Skip to content

Commit 7629601

Browse files
cheddZycheddZy
committed
About page & beta release
1 parent 807164b commit 7629601

File tree

6 files changed

+338
-58
lines changed

6 files changed

+338
-58
lines changed

‎src/components/HeaderAlert.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ import '../styles/globals.scss'
2929
</svg>
3030
<p id="classic">
3131

32-
Website version 0.2 - Feature incomplete! You may want to check in once in a while.
32+
Website version 0.8 - Beta Release! Expect some inaccuracies.
3333
<span><a href="https://github.com/cheddZy/design-repository" target="_blank">Github</a></span>
3434
</p>
3535
<button id="alertDismiss">

‎src/components/MainHeader.astro

Lines changed: 23 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -60,19 +60,26 @@ import SubmitButton from "./buttons/SubmitButton.astro";
6060
d="M6.32 2.577a49.255 49.255 0 0 1 11.36 0c1.497.174 2.57 1.46 2.57 2.93V21a.75.75 0 0 1-1.085.67L12 18.089l-7.165 3.583A.75.75 0 0 1 3.75 21V5.507c0-1.47 1.073-2.756 2.57-2.93Z"
6161
fill-rule="evenodd"></path>
6262
</svg>
63-
the design repo
63+
<a href="/" target="_self">the design repo</a>
64+
<span>BETA</span>
6465
</h1>
65-
<div class="menu">
6666

67+
<nav class="menu">
6768

6869
<ActionButton
69-
buttonText='Submit resources'
70+
buttonText='Home'
7071
href="/"
71-
label='Aria Label2'
72-
target="_blank"
72+
label='Home navigation'
73+
target="_self"
74+
/>
75+
<ActionButton
76+
buttonText='About'
77+
href="/about/"
78+
label='About page navigation'
79+
target="_self"
7380
/>
7481

75-
</div>
82+
</nav>
7683
</div>
7784
</header>
7885
<HeaderAlert/>
@@ -133,4 +140,14 @@ import SubmitButton from "./buttons/SubmitButton.astro";
133140
padding: 0 6%;
134141
}
135142

143+
span {
144+
font-size: 0.6rem !important;
145+
color: #f0f1f2;
146+
font-weight: 500;
147+
border-radius: 0.25rem;
148+
@apply px-1;
149+
@apply py-0.5;
150+
background-color: #3574F0;
151+
}
152+
136153
</style>

‎src/components/aboutPage.astro

Lines changed: 192 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,192 @@
1+
---
2+
import '../styles/styles.scss';
3+
import '../styles/globals.scss';
4+
import ActionButton from "./buttons/ActionButton.astro";
5+
---
6+
7+
<script>
8+
9+
let timestamp = Date.now()
10+
let stamp = document.getElementById('time')
11+
let date = new Date(timestamp);
12+
let month = (date.getUTCMonth() + 1).toString();
13+
14+
switch (month) {
15+
case '1':
16+
month = 'January';
17+
break;
18+
case '2':
19+
month = 'February';
20+
break;
21+
case '3':
22+
month = 'March';
23+
break;
24+
case '4':
25+
month = 'April';
26+
break;
27+
case '5':
28+
month = 'May';
29+
break;
30+
case '6':
31+
month = 'June';
32+
break;
33+
case '7':
34+
month = 'July';
35+
break;
36+
case '8':
37+
month = 'August';
38+
break;
39+
case '9':
40+
month = 'September';
41+
break;
42+
case '10':
43+
month = 'October';
44+
break;
45+
case '11':
46+
month = 'November';
47+
break;
48+
case '12':
49+
month = 'December';
50+
break;
51+
}
52+
53+
stamp.textContent = ((month + ', ' + date.getFullYear().toString()))
54+
55+
</script>
56+
57+
<section id="about">
58+
<h1>Ever feel like you're endlessly looking for the perfect mockup? Are you still looking for stuff to put on your
59+
Moodboard?<br>Been there, done that.</h1>
60+
<p>
61+
My goal with this site is to streamline the creative process for designers of all levels, to provide a one-stop
62+
hub where you
63+
can discover the best design resources available.
64+
</p>
65+
<p>
66+
Of course, the internet is a big place. This means to make a good collection, your support is appreciated.
67+
</p>
68+
<div class="itemButtonAbout">
69+
<ActionButton
70+
buttonText='Submit resources'
71+
href="mailto:[email protected]"
72+
label='Aria Label2'
73+
target="_blank"
74+
/>
75+
</div>
76+
</section>
77+
<section id="features">
78+
<h1>Upcoming features & the desire to grow this platform</h1>
79+
<p>
80+
I intend to keep growing & developing this site for the long-term.
81+
<br>Currently on my todo to look into (in no particular order):
82+
</p>
83+
<ul>
84+
<li><strong>Implementing user auth & profiles</strong> to easily share your favorite resources</li>
85+
<li><strong>A Tab for user generated resources</strong>, to remove the need to request addition to the curated
86+
list
87+
</li>
88+
<li><strong>LOADS more resources</strong></li>
89+
<li><strong>More Filter Categories</strong></li>
90+
<li><strong>Changelog page</strong></li>
91+
<li><strong>Improvements to the Filter itself</strong>, as I have some plans for it, the current code will need
92+
a rewrite.
93+
</li>
94+
</ul>
95+
96+
</section>
97+
<section id="ad">
98+
<h1>Advertisements</h1>
99+
<p>
100+
There are currently no plans for supporting advertisements on this site. Sorry!
101+
</p>
102+
</section>
103+
104+
<section id="authors">
105+
<h1>Contributors, Inspiration, Authors & Special Thanks</h1>
106+
<p>
107+
Website (as of <span id="time"></span>) is developed, curated and designed by <a href="https://cheddzy.com">Shachar
108+
MW</a>.
109+
</p>
110+
<p>
111+
Thank you <a href="https://www.deck.gallery/">deck.gallery</a> for inspiring me to make this site (you will notice some similarities between the two sites)
112+
</p>
113+
<p>
114+
Special thanks to friends who gave feedback on the website during development, and those who continue to
115+
help improve this little project.
116+
</p>
117+
<p>
118+
Wanna contribute to the website? Feel free to contact and let's see what we can do.
119+
</p>
120+
<div class="itemButtonAbout">
121+
<ActionButton
122+
buttonText='Get in touch'
123+
href="mailto:[email protected]"
124+
label='Aria Label2'
125+
target="_blank"
126+
/>
127+
</div>
128+
</section>
129+
130+
131+
<style>
132+
133+
section {
134+
max-width: 530px;
135+
margin: calc(100px - 0.25rem) auto;
136+
display: flex;
137+
flex-direction: column;
138+
gap: 1rem;
139+
position: relative;
140+
padding: 0.25rem 1rem;
141+
}
142+
143+
h1 {
144+
font-size: 1.5rem !important;
145+
font-weight: 500;
146+
font-family: 'Inter Tight', sans-serif;
147+
}
148+
149+
p {
150+
font-size: 1.1rem !important;
151+
font-weight: 400;
152+
opacity: 0.8;
153+
}
154+
155+
#about:after, #features:after, #ad:after, #authors:after {
156+
content: '';
157+
position: absolute;
158+
top: -1.5rem;
159+
font-size: 0.85rem !important;
160+
color: var(--text-secondary) !important;
161+
@apply py-1;
162+
}
163+
164+
#about:after {
165+
content: 'About';
166+
}
167+
168+
#features:after {
169+
content: 'Features';
170+
}
171+
172+
#ad:after {
173+
content: 'Sponsorship';
174+
}
175+
#authors:after {
176+
content: 'Authors';
177+
}
178+
179+
ul li {
180+
list-style-type: disc;
181+
padding-bottom: 0.5rem;
182+
}
183+
184+
ul {
185+
padding-left: 1rem;
186+
}
187+
188+
.itemButtonAbout {
189+
margin: auto;
190+
}
191+
192+
</style>

‎src/layouts/Layout.astro

Lines changed: 57 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,66 +1,73 @@
11
---
22
interface Props {
3-
title: string;
3+
title: string;
44
}
55
66
import '../styles/styles.scss';
77
import '../styles/globals.scss';
88
import thumbnail from '../assets/bookmarkrepo.png';
99
10-
const { title } = Astro.props;
10+
const {title} = Astro.props;
1111
---
1212

