Skip to content

Commit 65ca2db

Browse files
jorisvandenbosschejorisvandenbossche
authored
Add --pst prefix to all our CSS custom properties (variables) (#312)
1 parent 9628268 commit 65ca2db

8 files changed

+150
-150
lines changed

‎pydata_sphinx_theme/static/css/index.4ea0a4617f49cfd39b5b9e9540ffc872.css renamed to ‎pydata_sphinx_theme/static/css/index.57d3cd9fdfd1e83932aa4eb4774f9fb9.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎pydata_sphinx_theme/static/css/theme.css

Lines changed: 66 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -2,103 +2,103 @@
22
/*****************************************************************************
33
* Theme config
44
**/
5-
--header-height: 60px;
5+
--pst-header-height: 60px;
66

77
/*****************************************************************************
88
* Font size
99
**/
10-
--font-size-base: 15px; /* base font size - applied at body / html level */
10+
--pst-font-size-base: 15px; /* base font size - applied at body / html level */
1111

1212
/* heading font sizes */
13-
--font-size-h1: 36px;
14-
--font-size-h2: 32px;
15-
--font-size-h3: 26px;
16-
--font-size-h4: 21px;
17-
--font-size-h5: 18px;
18-
--font-size-h6: 16px;
13+
--pst-font-size-h1: 36px;
14+
--pst-font-size-h2: 32px;
15+
--pst-font-size-h3: 26px;
16+
--pst-font-size-h4: 21px;
17+
--pst-font-size-h5: 18px;
18+
--pst-font-size-h6: 16px;
1919

2020
/* smaller then heading font sizes*/
21-
--font-size-milli: 12px;
21+
--pst-font-size-milli: 12px;
2222

2323
/*****************************************************************************
2424
* Font family
2525
**/
26-
--font-family-base: 'Lato', sans-serif;
27-
--font-family-heading: 'Open Sans', sans-serif;
26+
--pst-font-family-base: 'Lato', sans-serif;
27+
--pst-font-family-heading: 'Open Sans', sans-serif;
2828

2929
/*****************************************************************************
3030
* Color
3131
*
3232
* Colors are defined in rgb string way, "red, green, blue"
3333
**/
34-
--color-primary: 19, 6, 84;
35-
--color-success: 40, 167, 69;
36-
--color-info: 0, 123, 255; /*23, 162, 184;*/
37-
--color-warning: 255, 193, 7;
38-
--color-danger: 220, 53, 69;
39-
--color-text-base: 51, 51, 51;
34+
--pst-color-primary: 19, 6, 84;
35+
--pst-color-success: 40, 167, 69;
36+
--pst-color-info: 0, 123, 255; /*23, 162, 184;*/
37+
--pst-color-warning: 255, 193, 7;
38+
--pst-color-danger: 220, 53, 69;
39+
--pst-color-text-base: 51, 51, 51;
4040

41-
--color-h1: var(--color-primary);
42-
--color-h2: var(--color-primary);
43-
--color-h3: var(--color-text-base);
44-
--color-h4: var(--color-text-base);
45-
--color-h5: var(--color-text-base);
46-
--color-h6: var(--color-text-base);
47-
--color-paragraph: var(--color-text-base);
48-
--color-link: 0, 91, 129;
49-
--color-link-hover: 227, 46, 0;
50-
--color-headerlink: 198, 15, 15;
51-
--color-headerlink-hover: 255, 255, 255;
52-
--color-preformatted-text: 34, 34, 34;
53-
--color-preformatted-background: 250, 250, 250;
41+
--pst-color-h1: var(--pst-color-primary);
42+
--pst-color-h2: var(--pst-color-primary);
43+
--pst-color-h3: var(--pst-color-text-base);
44+
--pst-color-h4: var(--pst-color-text-base);
45+
--pst-color-h5: var(--pst-color-text-base);
46+
--pst-color-h6: var(--pst-color-text-base);
47+
--pst-color-paragraph: var(--pst-color-text-base);
48+
--pst-color-link: 0, 91, 129;
49+
--pst-color-link-hover: 227, 46, 0;
50+
--pst-color-headerlink: 198, 15, 15;
51+
--pst-color-headerlink-hover: 255, 255, 255;
52+
--pst-color-preformatted-text: 34, 34, 34;
53+
--pst-color-preformatted-background: 250, 250, 250;
5454

55-
--color-active-navigation: 19, 6, 84;
56-
--color-navbar-link: 77, 77, 77;
57-
--color-navbar-link-hover: var(--color-active-navigation);
58-
--color-navbar-link-active: var(--color-active-navigation);
59-
--color-sidebar-link: 77, 77, 77;
60-
--color-sidebar-link-hover: var(--color-active-navigation);
61-
--color-sidebar-link-active: var(--color-active-navigation);
62-
--color-toc-link: 119, 117, 122;
63-
--color-toc-link-hover: var(--color-active-navigation);
64-
--color-toc-link-active: var(--color-active-navigation);
55+
--pst-color-active-navigation: 19, 6, 84;
56+
--pst-color-navbar-link: 77, 77, 77;
57+
--pst-color-navbar-link-hover: var(--pst-color-active-navigation);
58+
--pst-color-navbar-link-active: var(--pst-color-active-navigation);
59+
--pst-color-sidebar-link: 77, 77, 77;
60+
--pst-color-sidebar-link-hover: var(--pst-color-active-navigation);
61+
--pst-color-sidebar-link-active: var(--pst-color-active-navigation);
62+
--pst-color-toc-link: 119, 117, 122;
63+
--pst-color-toc-link-hover: var(--pst-color-active-navigation);
64+
--pst-color-toc-link-active: var(--pst-color-active-navigation);
6565

6666
/*****************************************************************************
6767
* Icon
6868
**/
6969

7070
/* font awesome icons*/
71-
--icon-check-circle: '\f058';
72-
--icon-info-circle: '\f05a';
73-
--icon-exclamation-triangle: '\f071';
74-
--icon-exclamation-circle: '\f06a';
75-
--icon-times-circle: '\f057';
76-
--icon-lightbulb: '\f0eb';
71+
--pst-icon-check-circle: '\f058';
72+
--pst-icon-info-circle: '\f05a';
73+
--pst-icon-exclamation-triangle: '\f071';
74+
--pst-icon-exclamation-circle: '\f06a';
75+
--pst-icon-times-circle: '\f057';
76+
--pst-icon-lightbulb: '\f0eb';
7777

7878
/*****************************************************************************
7979
* Admonitions
8080
**/
8181

82-
--color-admonition-default: var(--color-info);
83-
--color-admonition-note: var(--color-info);
84-
--color-admonition-attention: var(--color-warning);
85-
--color-admonition-caution: var(--color-warning);
86-
--color-admonition-warning: var(--color-warning);
87-
--color-admonition-danger: var(--color-danger);
88-
--color-admonition-error: var(--color-danger);
89-
--color-admonition-hint: var(--color-success);
90-
--color-admonition-tip: var(--color-success);
91-
--color-admonition-important: var(--color-success);
82+
--pst-color-admonition-default: var(--pst-color-info);
83+
--pst-color-admonition-note: var(--pst-color-info);
84+
--pst-color-admonition-attention: var(--pst-color-warning);
85+
--pst-color-admonition-caution: var(--pst-color-warning);
86+
--pst-color-admonition-warning: var(--pst-color-warning);
87+
--pst-color-admonition-danger: var(--pst-color-danger);
88+
--pst-color-admonition-error: var(--pst-color-danger);
89+
--pst-color-admonition-hint: var(--pst-color-success);
90+
--pst-color-admonition-tip: var(--pst-color-success);
91+
--pst-color-admonition-important: var(--pst-color-success);
9292

93-
--icon-admonition-default: var(--icon-info-circle);
94-
--icon-admonition-note: var(--icon-info-circle);
95-
--icon-admonition-attention: var(--icon-exclamation-circle);
96-
--icon-admonition-caution: var(--icon-exclamation-triangle);
97-
--icon-admonition-warning: var(--icon-exclamation-triangle);
98-
--icon-admonition-danger: var(--icon-exclamation-triangle);
99-
--icon-admonition-error: var(--icon-times-circle);
100-
--icon-admonition-hint: var(--icon-lightbulb);
101-
--icon-admonition-tip: var(--icon-lightbulb);
102-
--icon-admonition-important: var(--icon-exclamation-circle);
93+
--pst-icon-admonition-default: var(--pst-icon-info-circle);
94+
--pst-icon-admonition-note: var(--pst-icon-info-circle);
95+
--pst-icon-admonition-attention: var(--pst-icon-exclamation-circle);
96+
--pst-icon-admonition-caution: var(--pst-icon-exclamation-triangle);
97+
--pst-icon-admonition-warning: var(--pst-icon-exclamation-triangle);
98+
--pst-icon-admonition-danger: var(--pst-icon-exclamation-triangle);
99+
--pst-icon-admonition-error: var(--pst-icon-times-circle);
100+
--pst-icon-admonition-hint: var(--pst-icon-lightbulb);
101+
--pst-icon-admonition-tip: var(--pst-icon-lightbulb);
102+
--pst-icon-admonition-important: var(--pst-icon-exclamation-circle);
103103

104104
}

