refactor light-dark selection to variables defination.

This commit is contained in:
Vixalie
2025-03-09 10:59:10 +08:00
parent 33905e9007
commit 8dddc814c4
15 changed files with 375 additions and 681 deletions

View File

@@ -3,9 +3,6 @@
flex: 2;
border-radius: calc(var(--border-radius) * 2);
padding: calc(var(--spacing) * 2);
background-color: light-dark(
var(--color-light-surface-container),
var(--color-dark-surface-container)
);
background-color: var(--color-surface-container);
}
}

View File

@@ -24,8 +24,8 @@
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 3);
border-radius: calc(var(--border-radius) * 2);
background-color: light-dark(var(--color-light-surface), var(--color-dark-surface));
color: light-dark(var(--color-light-on-surface), var(--color-dark-on-surface));
background-color: var(--color-surface);
color: var(--color-on-surface);
display: flex;
flex-direction: row;
align-items: center;
@@ -37,20 +37,14 @@
text-overflow: ellipsis;
}
&:hover {
background-color: light-dark(
color-mix(in oklch, var(--color-light-on-surface) 8%, transparent),
color-mix(in oklch, var(--color-dark-on-surface) 8%, transparent)
);
background-color: color-mix(in oklch, var(--color-on-surface) 8%, transparent);
}
}
.empty_prompt {
padding-block: calc(var(--spacing) * 1);
text-align: center;
font-size: calc(var(--font-size) * 0.8);
color: light-dark(
var(--color-light-on-surface-variant),
var(--color-dark-on-surface-variant)
);
color: var(--color-on-surface-variant);
}
}
}

View File

@@ -7,10 +7,7 @@
gap: calc(var(--spacing) * 2);
padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
border-radius: calc(var(--border-radius) * 2);
color: light-dark(var(--color-light-on-surface), var(--color-dark-on-surface));
background-color: light-dark(
var(--color-light-surface-container),
var(--color-dark-surface-container)
);
color: var(--color-light-on-surface);
background-color: var(--color-surface-container);
}
}

View File

@@ -2,9 +2,6 @@
.pattern_detail {
flex: 2;
border-radius: calc(var(--border-radius) * 2);
background-color: light-dark(
var(--color-light-surface-container),
var(--color-dark-surface-container)
);
background-color: var(--color-surface-container);
}
}

View File

@@ -5,9 +5,6 @@
overflow: hidden;
flex: 1;
border-radius: calc(var(--border-radius) * 2);
background-color: light-dark(
var(--color-light-surface-container),
var(--color-dark-surface-container)
);
background-color: var(--color-surface-container);
}
}

View File

@@ -3,10 +3,7 @@
flex: 1;
padding: calc(var(--spacing) * 2) calc(var(--spacing) * 3);
border-radius: calc(var(--border-radius) * 2);
background-color: light-dark(
var(--color-light-surface-container),
var(--color-dark-surface-container)
);
background-color: var(--color-surface-container);
display: flex;
flex-direction: column;
gap: calc(var(--spacing));