Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenDocCN
LoveIt
提交
3d8efd63
L
LoveIt
项目概览
OpenDocCN
/
LoveIt
通知
3
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
L
LoveIt
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
3d8efd63
编写于
8月 20, 2019
作者:
D
Dillon
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: new mobile toc
上级
f4cda2e6
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
109 addition
and
24 deletion
+109
-24
assets/css/_core/_media.scss
assets/css/_core/_media.scss
+22
-3
assets/css/_page/_post.scss
assets/css/_page/_post.scss
+60
-2
assets/css/_partial/_post/_code.scss
assets/css/_partial/_post/_code.scss
+13
-13
assets/css/_variables.scss
assets/css/_variables.scss
+2
-2
layouts/posts/single.html
layouts/posts/single.html
+12
-4
未找到文件。
assets/css/_core/_media.scss
浏览文件 @
3d8efd63
@media
only
screen
and
(
min-device-width
:
320px
)
and
(
max-device-width
:
480px
)
{
.navbar
{
display
:
none
;
display
:
none
!
important
;
}
.post-toc
{
display
:
none
;
display
:
none
!
important
;
}
.navbar-mobile
{
...
...
@@ -149,13 +149,25 @@
.post-toc
{
margin-left
:
580px
!
important
;
}
.navbar-mobile
{
display
:
none
!
important
;
}
.post-toc-mobile
{
display
:
none
!
important
;
}
}
/* Desktops and laptops ----------- */
@media
only
screen
and
(
min-width
:
1224px
)
{
.navbar-mobile
{
display
:
none
;
display
:
none
!
important
;
}
.post-toc-mobile
{
display
:
none
!
important
;
}
}
...
...
@@ -163,4 +175,11 @@
@media
only
screen
and
(
min-width
:
1824px
)
{
/* Styles */
.navbar-mobile
{
display
:
none
!
important
;
}
.post-toc-mobile
{
display
:
none
!
important
;
}
}
assets/css/_page/_post.scss
浏览文件 @
3d8efd63
...
...
@@ -85,6 +85,64 @@
}
}
.post-toc-mobile
{
padding
:
10px
;
details
{
summary
{
display
:
block
;
outline
:
none
;
cursor
:
pointer
;
display
:
flex
;
justify-content
:
space-between
;
font-size
:
1
.2em
;
font-weight
:
bold
;
line-height
:
2em
;
padding
:
0
10px
;
background
:
$code-background-color
;
&
::-webkit-details-marker
{
display
:
none
;
}
i
.details
{
line-height
:
2em
;
}
.dark-theme
&
{
background
:
$code-background-color-dark
;
}
}
}
details
[
open
]
{
i
.details
{
transform
:
rotate
(
180deg
);
}
}
.post-toc-content
{
border
:
2px
solid
$code-background-color
;
>
nav
>
ul
{
margin
:
10px
0
;
}
ul
{
padding-left
:
10px
;
list-style
:
none
;
ul
{
padding-left
:
20px
;
}
}
.dark-theme
&
{
border
:
2px
solid
$code-background-color-dark
;
}
}
}
.featured_image
{
display
:
block
;
max-width
:
100%
;
...
...
@@ -145,14 +203,14 @@
}
ruby
{
background
:
$code-background
;
background
:
$code-background
-color
;
rt
{
color
:
$global-font-secondary-color
;
}
.dark-theme
&
{
background
:
$code-background-dark
;
background
:
$code-background-
color-
dark
;
rt
{
color
:
$global-font-secondary-color-dark
;
...
...
assets/css/_partial/_post/_code.scss
浏览文件 @
3d8efd63
...
...
@@ -3,10 +3,10 @@ pre {
padding
:
7px
;
font-size
:
$code-font-size
;
font-family
:
$code-font-family
;
background
:
$code-background
;
background
:
$code-background
-color
;
.dark-theme
&
{
background
:
$code-background-dark
;
background
:
$code-background-
color-
dark
;
}
}
...
...
@@ -14,20 +14,20 @@ code {
padding
:
3px
5px
;
border-radius
:
4px
;
color
:
$code-color
;
background
:
$code-background
;
background
:
$code-background
-color
;
.dark-theme
&
{
color
:
$code-color-dark
;
background
:
$code-background-dark
;
background
:
$code-background-
color-
dark
;
}
}
p
>
code
{
background
:
darken
(
$code-background
,
3%
);
background
:
darken
(
$code-background
-color
,
3%
);
.dark-theme
&
{
color
:
$code-color-dark
;
background
:
darken
(
$code-background-dark
,
3%
);
background
:
darken
(
$code-background-
color-
dark
,
3%
);
}
}
...
...
@@ -38,7 +38,7 @@ p > code {
overflow-x
:
auto
;
box-shadow
:
1px
1px
2px
rgba
(
0
,
0
,
0
,
0
.125
);
position
:
relative
;
background
:
$code-background
;
background
:
$code-background
-color
;
code
{
padding
:
0
;
...
...
@@ -56,17 +56,17 @@ p > code {
font-size
:
$code-font-size
;
font-weight
:
bold
;
color
:
darken
(
$code-info-color
,
10%
);
background
:
darken
(
$code-background
,
3%
);
background
:
darken
(
$code-background
-color
,
3%
);
content
:
'Code'
;
.dark-theme
&
{
background
:
darken
(
$code-background-dark
,
3%
);
background
:
darken
(
$code-background-
color-
dark
,
3%
);
}
}
}
@each
$sign
,
$text
in
$code-type-list
{
&
.
#{
$sign
}
>
table
::after
{
&
.
#{
$sign
}
table
::after
{
content
:
$text
;
}
}
...
...
@@ -100,10 +100,10 @@ p > code {
padding
:
0
;
width
:
100%
;
border-collapse
:
collapse
;
border-color
:
$code-background
;
border-color
:
$code-background
-color
;
.dark-theme
&
{
border-color
:
$code-background-dark
;
border-color
:
$code-background-
color-
dark
;
}
}
...
...
@@ -183,7 +183,7 @@ p > code {
/* GenericTraceback */
.gt
{
color
:
#d33682
}
.dark-theme
&
{
background
:
$code-background-dark
;
background
:
$code-background-
color-
dark
;
/* Keyword */
.chroma
.k
{
color
:
#D371E3
}
/* KeywordConstant */
.chroma
.kc
{
color
:
#D371E3
}
...
...
assets/css/_variables.scss
浏览文件 @
3d8efd63
...
...
@@ -52,8 +52,8 @@ $code-color: #E74C3C !default;
$code-color-dark
:
#E5BF78
!
default
;
// Color of the code background.
$code-background
:
whitesmoke
!
default
;
$code-background-dark
:
#272C34
!
default
;
$code-background
-color
:
whitesmoke
!
default
;
$code-background-
color-
dark
:
#272C34
!
default
;
$code-info-color
:
#cacaca
!
default
;
...
...
layouts/posts/single.html
浏览文件 @
3d8efd63
...
...
@@ -39,6 +39,10 @@
</div>
</div>
{{ with .Params.featured_image }}
<img
src=
/images/loading.svg
data-sizes=
auto
data-src=
{{
.
}}
alt=
"featured image"
class=
"featured_image lazyload"
>
{{ end }}
{{ if or .Params.toc (and .Site.Params.toc (ne .Params.toc false)) -}}
<div
class=
"post-toc"
id=
"post-toc"
>
<h2
class=
"post-toc-title"
>
{{ T "toc" }}
</h2>
...
...
@@ -47,12 +51,16 @@
{{ .TableOfContents }}
</div>
</div>
<div
class=
"post-toc-mobile"
id=
"post-toc-mobile"
>
<details>
<summary
class=
"post-toc-title"
>
{{ T "toc" }}
<i
class=
"details icon fas fa-angle-down"
></i></summary>
<div
class=
"post-toc-content"
>
{{ .TableOfContents }}
</div>
</details>
</div>
{{- end }}
{{ with .Params.featured_image }}
<img
src=
/images/loading.svg
data-sizes=
auto
data-src=
{{
.
}}
alt=
"featured image"
class=
"featured_image lazyload"
>
{{ end }}
<div
class=
"post-content"
>
{{ $content := .Content }}
{{ $REin := `
<img
src=
"([^"
]+)"
alt=
"([^"
]+)?"
/>
` }}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录