Leahnaya/sendou.ink
1
0
Fork 0
mirror of https://github.com/Sendouc/sendou.ink.git synced 2026-09-27 21:58:08 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Vars fixes

Browse Source
This commit is contained in:
hfcRed
2025-12-25 19:11:35 +01:00
parent b05fe4720f
commit c4d22aba53
15 changed files with 61 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/components/Ability.module.css
View File

@@ -2,13 +2,12 @@
width: var(--ability-size);
height: var(--ability-size);
padding: 0;
border: 2px solid var(--color-accent-low);
border: 2px solid var(--color-bg-higher);
border-radius: 50%;
border-right: 0;
border-bottom: 0;
background: var(--bg-ability);
background-size: 100%;
box-shadow: 0 0 0 1px var(--bg-ability);
transform: scale(1);
transition: all 0.1s ease;
user-select: none;

4
app/components/AddNewButton.module.css
View File

@@ -27,7 +27,7 @@
max-height: var(--icon-size);
min-width: var(--icon-size);
min-height: var(--icon-size);
color: var(--color-accent);
color: var(--color-text-accent);
stroke-width: 4px;
}
@@ -40,7 +40,7 @@
.textContainer {
padding-inline: var(--s-1-5);
background-color: var(--color-accent) !important;
background-color: var(--color-text-accent) !important;
height: calc(var(--button-height) - var(--border-width) * 2);
display: flex;
align-items: center;

2
app/components/Chart.tsx
View File

@@ -85,7 +85,7 @@ export default function Chart({
secondaryAxes,
dark: theme.htmlThemeClass === Theme.DARK,
defaultColors: [
"var(--color-accent)",
"var(--color-text-accent)",
"var(--color-accent)",
"var(--color-info)",
],

10
app/components/elements/Button.module.css
View File

@@ -3,10 +3,10 @@
width: auto;
align-items: center;
justify-content: center;
border: 2px solid var(--color-accent);
border: 2px solid var(--color-text-accent);
border-radius: var(--rounded-sm);
appearance: none;
background: var(--color-accent);
background: var(--color-text-accent);
color: var(--color-text-inverse);
cursor: pointer;
font-size: var(--fonts-sm);
@@ -20,7 +20,7 @@
.button[data-focus-visible],
.button:focus-visible {
outline: 2px solid var(--color-accent);
outline: 2px solid var(--color-text-accent);
}
.button[data-pressed],
@@ -37,7 +37,7 @@
.outlined {
background-color: var(--color-accent-low);
color: var(--color-accent);
color: var(--color-text-accent);
}
.outlinedSuccess {
@@ -68,7 +68,7 @@
padding: 0;
border: none;
background-color: transparent;
color: var(--color-accent);
color: var(--color-text-accent);
outline: initial;
}

6
app/components/elements/Menu.module.css
View File

@@ -54,7 +54,7 @@
}
.item[data-focused] {
background-color: var(--color-accent-low);
background-color: var(--color-bg-high);
}
.itemDisabled {
@@ -63,12 +63,12 @@
}
.itemSelected {
background-color: var(--color-accent-low);
background-color: var(--color-text-accent);
font-weight: var(--extra-bold);
}
.itemActive {
color: var(--color-accent);
color: var(--color-text-accent);
}
.itemIcon {

9
app/components/elements/Select.module.css
View File

@@ -17,6 +17,11 @@
font-size: var(--fonts-xs);
font-weight: var(--semi-bold);
letter-spacing: 0.5px;
cursor: pointer;
}
.button:hover {
border-color: var(--color-border-high);
}
.button[data-focus-visible] {
@@ -86,12 +91,12 @@
}
.itemFocused {
background-color: var(--color-accent-low);
background-color: var(--color-bg-high);
color: var(--color-text);
}
.itemSelected {
color: var(--color-accent);
color: var(--color-text-accent);
font-weight: var(--bold);
}

4
app/features/badges/components/BadgeDisplay.module.css
View File

@@ -62,12 +62,12 @@
padding: var(--s-1);
height: 24px;
width: 24px;
border: 2px solid var(--color-border);
border: 2px solid var(--color-border-high);
font-size: var(--fonts-xs);
color: var(--color-text-high);
}
.paginationButtonActive {
color: var(--color-accent);
color: var(--color-text-accent);
background-color: var(--color-bg-higher);
}

4
app/features/calendar/components/TournamentCard.module.css
View File

@@ -35,7 +35,7 @@
}
.card:hover .avatarImg {
outline: 6px solid var(--color-accent-low);
outline: 6px solid var(--color-bg-high);
}
.org {
@@ -121,7 +121,7 @@
.pillRanked {
background-color: var(--color-info-low);
color: var(--color-info);
color: var(--color-text-accent);
}
.pillRanked svg {

6
app/root.tsx
View File

@@ -52,14 +52,14 @@ import { allI18nNamespaces } from "./utils/i18n";
import { isRevalidation, metaTags } from "./utils/remix";
import { SUSPENDED_PAGE } from "./utils/urls";
import "nprogress/nprogress.css";
import "~/styles/normalize.css";
import "~/styles/common.css";
import "~/styles/elements.css";
import "~/styles/utils.css";
import "~/styles/flags.css";
import "~/styles/layout.css";
import "~/styles/normalize.css";
import "~/styles/utils.css";
import "~/styles/vars.css";
import "nprogress/nprogress.css";
export const shouldRevalidate: ShouldRevalidateFunction = (args) => {
if (isRevalidation(args)) return true;

32
app/styles/common.css
View File

@@ -101,11 +101,16 @@ textarea:not(.plain, [name="text"]) {
outline: none;
overflow-wrap: normal;
overflow-x: auto;
resize: vertical;
}
textarea:not(.plain, [name="text"]):hover {
border-color: var(--color-border-high);
}
textarea:not(.plain, [name="text"]):focus-within {
border-color: transparent;
outline: 2px solid var(--color-accent);
outline: 2px solid var(--color-text-accent);
}
input:not(.plain, [type="radio"]) {
@@ -242,9 +247,13 @@ select {
background-position: center right var(--s-3);
background-repeat: no-repeat;
cursor: pointer;
font-weight: 500;
padding-block: 3.5px;
padding-inline: var(--s-3) var(--s-9);
padding-block: 3.5px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
height: 2rem;
line-height: 1.25;
}
select:disabled {
@@ -253,6 +262,10 @@ select:disabled {
transform: initial;
}
select:hover {
border-color: var(--color-border-high);
}
.light select {
background-image: url('data:image/svg+xml;utf8,<svg width="17px" color="rgb(0 0 0 / 55%)" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /></svg>');
}
@@ -268,7 +281,8 @@ select::selection {
}
select:focus {
outline: 2px solid var(--color-accent);
border-color: transparent;
outline: 2px solid var(--color-text-accent);
}
.my-table {
@@ -349,9 +363,13 @@ abbr[title] {
outline: none;
}
.input-container:hover {
border-color: var(--color-border-high);
}
.input-container:focus-within {
border-color: transparent;
outline: 2px solid var(--color-accent);
outline: 2px solid var(--color-text-accent);
}
.input-container > input {
@@ -399,7 +417,7 @@ abbr[title] {
}
.sub-nav__link__container.active {
color: var(--color-accent);
color: var(--color-text-accent);
}
.sub-nav__link {
@@ -872,7 +890,7 @@ abbr[title] {
display: flex;
width: 100%;
align-items: center;
color: var(--color-accent);
color: var(--color-text-accent);
font-size: var(--fonts-lg);
text-align: center;
}

4
app/styles/elements.css
View File

@@ -152,7 +152,7 @@
.react-aria-Switch .indicator {
width: var(--s-11);
height: var(--s-6);
background: var(--color-accent-low);
background: var(--color-bg-higher);
border-radius: 1.143rem;
}
@@ -183,7 +183,7 @@
}
.react-aria-Switch[data-selected] .indicator {
background: var(--color-accent-high);
background: var(--color-text-accent);
}
.react-aria-Switch[data-selected] .indicator:before {

5
app/styles/layout.css
View File

@@ -90,8 +90,7 @@
height: var(--item-size);
outline-offset: 2px;
padding: 0.25rem;
border: 2px solid;
border-color: var(--color-accent-low);
border: 2px solid var(--color-border);
border-radius: 50%;
background-color: transparent;
color: inherit;
@@ -202,7 +201,7 @@
justify-content: space-between;
padding: var(--s-4);
border-radius: var(--rounded);
background-color: var(--color-accent-low);
background-color: var(--color-bg-higher);
cursor: pointer;
font-size: var(--fonts-lg);
}

6
app/styles/u.css
View File

@@ -110,7 +110,7 @@
.u__extra-info {
padding: var(--s-1) var(--s-1-5);
border-radius: var(--rounded);
background-color: var(--color-bg);
background-color: var(--color-bg-high);
font-size: var(--fonts-xxs);
display: flex;
align-items: center;
@@ -118,7 +118,7 @@
}
.u__extra-info__heading {
color: var(--color-accent);
color: var(--color-text-accent);
font-weight: var(--bold);
}
@@ -269,7 +269,7 @@
.u__season__weapon-border__outer {
--degree: 80deg;
--smoothing: 0.5deg;
--color: var(--color-accent);
--color: var(--color-text-accent);
display: block;
content: "";

4
app/styles/utils.css
View File

@@ -71,11 +71,11 @@
}
.text-theme {
color: var(--color-accent);
color: var(--color-text-accent);
}
.text-theme-secondary {
color: var(--color-accent);
color: var(--color-text-accent);
}
.text-uppercase {

2
app/styles/vars.css
View File

@@ -40,7 +40,7 @@ html.dark {
--color-warning-high: oklch(94% 0.05 85);
--color-error-low: oklch(31% 0.07 10);
--color-error: oklch(65% 0.19 10);
--color-error: oklch(65% 0.25 10);
--color-error-high: oklch(87% 0.07 10);
}