add 主题效果图
This commit is contained in:
xugaoyi
parent
e8dc22b3a2
commit
488dd44b5d
|
|
@ -15,6 +15,7 @@
|
|||
|
||||
效果预览：[ Evan's blog](https://xugaoyi.com/)
|
||||
|
||||
效果图：[vdoing主题效果图](https://xugaoyi.com/pages/d557b9a89a215d2e)
|
||||
|
||||
|
||||
## Original intention 初衷
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ module.exports = {
|
|||
|
||||
"/02.页面/": [{"title":"HTML","collapsable":false,"children":[["10.HTML/10.常用meta整理.md","常用meta整理","/pages/8309a5b876fc95e3"]]},{"title":"CSS","collapsable":false,"children":[["20.CSS/01.flex布局语法.md","flex布局语法","/pages/0a83b083bdf257cb"],["20.CSS/02.flex布局案例-基础.md","flex布局案例-基础","/pages/ea6db1530c42ad51"],["20.CSS/03.flex布局案例-骰子.md","flex布局案例-骰子","/pages/eff61bc8b4f4695d"],["20.CSS/04.flex布局案例-圣杯布局.md","flex布局案例-圣杯布局","/pages/df9e7c7214fa5046"],["20.CSS/05.flex布局案例-网格布局.md","flex布局案例-网格布局","/pages/85b5a3fe218a34b7"],["20.CSS/06.flex布局案例-输入框布局.md","flex布局案例-输入框布局","/pages/05cc577fb51c7998"],["20.CSS/07.CSS3之transition过渡.md","CSS3之transition过渡","/pages/02d7f59d98d87409"],["20.CSS/08.CSS3之animation动画.md","CSS3之animation动画","/pages/c2c0432138f6e042"],["20.CSS/20.「布局技巧」图片未加载前自动撑开元素高度.md","「布局技巧」图片未加载前自动撑开元素高度","/pages/3d52574260725aea"],["20.CSS/30.文字在一行或两行时超出显示省略号.md","文字在一行或两行时超出显示省略号","/pages/42b66999cc27dc25"],["20.CSS/35.从box-sizing属性入手，了解盒子模型.md","从box-sizing属性入手，了解盒子模型","/pages/20a978023139589d"],["20.CSS/40.水平垂直居中的几种方式-案例.md","水平垂直居中的几种方式-案例","/pages/cb7cb251adba4bf7"],["20.CSS/45.如何根据系统主题自动响应CSS深色模式.md","如何根据系统主题自动响应CSS深色模式","/pages/5dde351274f1e39d"]]},{"title":"stylus","collapsable":false,"children":[["25.stylus/10.混入(Mixins).md","混入(Mixins)","/pages/9f15c1a281d8bedb"]]}],
|
||||
|
||||
"/03.技术/": [{"title":"技术文档","collapsable":false,"children":[["01.技术文档/01.Git使用手册.md","Git使用手册","/pages/9a7ee40fc232253e"],["01.技术文档/02.Markdown使用教程.md","Markdown使用教程","/pages/ad247c4332211551"],["01.技术文档/03.npm常用命令.md","npm常用命令","/pages/61f2f95fd7da14fd"],["01.技术文档/04.yaml语言教程.md","yaml语言教程","/pages/4e8444e2d534d14f"]]},{"title":"GitHub技巧","collapsable":false,"children":[["02.GitHub技巧/01.GitHub高级搜索技巧.md","GitHub高级搜索技巧","/pages/4c778760be26d8b3"],["02.GitHub技巧/02.GitHub Actions 实现自动部署静态博客.md","GitHub Actions 实现自动部署静态博客","/pages/6b9d359ec5aa5019"],["02.GitHub技巧/03.GitHub Actions 定时运行代码：每天定时百度链接推送.md","GitHub Actions 定时运行代码：每天定时百度链接推送","/pages/f44d2f9ad04ab8d3"],["02.GitHub技巧/10.GitHub加速下载项目的方法.md","GitHub加速下载项目的方法","/pages/95331c6a9613faf8"]]},{"title":"Nodejs","collapsable":false,"children":[["03.Nodejs/01.nodejs递归读取所有文件.md","nodejs递归读取所有文件","/pages/117708e0af7f0bd9"]]},{"title":"博客搭建","collapsable":false,"children":[["04.博客搭建/01.解决百度无法收录搭建在GitHub上的个人博客的问题.md","解决百度无法收录搭建在GitHub上的个人博客的问题","/pages/41f87d890d0a02af"],["04.博客搭建/02.使用Gitalk实现静态博客无后台评论系统.md","使用Gitalk实现静态博客无后台评论系统","/pages/1da0bf9a988eafe5"],["04.博客搭建/03.GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床.md","GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床","/pages/a5f73af5185fdf0a"]]}],
|
||||
"/03.技术/": [{"title":"技术文档","collapsable":false,"children":[["01.技术文档/01.Git使用手册.md","Git使用手册","/pages/9a7ee40fc232253e"],["01.技术文档/02.Markdown使用教程.md","Markdown使用教程","/pages/ad247c4332211551"],["01.技术文档/03.npm常用命令.md","npm常用命令","/pages/61f2f95fd7da14fd"],["01.技术文档/04.yaml语言教程.md","yaml语言教程","/pages/4e8444e2d534d14f"]]},{"title":"GitHub技巧","collapsable":false,"children":[["02.GitHub技巧/01.GitHub高级搜索技巧.md","GitHub高级搜索技巧","/pages/4c778760be26d8b3"],["02.GitHub技巧/02.GitHub Actions 实现自动部署静态博客.md","GitHub Actions 实现自动部署静态博客","/pages/6b9d359ec5aa5019"],["02.GitHub技巧/03.GitHub Actions 定时运行代码：每天定时百度链接推送.md","GitHub Actions 定时运行代码：每天定时百度链接推送","/pages/f44d2f9ad04ab8d3"],["02.GitHub技巧/10.GitHub加速下载项目的方法.md","GitHub加速下载项目的方法","/pages/95331c6a9613faf8"]]},{"title":"Nodejs","collapsable":false,"children":[["03.Nodejs/01.nodejs递归读取所有文件.md","nodejs递归读取所有文件","/pages/117708e0af7f0bd9"]]},{"title":"博客搭建","collapsable":false,"children":[["04.博客搭建/01.解决百度无法收录搭建在GitHub上的个人博客的问题.md","解决百度无法收录搭建在GitHub上的个人博客的问题","/pages/41f87d890d0a02af"],["04.博客搭建/02.使用Gitalk实现静态博客无后台评论系统.md","使用Gitalk实现静态博客无后台评论系统","/pages/1da0bf9a988eafe5"],["04.博客搭建/03.GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床.md","GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床","/pages/a5f73af5185fdf0a"],["04.博客搭建/10.vdoing主题效果图.md","vdoing主题效果图","/pages/d557b9a89a215d2e"]]}],
|
||||
|
||||
"/04.更多/": [{"title":"学习","collapsable":false,"children":[["01.学习/02.提高学习效率的策略.md","提高学习效率的策略","/pages/a8692ab3bdcb4588"],["01.学习/03.提高记忆的技巧.md","提高记忆的技巧","/pages/996822b2a2ca6e3b"],["01.学习/04.自律小建议.md","自律小建议","/pages/c3f302a03c8daf79"],["01.学习/05.处理问题的思路.md","处理问题的思路","/pages/9ba2b8fb13de1957"]]},{"title":"面试","collapsable":false,"children":[["03.面试/01.面试问题集锦.md","面试问题集锦","/pages/aea6571b7a8bae86"]]},{"title":"英语","collapsable":false,"children":[["04.英语/01.英语基础.md","英语基础","/pages/6f9525eecdd51d5a"]]},{"title":"心情杂货","collapsable":false,"children":[["05.心情杂货/01.一个完美主义者的自我救赎.md","一个完美主义者的自我救赎","/pages/2d615df9a36a98ed"]]},["97.学习网站.md","学习网站","/pages/2e9ba3fa6e1ed0e9"],["98.在线工具.md","在线工具","/pages/9c2232288caaa8ec"],["99.友情链接.md","友情链接","/pages/844eea1b2387fb96"]],
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,48 @@
|
|||
---
|
||||
title: vdoing主题效果图
|
||||
date: 2020-04-08 11:27:22
|
||||
permalink: /pages/d557b9a89a215d2e
|
||||
article: false
|
||||
---
|
||||
|
||||
# vdoing主题效果图
|
||||
|
||||
## PC端
|
||||
|
||||
<br/>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408125410.png" style="width:48%;"/>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120138.png" style="width:48%;" />
|
||||
<p align="center">首页 & 目录页△</p>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120144.png" style="width:48%;" />
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120145.png" style="width:48%;" />
|
||||
<p align="center">文章详情页 & 时间轴页△</p>
|
||||
|
||||
## 首页个性化大图
|
||||
|
||||
<br/>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408125412.png" />
|
||||
<p align="center">首页个性化大图(1/1)△</p>
|
||||
|
||||
## 深色模式和阅读模式
|
||||
|
||||
<br/>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408125408.png" style="width:48%;" />
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120139.png" style="width:48%;" />
|
||||
<p align="center">深色模式(2)△</p>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408125409.png" style="width:48%;" />
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120143.png" style="width:48%;" />
|
||||
<p align="center">阅读模式(2)△</p>
|
||||
|
||||
## 移动端
|
||||
|
||||
<br/>
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120606.png" style="width:24%;" />
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120147.png" style="width:24%;" />
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408120148.png" style="width:24%;" />
|
||||
<img src="https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200408130831.png" style="width:24%;" />
|
||||
<p align="center">移动端效果(4)△</p>
|
||||
|
||||
<style scoped>
|
||||
/* .content__default img{border: 1px solid #ccc;} */
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue