-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
254 lines (252 loc) · 9.94 KB
/
index.html
File metadata and controls
254 lines (252 loc) · 9.94 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Google tag (gtag.js) -->
<script
async
src="https://www.googletagmanager.com/gtag/js?id=G-BE94J4G6KM"
></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-BE94J4G6KM');
</script>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Art Daily</title>
<link rel="stylesheet" href="./style/main.css" />
</head>
<body>
<div class="circle-container">
<div class="red-stripe"></div>
<div class="top-circle"></div>
</div>
<button id="theme-switch">
<svg
id="dark"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21 12.79C20.8427 14.4922 20.2039 16.1144 19.1583 17.4668C18.1127 18.8192 16.7035 19.8458 15.0957 20.4265C13.4879 21.0073 11.748 21.1181 10.0795 20.7461C8.41104 20.3741 6.88302 19.5345 5.67425 18.3258C4.46548 17.117 3.62596 15.589 3.25393 13.9205C2.8819 12.252 2.99274 10.5121 3.57348 8.9043C4.15423 7.29651 5.18085 5.88737 6.53324 4.84175C7.88562 3.79614 9.50782 3.15731 11.21 3C10.2134 4.34827 9.73387 6.00945 9.85856 7.68141C9.98324 9.35338 10.7039 10.9251 11.8894 12.1106C13.075 13.2961 14.6466 14.0168 16.3186 14.1415C17.9906 14.2662 19.6518 13.7866 21 12.79V12.79Z"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
<svg
id="light"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clip-path="url(#clip0_11_2)">
<path
d="M12 17C14.7614 17 17 14.7614 17 12C17 9.23858 14.7614 7 12 7C9.23858 7 7 9.23858 7 12C7 14.7614 9.23858 17 12 17Z"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M12 1V3"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M12 21V23"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M4.21997 4.22L5.63997 5.64"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M18.36 18.36L19.78 19.78"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M1 12H3"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M21 12H23"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M4.21997 19.78L5.63997 18.36"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M18.36 5.64L19.78 4.22"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</g>
<defs>
<clipPath id="clip0_11_2">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
</button>
<header class="header">
<h1 class="title">
Generative art <span class="highlight-text">daily</span>
</h1>
<div class="sub-heading">
<div class="horizontal-line"></div>
<p class="sub-heading-text">
A project where I work on a sketch a day to develop the skills to
become a creative coder and hopefully over come my fear of math, and
art.
</p>
</div>
<div class="socials">
<a
href="https://www.youtube.com/@alwaysalthough"
class="social-icon"
target="_blank"
><svg
id="youtube"
class="fill"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M23 9.71001C23.0495 8.27867 22.7365 6.85803 22.09 5.58001C21.6514 5.05561 21.0427 4.70172 20.37 4.58001C17.5875 4.32754 14.7936 4.22406 12 4.27001C9.21667 4.22197 6.43274 4.32211 3.66003 4.57001C3.11185 4.66973 2.60454 4.92686 2.20003 5.31001C1.30003 6.14001 1.20003 7.56001 1.10003 8.76002C0.954939 10.9176 0.954939 13.0825 1.10003 15.24C1.12896 15.9154 1.22952 16.5858 1.40003 17.24C1.5206 17.7451 1.76455 18.2124 2.11003 18.6C2.51729 19.0035 3.03641 19.2752 3.60003 19.38C5.75594 19.6461 7.92824 19.7564 10.1 19.71C13.6 19.76 16.67 19.71 20.3 19.43C20.8775 19.3317 21.4112 19.0596 21.83 18.65C22.11 18.3699 22.3191 18.0271 22.44 17.65C22.7977 16.5526 22.9733 15.4041 22.96 14.25C23 13.69 23 10.31 23 9.71001ZM9.74003 14.85V8.66001L15.66 11.77C14 12.69 11.81 13.73 9.74003 14.85Z"
/>
</svg>
</a>
<a
href="https://x.com/AlwaysAlthough"
class="social-icon"
target="_blank"
><svg
id="twitter"
class="fill"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clip-path="url(#clip0_6_81)">
<path
d="M21.9699 6.46378C21.4539 7.15213 20.8301 7.75258 20.1227 8.24195C20.1227 8.42177 20.1227 8.60158 20.1227 8.79139C20.1283 12.0568 18.824 15.1879 16.5021 17.4828C14.1801 19.7777 11.0348 21.0443 7.77126 20.9988C5.88453 21.0051 4.02196 20.5743 2.32945 19.7401C2.23819 19.7003 2.17933 19.61 2.17967 19.5103V19.4005C2.17967 19.257 2.2959 19.1407 2.43928 19.1407C4.29389 19.0796 6.08234 18.4366 7.55159 17.3026C5.87291 17.2688 4.36252 16.2744 3.66743 14.7453C3.63232 14.6617 3.64326 14.5659 3.69628 14.4925C3.7493 14.419 3.83676 14.3785 3.92704 14.3856C4.43723 14.4369 4.95252 14.3894 5.44476 14.2458C3.59163 13.8611 2.19922 12.3227 1.99994 10.4397C1.99286 10.3494 2.03334 10.2619 2.10676 10.2088C2.18018 10.1558 2.27592 10.1448 2.3594 10.18C2.8567 10.3994 3.39353 10.515 3.93703 10.5196C2.31325 9.45384 1.61189 7.42672 2.2296 5.58469C2.29336 5.4057 2.44655 5.27347 2.63287 5.2366C2.81919 5.19972 3.01116 5.26365 3.13823 5.40487C5.32941 7.73695 8.34014 9.12662 11.5356 9.28088C11.4537 8.95427 11.4135 8.61862 11.4158 8.28191C11.4457 6.51636 12.5381 4.94357 14.1816 4.29986C15.8251 3.65615 17.6945 4.06893 18.9145 5.34494C19.7461 5.18651 20.5501 4.90716 21.3009 4.51579C21.3559 4.48145 21.4256 4.48145 21.4806 4.51579C21.515 4.57081 21.515 4.64058 21.4806 4.6956C21.117 5.52835 20.5026 6.2268 19.7233 6.69355C20.4058 6.6144 21.0762 6.45341 21.7203 6.21404C21.7745 6.17713 21.8458 6.17713 21.9 6.21404C21.9454 6.23482 21.9794 6.27457 21.9929 6.32269C22.0063 6.37081 21.9979 6.42242 21.9699 6.46378Z"
/>
</g>
<defs>
<clipPath id="clip0_6_81">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
</a>
<a href="https://github.com/athoug" class="social-icon" target="_blank">
<svg
id="github"
width="25"
height="25"
viewBox="0 0 25 25"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clip-path="url(#clip0_6_87)">
<path
d="M16.5599 22.2793V18.4093C16.5974 17.9325 16.533 17.4531 16.371 17.0031C16.2089 16.5531 15.9529 16.1427 15.6199 15.7993C18.7599 15.4493 22.0599 14.2593 22.0599 8.7993C22.0597 7.40312 21.5226 6.06049 20.5599 5.0493C21.0158 3.8278 20.9836 2.47764 20.4699 1.2793C20.4699 1.2793 19.2899 0.929296 16.5599 2.7593C14.2679 2.13812 11.8519 2.13812 9.55994 2.7593C6.82994 0.929296 5.64994 1.2793 5.64994 1.2793C5.13631 2.47764 5.10408 3.8278 5.55994 5.0493C4.59006 6.068 4.05246 7.42276 4.05994 8.8293C4.05994 14.2493 7.35994 15.4393 10.4999 15.8293C10.1709 16.1693 9.9172 16.5747 9.75525 17.0192C9.59329 17.4637 9.52674 17.9374 9.55994 18.4093V22.2793M9.55994 19.2793C4.55994 20.7793 4.55994 16.7793 2.55994 16.2793L9.55994 19.2793Z"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</g>
<defs>
<clipPath id="clip0_6_87">
<rect
width="24"
height="24"
fill="white"
transform="translate(0.559937 0.279297)"
/>
</clipPath>
</defs>
</svg>
</a>
<a
href="https://www.instagram.com/alwaysalthough/"
class="social-icon"
target="_blank"
><svg
id="instagram"
class="fill"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clip-path="url(#clip0_6_77)">
<path
d="M16 3H8C5.23858 3 3 5.23858 3 8V16C3 18.7614 5.23858 21 8 21H16C18.7614 21 21 18.7614 21 16V8C21 5.23858 18.7614 3 16 3ZM19.25 16C19.2445 17.7926 17.7926 19.2445 16 19.25H8C6.20735 19.2445 4.75549 17.7926 4.75 16V8C4.75549 6.20735 6.20735 4.75549 8 4.75H16C17.7926 4.75549 19.2445 6.20735 19.25 8V16ZM17.75 7.25C17.75 7.80228 17.3023 8.25 16.75 8.25C16.1977 8.25 15.75 7.80228 15.75 7.25C15.75 6.69772 16.1977 6.25 16.75 6.25C17.3023 6.25 17.75 6.69772 17.75 7.25ZM12 7.5C9.51472 7.5 7.5 9.51472 7.5 12C7.5 14.4853 9.51472 16.5 12 16.5C14.4853 16.5 16.5 14.4853 16.5 12C16.5027 10.8057 16.0294 9.65957 15.1849 8.81508C14.3404 7.97059 13.1943 7.49734 12 7.5ZM12 14.75C10.4812 14.75 9.25 13.5188 9.25 12C9.25 10.4812 10.4812 9.25 12 9.25C13.5188 9.25 14.75 10.4812 14.75 12C14.75 13.5188 13.5188 14.75 12 14.75Z"
/>
</g>
<defs>
<clipPath id="clip0_6_77">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
</a>
<a
href="https://www.twitch.tv/alwaysalthough"
class="social-icon"
target="_blank"
>
<svg
width="25"
height="25"
viewBox="0 0 25 25"
fill="none"
xmlns="http://www.w3.org/2000/svg"
id="twitch"
>
<path
d="M16.5599 11.2793V7.2793M21.5599 2.2793H3.55994V18.2793H8.55994V22.2793L12.5599 18.2793H17.5599L21.5599 14.2793V2.2793ZM11.5599 11.2793V7.2793V11.2793Z"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</a>
</div>
</header>
<section class="card-wrapper"></section>
<script type="text/javascript" src="./scripts/base.js" defer></script>
<script type="text/javascript" src="./scripts/actions.js" defer></script>
</body>
</html>