Login Register
LixdHappy

LixdHappy / Friend-Circle-Lite部分优化

Last active 4 months ago

Like 1

针对柳神更新后不适配anzhiyu主题的情况

css js pug 朋友圈

LixdHappy revised this gist 4 months ago · c80a1ee

3 files changed, 424 insertions

fcircle.pug (file created)
@@ -0,0 +1,63 @@
1 + if theme.friends_lite.enable
2 + link(rel="stylesheet", href=theme.friends_lite.fclite_css_url)
3 + style.
4 + #random-article {
5 + display: none!important;
6 + }
7 + .card:hover,
8 + #random-article:hover {
9 + border: var(--style-border-hover)!important;
10 + }
11 + #modal-author-name-link,
12 + .modal-article .modal-article-title:hover,
13 + .card-title:hover{
14 + color: var(--anzhiyu-theme)!important;
15 + }
16 + .modal-article,
17 + #modal-articles-container {
18 + border-top-color: var(--anzhiyu-theme)!important;
19 + border-bottom-color: var(--anzhiyu-theme)!important;
20 + }
21 + #load-more-btn:hover {
22 + background: var(--anzhiyu-theme)!important;
23 + }
24 + .card-title {
25 + margin-bottom: 16px!important;
26 + }
27 + .fcircle_page
28 + .author-content.author-content-item.fcirclePage.single(style=`background: url(${theme.friends_lite.top_background}) center / cover no-repeat !important;`)
29 + .card-content
30 + .author-content-item-tips 朋友圈
31 + span.author-content-item-title 最新文章订阅
32 + .content-bottom
33 + .tips= theme.friends_lite.top_tips
34 + .banner-button-group
35 + a.banner-button(onclick='pjax.loadUrl("/subscribe")')
36 + i.anzhiyufont.anzhiyu-icon-arrow-circle-right(style='font-size: 22px; margin-right: 0.25rem')
37 + span.banner-button-text(gbtip="查看本站的订阅方式") 订阅本站
38 + .title-h2-a
39 + .title-h2-a-left
40 + h2(style='padding-top:0;margin:.6rem 0 .6rem') 🎣 钓鱼
41 + a.random-post-start(gbtip="钓钓更健康" href='javascript:fetchRandomPost();')
42 + i.anzhiyufont.anzhiyu-icon-arrow-rotate-right
43 + .title-h2-a-right
44 + a.random-post-all( gbtip="查看本站的朋友们" href='/link/') 全部友链
45 + .fishing-card
46 + #friend-stats
47 + .fishing-tip 🎲 这里不给钓鱼(￣^￣)
48 + #random-post
49 + .title-h2-a
50 + .title-h2-a-left
51 + h2 🐟 鱼塘
52 + #friend-circle-lite-root
53 +
54 + script.
55 + if (typeof UserConfig === 'undefined') {
56 + var UserConfig = {
57 + private_api_url: '#{theme.friends_lite.private_api_url}',
58 + page_turning_number: #{theme.friends_lite.page_turning_number},
59 + error_img: '#{theme.friends_lite.error_img}'
60 + }
61 + }
62 + script(src=theme.friends_lite.fclite_js_url)
63 + script(defer data-pjax src=url_for(theme.asset.random_friends_post_js))
friends.css (file created)
@@ -0,0 +1,169 @@
1 + /* 顶部样式 */
2 + .fcircle_page .author-content.fcirclePage {
3 + height: 19rem;
4 + color: var(--anzhiyu-white);
5 + overflow: hidden;
6 + margin-top: 0px;
7 + }
8 + body[data-type="fcircle"] #web_bg {
9 + background-color: #f7f9fe;
10 + }
11 +
12 + [data-theme="dark"] body[data-type="fcircle"] #web_bg {
13 + background-color: #000;
14 + }
15 +
16 + body[data-type="fcircle"] #page .page-title {
17 + display: none;
18 + }
19 +
20 + body[data-type="fcircle"] #page {
21 + border: 0;
22 + box-shadow: none !important;
23 + padding: 0 !important;
24 + background: transparent !important;
25 + }
26 + .fcircle_page a {
27 + border-bottom: none !important;
28 + }
29 + .fcircle_page .cf-article-avatar a:hover {
30 + background: none !important;
31 + color: var(--anzhiyu-fontcolor) !important;
32 + }
33 + /* 随机文章样式 */
34 +
35 + .title-h2-a {
36 + display: flex;
37 + align-items: center;
38 + justify-content: space-between;
39 + margin-top: 0.5rem;
40 + }
41 + .title-h2-a-left {
42 + display: flex;
43 + align-items: center;
44 + }
45 + .title-h2-a-left h2 {
46 + margin-top: 0 !important;
47 + margin-bottom: 0 !important;
48 + }
49 + .title-h2-a a {
50 + margin-left: 0.5rem;
51 + color: var(--anzhiyu-fontcolor);
52 + font-weight: 700;
53 + }
54 + #article-container .title-h2-a a:hover {
55 + color: var(--anzhiyu-hovertext) !important;
56 + }
57 + .fcircle_page .title-h2-a-right a.random-post-all {
58 + color: var(--anzhiyu-fontcolor);
59 + }
60 + #cf-overshow.cf-show-now p a.cf-article-title:hover,
61 + .fcircle_page #fcircleContainer .cf-article a.cf-article-title:hover,
62 + .fcircle_page .title-h2-a-right a.random-post-all:hover,
63 + .fcircle_page .title-h2-a-left a.random-post-start:hover {
64 + background: none;
65 + box-shadow: none;
66 + color: var(--anzhiyu-theme);
67 + }
68 + .fcircle_page .fish-pond-item .cf-article .cf-article-title {
69 + line-height: 2;
70 + }
71 +
72 + /* 钓鱼统一卡片 */
73 + .fishing-card {
74 + background: var(--card-bg);
75 + border: var(--style-border-always);
76 + box-shadow: var(--anzhiyu-shadow-border);
77 + border-radius: 12px;
78 + margin-top: 8px;
79 + padding: 20px 30px;
80 + }
81 +
82 + /* 朋友圈统计 */
83 + #friend-stats .stats-grid {
84 + display: grid;
85 + grid-template-columns: repeat(4, 1fr);
86 + gap: 8px;
87 + }
88 +
89 + #friend-stats .stats-item {
90 + display: flex;
91 + flex-direction: column;
92 + align-items: center;
93 + justify-content: center;
94 + background: var(--anzhiyu-card-bg);
95 + border: var(--style-border-always);
96 + border-radius: 6px;
97 + padding: 12px 8px;
98 + transition: border-color 0.3s ease;
99 + cursor: default;
100 + }
101 +
102 + #friend-stats .stats-item:hover {
103 + border-color: var(--anzhiyu-theme);
104 + }
105 +
106 + #friend-stats .stats-num {
107 + font-size: 24px;
108 + font-weight: 700;
109 + color: var(--anzhiyu-theme);
110 + line-height: 1;
111 + margin-bottom: 4px;
112 + }
113 +
114 + #friend-stats .stats-label {
115 + font-size: 12px;
116 + color: var(--anzhiyu-fontcolor);
117 + opacity: 0.5;
118 + }
119 +
120 + .fishing-tip {
121 + margin-top: 12px;
122 + font-size: 14px;
123 + font-weight: 700;
124 + color: var(--anzhiyu-fontcolor);
125 + opacity: 0.5;
126 + border-top: 1px dashed var(--anzhiyu-theme);
127 + padding-top: 8px;
128 + }
129 +
130 + /* random-post 降级为内嵌区块 */
131 + .fishing-card #random-post {
132 + background: transparent;
133 + border: none;
134 + box-shadow: none;
135 + padding: 8px 0 0;
136 + margin-top: 0;
137 + border-radius: 0;
138 + }
139 +
140 + #random-post {
141 + min-height: 32px;
142 + background: var(--card-bg);
143 + border: var(--style-border-always);
144 + box-shadow: var(--anzhiyu-shadow-border);
145 + padding: 20px 30px;
146 + border-radius: 12px;
147 + margin-top: 8px;
148 + }
149 + #random-post .random-friends-post {
150 + text-decoration: none;
151 + border-bottom: 2px solid var(--anzhiyu-lighttext) !important;
152 + color: var(--anzhiyu-fontcolor);
153 + font-weight: 700;
154 + padding: 0 4px;
155 + }
156 + #random-post .random-friends-post:hover {
157 + text-decoration: none;
158 + border-bottom: 2px solid var(--anzhiyu-none) !important;
159 + color: var(--anzhiyu-white) !important;
160 + background: var(--anzhiyu-main) !important;
161 + border-radius: 4px;
162 + box-shadow: var(--anzhiyu-shadow-main);
163 + }
164 +
165 + @media screen and (max-width: 500px) {
166 + #friend-stats .stats-grid {
167 + grid-template-columns: repeat(2, 1fr);
168 + }
169 + }
random_friends_post.js (file created)

Diff is too large to be shown