‎pydata_sphinx_theme/static/js/index.bf572f7d6dfb3e591c72.js renamed to ‎pydata_sphinx_theme/static/js/index.109f8ec7af5a9d176fcd.js

File renamed without changes.

‎pydata_sphinx_theme/static/webpack-macros.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,13 +17,13 @@
1717

1818
{% macro head_pre_bootstrap() %}
1919
<link href="{{ pathto('_static/css/theme.css', 1) }}" rel="stylesheet" />
20-
<link href="{{ pathto('_static/css/index.4ea0a4617f49cfd39b5b9e9540ffc872.css', 1) }}" rel="stylesheet" />
20+
<link href="{{ pathto('_static/css/index.57d3cd9fdfd1e83932aa4eb4774f9fb9.css', 1) }}" rel="stylesheet" />
2121
{% endmacro %}
2222

2323
{% macro head_js_preload() %}
24-
<link rel="preload" as="script" href="{{ pathto('_static/js/index.bf572f7d6dfb3e591c72.js', 1) }}">
24+
<link rel="preload" as="script" href="{{ pathto('_static/js/index.109f8ec7af5a9d176fcd.js', 1) }}">
2525
{% endmacro %}
2626

2727
{% macro body_post() %}
28-
<script src="{{ pathto('_static/js/index.bf572f7d6dfb3e591c72.js', 1) }}"></script>
28+
<script src="{{ pathto('_static/js/index.109f8ec7af5a9d176fcd.js', 1) }}"></script>
2929
{% endmacro %}