1313
<!doctype html>
1414
<html data-alertBox="dismissed" lang="en">
15-
<head>
16-
<script is:inline>document.documentElement.setAttribute('data-theme', localStorage.getItem('theme'))</script>
17-
<meta charset="UTF-8" />
18-
<meta name="description" content="Astro description" />
19-
<meta name="viewport" content="width=device-width" />
20-
<link rel="icon" type="image/svg+xml" href="/Bookmark.svg" />
21-
<meta content={title} property="og:title" />
22-
<meta content="End-all-be-all bookmark repository for designers" property="og:description" />
23-
<meta content="https://repo.cheddzy.com/" property="og:url" />
24-
<meta content={thumbnail} property="og:image" />
25-
<meta content="#3574F0" data-react-helmet="true" name="theme-color" />
26-
<meta name="twitter:card" content="summary_large_image">
15+
<head>
16+
<script is:inline>document.documentElement.setAttribute('data-theme', localStorage.getItem('theme'))</script>
17+
<meta charset="UTF-8"/>
18+
<meta name="description" content="Astro description"/>
19+
<meta name="viewport" content="width=device-width"/>
20+
<link rel="icon" type="image/svg+xml" href="/Bookmark.svg"/>
21+
<meta content={title} property="og:title"/>
22+
<meta content="End-all-be-all bookmark repository for designers" property="og:description"/>
23+
<meta content="https://repo.cheddzy.com/" property="og:url"/>
24+
<meta content={thumbnail} property="og:image"/>
25+
<meta content="#3574F0" data-react-helmet="true" name="theme-color"/>
26+
<meta name="twitter:card" content="summary_large_image">
27+
<link rel="preconnect" href="https://fonts.googleapis.com">
28+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
29+
<link href="https://fonts.googleapis.com/css2?family=Alef:wght@400;700&family=Assistant:[email protected]&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+Hebrew:[email protected]&display=swap"
30+
rel="stylesheet">
2731

28-
<meta name="generator" content={Astro.generator} />
29-
<title>{title}</title>
30-
</head>
31-
<body>
32-
<slot />
33-
</body>
32+
33+
<meta name="generator" content={Astro.generator}/>
34+
<title>{title}</title>
35+
</head>
36+
<body>
37+
<slot/>
38+
</body>
3439
</html>
3540
<style is:global>
36-
:root {
37-
--accent: 136, 58, 234;
38-
--accent-light: 224, 204, 250;
39-
--accent-dark: 49, 10, 101;
40-
--accent-gradient: linear-gradient(
41-
45deg,
42-
rgb(var(--accent)),
43-
rgb(var(--accent-light)) 30%,
44-
white 60%
45-
);
46-
}
47-
html {
48-
font-family: system-ui, sans-serif;
49-
background: #13151a;
50-
background-size: 224px;
51-
}
52-
code {
53-
font-family:
54-
Menlo,
55-
Monaco,
56-
Lucida Console,
57-
Liberation Mono,
58-
DejaVu Sans Mono,
59-
Bitstream Vera Sans Mono,
60-
Courier New,
61-
monospace;
62-
}
63-
body {
64-
overflow-y: scroll;
65-
}
41+
:root {
42+
--accent: 136, 58, 234;
43+
--accent-light: 224, 204, 250;
44+
--accent-dark: 49, 10, 101;
45+
--accent-gradient: linear-gradient(
46+
45deg,
47+
rgb(var(--accent)),
48+
rgb(var(--accent-light)) 30%,
49+
white 60%
50+
);
51+
}
52+
53+
html {
54+
font-family: system-ui, sans-serif;
55+
background: #13151a;
56+
background-size: 224px;
57+
}
58+
59+
code {
60+
font-family: Menlo,
61+
Monaco,
62+
Lucida Console,
63+
Liberation Mono,
64+
DejaVu Sans Mono,
65+
Bitstream Vera Sans Mono,
66+
Courier New,
67+
monospace;
68+
}
69+
70+
body {
71+
overflow-y: scroll;
72+
}
6673
</style>

0 commit comments

Comments
 (0)