about summary refs log tree commit diff
path: root/served/styles/home.css
diff options
context:
space:
mode:
Diffstat (limited to 'served/styles/home.css')
-rw-r--r--[-rwxr-xr-x]served/styles/home.css197
1 files changed, 27 insertions, 170 deletions
diff --git a/served/styles/home.css b/served/styles/home.css
index d48471a..bd23605 100755..100644
--- a/served/styles/home.css
+++ b/served/styles/home.css
@@ -1,194 +1,51 @@
-body {
-	padding-top: 4rem;
-	padding-bottom: 4rem;
+#hello {
+	margin: 1rem 0;
 }
 
-main,
-header {
-	max-width: 35rem;
-	margin: 0 auto;
-}
-
-header {
-	display: flex;
-	justify-content: space-between;
-	flex-wrap: wrap;
-	row-gap: 1rem;
-}
-
-header img {
-	width: 96px;
-	height: 96px;
-	margin-top: 1.5em;
-}
-
-#contact a {
-	text-decoration: none;
-	color: var(--color-a);
-	border-bottom: none;
-}
-
-#contact ul {
-	line-height: normal;
-	list-style: none;
-	padding: 0;
-	margin: 0;
-}
-
-#contact h2 {
-	margin: 0;
-}
+#contact {
+	border: 1px solid black;
+	box-shadow: 5px -5px 0px #999, 10px -10px 0px #666, 15px -15px 0px #333;
+	padding: 1rem 2rem 1rem 1rem;
 
-#greeting {
-	flex: 1 0 15rem;
+	max-width: var(--pwidth);
+	height: min-content;
 }
 
-#greeting h1 {
+#contact>h2 {
 	margin-top: 0;
 }
 
-#notice {
-	font-style: italic;
-	text-align: center;
-}
-
-.thing-list {
-	padding: 0.5rem 0;
-	margin: 0;
-	list-style-position: inside;
-}
-
-ul.thing-list {
-	padding: 0;
-	list-style: none;
-}
-
-section h2 {
+#contact>ul {
 	margin: 0;
-}
-
-ol,
-ul.thing-list {
-	line-height: 1.5;
-}
-
-#scrap {
-	max-width: 25rem;
-}
-
-#changelog {
-	margin: 0.5rem 1rem;
-	padding: 1rem 0;
-	border-top: 1px solid var(--text);
-}
-
-#changelog h2 {
-	font-size: 1.5rem;
-	margin-bottom: 0.25rem;
-	display: inline-block;
-}
-
-#changelog h3 {
-	font-size: 1rem;
-	font-weight: normal;
-	align-self: baseline;
-	display: inline-block;
-}
-
-#changelog ul {
 	list-style: none;
 	padding: 0;
-	margin: 0;
 }
 
-#changelog time {
-	color: var(--text-dim);
-	font-style: italic;
-	margin-right: 0.5rem;
+@media (max-width: 50rem) {
+	#contact {
+		margin-top: 1.5rem;
+		margin-right: 1rem;
+	}
 }
 
-@media (min-width: 40rem) {
-	main {
-		padding: 1rem 0;
+@media (min-width: 50rem) {
+	#hello {
 		display: grid;
-		grid-template-columns: 1fr 1fr;
+		grid-template-columns: 30rem 1fr;
+		row-gap: 1rem;
 		column-gap: 1rem;
-		row-gap: 0.5rem;
-	}
-
-	#greeting {
-		grid-column: 1 / 3;
-	}
-
-	#greeting p {
-		max-width: 26rem;
 	}
 
-	p#notice {
-		/* there's too much space without this. only on desktop. i think it's
-		to do with the grid gap */
-		margin-bottom: 0rem;
-		max-width: 100%;
+	#hello>p,
+	#hello>h1 {
+		grid-column: 1 / 2;
+		margin: 0;
 	}
 
-	#scrap {
-		width: 100%;
-		/* a padding on desktop so it falls below the multimedia heading and
-		looks like it's kind of part of that section even if maybe it's not */
-		padding-top: 2.25rem;
-		position: relative;
-		padding-right: 1rem;
-	}
-
-	#scrap h2 {
-		display: inline;
-		margin: 0 0.5rem 0 0;
-	}
-
-	/* tried https://stackoverflow.com/a/68283780 but it didn't seem to want
-	to work for right and bottom at the same time */
-	#scrap-halfborder {
-		position: absolute;
-		right: 0;
-		bottom: 0;
-
-		z-index: -1;
-		width: 50%;
-		height: 50%;
-		border: 1px solid var(--text);
-		border-width: 0px 1px 1px 0px;
-	}
-
-	#writing-halfborder,
-	#feed-halfborder {
-		position: absolute;
-		left: 0;
-		top: 0;
-
-		z-index: -1;
-		width: 25%;
-		height: min(50%, 2rem);
-		border: 1px solid var(--text);
-		border-width: 1px 0 0 1px;
-	}
-
-	#writing {
-		padding-left: 1rem;
-		padding-top: 1rem;
-		position: relative;
-
-		grid-column: 1 / 3;
-	}
-
-	#feed {
-		position: relative;
-		margin: 1rem 0 0 1rem;
-		padding: 1rem 0 0 1rem;
-		width: 15rem;
-		float: right;
-	}
+	#hello>#contact {
+		grid-column: 2 / 3;
+		grid-row: 2 / 5;
 
-	#changelog {
-		grid-column: 1 / 3;
+		width: fit-content;
 	}
 }
\ No newline at end of file