Skip to content

Commit 6a509da

Browse files
silverwindclaude
andauthored
refactor: lint bare fill/stroke colors, add vars for git graph color series (#37543)
- make `scale-unlimited/declaration-strict-value` cover fill and stroke - add new color vars for color series in gitgraph - move most rule disablement to per-line - remove dead highlight colors since #34948 - move stylelint config to ts now that the linked issue is fixed Co-authored-by: Claude (Opus 4.7) <noreply@anthropic.com>
1 parent 601c6eb commit 6a509da

6 files changed

Lines changed: 93 additions & 152 deletions

File tree

Lines changed: 3 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
1-
// @ts-check
2-
// TODO: Move to .ts after https://github.com/stylelint/stylelint/issues/8893 is fixed
31
import {fileURLToPath} from 'node:url';
2+
import type {Config} from 'stylelint';
43

54
const cssVarFiles = [
65
fileURLToPath(new URL('web_src/css/base.css', import.meta.url)),
76
fileURLToPath(new URL('web_src/css/themes/theme-gitea-light.css', import.meta.url)),
87
fileURLToPath(new URL('web_src/css/themes/theme-gitea-dark.css', import.meta.url)),
98
];
109

11-
/** @type {import('stylelint').Config} */
1210
export default {
1311
extends: 'stylelint-config-recommended',
1412
reportUnscopedDisables: true,
@@ -25,18 +23,6 @@ export default {
2523
'/web_src/fomantic',
2624
],
2725
overrides: [
28-
{
29-
files: ['**/chroma/*', '**/codemirror/*', '**/console.css', 'font_i18n.css'],
30-
rules: {
31-
'scale-unlimited/declaration-strict-value': null,
32-
},
33-
},
34-
{
35-
files: ['**/chroma/*', '**/codemirror/*'],
36-
rules: {
37-
'block-no-empty': null,
38-
},
39-
},
4026
{
4127
files: ['**/*.vue'],
4228
customSyntax: 'postcss-html',
@@ -139,7 +125,7 @@ export default {
139125
'no-unknown-custom-media': null, // disabled until stylelint supports multi-file linting
140126
'no-unknown-custom-properties': null, // disabled until stylelint supports multi-file linting
141127
'plugin/declaration-block-no-ignored-properties': true,
142-
'scale-unlimited/declaration-strict-value': [['/color$/', 'font-weight'], {ignoreValues: '/^(inherit|transparent|unset|initial|currentcolor|none)$/', ignoreFunctions: true, disableFix: true, expandShorthand: true}],
128+
'scale-unlimited/declaration-strict-value': [['/color$/', 'fill', 'stroke', 'font-weight'], {ignoreValues: '/^(inherit|transparent|unset|initial|currentcolor|none)$/', ignoreFunctions: true, disableFix: true, expandShorthand: true}],
143129
'selector-attribute-quotes': 'always',
144130
'selector-no-vendor-prefix': true,
145131
'selector-pseudo-element-colon-notation': 'double',
@@ -148,4 +134,4 @@ export default {
148134
'shorthand-property-no-redundant-values': true,
149135
'value-no-vendor-prefix': [true, {ignoreValues: ['box', 'inline-box']}],
150136
},
151-
};
137+
} satisfies Config;

web_src/css/features/console.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
/* Based on https://github.com/buildkite/terminal-to-html/blob/697ff23bd8dc48b9d23f11f259f5256dae2455f0/assets/terminal.css */
2+
/* stylelint-disable scale-unlimited/declaration-strict-value -- terminal ANSI palette uses literal hex values */
23

34
.console {
45
background: var(--color-console-bg);

web_src/css/features/gitgraph.css

Lines changed: 35 additions & 115 deletions
Original file line numberDiff line numberDiff line change
@@ -84,162 +84,82 @@
8484
fill: var(--color-secondary-dark-5);
8585
}
8686

87+
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-0 {
88+
stroke: var(--color-series-16-0);
89+
fill: var(--color-series-16-0);
90+
}
91+
8792
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-1 {
88-
stroke: #499a37;
89-
fill: #499a37;
93+
stroke: var(--color-series-16-1);
94+
fill: var(--color-series-16-1);
9095
}
9196

9297
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-2 {
93-
stroke: #ce4751;
94-
fill: #ce4751;
98+
stroke: var(--color-series-16-2);
99+
fill: var(--color-series-16-2);
95100
}
96101

97102
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-3 {
98-
stroke: #8f9121;
99-
fill: #8f9121;
103+
stroke: var(--color-series-16-3);
104+
fill: var(--color-series-16-3);
100105
}
101106

102107
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-4 {
103-
stroke: #ac32a6;
104-
fill: #ac32a6;
108+
stroke: var(--color-series-16-4);
109+
fill: var(--color-series-16-4);
105110
}
106111

107112
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-5 {
108-
stroke: #7445e9;
109-
fill: #7445e9;
113+
stroke: var(--color-series-16-5);
114+
fill: var(--color-series-16-5);
110115
}
111116

112117
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-6 {
113-
stroke: #c67d28;
114-
fill: #c67d28;
118+
stroke: var(--color-series-16-6);
119+
fill: var(--color-series-16-6);
115120
}
116121

117122
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-7 {
118-
stroke: #4db392;
119-
fill: #4db392;
123+
stroke: var(--color-series-16-7);
124+
fill: var(--color-series-16-7);
120125
}
121126

122127
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-8 {
123-
stroke: #aa4d30;
124-
fill: #aa4d30;
128+
stroke: var(--color-series-16-8);
129+
fill: var(--color-series-16-8);
125130
}
126131

127132
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-9 {
128-
stroke: #2a6f84;
129-
fill: #2a6f84;
133+
stroke: var(--color-series-16-9);
134+
fill: var(--color-series-16-9);
130135
}
131136

132137
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-10 {
133-
stroke: #c45327;
134-
fill: #c45327;
138+
stroke: var(--color-series-16-10);
139+
fill: var(--color-series-16-10);
135140
}
136141

137142
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-11 {
138-
stroke: #3d965c;
139-
fill: #3d965c;
143+
stroke: var(--color-series-16-11);
144+
fill: var(--color-series-16-11);
140145
}
141146

142147
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-12 {
143-
stroke: #792a93;
144-
fill: #792a93;
148+
stroke: var(--color-series-16-12);
149+
fill: var(--color-series-16-12);
145150
}
146151

147152
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-13 {
148-
stroke: #439d73;
149-
fill: #439d73;
153+
stroke: var(--color-series-16-13);
154+
fill: var(--color-series-16-13);
150155
}
151156

152157
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-14 {
153-
stroke: #103aad;
154-
fill: #103aad;
158+
stroke: var(--color-series-16-14);
159+
fill: var(--color-series-16-14);
155160
}
156161

157162
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-15 {
158-
stroke: #982e85;
159-
fill: #982e85;
160-
}
161-
162-
#git-graph-container:not(.monochrome) #rel-container .flow-group.flow-color-16-0 {
163-
stroke: #7db233;
164-
fill: #7db233;
165-
}
166-
167-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-1 {
168-
stroke: #5ac144;
169-
fill: #5ac144;
170-
}
171-
172-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-2 {
173-
stroke: #ed5a8b;
174-
fill: #ed5a8b;
175-
}
176-
177-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-3 {
178-
stroke: #ced049;
179-
fill: #ced048;
180-
}
181-
182-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-4 {
183-
stroke: #db61d7;
184-
fill: #db62d6;
185-
}
186-
187-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-5 {
188-
stroke: #8455f9;
189-
fill: #8455f9;
190-
}
191-
192-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-6 {
193-
stroke: #e6a151;
194-
fill: #e6a151;
195-
}
196-
197-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-7 {
198-
stroke: #44daaa;
199-
fill: #44daaa;
200-
}
201-
202-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-8 {
203-
stroke: #dd7a5c;
204-
fill: #dd7a5c;
205-
}
206-
207-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-9 {
208-
stroke: #38859c;
209-
fill: #38859c;
210-
}
211-
212-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-10 {
213-
stroke: #d95520;
214-
fill: #d95520;
215-
}
216-
217-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-11 {
218-
stroke: #42ae68;
219-
fill: #42ae68;
220-
}
221-
222-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-12 {
223-
stroke: #9126b5;
224-
fill: #9126b5;
225-
}
226-
227-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-13 {
228-
stroke: #4ab080;
229-
fill: #4ab080;
230-
}
231-
232-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-14 {
233-
stroke: #284fb8;
234-
fill: #284fb8;
235-
}
236-
237-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-15 {
238-
stroke: #971c80;
239-
fill: #971c80;
240-
}
241-
242-
#git-graph-container:not(.monochrome) #rel-container .flow-group.highlight.flow-color-16-0 {
243-
stroke: #87ca28;
244-
fill: #87ca28;
163+
stroke: var(--color-series-16-15);
164+
fill: var(--color-series-16-15);
245165
}

0 commit comments

Comments
 (0)