mirror of
https://github.com/PR0M3TH3AN/bitvid.git
synced 2026-10-31 18:02:27 +00:00
Tighten profile modal spacing and add-profile styling
This commit is contained in:
1 parent
7ac4abfa61
commit
27947a54c7
3 files changed
+40
-10
No files matched your search
+37
-4
@@ -1538,13 +1538,13 @@
|
||||
overflow: hidden;
|
||||
--profile-modal-scale: 0.9;
|
||||
--profile-modal-gap:
|
||||
calc((var(--space-lg) - var(--space-xs)) * var(--profile-modal-scale));
|
||||
calc((var(--space-md) - var(--space-3xs)) * var(--profile-modal-scale));
|
||||
--profile-modal-padding-inline:
|
||||
calc((var(--space-lg) - var(--space-xs)) * var(--profile-modal-scale));
|
||||
calc((var(--space-lg) - var(--space-md)) * var(--profile-modal-scale));
|
||||
--profile-modal-padding-block-start:
|
||||
calc(var(--space-md) * var(--profile-modal-scale));
|
||||
calc((var(--space-md) - var(--space-2xs)) * var(--profile-modal-scale));
|
||||
--profile-modal-padding-block-end:
|
||||
calc((var(--space-lg) - var(--space-xs)) * var(--profile-modal-scale));
|
||||
calc((var(--space-lg) - var(--space-sm)) * var(--profile-modal-scale));
|
||||
--profile-modal-nav-gap: calc(var(--space-xs) * var(--profile-modal-scale));
|
||||
}
|
||||
|
||||
@@ -1558,6 +1558,39 @@
|
||||
transform-origin: top center;
|
||||
}
|
||||
|
||||
.profile-modal__add-profile {
|
||||
--tw-ring-color: var(--color-ring-alert);
|
||||
@apply focus-ring relative flex w-full items-center justify-start gap-4 rounded-xl px-5 py-4 text-left text-text transition duration-base ease-in-out;
|
||||
border: var(--outline-thick-width) solid var(--color-ring-alert);
|
||||
background-color: var(--surface-panel-hover);
|
||||
}
|
||||
|
||||
.profile-modal__add-profile:hover {
|
||||
background-color: color-mix(
|
||||
in srgb,
|
||||
var(--surface-panel-hover) 88%,
|
||||
var(--color-ring-alert) 12%
|
||||
);
|
||||
}
|
||||
|
||||
.profile-modal__add-profile:focus-visible {
|
||||
background-color: color-mix(
|
||||
in srgb,
|
||||
var(--surface-panel-hover) 80%,
|
||||
var(--color-ring-alert) 20%
|
||||
);
|
||||
}
|
||||
|
||||
.profile-modal__add-profile-icon {
|
||||
@apply flex h-10 w-10 items-center justify-center rounded-full;
|
||||
background-color: color-mix(
|
||||
in srgb,
|
||||
var(--color-ring-alert) 18%,
|
||||
var(--surface-panel)
|
||||
);
|
||||
color: var(--color-ring-alert);
|
||||
}
|
||||
|
||||
.profile-modal__body {
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
|
||||
Reference in new issue
Block a user