Skip to content

Commit b702361

Browse files
committed
style: Remove most font-family definitions, set to Inter on body
style: More Inter replacing Arial Remove special fonts for tests
1 parent 6081404 commit b702361

File tree

13 files changed

+10
-49
lines changed

13 files changed

+10
-49
lines changed

browser_tests/fixtures/ComfyPage.ts

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -324,19 +324,6 @@ export class ComfyPage {
324324
}
325325
await this.goto()
326326

327-
// Unify font for consistent screenshots.
328-
await this.page.addStyleTag({
329-
url: 'https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'
330-
})
331-
await this.page.addStyleTag({
332-
url: 'https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'
333-
})
334-
await this.page.addStyleTag({
335-
content: `
336-
* {
337-
font-family: 'Roboto Mono', 'Noto Color Emoji';
338-
}`
339-
})
340327
await this.page.waitForFunction(() => document.fonts.ready)
341328
await this.page.waitForFunction(
342329
() =>

packages/design-system/src/css/style.css

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -566,7 +566,7 @@ body {
566566
max-height: -webkit-fill-available;
567567
min-width: -webkit-fill-available;
568568
max-width: -webkit-fill-available;
569-
font-family: Arial, sans-serif;
569+
font-family: Inter, Arial, sans-serif;
570570
}
571571

572572
.comfy-multiline-input {
@@ -880,7 +880,6 @@ body {
880880
align-items: center;
881881
color: var(--descrip-text);
882882
background-color: var(--comfy-menu-bg);
883-
font-family: sans-serif;
884883
padding: 10px;
885884
border-radius: 0 8px 8px;
886885
box-shadow: 3px 3px 8px rgb(0 0 0 / 0.4);
@@ -978,7 +977,6 @@ span.drag-handle {
978977
margin-top: -0.4em;
979978
margin-left: -0.2em;
980979
font-size: 12px;
981-
font-family: sans-serif;
982980
letter-spacing: 2px;
983981
color: var(--drag-text);
984982
text-shadow: 1px 0 1px black;
@@ -1038,7 +1036,6 @@ button.comfy-queue-btn {
10381036
.comfy-modal.comfy-settings,
10391037
.comfy-modal.comfy-manage-templates {
10401038
text-align: center;
1041-
font-family: sans-serif;
10421039
color: var(--descrip-text);
10431040
z-index: 99;
10441041
}
@@ -1102,7 +1099,6 @@ button.comfy-queue-btn {
11021099

11031100
.graphdialog .name {
11041101
font-size: 14px;
1105-
font-family: sans-serif;
11061102
color: var(--descrip-text);
11071103
}
11081104

@@ -1142,7 +1138,6 @@ dialog::backdrop {
11421138
}
11431139

11441140
.comfy-dialog.comfy-modal {
1145-
font-family: Arial, sans-serif;
11461141
border-color: var(--bg-color);
11471142
box-shadow: none;
11481143
border: 2px solid var(--border-color);
@@ -1172,7 +1167,6 @@ dialog::backdrop {
11721167

11731168
.litegraph .dialog {
11741169
z-index: 1;
1175-
font-family: Arial, sans-serif;
11761170
}
11771171

11781172
.litegraph .litemenu-entry.has_submenu {
@@ -1337,7 +1331,6 @@ audio.comfy-audio.empty-audio-widget {
13371331
.maskEditor_sidePanelTitle {
13381332
text-align: center;
13391333
font-size: 15px;
1340-
font-family: sans-serif;
13411334
color: var(--descrip-text);
13421335
margin-top: 10px;
13431336
}
@@ -1445,7 +1438,6 @@ audio.comfy-audio.empty-audio-widget {
14451438
background: rgb(0 0 0 / 0.2);
14461439
border: 1px solid var(--border-color);
14471440
color: var(--input-text);
1448-
font-family: sans-serif;
14491441
font-size: 15px;
14501442
pointer-events: auto;
14511443
transition: background-color 0.1s;
@@ -1560,7 +1552,6 @@ audio.comfy-audio.empty-audio-widget {
15601552
border: 1px solid var(--p-form-field-border-color);
15611553
border-radius: 10px;
15621554
color: var(--input-text);
1563-
font-family: sans-serif;
15641555
pointer-events: auto;
15651556
transition: 0.1s;
15661557
width: 60px;
@@ -1576,7 +1567,6 @@ audio.comfy-audio.empty-audio-widget {
15761567
border: 1px solid var(--p-form-field-border-color);
15771568
border-radius: 10px;
15781569
color: var(--input-text);
1579-
font-family: sans-serif;
15801570
pointer-events: auto;
15811571
transition: 0.1s;
15821572
width: 60px;
@@ -1764,7 +1754,6 @@ audio.comfy-audio.empty-audio-widget {
17641754
.maskEditor_sidePanelSubTitle {
17651755
text-align: left;
17661756
font-size: 12px;
1767-
font-family: sans-serif;
17681757
color: var(--descrip-text);
17691758
}
17701759

src/components/graph/NodeTooltip.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,6 @@ useEventListener(window, 'click', hideTooltip)
138138
border-radius: 5px;
139139
box-shadow: 0 0 5px rgb(0 0 0 / 0.4);
140140
color: var(--input-text);
141-
font-family: sans-serif;
142141
left: 0;
143142
max-width: 30vw;
144143
padding: 4px 8px;

src/components/node/NodePreview.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -200,7 +200,6 @@ const truncateDefaultValue = (value: any, charLimit: number = 32): string => {
200200
}
201201
202202
._sb_node_preview {
203-
font-family: 'Open Sans', sans-serif;
204203
color: var(--descrip-text);
205204
border: 1px solid var(--descrip-text);
206205
min-width: 300px;

src/components/sidebar/tabs/modelLibrary/ModelPreview.vue

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@ const modelDef = props.modelDef
4949
<style scoped>
5050
.model_preview {
5151
background-color: var(--comfy-menu-bg);
52-
font-family: 'Open Sans', sans-serif;
5352
color: var(--descrip-text);
5453
border: 1px solid var(--descrip-text);
5554
min-width: 300px;

src/extensions/core/groupNodeManage.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
background: var(--bg-color);
33
color: var(--fg-color);
44
padding: 0;
5-
font-family: Arial, Helvetica, sans-serif;
65
border-color: black;
76
margin: 20vh auto;
87
max-height: 60vh;

src/lib/litegraph/public/css/litegraph.css

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,13 @@
66
-moz-user-select: none;
77
-webkit-user-select: none;
88
outline: none;
9-
font-family: Tahoma, sans-serif;
109
}
1110

1211
.lgraphcanvas * {
1312
box-sizing: border-box;
1413
}
1514

1615
.litegraph.litecontextmenu {
17-
font-family: Tahoma, sans-serif;
1816
position: fixed;
1917
top: 100px;
2018
left: 100px;
@@ -48,7 +46,6 @@
4846
}
4947

5048
.litegraph .litemenubar ul {
51-
font-family: Tahoma, sans-serif;
5249
margin: 0;
5350
padding: 0;
5451
}
@@ -165,7 +162,6 @@
165162
}
166163

167164
.litegraph.litesearchbox {
168-
font-family: Tahoma, sans-serif;
169165
position: absolute;
170166
background-color: rgba(0, 0, 0, 0.5);
171167
padding-top: 4px;
@@ -198,7 +194,6 @@
198194
}
199195

200196
.litegraph.lite-search-item {
201-
font-family: Tahoma, sans-serif;
202197
background-color: rgba(0, 0, 0, 0.5);
203198
color: white;
204199
padding-top: 2px;
@@ -302,7 +297,6 @@
302297

303298
.litegraph .dialog .dialog-header .dialog-title {
304299
font: 1rem;
305-
font-family: Inter, Arial, sans-serif;
306300
margin: 4px;
307301
padding: 4px 10px;
308302
display: inline-block;

src/lib/litegraph/src/LiteGraphGlobal.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -59,16 +59,16 @@ export class LiteGraphGlobal {
5959
NODE_DEFAULT_SHAPE = RenderShape.ROUND
6060
NODE_BOX_OUTLINE_COLOR = '#FFF'
6161
NODE_ERROR_COLOUR = '#E00'
62-
NODE_FONT = 'Arial'
62+
NODE_FONT = 'Inter'
6363
NODE_DEFAULT_BYPASS_COLOR = '#FF00FF'
6464
NODE_OPACITY = 0.9
6565

66-
DEFAULT_FONT = 'Arial'
66+
DEFAULT_FONT = 'Inter'
6767
DEFAULT_SHADOW_COLOR = 'rgba(0,0,0,0.5)'
6868

6969
DEFAULT_GROUP_FONT = 24
7070
DEFAULT_GROUP_FONT_SIZE?: any
71-
GROUP_FONT = 'Arial'
71+
GROUP_FONT = 'Inter'
7272

7373
WIDGET_BGCOLOR = '#222'
7474
WIDGET_OUTLINE_COLOR = '#666'

src/lib/litegraph/src/canvas/InputIndicators.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export class InputIndicators implements Disposable {
2323
colour1 = '#ff5f00'
2424
colour2 = '#00ff7c'
2525
colour3 = '#dea7ff'
26-
fontString = 'bold 12px Arial'
26+
fontString = 'bold 12px Inter'
2727
// #endregion
2828

2929
// #region state

src/lib/litegraph/src/subgraph/SubgraphIONodeBase.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -353,7 +353,7 @@ export abstract class SubgraphIONodeBase<
353353
editorAlpha?: number
354354
): void {
355355
ctx.fillStyle = '#AAA'
356-
ctx.font = '12px Arial'
356+
ctx.font = '12px Inter'
357357
ctx.textBaseline = 'middle'
358358

359359
for (const slot of this.allSlots) {

0 commit comments

Comments
 (0)