PureLand Flarum Theme

本来是想制作一份卡通的蓝天主题,
但是,需要和首页的blog相搭配起来,
就制作了这份比较注重阅读、交流与记录的主题,
取名为极乐净土,译为PureLand,多么希望,我们能一直纯洁童真!


HOT TO INSTALLATION | 如何使用该风格

copy this code to your Appearance >> Custom Styles
复制这些片段的代码至你的后台管理中的**外观>>样式**

Demo Link: https://bbs.kuoxo.com/ | https://bbs.kuoxo.com/d/337-pureland-flarum-theme
声明: 如果您对 !important 介意,请不要使用此主题,请自己码,谢谢!


UPDATING | 内容更新

Welcome to give me some inspiration or a bug, I will do it all day.
谢谢你能给我一些建议或者BUG,我会仔细check的!Great?😅

  • Apr. 8, 2020 第一版发布
    边栏右置,移除头像,注重阅读交流与记录
  • Apr. 9, 2020
    增加POST页面的小头像,增加辨别度
    修复了一些BUG
  • Apr. 10, 2020
    修复了讨论的CLASS Hero BUG
  • Apr. 17, 2020
    增加 引用美化效果 ,代码在OTHERS | 其他搭配
  • Apr. 19, 2020
    修复自适分辨率BUG,以及适配 reflar/level-ranks 等级插件

CONTRIBUTING | 贡献

Yannisme - Just me 😀
这就是我 😀


SUGGESTIONS | 建议

💡 可开启黑夜模式,但需要微调 board 颜色

Choose two colors to theme your forum with. The first will be used as a highlight color, while the second will be used to style background elements.
颜色搭配,第一种作为突出显示颜色,第二种作为背景元素样式。
Colors #444 , #222


CONTENT | 主题代码内容

Apr. 8, 2020 🌟

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
.IndexPage .DiscussionListItem-info>.item-tags, .UserPage .DiscussionListItem-info>.item-tags{
position:inherit!important;
-webkit-mask-image: none!important;
padding-right:10px;
}
::-webkit-scrollbar {
width: 5px;
height: 5px;
}

::-webkit-scrollbar-thumb {
background: @config-primary-color;
}

::-webkit-scrollbar-track {
background: #EDEDED;
}

.Search-input:before {
display: inline-block;
font-size: inherit;
text-rendering: auto;
content: "\f002";
float: left;
margin-right: -36px;
width: 36px;
font-size: 14px;
text-align: center;
position: relative;
padding: 7px 0;
line-height: 1.5;
pointer-events: none;
background: #0000000f;
color: #fff;
border-radius: 4px 0 0 4px
}

.Search-input input {
float: left;
width: 225px;
padding-left: 50px;
padding-right: 32px;
-webkit-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
box-sizing: inherit!important
}

body {
font-family: 'Microsoft YaHei',"Open Sans","Clear Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
line-height: 1.6;
}

