release: v0.10.0
This commit is contained in:
Yun Chan
parent
2b7fa32b5b
commit
6930906583
61 changed files with 15165 additions and 82 deletions
2172
apps/site/public/work/hannam-jari/styles/admin.css
Normal file
2172
apps/site/public/work/hannam-jari/styles/admin.css
Normal file
File diff suppressed because it is too large
Load diff
1741
apps/site/public/work/hannam-jari/styles/landing.css
Normal file
1741
apps/site/public/work/hannam-jari/styles/landing.css
Normal file
File diff suppressed because it is too large
Load diff
312
apps/site/public/work/hannam-jari/styles/tokens.css
Normal file
312
apps/site/public/work/hannam-jari/styles/tokens.css
Normal file
|
|
@ -0,0 +1,312 @@
|
|||
:root {
|
||||
color-scheme: light;
|
||||
--font-sans: "Pretendard Variable", Pretendard, SUIT, "Noto Sans KR", "Apple SD Gothic Neo", system-ui, sans-serif;
|
||||
--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
|
||||
|
||||
--ink-950: #0a0a09;
|
||||
--ink-900: #121210;
|
||||
--ink-800: #24231f;
|
||||
--ink-700: #3e3c35;
|
||||
--ink-600: #5d5a50;
|
||||
--ink-500: #69655d;
|
||||
--paper-50: #f8f7f3;
|
||||
--paper-100: #f2f0e9;
|
||||
--paper-200: #e8e4da;
|
||||
--paper-300: #d8d2c5;
|
||||
--gold-dark: #6f5420;
|
||||
--gold: #9b762d;
|
||||
--gold-light: #c6a15b;
|
||||
--blue: #345d8c;
|
||||
--blue-pale: #e7eef6;
|
||||
--green: #2e684d;
|
||||
--green-pale: #e5f0e9;
|
||||
--red: #9d3f34;
|
||||
--red-pale: #f6e8e5;
|
||||
--amber: #7f5d18;
|
||||
--amber-pale: #f4ecd8;
|
||||
--white: #ffffff;
|
||||
|
||||
--line-light: rgba(10, 10, 9, 0.14);
|
||||
--line-dark: rgba(255, 255, 255, 0.18);
|
||||
--focus: #2e6ba8;
|
||||
|
||||
--space-1: 0.25rem;
|
||||
--space-2: 0.5rem;
|
||||
--space-3: 0.75rem;
|
||||
--space-4: 1rem;
|
||||
--space-5: 1.25rem;
|
||||
--space-6: 1.5rem;
|
||||
--space-8: 2rem;
|
||||
--space-10: 2.5rem;
|
||||
--space-12: 3rem;
|
||||
--space-16: 4rem;
|
||||
--space-20: 5rem;
|
||||
--space-24: 6rem;
|
||||
--space-32: 8rem;
|
||||
|
||||
--content: min(100% - 2rem, 88rem);
|
||||
--reading: 44rem;
|
||||
--header-height: 4.5rem;
|
||||
--radius-sm: 0.25rem;
|
||||
--radius-md: 0.75rem;
|
||||
--radius-lg: 1.25rem;
|
||||
--transition: 180ms cubic-bezier(0.22, 1, 0.36, 1);
|
||||
}
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: var(--font-sans);
|
||||
font-size: 1rem;
|
||||
line-height: 1.6;
|
||||
letter-spacing: -0.015em;
|
||||
color: var(--ink-950);
|
||||
background: var(--paper-50);
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
body.is-locked {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
img,
|
||||
svg {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
button,
|
||||
select,
|
||||
input[type="range"],
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button:disabled,
|
||||
input:disabled,
|
||||
select:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
:focus-visible {
|
||||
outline: 3px solid var(--focus);
|
||||
outline-offset: 3px;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.skip-link {
|
||||
position: fixed;
|
||||
z-index: 200;
|
||||
top: 0.75rem;
|
||||
left: 0.75rem;
|
||||
padding: 0.75rem 1rem;
|
||||
color: var(--white);
|
||||
background: var(--ink-950);
|
||||
transform: translateY(-180%);
|
||||
transition: transform var(--transition);
|
||||
}
|
||||
|
||||
.skip-link:focus {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.demo-strip {
|
||||
min-height: 2rem;
|
||||
padding: 0.35rem 1rem;
|
||||
color: #f5ead5;
|
||||
background: var(--ink-950);
|
||||
border-bottom: 1px solid rgba(198, 161, 91, 0.4);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.04em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-flex;
|
||||
min-height: 2.875rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.7rem 1.05rem;
|
||||
border: 1px solid transparent;
|
||||
border-radius: var(--radius-sm);
|
||||
font-weight: 720;
|
||||
line-height: 1.2;
|
||||
text-decoration: none;
|
||||
transition: color var(--transition), background-color var(--transition), border-color var(--transition), transform var(--transition);
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.button-primary {
|
||||
color: var(--paper-50);
|
||||
background: var(--ink-950);
|
||||
border-color: var(--ink-950);
|
||||
}
|
||||
|
||||
.button-primary:hover {
|
||||
color: var(--ink-950);
|
||||
background: var(--gold-light);
|
||||
border-color: var(--gold-light);
|
||||
}
|
||||
|
||||
.button-light {
|
||||
color: var(--ink-950);
|
||||
background: var(--paper-50);
|
||||
border-color: var(--paper-50);
|
||||
}
|
||||
|
||||
.button-outline {
|
||||
color: inherit;
|
||||
background: transparent;
|
||||
border-color: currentColor;
|
||||
}
|
||||
|
||||
.button-ghost {
|
||||
color: inherit;
|
||||
background: transparent;
|
||||
border-color: var(--line-light);
|
||||
}
|
||||
|
||||
.button-small {
|
||||
min-height: 2.25rem;
|
||||
padding: 0.45rem 0.7rem;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
.status-badge {
|
||||
display: inline-flex;
|
||||
min-height: 1.6rem;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
width: max-content;
|
||||
padding: 0.25rem 0.5rem;
|
||||
border: 1px solid currentColor;
|
||||
border-radius: 999px;
|
||||
font-size: 0.7rem;
|
||||
font-weight: 760;
|
||||
line-height: 1;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
|
||||
.status-badge::before {
|
||||
width: 0.38rem;
|
||||
height: 0.38rem;
|
||||
border-radius: 50%;
|
||||
background: currentColor;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.status-demo {
|
||||
color: var(--gold-dark);
|
||||
background: #f7efdc;
|
||||
}
|
||||
|
||||
.status-pass {
|
||||
color: var(--green);
|
||||
background: var(--green-pale);
|
||||
}
|
||||
|
||||
.status-warn {
|
||||
color: var(--amber);
|
||||
background: var(--amber-pale);
|
||||
}
|
||||
|
||||
.status-blocked {
|
||||
color: var(--red);
|
||||
background: var(--red-pale);
|
||||
}
|
||||
|
||||
.field-label {
|
||||
display: block;
|
||||
margin-bottom: 0.45rem;
|
||||
color: var(--ink-700);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 760;
|
||||
}
|
||||
|
||||
.text-input,
|
||||
.select-input {
|
||||
width: 100%;
|
||||
min-height: 2.75rem;
|
||||
padding: 0.65rem 0.75rem;
|
||||
color: var(--ink-950);
|
||||
background: var(--white);
|
||||
border: 1px solid var(--line-light);
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
|
||||
.live-region {
|
||||
position: fixed;
|
||||
z-index: 300;
|
||||
right: 1rem;
|
||||
bottom: 1rem;
|
||||
max-width: min(24rem, calc(100% - 2rem));
|
||||
padding: 0.85rem 1rem;
|
||||
color: var(--white);
|
||||
background: var(--ink-950);
|
||||
border-left: 3px solid var(--gold-light);
|
||||
border-radius: var(--radius-sm);
|
||||
box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.22);
|
||||
}
|
||||
|
||||
@media (min-width: 48rem) {
|
||||
:root {
|
||||
--content: min(100% - 4rem, 88rem);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
html {
|
||||
scroll-behavior: auto;
|
||||
}
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
scroll-behavior: auto !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue