This commit is contained in:
parent
86f9898f01
commit
d8064d0a64
SSH key fingerprint:
SHA256:5BmINP9VjZWaUk5Z+2CTut1KFhwLtd0ZynMekKbtViM
31 changed files with 2550 additions and 0 deletions
294
dist/digital/c3voc/style.css
vendored
Normal file
294
dist/digital/c3voc/style.css
vendored
Normal file
|
|
@ -0,0 +1,294 @@
|
|||
:root {
|
||||
--color-neutral-50: #f2f0f5;
|
||||
--color-neutral-100: #d1c6e0;
|
||||
--color-neutral-200: #b2a0cb;
|
||||
--color-neutral-300: #957eb5;
|
||||
--color-neutral-400: #7a60a0;
|
||||
--color-neutral-500: #61468b;
|
||||
--color-neutral-600: #4b3176;
|
||||
--color-neutral-700: #371f60;
|
||||
--color-neutral-800: #26114b;
|
||||
--color-neutral-900: #180736;
|
||||
--color-neutral-950: #0c011f;
|
||||
--color-argon-50: #e1abc9;
|
||||
--color-argon-100: #da87b5;
|
||||
--color-argon-200: #d464a1;
|
||||
--color-argon-300: #cd448f;
|
||||
--color-argon-400: #c6257d;
|
||||
--color-argon-500: #b0166f;
|
||||
--color-argon-600: #9a0a61;
|
||||
--color-argon-700: #830755;
|
||||
--color-argon-800: #6d0449;
|
||||
--color-argon-900: #56023c;
|
||||
--color-argon-950: #3f012d;
|
||||
--color-krypton-50: #b2d9ea;
|
||||
--color-krypton-100: #8cc9e4;
|
||||
--color-krypton-200: #69bade;
|
||||
--color-krypton-300: #4badd8;
|
||||
--color-krypton-400: #2493c2;
|
||||
--color-krypton-500: #167fac;
|
||||
--color-krypton-600: #0a6c96;
|
||||
--color-krypton-700: #075c81;
|
||||
--color-krypton-800: #044c6b;
|
||||
--color-krypton-900: #023c55;
|
||||
--color-krypton-950: #012c3f;
|
||||
--color-green-50: #c0f49a;
|
||||
--color-green-100: #a7e57a;
|
||||
--color-green-200: #8fd75d;
|
||||
--color-green-300: #7ac843;
|
||||
--color-green-400: #66b92d;
|
||||
--color-green-500: #54aa18;
|
||||
--color-green-600: #47990f;
|
||||
--color-green-700: #397e0a;
|
||||
--color-green-800: #2b6206;
|
||||
--color-green-900: #1f4703;
|
||||
--color-green-950: #122b01;
|
||||
--color-red-50: #e6afaf;
|
||||
--color-red-100: #dd9090;
|
||||
--color-red-200: #d57272;
|
||||
--color-red-300: #cc5757;
|
||||
--color-red-400: #c33d3d;
|
||||
--color-red-500: #bb2626;
|
||||
--color-red-600: #b21010;
|
||||
--color-red-700: #950808;
|
||||
--color-red-800: #780404;
|
||||
--color-red-900: #5c0202;
|
||||
--color-red-950: #3f0101;
|
||||
--color-yellow-50: #fefce8;
|
||||
--color-yellow-100: #fef9c2;
|
||||
--color-yellow-200: #fff085;
|
||||
--color-yellow-300: #ffdf20;
|
||||
--color-yellow-400: #fdc700;
|
||||
--color-yellow-500: #efb100;
|
||||
--color-yellow-600: #d08700;
|
||||
--color-yellow-700: #a65f00;
|
||||
--color-yellow-800: #894b00;
|
||||
--color-yellow-900: #733e0a;
|
||||
--color-yellow-950: #432004;
|
||||
--color-white: #ffffff;
|
||||
--color-dark-foreground: var(--color-neutral-50);
|
||||
--color-dark-background: var(--color-neutral-950);
|
||||
--color-dark-shade-1: var(--color-neutral-900);
|
||||
--color-dark-shade-2: var(--color-neutral-800);
|
||||
--color-dark-shade-3: var(--color-neutral-700);
|
||||
--color-dark-shade-4: var(--color-neutral-600);
|
||||
--color-dark-text-1: var(--color-neutral-200);
|
||||
--color-dark-text-2: var(--color-neutral-300);
|
||||
--color-dark-text-3: var(--color-neutral-400);
|
||||
--color-dark-text-4: var(--color-neutral-500);
|
||||
--color-dark-primary: var(--color-argon-400);
|
||||
--color-dark-secondary: var(--color-krypton-300);
|
||||
--color-dark-error: var(--color-red-500);
|
||||
--color-dark-success: var(--color-green-500);
|
||||
--color-dark-warning: var(--color-yellow-500);
|
||||
--color-dark-accent-1: #60a5f9;
|
||||
--color-dark-accent-2: #d381f7;
|
||||
--color-dark-accent-3: #ff7975;
|
||||
--color-light-foreground: var(--color-neutral-950);
|
||||
--color-light-background: var(--color-neutral-50);
|
||||
--color-light-shade-1: var(--color-neutral-100);
|
||||
--color-light-shade-2: var(--color-neutral-200);
|
||||
--color-light-shade-3: var(--color-neutral-300);
|
||||
--color-light-shade-4: var(--color-neutral-400);
|
||||
--color-light-text-1: var(--color-neutral-800);
|
||||
--color-light-text-2: var(--color-neutral-700);
|
||||
--color-light-text-3: var(--color-neutral-600);
|
||||
--color-light-text-4: var(--color-neutral-500);
|
||||
--color-light-primary: var(--color-argon-600);
|
||||
--color-light-secondary: var(--color-krypton-500);
|
||||
--color-light-error: var(--color-red-600);
|
||||
--color-light-success: var(--color-green-600);
|
||||
--color-light-warning: var(--color-yellow-600);
|
||||
--color-light-accent-1: #303ec0;
|
||||
--color-light-accent-2: #6c366c;
|
||||
--color-light-accent-3: #932f0a;
|
||||
--color-cmyk-primary: var(--color-dark-primary);
|
||||
--color-cmyk-secondary: var(--color-dark-secondary);
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Athiti";
|
||||
font-weight: 700;
|
||||
src: url("assets/font/athiti/Athiti-Bold.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Athiti";
|
||||
font-weight: 600;
|
||||
src: url("assets/font/athiti/Athiti-SemiBold.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Athiti";
|
||||
font-weight: 500;
|
||||
src: url("assets/font/athiti/Athiti-Medium.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Athiti";
|
||||
font-weight: 400;
|
||||
src: url("assets/font/athiti/Athiti-Regular.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Athiti";
|
||||
font-weight: 300;
|
||||
src: url("assets/font/athiti/Athiti-Light.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Athiti";
|
||||
font-weight: 200;
|
||||
src: url("assets/font/athiti/Athiti-ExtraLight.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Departure Mono";
|
||||
src: url("assets/font/departuremono/DepartureMono-Regular.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 100;
|
||||
src: url("assets/font/argonglow/ArgonGlow-Thin.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 200;
|
||||
src: url("assets/font/argonglow/ArgonGlow-ExtraLight.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 300;
|
||||
src: url("assets/font/argonglow/ArgonGlow-Light.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 400;
|
||||
src: url("assets/font/argonglow/ArgonGlow-Regular.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 500;
|
||||
src: url("assets/font/argonglow/ArgonGlow-Medium.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 600;
|
||||
src: url("assets/font/argonglow/ArgonGlow-SemiBold.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
font-weight: 700;
|
||||
src: url("assets/font/argonglow/ArgonGlow-Bold.woff2") format("woff2");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Argon Glow";
|
||||
src: url("assets/font/argonglow/ArgonGlow-VariableVF.woff2") format("woff2");
|
||||
font-weight: 100 900;
|
||||
}
|
||||
:root.is-transparent {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #000000;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#scene {
|
||||
background: var(--color-dark-background);
|
||||
color: white;
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
overflow: hidden;
|
||||
contain: strict;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
:root.is-transparent #scene {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#title {
|
||||
position: absolute;
|
||||
left: 100px;
|
||||
top: 600px;
|
||||
width: 1720px;
|
||||
overflow: visible;
|
||||
}
|
||||
#title text {
|
||||
font-family: "Argon Glow", ui-sans, sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 216px;
|
||||
}
|
||||
|
||||
#breakText {
|
||||
position: absolute;
|
||||
left: 100px;
|
||||
top: 0;
|
||||
width: 1720px;
|
||||
height: 1080px;
|
||||
overflow: visible;
|
||||
transform: scale(2.5);
|
||||
}
|
||||
#breakText text {
|
||||
font-family: "Argon Glow", ui-sans, sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 216px;
|
||||
text-anchor: middle;
|
||||
}
|
||||
|
||||
#speaker {
|
||||
position: absolute;
|
||||
right: 150px;
|
||||
bottom: 150px;
|
||||
overflow: visible;
|
||||
}
|
||||
#speaker text {
|
||||
font-family: "Argon Glow", ui-sans, sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 216px;
|
||||
text-anchor: end;
|
||||
fill: #ffffff;
|
||||
}
|
||||
|
||||
#title tspan, #speaker tspan {
|
||||
fill: #ffffff;
|
||||
}
|
||||
|
||||
#logo_eventname_glow_off {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
width: 1720px;
|
||||
height: 400px;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
#logo_eventname_glow {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
width: 1720px;
|
||||
height: 400px;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
#bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 1920px;
|
||||
}
|
||||
|
||||
#outro {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 1920px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#svgPath {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=style.css.map */
|
||||
Loading…
Add table
Add a link
Reference in a new issue