fix styles [episode 8]

author: NerdyPepper <[email protected]> 2019-07-30 09:51:57 +0100
committer: NerdyPepper <[email protected]> 2019-07-30 09:51:57 +0100
commit: ef7926f2a457b19dcd277c6be0bcb2789bbff718 (patch)
tree: 6433edd71bde25b4955cf0aeaa0e27bd9c2de791 /docs
parent: b974122914c9af8f413ed9d554656afaeb8e000c (diff)
2 files changed, 113 insertions, 1 deletions
diff --git a/docs/index.html b/docs/index.html
index afdde45..384be00 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -2,7 +2,7 @@
 <!DOCTYPE html>
 <html lang=en>
 <head>
-<link rel=stylesheet href=/style.css>
+<link rel=stylesheet href=./style.css>
 <meta charset=UTF-8>
 <title>n</title>
diff --git a/docs/style.css b/docs/style.css
new file mode 100644
index 0000000..fd07289
--- /dev/null
+++ b/docs/style.css
@@ -0,0 +1,112 @@
+:root {
+  --cyan: #00FECA;
+  --pink: #FF2079;
+  --black: #212121;
+  --light-black: #535353;
+  --white: #ffffff;
+  --dark-white: #d4d4d4;
+}
+body {
+  font-family: sans;
+  background-color: var(--white);
+  color: var(--black);
+  font-size: 18px;
+  padding: 0;
+  padding-top: 2rem;
+  text-align: center;
+}
+.posts {
+  text-align: left;
+  display: inline-block;
+  width: 100%;
+}
+@media only screen and (min-width: 1000px) {
+  .posts {
+    text-align: left;
+    display: inline-block;
+    width: 60%;
+  }
+}
+.post {
+  margin: 2rem;
+}
+hr {
+  color: var(--light-black);
+}
+.date {
+  font-weight: 400;
+  font-size: 0.8rem;
+  color: var(--light-black);
+}
+.separator {
+  margin: 0;
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+  border-top: 1px solid var(--dark-white);
+}
+.black-circle {
+  margin:0 auto;
+  width: 10rem;
+  height: 10rem;
+  border: 0px solid transparent;
+  border-radius: 50%;
+  background-color: var(--black);
+}
+.heading {
+  margin:0 auto;
+  color: var(--white);
+  text-align: center;
+  font-size: 120px;
+  font-family: 'Iosevka Term', sans-serif;
+  text-shadow: 0.25rem 0rem var(--cyan), -0.25rem 0rem var(--pink);
+  line-height: 8.5rem;
+  font-style: italic;
+}
+a, a:hover, a:visited, a:active {
+  text-decoration: none;
+  transition: ease 0.2s;
+}
+a:hover, a:active {
+  background-color: var(--dark-white);
+}
+.post-link {
+  color: var(--black);
+  font-family: sans-serif;
+  font-weight: 600;
+  font-size: 1rem;
+  text-decoration: none;
+  text-decoration-skip: objects edges box-decoration;
+}
+.post-end-link, .post-end-link:hover, .post-end-link:visited, .post-end-link:active {
+  text-decoration: none;
+  color: var(--light-black);
+  text-shadow: none;
+}
+.post-text {
+  font-size: 14px;
+}
+pre, code {
+  background-color: var(--dark-white);
+  color: var(--black);
+}
+pre {
+  padding: 1rem;
+  overflow: auto;
+}
author	NerdyPepper <[email protected]>	2019-07-30 09:51:57 +0100
committer	NerdyPepper <[email protected]>	2019-07-30 09:51:57 +0100
commit	ef7926f2a457b19dcd277c6be0bcb2789bbff718 (patch)
tree	6433edd71bde25b4955cf0aeaa0e27bd9c2de791 /docs
parent	b974122914c9af8f413ed9d554656afaeb8e000c (diff)

diff --git a/docs/index.html b/docs/index.html index afdde45..384be00 100644 --- a/docs/index.html +++ b/docs/index.html
@@ -2,7 +2,7 @@
2	<!DOCTYPE html>	2	<!DOCTYPE html>
3	<html lang=en>	3	<html lang=en>
4	<head>	4	<head>
5	<link rel=stylesheet href=/style.css>	5	<link rel=stylesheet href=./style.css>
6	<meta charset=UTF-8>	6	<meta charset=UTF-8>
7	<title>n</title>	7	<title>n</title>
8		8


diff --git a/docs/style.css b/docs/style.css new file mode 100644 index 0000000..fd07289 --- /dev/null +++ b/docs/style.css
@@ -0,0 +1,112 @@
		1	:root {
		2	--cyan: #00FECA;
		3	--pink: #FF2079;
		4	--black: #212121;
		5	--light-black: #535353;
		6	--white: #ffffff;
		7	--dark-white: #d4d4d4;
		8	}
		9
		10	body {
		11	font-family: sans;
		12	background-color: var(--white);
		13	color: var(--black);
		14	font-size: 18px;
		15	padding: 0;
		16	padding-top: 2rem;
		17	text-align: center;
		18	}
		19
		20	.posts {
		21	text-align: left;
		22	display: inline-block;
		23	width: 100%;
		24	}
		25
		26	@media only screen and (min-width: 1000px) {
		27	.posts {
		28	text-align: left;
		29	display: inline-block;
		30	width: 60%;
		31	}
		32	}
		33
		34
		35	.post {
		36	margin: 2rem;
		37	}
		38
		39	hr {
		40	color: var(--light-black);
		41	}
		42
		43	.date {
		44	font-weight: 400;
		45	font-size: 0.8rem;
		46	color: var(--light-black);
		47	}
		48
		49	.separator {
		50	margin: 0;
		51	margin-top: 1rem;
		52	margin-bottom: 1rem;
		53	border-top: 1px solid var(--dark-white);
		54	}
		55
		56	.black-circle {
		57	margin:0 auto;
		58	width: 10rem;
		59	height: 10rem;
		60	border: 0px solid transparent;
		61	border-radius: 50%;
		62	background-color: var(--black);
		63	}
		64
		65	.heading {
		66	margin:0 auto;
		67	color: var(--white);
		68	text-align: center;
		69	font-size: 120px;
		70	font-family: 'Iosevka Term', sans-serif;
		71	text-shadow: 0.25rem 0rem var(--cyan), -0.25rem 0rem var(--pink);
		72	line-height: 8.5rem;
		73	font-style: italic;
		74	}
		75
		76	a, a:hover, a:visited, a:active {
		77	text-decoration: none;
		78	transition: ease 0.2s;
		79	}
		80
		81	a:hover, a:active {
		82	background-color: var(--dark-white);
		83	}
		84
		85	.post-link {
		86	color: var(--black);
		87	font-family: sans-serif;
		88	font-weight: 600;
		89	font-size: 1rem;
		90	text-decoration: none;
		91	text-decoration-skip: objects edges box-decoration;
		92	}
		93
		94	.post-end-link, .post-end-link:hover, .post-end-link:visited, .post-end-link:active {
		95	text-decoration: none;
		96	color: var(--light-black);
		97	text-shadow: none;
		98	}
		99
		100	.post-text {
		101	font-size: 14px;
		102	}
		103
		104	pre, code {
		105	background-color: var(--dark-white);
		106	color: var(--black);
		107	}
		108
		109	pre {
		110	padding: 1rem;
		111	overflow: auto;
		112	}