@media (min-width: 1120px) {
.containerNarrow {
max-width: 100%;
}

.Post-header {
text-align: right;
border-bottom: 1px solid #ededed;
}

.PostUser-badges {
display: none;
}

.DiscussionPage-stream {
margin-left: -85px;
}

.Hero .container {
padding-top: 15px;
padding-bottom: 15px;
}

.PostUser-avatar {
vertical-align: middle;
position: relative;
left: -7px;
top: -2px;
width: 1.5em;
height: 1.5em;
font-size: 1em;
line-height: 1.5em;
}

.UserPage .Post {
padding-left: 18px;
}

.DiscussionListItem-author .Avatar,.IndexPage .DiscussionListItem-author .Avatar {
display: none;
}

.DiscussionListItem-badges {
width: 0;
}

.containerNarrow {
float: left;
text-align: left;
}

.DiscussionHero--colored, .DiscussionHero--colored a {
text-align: left;
}

.Post--BestAnswer {
text-align: center;
left: 0!important;
width: 25%;
z-index: 999;
}

.Post-body a {
border: 1px solid #e0e0e0 !important;
padding: 1px;
padding-top: 0;
}

.DiscussionListItem-badges {
margin-left: -42px;
margin-top: 20px;
}

.Badge, .Badge .Badge-icon {
vertical-align: middle;
}

.EventPost-icon {
margin-top: 2px;
margin-left: 0;
padding-right: 10px;
width: auto;
font-size: 1.5em;
}

.sideNav, .sideNav>ul {
width: 190px;
right: 0;
position: absolute;
}

.sideNavOffset {
max-width: 800px;
}

nav.IndexPage-nav.sideNav {
width: 190px;
margin-right: 0;
position: relative;
float: right;
}

.sideNavContainer {
display: block;
}

.TagsPage nav.IndexPage-nav.sideNav {
overflow: hidden;
margin-right: -99999px;
}

.TagsPage .sideNavOffset {
max-width: 1200px;
}

.Post a.inline-image-link {
margin-top: 15px;
}

.Post-likedBy {
position: absolute;
top: 17px;
}

.item-edited .ButtonGroup>.Button {
padding: 0;
}

.DiscussionHero-items {
text-align: left;
}
.PostUser-level {
float: right!important;
position: inherit!important;
margin: 0!important;
}
.PostUser-bar {
border-radius: .1px !important;
margin-top: 7px;
height: 6px !important;
top: 24px!important;
}

.PostUser-text {
position: absolute;
right: 55px;
top: 24px;
width: 77px;
font-size: 12px;
}

}

.topbutton i {
padding: 5px;
}

.topbutton a {
color: #fff;
text-decoration: unset;
}

.IndexPage-nav .item-newDiscussion .Button {
width: auto;
}

.Flagrow-Ads-fake-poststream-item {
border: 0!important;
}

.PostStream-item:not(:last-child) {
border: 0;
}


