이찬

소스를 따온 css, 수정 예정

1 +@font-face { font-family: 'NeoDunggeunmo'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.3/NeoDunggeunmo.woff') format('woff'); font-weight: normal; font-style: normal; }
2 +@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap');
3 +
4 +* {
5 + outline: none;
6 +}
7 +body {
8 + background-color: #000;
9 + color: #fff;
10 + font-family: 'NeoDunggeunmo', sans-serif;
11 +}
12 +body.detail {
13 + margin-top: 60px;
14 +}
15 +body.joonsik {
16 + background: url(./assets/bg/umbg.jpg) center/cover no-repeat fixed;
17 +}
18 +body.sibal {
19 + background: url(./assets/bg/sibalbg.jpg) center/cover no-repeat fixed;
20 +}
21 +body.trump {
22 + background: url(./assets/bg/trumpbg.jpg) center/cover no-repeat fixed;
23 +}
24 +a {
25 + color: #fff;
26 +}
27 +.github a {
28 + text-decoration: none;
29 +}
30 +img {
31 + width: 100%;
32 + max-width: 400px;
33 +}
34 +input[type=text], input[type=text]::placeholder, input[type=number], input[type=number]::placeholder {
35 + font-family: 'NeoDunggeunmo', sans-serif;
36 +}
37 +input[type=number]::-webkit-outer-spin-button,
38 +input[type=number]::-webkit-inner-spin-button {
39 + -webkit-appearance: none;
40 + margin: 0;
41 +}
42 +input[type=number] {
43 + -moz-appearance: textfield;
44 +}
45 +
46 +.container {
47 + margin: 40px 20px 0 20px;
48 +}
49 +.box-shadow {
50 + -webkit-box-shadow: 0px 0px 16px 1px rgba(0,0,0,0.35);
51 + -moz-box-shadow: 0px 0px 16px 1px rgba(0,0,0,0.35);
52 + box-shadow: 0px 0px 16px 1px rgba(0,0,0,0.35);
53 +}
54 +.form-component {
55 + height: 40px;
56 + width: 300px;
57 + display: block;
58 + padding: 10px 20px;
59 + border: 0px solid rgb(85, 78, 78);
60 + font-size: 17px;
61 + color: #fff;
62 + transition: .5s ease-in-out;
63 +}
64 +.form-component.input:hover, .form-component.input:focus {
65 + background-color: #303030;
66 + transition: .5s ease-in-out;
67 +}
68 +.form-component.button {
69 + justify-content: center;
70 + flex-direction: column;
71 + display: flex;
72 + text-align: center;
73 + background-color: rgb(207, 207, 207);
74 + color: #000;
75 + cursor: pointer;
76 + transition: .5s ease-in-out;
77 +}
78 +.form-component.button:hover, .form-component.button:focus {
79 + background-color: #fff;
80 + transition: .5s ease-in-out;
81 +}
82 +form .wrapper {
83 + margin-bottom: 20px;
84 +}
85 +.form-8bit {
86 + position: relative;
87 + display: inline-block;
88 + transition: .5s ease-in-out;
89 +}
90 +.form-8bit:before,
91 +.form-8bit:after,
92 +.form-8bit .form-8bit-wrapper:before,
93 +.form-8bit .form-8bit-wrapper:after {
94 + content: '';
95 + background-color: #8d8d8d;
96 + display: inline-block;
97 + position: absolute;
98 + transition: .5s ease-in-out;
99 +}
100 +.form-8bit:before, .form-8bit:after {
101 + width: 5px;
102 + height: 100%;
103 +}
104 +.form-8bit .form-8bit-wrapper:before, .form-8bit .form-8bit-wrapper:after {
105 + width: 100%;
106 + height: 5px;
107 +}
108 +.form-8bit .form-8bit-wrapper:before {
109 + left: 0;
110 + top: -5px;
111 +}
112 +.form-8bit .form-8bit-wrapper:after {
113 + left: 0;
114 + bottom: -5px;
115 +}
116 +.form-8bit:before {
117 + top: 0px;
118 + left: -5px;
119 +}
120 +.form-8bit:after {
121 + top: 0px;
122 + right: -5px;
123 +}
124 +.preload * {
125 + -webkit-transition: none !important;
126 + -moz-transition: none !important;
127 + -ms-transition: none !important;
128 + -o-transition: none !important;
129 +}
130 +.light-dark {
131 + background-color: #3a3a3a;
132 +}
133 +div.input-example {
134 + display: inline-block;
135 + padding: 5px;
136 + border: 0px solid;
137 + border-radius: 3px;
138 + margin-bottom: 5px;
139 +}
140 +hr {
141 + height: 5px;
142 + background-color: #8d8d8d;
143 + border: 0px solid;
144 +}
145 +.github-wrapper {
146 + position: fixed;
147 + z-index: 5;
148 + background-color: rgb(56, 56, 56);
149 + right: 25px;
150 + bottom: 25px;
151 +}
152 +.github {
153 + padding: 5px;
154 +}
155 +.detail .container {
156 + margin: auto;
157 + margin-bottom: 60px;
158 + max-width: 1000px;
159 +}
160 +.badge {
161 + width: 162px;
162 + height: 100%;
163 + vertical-align: middle;
164 +}
165 +.youtube-profile-wrapper {
166 + display: inline-block;
167 + padding: 10px;
168 + background-color: #6a6a6a;
169 + border: 0;
170 + border-radius: 100px;
171 + transition: .5s ease-in-out;
172 +}
173 +.youtube-profile-img {
174 + width: 25px;
175 + height: 25px;
176 + display: inline-block;
177 + vertical-align: middle;
178 + margin-right: 7.5px;
179 + background-color: #aaa;
180 + border-radius: 100px;
181 + transition: .5s ease-in-out;
182 +}
183 +.youtube-profile-name {
184 + display: inline-block;
185 + vertical-align: middle;
186 + transition: .5s ease-in-out;
187 +}
188 +#is-limited-label {
189 + width: 50px;
190 + height: 50px;
191 +}
192 +.checkboxlabeler {
193 + display: inline-block;
194 +}
195 +.checkboxlabeler input[type=checkbox] {
196 + opacity: 0;
197 +}
198 +p.checkboxlabeler {
199 + margin-left: 15px;
200 +}
201 +#is-limited-num {
202 + display: inline-block;
203 +}
204 +div#is-limited-num {
205 + margin-left: 10px;
206 +}
207 +#is-limited-num input[type=number] {
208 + height: 10px;
209 + width: 50px;
210 +}
...\ No newline at end of file ...\ No newline at end of file