diff --git a/src/app.html b/src/app.html
index 46589fa..c8b3237 100644
--- a/src/app.html
+++ b/src/app.html
@@ -2,10 +2,8 @@
{title}
diff --git a/src/lib/datefmt.js b/src/lib/datefmt.js
new file mode 100644
index 0000000..7ae04df
--- /dev/null
+++ b/src/lib/datefmt.js
@@ -0,0 +1,23 @@
+const months = [
+ 'January', 'February', 'March', 'April', 'May', 'June',
+ 'July', 'August', 'September', 'October', 'November', 'December'
+];
+
+const ordinals = [
+ 'first', 'second', 'third', 'fourth', 'fifth', 'sixth', 'seventh',
+ 'eighth', 'ninth', 'tenth', 'eleventh', 'twelfth', 'thirteenth',
+ 'fourteenth', 'fifteenth', 'sixteenth', 'seventeenth', 'eighteenth',
+ 'nineteenth', 'twentieth', 'twenty-first', 'twenty-second', 'twenty-third',
+ 'twenty-fourth', 'twenty-fifth', 'twenty-sixth', 'twenty-seventh',
+ 'twenty-eighth', 'twenty-ninth', 'thirtieth', 'thirty-first'
+];
+
+const weekdays = [
+ 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'
+];
+
+
+export function formatDate(datestr) {
+ const date = new Date(datestr);
+ const w = date.get
+}
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 449433c..a12d8b1 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -2,6 +2,7 @@
:global(main) {
max-width: 42rem;
margin: 0 auto;
+ padding: 0 15px;
}
#header {
@@ -13,7 +14,6 @@
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
- column-gap: 40px;
}
#nav-main a {
@@ -21,7 +21,8 @@
color: white;
text-decoration: none;
text-align: center;
- padding: 6px 0;
+ padding: 0.25rem 0;
+ max-width: 8rem;
}
#nav-main a:hover {
diff --git a/src/routes/posts.svelte b/src/routes/posts.svelte
index a127a21..8b0766f 100644
--- a/src/routes/posts.svelte
+++ b/src/routes/posts.svelte
@@ -27,6 +27,10 @@
}
+
+ Posts
+
+
All Posts
{#each postData as post}
diff --git a/static/Tajawal-Regular.woff2 b/static/Tajawal-Regular.woff2
new file mode 100644
index 0000000..4cad20e
Binary files /dev/null and b/static/Tajawal-Regular.woff2 differ
diff --git a/static/style.css b/static/style.css
index 6b94e1e..954fa5c 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,4 +1,11 @@
/* ### TYPOGRAPHY ### */
+@font-face {
+ font-family: 'Tajawal';
+ font-style: normal;
+ font-weight: 400;
+ src: url(/Tajawal-Regular.woff2) format('woff2');
+}
+
html {
font-family: 'Tajawal', sans-serif;
font-size: 20px;
@@ -16,20 +23,13 @@ h1, h2, h3, h4, h5, h6 {
color: #464646;
}
-h1, h2 {
- margin-bottom: 0.75rem;
-}
-
-h3, h4 {
- margin-bottom: 0.5rem;
-}
-
-h5, h6 {
- margin-bottom: 0;
-}
-
h1 {
font-variant: petite-caps;
+ margin-top: 0.75rem;
+}
+
+h1, h2 {
+ margin-bottom: 0.75rem;
}
h3 {
@@ -40,8 +40,13 @@ h4 {
font-size: 1.1rem;
}
+h3, h4 {
+ margin-bottom: 0.5rem;
+}
+
h5, h6 {
font-size: 1rem;
+ margin-bottom: 0;
}
p {