@media (max-width: 1024px) and (min-width: 768px) {
.sideNavOffset {
max-width: 700px;
}
nav.IndexPage-nav.sideNav {
width: 100%;
position: initial!important;
white-space: nowrap;
overflow: auto;
}

.Post-body, .TextEditor textarea, .ComposerBody-header h3, .ComposerBody-header h3 input, .ComposerBody-header h3 a {
font-size: 1rem;
}

.PostsUserPage-discussion a {
font-style: normal;
}

.item-bestAnswerPost .Post-header,.UserPage .Post-header {
border-bottom: 0;
}

SCREENSHOTS | 效果截图

image.png

image.png

image.png

image.png

image.png

image.png

image.png

OTHERS | 其他搭配:

欢迎横幅处添加小图标
1
2
3
4
5
6
<div class="topbutton">
<a href="#"><i class="icon fas fa-project-diagram Button-icon" style="color: rgb(255, 141, 70);"></i></a>
<a href="#"><i class="icon fas fa-wrench Button-icon" style="color: rgb(75, 147, 209);"></i></a>
<a href="https://kuoxo.com"><i class="icon fas fa-globe Button-icon" style="color: rgb(181, 158, 140);"></i></a>
<a href="#"><i class="icon fas fa-puzzle-piece Button-icon" style="color: rgb(253, 207, 88);"></i></a>
</div>
美化引用效果

image.png

后3个效果需配合 BBCODE 文本效果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
.Post-body pre {
font-size: 12px;
padding: 0 10px;
border-left: 4px solid #929292;
border-radius: 0;
}
.Post-body blockquote {
background: #f7f7f7;
color: #444;
font-size: 14px;
padding: 10px;
border: 0;
border-left: 4px solid #46a4b2;
border-radius: 0;
}
.aaalert.aaerror .aainner,.aaalert.aasuccess .aainner,.aaalert.aainfo .aainner {
font-size: 14px;
text-align: left;
width: 80%;
margin-left: -8px;
padding: 5px 10px;
border: 0;
border-radius: 0;
}
.aaalert.aaerror .aainner {
border-left: 4px solid #ff5c5c!important;
}
.aaalert.aasuccess .aainner{
border-left: 4px solid #58a400!important;
}
.aaalert.aainfo .aainner{
border-left: 4px solid #569ff7!important;
}

2020 COLOR Flarum Theme

与暗黑风格相对的彩色风格出现了,
其实一开始打算弄白色系的,觉得不够粉男人,就Sao起来了 🙃
这个风格搭配Sao可爱粉和基佬紫以及迷人的工口色~


HOT TO INSTALLATION | 如何使用该风格

copy this code to your Appearance >> Custom Styles
复制这些片段的代码至你的后台管理中的**外观>>样式**

Demo Link: https://bbs.kuoxo.com/ | https://bbs.kuoxo.com/d/323-2020-color-flarum-theme
声明: 如果您对 !important 介意,请不要使用此主题,请自己码,谢谢!


UPDATING | 内容更新

Welcome to give me some inspiration or a bug, I will do it all day.
谢谢你能给我一些建议或者BUG,我会仔细check的!Great?😅

  • Feb. 25, 2020 第一版发布
  • Feb. 26, 2020
    Fixed the problem of excessive notification text
    修复了通知文字过大的问题
  • Apr. 7, 2020
    修改首页鼠标停留到内容效果
    修复了Hero的DIV错误和优化部分代码
    修改背景图片地址
    [https://kuoxo.com/images/flarum/color-background.png]

CONTRIBUTING | 贡献

Yannisme - Just me 😀
这就是我 😀


SUGGESTIONS | 建议

💡 It needs Colored Header Mode
💡 本主题需搭彩色页眉使用

Choose two colors to theme your forum with. The first will be used as a highlight color, while the second will be used to style background elements.
颜色搭配,第一种作为突出显示颜色,第二种作为背景元素样式。
Colors #ff6476 , #6d508b

✅ please Colored Header
✅ 勾选 彩色页眉


CONTENT | 主题代码内容

Apr. 7, 2020 🌟

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
body,body.touch {
background: #faf6f5;
}

.DiscussionHero .item-title {
margin: 15px;
}

.Scrubber-handle {
background: #faf6f5;
}

a.NotificationGroup-header {
font-size: 16px!important;
}

.Notification-content {
margin-right: 5px;
font-size: 14px;
}

.NotificationGroup-content li a {
font-size: 12px;
}

.DiscussionListItem-title, .UserPage .DiscussionListItem-title {
color: #313131!important;
}

.UserCard.Hero.UserHero {
background: #505a8b url(https://kuoxo.com/images/flarum/color-background.png)!important;
}

.UserCard.Hero.UserHero .darkenBackground {
background: rgba(0, 0, 0, 0)!important;
}

@media (min-width:768px) {
.IndexPage .DiscussionListItem-info>.item-tags,.UserPage .DiscussionListItem-info>.item-tags {
margin-right: 0;
position: inherit;
padding-right: 10px
}

.IndexPage .DiscussionListItem-info>.item-tags,.UserPage .DiscussionListItem-info>.item-tags {
transition: none;
-webkit-mask-image: none
}
}

body {
font: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.Alert {
background: #ede8f2;
}

.Alert, .Alert a, .Alert a:hover, .Alert .Button, .Alert .Button:hover, .Alert .Button:active, .Alert .Button.active, .Alert .Button:focus, .Alert .Button.focus {
color: #7f6699;
}

.Hero {
background: #ffe305 url(https://kuoxo.com/images/flarum/color-background.png);
}

.Hero h2,.Hero-subtitle,.App-header .Button {
font-weight: 600;
}

h3.DiscussionListItem-title {
font-size: 18px;
}

.sideNav .Dropdown--select .Dropdown-menu>li>a {
font-size: 14px;
}

.containerNarrow {
color: #1a1a1a;
}

.App-header .Button {
color: #f3f0f5;
font-size: 16px;
font-weight: 700;
}

.App-header .Button:hover {
color: #fde4bb;
}

.App-header,.App-header a {
color: #ffffff;
font-size: 21px;
font-weight: 600;
text-decoration: none;
}

.DiscussionListItem-title,.UserPage .DiscussionListItem-title {
color: #ededed;
}

.DiscussionListItem {
margin-top: 15px;
}

.IndexPage .DiscussionListItem:hover {
background: #ede8f25c;
border-left: 5px dashed #dddddd;
margin-left: -20px;
}

h2.DiscussionHero-title,.PageHero-title>a {
color: #1a1a1a;
}

.DiscussionList-loadMore .Button {
width: 80%;
background: #ede8f28a;
}

.Post-body blockquote {
border: 2px dotted #bac;
}

.Post-body pre {
border: 2px dotted #aaa;
}

.aaalert.aaerror .aainner {
border: 2px dotted #b94a48;
text-align: left;
}

.aaalert.aasuccess .aainner {
background-color: #dff0d8;
border: 2px dotted #468847;
text-align: left;
}

.aaalert.aainfo .aainner {
border: 2px dotted #3a87ad;
text-align: left;
}


SCREENSHOTS | 效果截图

image.png

image.png

image.png

image.png

image.png

OTHERS | 其他搭配

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

::-webkit-scrollbar {/*滚动条整体样式*/
width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
height: 5px;
}

::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
background: @config-secondary-color;
}
::-webkit-scrollbar-track {/*滚动条里面轨道*/
background: #EDEDED;
}


.Search-input:before {
display:inline-block;
font-size:inherit;
text-rendering:auto;
content:"\f002";
float:left;
margin-right:-36px;
width:36px;
font-size:14px;
text-align:center;
position:relative;
padding:7px 0;
line-height:1.5;
pointer-events:none;
background: #0000000f;
color:#fff;
border-radius:4px 0 0 4px
}
.Search-input input {
float:left;
width:225px;
padding-left:50px;
padding-right:32px;
-webkit-transition:all .4s;
-o-transition:all .4s;
transition:all .4s;
box-sizing:inherit!important
}

2020 BLACK Flarum Theme

琢磨着~ 是否要弄个暗夜风格,还是正常的那种。。。
我已经是一个成熟的人了,还要什么选择!
本主题需搭配夜间模式使用,白夜模式正在琢磨中…


HOT TO INSTALLATION | 如何使用该风格

copy this code to your Appearance >> Custom Styles
复制这些片段的代码至你的后台管理中的**外观>>样式**

Demo Link: https://bbs.kuoxo.com/ | https://bbs.kuoxo.com/d/319-2020-black-flarum-theme
Link: https://discuss.flarum.org/d/22774-2020-black-flarum-theme-by-yannisme
声明: 如果您对 !important 介意,请不要使用此主题,请自己码,谢谢!


UPDATING | 内容更新

Welcome to give me some inspiration or a bug, I will do it all day.
谢谢你能给我一些建议或者BUG,我会仔细check的!Great?😅

  • Feb. 12, 2020 第一版发布
    Adapt to IPhone dark night mode
    适配IPhone暗夜模式
  • Apr. 7, 2020
    优化部分代码并修改了背景图片地址
    [https://kuoxo.com/images/flarum/color-background.png]

CONTRIBUTING | 贡献

Yannisme - Just me 😀
这就是我 😀


SUGGESTIONS | 建议

💡 It needs Dark Mode
💡 本主题需搭配夜间模式使用

Choose two colors to theme your forum with. The first will be used as a highlight color, while the second will be used to style background elements.
颜色搭配,第一种作为突出显示颜色,第二种作为背景元素样式。
Colors #93d1ce , #fff

✅ please Dark Mode
✅ 勾选 夜间模式


CONTENT | 主题代码内容

Apr. 7, 2020 🌟

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
::-webkit-scrollbar {
width: 5px;
height: 5px;
}
::-webkit-scrollbar-thumb {
background: @config-primary-color;
}
::-webkit-scrollbar-track {
background: #EDEDED;
}
.Search-input:before {
display:inline-block;
font-size:inherit;
text-rendering:auto;
content:"\f002";
float:left;
margin-right:-36px;
width:36px;
font-size:14px;
text-align:center;
position:relative;
padding:7px 0;
line-height:1.5;
pointer-events:none;
background: #0000000f;
color:#fff;
border-radius:4px 0 0 4px
}
.Search-input input {
float:left;
width:225px;
padding-left:50px;
padding-right:32px;
-webkit-transition:all .4s;
-o-transition:all .4s;
transition:all .4s;
box-sizing:inherit!important
}
@media (min-width:768px) {
.IndexPage .DiscussionListItem-info>.item-tags,.UserPage .DiscussionListItem-info>.item-tags{margin-right: 0;
position: inherit;
padding-right: 10px
}

.IndexPage .DiscussionListItem-info>.item-tags,.UserPage .DiscussionListItem-info>.item-tags {
transition: none;
-webkit-mask-image: none
}
}

body {
font: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.Alert {
background: #212121;
}

.Hero {
background: #000000 url(https://kuoxo.com/images/flarum/color-background.png);
}

.Hero h2,.Hero-subtitle,.App-header .Button {
font-weight: 600;
}

h3.DiscussionListItem-title {
font-size: 18px;
}

.sideNav .Dropdown--select .Dropdown-menu>li>a {
font-size: 14px;
}

.containerNarrow {
color: #1a1a1a;
}

.App-header .Button {
color: #93d1ce;
font-size: 16px;
}

.App-header .Button:hover {
color: #fff!important;
}

.App-header,.App-header a {
color: #fff;
font-weight: 700;
}

.DiscussionListItem-title,.UserPage .DiscussionListItem-title {
color: #ededed;
}

.DiscussionListItem {
margin-top: 15px;
}

.DiscussionListItem:hover {
background: #17212047;
box-shadow: 0 2px 6px #00000052;
}

h2.DiscussionHero-title,.PageHero-title>a {
color: #1a1a1a;
}

.DiscussionList-loadMore .Button {
width: 80%;
background: #00000040;
}

SCREENSHOTS | 效果截图

Apr. 7, 2020

image.png

image.png

image.png

OTHERS | 其他搭配:

暂无

OXO Flarum Themes

A COAT,U CAN TAKE IT OFF ANYTIME , BECAUSE IT’S JUST A PIECE OF CSS, ISN’T IT?
这是一件衣服,你可以随时穿上或者脱下来,因为它只是一段代码,很方便对吧!?


HOT TO INSTALLATION | 如何使用该风格

copy this code to your Appearance >> Custom Header or Custom Footer
复制这些片段的代码至你的后台管理中的**外观>>自定义页眉/页脚**

why not Custom Styles, because I CANNOT write it (“@media (xxx){xxx}”) here !!
为什么不放在自定义样式中,因为无法将@media写在其中

Demo Link: https://bbs.kuoxo.com/ | https://bbs.kuoxo.com/d/301-oxo-flarum-themes
Link: https://discuss.flarum.org/d/22245-oxo-flarum-themes-by-yannisme


UPDATING | 内容更新

Welcome to give me some inspiration or a bug, I will do it all day.
谢谢你能给我一些建议或者BUG,我会仔细check的!Great?😅

  • Dec. 12, 2019 第一版发布
  • Jan. 15, 2020 进行细节优化,更至第二版

[AINFO] 主题暂未适配边栏友情链接,后续会优化不同分辨率下的适配问题,包含手机端。
@media可以写在自定义样式里面了,会对其优化、整理,请耐心等待…[/AINFO]


CONTRIBUTING | 贡献

Flarum - Without you, nothing exist
没有你,就没有这个主题的存在
Yannisme - Just me 😀
这就是我 😀


SUGGESTIONS | 建议

Colors #b59e8c , #444
颜色搭配,第一种作为突出显示颜色,第二种作为背景元素样式。

Colored Header
✅ 勾选 彩色页眉

I suggest use the following fonts
同时,建议使用以下网页字体,有利于阅读和缓解视觉疲劳

1
2
3
1. font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;
2. font: 12px/1.5 Tahoma,Helvetica,Arial,'宋体',sans-serif;
3. font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;

CONTENT | 主题代码内容

Dec. 12, 2019

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
body {
font-family:Arial,"Microsoft YaHei","黑体","宋体",sans-serif;
background:-moz-linear-gradient(to bottom,#f2f2f2,#ebebeb)
}
.Search-input:before {
display:inline-block;
font-size:inherit;
text-rendering:auto;
content:"\f002";
float:left;
margin-right:-36px;
width:36px;
font-size:14px;
text-align:center;
position:relative;
padding:7px 0;
line-height:1.5;
pointer-events:none;
background:rgba(0,0,0,.11);
color:#fff;
border-radius:4px 0 0 4px
}
.Search-input input {
float:left;
width:225px;
padding-left:50px;
padding-right:32px;
-webkit-transition:all .4s;
-o-transition:all .4s;
transition:all .4s;
box-sizing:inherit!important
}
.Post-body table {
box-shadow:0 -1px 5px -2px #515151!important
}
@media (min-width:768px) {
.DiscussionListItem {
position:relative;
margin:0;
padding:0;
border-radius:5px;
margin-top:18px;
}
.UserPage .sideNavOffset,.sideNav .Dropdown--select {
display:block;
background:#fff;
padding:15px;
padding-top:5px;
padding-bottom:5px;
box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
border-radius:6px
}
.DiscussionListItem-count {
margin-top:5px
}
body {
background-image:linear-gradient(to bottom,#f2f2f2,#ebebeb);
background-repeat:no-repeat
}
.IndexPage-results sideNavOffset .Post.CommentPost {
background-color:#fff!important;
border-radius:5px;
margin-top:20px;
-webkit-box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important
}
.Scrubber-handle {
background-color:transparent!important
}
bbs.kuoxo.com {
author:yannisme
}
.DiscussionHero .TagsLabel .TagLabel.colored {
margin-right:5px;
background:#fff!important;
color:#667c99
}
.DiscussionHero .TagsLabel .TagLabel.colored .TagLabel-text {
color:inherit!important
}
.Hero {
box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
background-color:#fff!important;
margin-bottom:15px
}
.Hero h2 {
font-size:2em;
font-weight:bolder;
color:#191919;
}
.Hero-subtitle {
color:#000;
font-size:15px;
margin:8px 0 0;
line-height:1.5em
}
.DiscussionHero .TagsLabel .TagLabel {
color:#4d698e;
font-size:18px!important
}
.App-header .Button,.App-header .Button:hover {
color:#fff
}
.IndexPage-results .DiscussionListItem-content {
padding-left:80px;
padding-right:80px;
padding-top:10px;
border-radius:5px;
padding-bottom:10px;
background-color:#fff!important;
-webkit-box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important
}
.UserPage .DiscussionListItem-content {
padding-left:80px;
padding-right:80px;
padding-top:10px;
padding-bottom:10px;
background-color:#fff!important;
border-bottom:1px solid #ebebeb
}
.UserPage .Hero h2 {
color:#fff
}
.DiscussionPage .CommentPost {
border-radius:5px;
margin-top:20px;
box-shadow:0 4px 30px 0 rgba(0,0,0,.1)!important;
background:#fff
}
}

[ASUCCESS]Jan. 15, 2020 🌟 推荐 [/ASUCCESS]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
body {
font-family:"Arial","Microsoft YaHei","黑体","宋体",sans-serif;
background:-moz-linear-gradient(to bottom,#f2f2f2,#ebebeb);
}
.Search-input:before {
display:inline-block;
font-size:inherit;
text-rendering:auto;
content:"\f002";
float:left;
margin-right:-36px;
width:36px;
font-size:14px;
text-align:center;
position:relative;
padding:7px 0;
line-height:1.5;
pointer-events:none;
background:rgba(0,0,0,0.11);
color:#fff;
border-radius:4px 0 0 4px;
}
.Search-input input {
float:left;
width:225px;
padding-left:50px;
padding-right:32px;
-webkit-transition:all .4s;
-o-transition:all .4s;
transition:all .4s;
box-sizing:inherit !important;
}
.Post-body table {
box-shadow:0px -1px 5px -2px #515151!important;
}
@media (max-width:767px) {
#yqlj {
display:none;
}}
@media (min-width:768px) {
body {
background-image:linear-gradient(to bottom,#f2f2f2,#ebebeb);
background-repeat:no-repeat;
}
.DiscussionListItem {
position:relative;
margin:0;
padding:0;
border-radius:5px;
margin-top:18px;
}
.IndexPage .DiscussionListItem-info>.item-tags {
margin-right:0;
position:absolute;
left:80px;
top:38px;
max-width:150px;
white-space:nowrap;
overflow:inherit;
transition:max-width .2s ease-in-out,-webkit-mask-image .2s;
-webkit-mask-image:none;
font-size:12px;
}
.IndexPage .DiscussionListItem-controls {
right:32px;
top:38px;
}
.IndexPage .DiscussionListItem-title {
margin-right:155px;
padding-bottom:30px;
}
.IndexPage .DiscussionListItem-author .Avatar {
width:48px;
height:48px;
position:absolute;
left:17px;
border-radius:48px;
top:20px;
}
.UserPage .DiscussionListItem-content {
padding-left:80px;
padding-right:80px;
padding-top:10px;
padding-bottom:10px;
background-color:#fff!important;
border-bottom:1px solid #ebebeb;
}
.IndexPage-results .DiscussionListItem-content {
padding-left:80px;
padding-right:80px;
padding-top:0;
border-radius:5px;
background-color:#fff!important;
-webkit-box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
}
.sideNav .Dropdown--select,.UserPage .sideNavOffset {
display:block;
background:#fff;
padding-left:15px;
padding-right:15px;
padding-top:5px;
padding-bottom:5px;
box-shadow:0 1px 5px 0 rgba(151,158,181,.28)!important;
border-radius:6px;
}
.Scrubber-handle {
background-color:transparent!important;
}
bbs.kuoxo.com {
author:yannisme;
}
.DiscussionHero .TagsLabel .TagLabel.colored {
margin-right:5px;
background:#fff!important;
color:#667c99;
}
.DiscussionHero .TagsLabel .TagLabel.colored .TagLabel-text {
color:inherit!important;
}
.DiscussionHero .TagsLabel .TagLabel {
color:#4d698e;
font-size:18px!important;
}
.Hero {
box-shadow:0 1px 10px 0 rgba(151,158,181,.28)!important;
background-color:#fff!important;
margin-bottom:15px;
}
.Hero h2 {
font-size:2em;
font-weight:bolder;
color:#191919;
}
.Hero-subtitle {
color:#000;
font-size:15px;
margin:8px 0 0;
line-height:1.5em;
}
.App-header .Button,.App-header .Button:hover {
color:#ffffff;
}
.UserPage .Hero h2 {
color:#ffffff;
}
.Post-body {
font-size:14px;
line-height:1.7;
position:relative;
overflow:auto;
overflow-wrap:break-word;
border-radius:5px;
margin-top:0;
box-shadow:0 8px 9px 0 rgba(0,0,0,0.1) !important;
background:#fff;
padding:20px;
min-height:80px;
}
.Post-body>*:first-child,.Post-preview>*:first-child {
margin-top:0 !important;
margin-bottom:0;
}
.Post-actions {
margin-top:5px;
}
.Post-footer {
margin-top:10px;
margin-bottom:0;
}
.Post-header {
margin-bottom:10px;
color:#808080;
}
.PostStream-timeGap {
padding-top:0;
padding-bottom:0;
}
.Select-caret {
margin-left:5px;
}
.Post {
padding-bottom:10px;
}
.PostStream-timeGap span {
margin-top:-10px;
position:absolute;
}
.UserPage .Post-body {
box-shadow:none!important;
}
.tooltip.right {
margin-left:-29px;
margin-top:-18px;
padding:0;
}}

SCREENSHOTS | 效果截图

Dec. 12, 2019

image.png

Jan. 15, 2020

image.png