Mercurial

annotate mrjunejune/pages/base.css @ 81:37fc1ec888b6

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[MrJuneJune] Separate out base_head.html
author June Park <parkjune1995@gmail.com>
date Thu, 01 Jan 2026 08:24:06 -0800
parents d55157451947
children 1ded13720541
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
7
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
1 /* Base Colors */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
2 :root {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
3 --white: #ffffff;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
4 --black: hsl(224, 12%, 4%);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
5 --darkgray: #333333;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
6 --gray: #5d5d5d;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
7 --lightgray: #999999;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
8 --green: #c2e15f;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
9 --orange: #fda333;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
10 --purple: #d3a4f9;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
11 --red: #fb4485;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
12 --blue: #6ce0f1;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
13 --darktext: #414141;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
14 /* from astro */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
15 --accent: #2337ff;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
16 --accent-dark: #000d8a;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
17 --gray: 96, 115, 159;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
18 --gray-light: 229, 233, 240;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
19 --gray-dark: 34, 41, 57;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
20 --gray-gradient: rgba(var(--gray-light), 50%), #fff;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
21 --box-shadow: 0 2px 6px rgba(var(--gray), 25%),
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
22 0 8px 24px rgba(var(--gray), 33%), 0 16px 32px rgba(var(--gray), 33%);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
23 --awesome: #dc3522;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
24 --main-width: 720px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
25 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
26 .dark {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
27 --white: hsl(224, 10%, 10%);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
28 --black: hsl(0, 0%, 90%);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
29 --darkgray: #cccccc; /* Inverted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
30 --lightgray: #666666; /* Inverted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
31 --green: #3d1ea0; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
32 --orange: #025ccc; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
33 --purple: #2b5b06; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
34 --red: #04bb7a; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
35 --blue: #932f0e; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
36 --darktext: #bebebe; /* Inverted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
37 --text: var(--lightgray); /* Opposite of --darkgray */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
38 --graytext: var(--lightgray); /* Opposite of --gray */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
39 --lighttext: var(--darkgray); /* Opposite of --lightgray */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
40 --awesome: #23cade; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
41
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
42 /* Opposite of Astro Colors */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
43 --accent: #ffcc00; /* Complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
44 --accent-dark: #ffb275; /* Modified complementary */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
45 --gray: 159, 140, 96; /* Inverted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
46 --gray-light: 26, 22, 15; /* Inverted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
47 --gray-dark: 221, 214, 198; /* Inverted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
48 --gray-gradient: rgba(26, 22, 15, 50%), #000; /* Adjusted */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
49 --box-shadow: 0 -2px -6px rgba(159, 140, 96, 25%),
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
50 0 -8px -24px rgba(159, 140, 96, 33%), 0 -16px -32px rgba(159, 140, 96, 33%);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
51 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
52
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
53 html {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
54 background: var(--white);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
55 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
56
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
57 /* fonts */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
58 @font-face {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
59 font-family: "Atkinson";
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
60 src: url("/fonts/atkinson-regular.woff") format("woff");
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
61 font-weight: 400;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
62 font-style: normal;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
63 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
64 @font-face {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
65 font-family: "Atkinson";
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
66 src: url("/fonts/atkinson-bold.woff") format("woff");
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
67 font-weight: 700;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
68 font-style: normal;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
69 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
70 /* Fonts */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
71 @font-face {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
72 font-family: "Roboto";
73
ede391ac83c8 [MrJuneJune] My own websites.
June Park <parkjune1995@gmail.com>
parents: 7
diff changeset
73 src: url("/fonts/Roboto-Regular.ttf");
7
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
74 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
75
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
76 @font-face {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
77 font-family: "Roboto Light";
73
ede391ac83c8 [MrJuneJune] My own websites.
June Park <parkjune1995@gmail.com>
parents: 7
diff changeset
78 src: url("/fonts/Roboto-Thin.ttf");
7
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
79 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
80
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
81 a {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
82 color: inherit; /* blue colors for links too */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
83 text-decoration: inherit; /* no underline */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
84 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
85
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
86 body {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
87 font-family: "Atkinson", sans-serif;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
88 margin: 0;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
89 padding: 0;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
90 text-align: left;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
91 background: var(--gray-gradient);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
92 background-size: 100% 600px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
93 word-wrap: break-word;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
94 overflow-wrap: break-word;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
95 color: rgb(var(--gray-dark));
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
96 font-size: 20px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
97 line-height: 1.7;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
98 }
80
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
99
7
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
100 main {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
101 background: var(--white);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
102 width: var(--main-width);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
103 max-width: calc(100% - 2em);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
104 margin: auto;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
105 padding: 1em 1em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
106 }
80
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
107
7
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
108 h1,
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
109 h2,
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
110 h3,
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
111 h4,
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
112 h5,
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
113 h6 {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
114 margin: 0 0 0.5rem 0;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
115 color: rgb(var(--black));
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
116 line-height: 1.2;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
117 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
118 h1 {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
119 font-size: 3.052em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
120 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
121 h2 {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
122 font-size: 2.441em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
123 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
124 h3 {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
125 font-size: 1.953em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
126 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
127 h4 {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
128 font-size: 1.563em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
129 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
130 h5 {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
131 font-size: 1.25em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
132 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
133 strong,
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
134 b {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
135 font-weight: 700;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
136 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
137 p {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
138 margin-bottom: 1em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
139 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
140 .prose p {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
141 margin-bottom: 2em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
142 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
143 textarea {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
144 width: 100%;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
145 font-size: 16px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
146 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
147 input {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
148 font-size: 16px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
149 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
150 table {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
151 width: 100%;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
152 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
153 img {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
154 max-width: 100%;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
155 height: auto;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
156 border-radius: 8px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
157 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
158 code {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
159 padding: 2px 5px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
160 background-color: rgb(var(--gray-light));
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
161 border-radius: 2px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
162 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
163 pre {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
164 padding: 1.5em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
165 border-radius: 8px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
166 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
167 pre > code {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
168 all: unset;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
169 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
170 blockquote {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
171 border-left: 4px solid var(--accent);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
172 padding: 0 0 0 20px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
173 margin: 0px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
174 font-size: 1.333em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
175 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
176 hr {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
177 border: none;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
178 border-top: 1px solid rgb(var(--gray-light));
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
179 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
180 @media (max-width: 720px) {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
181 body {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
182 font-size: 18px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
183 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
184 main {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
185 padding: 1em;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
186 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
187 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
188
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
189 .sr-only {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
190 border: 0;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
191 padding: 0;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
192 margin: 0;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
193 position: absolute !important;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
194 height: 1px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
195 width: 1px;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
196 overflow: hidden;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
197 /* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
198 clip: rect(1px 1px 1px 1px);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
199 /* maybe deprecated but we need to support legacy browsers */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
200 clip: rect(1px, 1px, 1px, 1px);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
201 /* modern browsers, clip-path works inwards from each corner */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
202 clip-path: inset(50%);
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
203 /* added line to stop words getting smushed together (as they go onto separate lines and some screen readers do not understand line feeds as a space */
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
204 white-space: nowrap;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
205 }
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
206
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
207 .center {
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
208 display: flex;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
209 justify-content: center;
114cad94008f [Seobeo] Updated to support thread and edge server calls.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
210 }
76
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
211
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
212 /* Auto dark mode based on system preference */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
213 @media (prefers-color-scheme: dark) {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
214 :root:not(.light-mode) {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
215 --white: hsl(224, 10%, 10%);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
216 --black: hsl(0, 0%, 90%);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
217 --darkgray: #cccccc;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
218 --lightgray: #666666;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
219 --green: #3d1ea0;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
220 --orange: #025ccc;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
221 --purple: #2b5b06;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
222 --red: #04bb7a;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
223 --blue: #932f0e;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
224 --darktext: #bebebe;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
225 --awesome: #23cade;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
226 --accent: #ffcc00;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
227 --accent-dark: #ffb275;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
228 --gray: 159, 140, 96;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
229 --gray-light: 26, 22, 15;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
230 --gray-dark: 221, 214, 198;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
231 --gray-gradient: rgba(26, 22, 15, 50%), #000;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
232 --box-shadow: 0 -2px -6px rgba(159, 140, 96, 25%),
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
233 0 -8px -24px rgba(159, 140, 96, 33%), 0 -16px -32px rgba(159, 140, 96, 33%);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
234 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
235 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
236
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
237 /* Dark mode toggle button */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
238 .dark-mode-toggle {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
239 position: fixed;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
240 top: 20px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
241 left: 20px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
242 width: 40px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
243 height: 40px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
244 border-radius: 50%;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
245 background: var(--white);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
246 cursor: pointer;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
247 display: flex;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
248 align-items: center;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
249 justify-content: center;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
250 font-size: 20px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
251 transition: all 0.3s ease;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
252 z-index: 1000;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
253 box-shadow: 0 2px 8px rgba(0,0,0,0.2);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
254 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
255
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
256 .dark-mode-toggle:hover {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
257 transform: scale(1.1);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
258 box-shadow: 0 4px 12px rgba(0,0,0,0.3);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents: 73
diff changeset
259 }
80
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
260
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
261 a {
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
262 text-decoration: underline;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
263 }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
264
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
265 a::before {
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
266 content: "";
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
267 display: inline-block;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
268 width: 1em;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
269 height: 1em;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
270 margin-right: 8px;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
271 vertical-align: middle;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
272
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
273 /* This treats the paw like a stencil */
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
274 background-color: #FF69B4; /* Change your color here! (e.g., Hot Pink) */
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
275 -webkit-mask: url('/public/paw.svg') no-repeat center;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
276 mask: url('/public/paw.svg') no-repeat center;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
277
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
278 /* Your 2D Animation */
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
279 animation: pawStep 0.6s ease-out forwards;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
280 }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
281
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
282 @keyframes pawStep {
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
283 0% { transform: scale(0); opacity: 0; }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
284 100% { transform: scale(1); opacity: 1; }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
285 }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
286
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
287 a:hover::before {
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
288 animation: wiggle 0.4s ease-in-out infinite;
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
289 }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
290
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
291 @keyframes wiggle {
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
292 0%, 100% { transform: rotate(-15deg); }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
293 50% { transform: rotate(15deg); }
d55157451947 [MrJuneJune] Updating my homepage.
June Park <parkjune1995@gmail.com>
parents: 76
diff changeset
294 }