‎src/scss/_admonitions.scss

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
overflow: hidden;
77
page-break-inside: avoid;
88
border-left: 0.2rem solid;
9-
border-color: rgba(var(--color-admonition-default), 1);
9+
border-color: rgba(var(--pst-color-admonition-default), 1);
1010
border-radius: 0.1rem;
1111
box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.05),
1212
0 0 0.05rem rgba(0, 0, 0, 0.1);
@@ -33,17 +33,17 @@
3333
margin: 0 -0.6rem !important;
3434
padding: 0.4rem 0.6rem 0.4rem 2rem;
3535
font-weight: 700;
36-
background-color: rgba(var(--color-admonition-default), 0.1);
36+
background-color: rgba(var(--pst-color-admonition-default), 0.1);
3737

3838
&:before {
3939
position: absolute;
4040
left: 0.6rem;
4141
width: 1rem;
4242
height: 1rem;
43-
color: rgba(var(--color-admonition-default), 1);
43+
color: rgba(var(--pst-color-admonition-default), 1);
4444
font-family: 'Font Awesome 5 Free';
4545
font-weight: 900;
46-
content: var(--icon-admonition-default);
46+
content: var(--pst-icon-admonition-default);
4747
}
4848

4949
// Next element after title needs some extra upper-space
@@ -53,109 +53,109 @@
5353
}
5454

5555
&.attention {
56-
border-color: rgba(var(--color-admonition-attention), 1);
56+
border-color: rgba(var(--pst-color-admonition-attention), 1);
5757
.admonition-title {
58-
background-color: rgba(var(--color-admonition-attention), 0.1);
58+
background-color: rgba(var(--pst-color-admonition-attention), 0.1);
5959

6060
&:before {
61-
color: rgba(var(--color-admonition-attention), 1);
62-
content: var(--icon-admonition-attention);
61+
color: rgba(var(--pst-color-admonition-attention), 1);
62+
content: var(--pst-icon-admonition-attention);
6363
}
6464
}
6565
}
6666

6767
&.caution {
68-
border-color: rgba(var(--color-admonition-caution), 1);
68+
border-color: rgba(var(--pst-color-admonition-caution), 1);
6969
.admonition-title {
70-
background-color: rgba(var(--color-admonition-caution), 0.1);
70+
background-color: rgba(var(--pst-color-admonition-caution), 0.1);
7171

7272
&:before {
73-
color: rgba(var(--color-admonition-caution), 1);
74-
content: var(--icon-admonition-caution);
73+
color: rgba(var(--pst-color-admonition-caution), 1);
74+
content: var(--pst-icon-admonition-caution);
7575
}
7676
}
7777
}
7878

