Skip to content

Commit 84c9bf0

Browse files
shenxianpengshenxianpeng
authored
docs: add shared styles for the cpp-linter docs sites (#64)
1 parent 7540013 commit 84c9bf0

3 files changed

Lines changed: 126 additions & 71 deletions

File tree

‎docs/stylesheets/extra.css‎

Lines changed: 0 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
th {
2-
background-color: var(--md-default-fg-color--lightest);
3-
}
4-
51
:root > * {
62
--cpp-linter-logo-color-green: #40b385;
73
--cpp-linter-logo-color-yellow: #ffc20a;
@@ -281,70 +277,3 @@ th {
281277
.md-tabs__link:hover {
282278
color: white;
283279
}
284-
285-
@media screen and (max-width: 76.2344em) {
286-
.md-nav--primary .md-nav__title[for="__drawer"] {
287-
background-color: #4051b5;
288-
}
289-
}
290-
291-
.md-typeset .admonition.important,
292-
.md-typeset details.important {
293-
border-color: #00b8d4;
294-
}
295-
296-
.md-typeset .important>.admonition-title::before,
297-
.md-typeset .important>summary::before {
298-
background-color: #00b8d4;
299-
-webkit-mask-image: var(--md-admonition-icon--info);
300-
mask-image: var(--md-admonition-icon--info);
301-
}
302-
303-
.md-typeset .important>.admonition-title,
304-
.md-typeset .important>summary {
305-
background-color: #00b8d41a;
306-
}
307-
308-
.md-banner {
309-
color: var(--md-footer-fg-color--lighter)
310-
}
311-
312-
.md-banner strong {
313-
white-space: nowrap
314-
}
315-
316-
.md-banner a,
317-
.md-banner strong {
318-
color: var(--md-footer-fg-color)
319-
}
320-
321-
.md-banner a:focus,
322-
.md-banner a:hover {
323-
color: currentcolor
324-
}
325-
326-
.md-banner a:focus .twemoji,
327-
.md-banner a:hover .twemoji {
328-
background-color: var(--md-footer-fg-color);
329-
box-shadow: none
330-
}
331-
332-
.md-banner .twemoji {
333-
border-radius: 100%;
334-
box-shadow: inset 0 0 0 .05rem currentcolor;
335-
display: inline-block;
336-
height: 1.2rem;
337-
padding: .25rem;
338-
transition: all .25s;
339-
vertical-align: bottom;
340-
width: 1.2rem
341-
}
342-
343-
.md-banner .twemoji svg {
344-
display: block;
345-
max-height: none
346-
}
347-
348-
a.md-annotation__index {
349-
border-radius: 2.2ch;
350-
}

‎docs/stylesheets/shared.css‎

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
/*
2+
* Styles shared by the cpp-linter docs sites. Each site loads this file from
3+
* https://cpp-linter.github.io/stylesheets/shared.css before its own stylesheet,
4+
* so rules that only one site needs belong in that site's stylesheet instead.
5+
*/
6+
7+
th {
8+
background-color: var(--md-default-fg-color--lightest);
9+
}
10+
11+
/* "important" admonitions */
12+
.md-typeset .admonition.important,
13+
.md-typeset details.important {
14+
border-color: #00b8d4;
15+
}
16+
17+
.md-typeset .important>.admonition-title::before,
18+
.md-typeset .important>summary::before {
19+
background-color: #00b8d4;
20+
-webkit-mask-image: var(--md-admonition-icon--info);
21+
mask-image: var(--md-admonition-icon--info);
22+
}
23+
24+
.md-typeset .important>.admonition-title,
25+
.md-typeset .important>summary {
26+
background-color: #00b8d41a;
27+
}
28+
29+
/* badges next to inputs and options */
30+
.md-typeset .mdx-badge {
31+
font-size: .85em;
32+
}
33+
34+
.md-typeset .mdx-badge--right {
35+
float: right;
36+
margin-left: .35em;
37+
}
38+
39+
[dir=ltr] .md-typeset .mdx-badge__icon {
40+
border-top-left-radius: .1rem;
41+
border-bottom-left-radius: .1rem;
42+
}
43+
44+
[dir=rtl] .md-typeset .mdx-badge__icon {
45+
border-top-right-radius: .1rem;
46+
border-bottom-right-radius: .1rem;
47+
}
48+
49+
.md-typeset .mdx-badge__icon {
50+
background: var(--md-accent-fg-color--transparent);
51+
padding: .2rem;
52+
}
53+
54+
.md-typeset .mdx-badge__icon:last-child {
55+
border-radius: .1rem;
56+
}
57+
58+
[dir=ltr] .md-typeset .mdx-badge__text {
59+
border-top-right-radius: .1rem;
60+
border-bottom-right-radius: .1rem;
61+
}
62+
63+
[dir=rtl] .md-typeset .mdx-badge__text {
64+
border-top-left-radius: .1rem;
65+
border-bottom-left-radius: .1rem;
66+
}
67+
68+
.md-typeset .mdx-badge__text {
69+
box-shadow: 0 0 0 1px inset var(--md-accent-fg-color--transparent);
70+
padding: .2rem .3rem;
71+
}
72+
73+
/* the "experimental" badge icon: an inline SVG in MkDocs, a ::before mask in Sphinx */
74+
@keyframes heart {
75+
76+
0%,
77+
40%,
78+
80%,
79+
to {
80+
transform: scale(1);
81+
}
82+
83+
20%,
84+
60% {
85+
transform: scale(1.15);
86+
}
87+
}
88+
89+
.md-typeset .mdx-badge--heart {
90+
color: #ff4281;
91+
}
92+
93+
.md-typeset .mdx-badge--heart.twemoji {
94+
animation: heart 1s infinite;
95+
}
96+
97+
.md-typeset .mdx-badge--heart::before {
98+
background-color: #ff4281;
99+
}
100+
101+
.md-typeset .mdx-heart::before {
102+
animation: heart 1s infinite;
103+
}
104+
105+
/* code annotation buttons: round, pulsing in the accent color */
106+
a.md-annotation__index {
107+
border-radius: 2.2ch;
108+
}
109+
110+
@keyframes pulse {
111+
0% {
112+
box-shadow: 0 0 0 0 var(--md-accent-fg-color);
113+
transform: scale(.95);
114+
}
115+
116+
75% {
117+
box-shadow: 0 0 0 .625em transparent;
118+
transform: scale(1);
119+
}
120+
121+
to {
122+
box-shadow: 0 0 0 0 transparent;
123+
transform: scale(.95);
124+
}
125+
}

‎mkdocs.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,7 @@ plugins:
9494
- Announcements
9595

9696
extra_css:
97+
- stylesheets/shared.css
9798
- stylesheets/extra.css
9899

99100
edit_uri_template: https://github.com/cpp-linter/cpp-linter.github.io/edit/main/docs/{path}

0 commit comments

Comments
 (0)