Giter VIP home page Giter VIP logo

Comments (2)

llsccm avatar llsccm commented on June 4, 2024 1

感谢提出意见！

哈哈，其实我不仅对ejs语法不熟悉，对前端也不太熟悉，因为我是一名后端开发，所以写出来的前端代码只管是否呈现出效果了。。。

如果可以的话，在你魔改完毕后，希望你可以提个pull request到dev分支，我参考下做修改。

ps：刚才更新了v1.6.7版本，主题可支持自定义配色、首页header链接自定义、数学公式。

ejs语法我也不太熟悉... layout.ejs 这里应该要设置config的language配置项吧 <html lang="<%= config.language || 'en' %>">

这是正确的，已更新代码。

footer.ejs <span style="border-top: 1px solid var(--line-1);margin-top: -30px;"></span> 这条线设置成.footer-last的样式比较好？

<div style="display: float;">
            <span style="float: left; font-size: 10px;">🌊看过大海的人不会忘记海的广阔🌊</span>
            <span class="footer-last-span-right"><i>本站由<a target="_blank" rel="noopener" href="https://hexo.io/zh-cn/index.html">Hexo</a>驱动｜使用<a target="_blank" rel="noopener" href="https://github.com/HiNinoJay/hexo-theme-A4">Hexo-theme-A4</a>主题</i></span>
</div>

这里的样式我认为去掉div，不用float，用flex+text-align: right;(不过得把上面的线的样式改掉)
由于还魔改了一些其他地方的样式，不太好PR，就在issues里提提自己的想法

这里我原来就是采用text-align 并没有实现成功，所以改用了float，如果可以的话，能解释下为什么要去掉 div 吗？为什么这里float不太行？改成那个flex有什么好处？

先提前感谢解答！

.footer-last 的flex应该设置为横向的flex-direction: row;

当page在index时，该div有一个子元素span用于email，带有样式border-top: 1px solid var(--line-1);
在list时，这条线由<span style="border-top: 1px solid var(--line-1);margin-top: -30px;"></span> 提供

就个人感觉，应该在.footer-last加上一个border-top，去掉两者的border-top
这样改完后，把 .footer-last 下面的div去掉(style="display: float;"其实浏览器不能识别)，就有3个span子元素
为子元素设置好样式flex;1;text-align: right; 就是靠右的效果了
这里主要是父元素用了flex布局，直接设置子元素的样式要比浮动好一点，当然两者效果是一样...

我修改这部分的样式是打算用icon代替email超链接，并且加入更多的icon，选择了左对齐就想统一样式

from hexo-theme-a4.

HiNinoJay avatar HiNinoJay commented on June 4, 2024

感谢提出意见！

哈哈，其实我不仅对ejs语法不熟悉，对前端也不太熟悉，因为我是一名后端开发，所以写出来的前端代码只管是否呈现出效果了。。。

如果可以的话，在你魔改完毕后，希望你可以提个pull request到dev分支，我参考下做修改。

ps：刚才更新了v1.6.7版本，主题可支持自定义配色、首页header链接自定义、数学公式。

ejs语法我也不太熟悉... layout.ejs 这里应该要设置config的language配置项吧 <html lang="<%= config.language || 'en' %>">

这是正确的，已更新代码。

footer.ejs <span style="border-top: 1px solid var(--line-1);margin-top: -30px;"></span> 这条线设置成.footer-last的样式比较好？

<div style="display: float;">
            <span style="float: left; font-size: 10px;">🌊看过大海的人不会忘记海的广阔🌊</span>
            <span class="footer-last-span-right"><i>本站由<a target="_blank" rel="noopener" href="https://hexo.io/zh-cn/index.html">Hexo</a>驱动｜使用<a target="_blank" rel="noopener" href="https://github.com/HiNinoJay/hexo-theme-A4">Hexo-theme-A4</a>主题</i></span>
</div>

这里的样式我认为去掉div，不用float，用flex+text-align: right;(不过得把上面的线的样式改掉)

由于还魔改了一些其他地方的样式，不太好PR，就在issues里提提自己的想法

这里我原来就是采用text-align 并没有实现成功，所以改用了float，如果可以的话，能解释下为什么要去掉 div 吗？为什么这里float不太行？改成那个flex有什么好处？

先提前感谢解答！

from hexo-theme-a4.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.