7979
&.warning {
80-
border-color: rgba(var(--color-admonition-warning), 1);
80+
border-color: rgba(var(--pst-color-admonition-warning), 1);
8181
.admonition-title {
82-
background-color: rgba(var(--color-admonition-warning), 0.1);
82+
background-color: rgba(var(--pst-color-admonition-warning), 0.1);
8383

8484
&:before {
85-
color: rgba(var(--color-admonition-warning), 1);
86-
content: var(--icon-admonition-warning);
85+
color: rgba(var(--pst-color-admonition-warning), 1);
86+
content: var(--pst-icon-admonition-warning);
8787
}
8888
}
8989
}
9090

9191
&.danger {
92-
border-color: rgba(var(--color-admonition-danger), 1);
92+
border-color: rgba(var(--pst-color-admonition-danger), 1);
9393
.admonition-title {
94-
background-color: rgba(var(--color-admonition-danger), 0.1);
94+
background-color: rgba(var(--pst-color-admonition-danger), 0.1);
9595

9696
&:before {
97-
color: rgba(var(--color-admonition-danger), 1);
98-
content: var(--icon-admonition-danger);
97+
color: rgba(var(--pst-color-admonition-danger), 1);
98+
content: var(--pst-icon-admonition-danger);
9999
}
100100
}
101101
}
102102

103103
&.error {
104-
border-color: rgba(var(--color-admonition-error), 1);
104+
border-color: rgba(var(--pst-color-admonition-error), 1);
105105
.admonition-title {
106-
background-color: rgba(var(--color-admonition-error), 0.1);
106+
background-color: rgba(var(--pst-color-admonition-error), 0.1);
107107

108108
&:before {
109-
color: rgba(var(--color-admonition-error), 1);
110-
content: var(--icon-admonition-error);
109+
color: rgba(var(--pst-color-admonition-error), 1);
110+
content: var(--pst-icon-admonition-error);
111111
}
112112
}
113113
}
114114

115115
&.hint {
116-
border-color: rgba(var(--color-admonition-hint), 1);
116+
border-color: rgba(var(--pst-color-admonition-hint), 1);
117117
.admonition-title {
118-
background-color: rgba(var(--color-admonition-hint), 0.1);
118+
background-color: rgba(var(--pst-color-admonition-hint), 0.1);
119119

120120
&:before {
121-
color: rgba(var(--color-admonition-hint), 1);
122-
content: var(--icon-admonition-hint);
121+
color: rgba(var(--pst-color-admonition-hint), 1);
122+
content: var(--pst-icon-admonition-hint);
123123
}
124124
}
125125
}
126126

127127
&.tip {
128-
border-color: rgba(var(--color-admonition-tip), 1);
128+
border-color: rgba(var(--pst-color-admonition-tip), 1);
129129
.admonition-title {
130-
background-color: rgba(var(--color-admonition-tip), 0.1);
130+
background-color: rgba(var(--pst-color-admonition-tip), 0.1);
131131

132132
&:before {
133-
color: rgba(var(--color-admonition-tip), 1);
134-
content: var(--icon-admonition-tip);
133+
color: rgba(var(--pst-color-admonition-tip), 1);
134+
content: var(--pst-icon-admonition-tip);
135135
}
136136
}
137137
}
138138

139139
&.important {
140-
border-color: rgba(var(--color-admonition-important), 1);
140+
border-color: rgba(var(--pst-color-admonition-important), 1);
141141
.admonition-title {
142-
background-color: rgba(var(--color-admonition-important), 0.1);
142+
background-color: rgba(var(--pst-color-admonition-important), 0.1);
143143

144144
&:before {
145-
color: rgba(var(--color-admonition-important), 1);
146-
content: var(--icon-admonition-important);
145+
color: rgba(var(--pst-color-admonition-important), 1);
146+
content: var(--pst-icon-admonition-important);
147147
}
148148
}
149149
}
150150

151151
&.note {
152-
border-color: rgba(var(--color-admonition-note), 1);
152+
border-color: rgba(var(--pst-color-admonition-note), 1);
153153
.admonition-title {
154-
background-color: rgba(var(--color-admonition-note), 0.1);
154+
background-color: rgba(var(--pst-color-admonition-note), 0.1);
155155

156156
&:before {
157-
color: rgba(var(--color-admonition-note), 1);
158-
content: var(--icon-admonition-note);
157+
color: rgba(var(--pst-color-admonition-note), 1);
158+
content: var(--pst-icon-admonition-note);
159159
}
160160
}
161161
}

0 commit comments

Comments
 (0)