README.md

@@ -5,9 +5,9 @@
 A truly proper website this time™
 
 **TODO**:
+- Redo the entire CSS with a framework
 - Change domain to quenten.nl and staging.quenten.nl
 - Dynamically make domains for other branches
-- Make a generic page component, so that you don't have to add the standard panels every time (such as navbar, leftbar, header, etc)
 
 
 This website will be done with this:

components/bannerpanel.go

@@ -1,13 +0,0 @@
-package components
-
-import "github.com/maxence-charriere/go-app/v9/pkg/app"
-
-type bannerPanel struct {
-	app.Compo
-}
-
-func (b *bannerPanel) Render() app.UI {
-	return app.Div().
-		Class("leftbar").
-		Body()
-}

components/galaxiespage.go

@@ -15,7 +15,6 @@ func (f *GalaxiesPage) Render() app.UI {
 		&header{},
 		&navbar{},
 		&galaxiesPanel{},
-		&bannerPanel{},
 	).Class("main")
 }
 
@@ -37,7 +36,7 @@ func (b *galaxiesPanel) Render() app.UI {
 		app.Div().
 			Body(
 				app.P().
-					Class("p-h2 mt-20 mb-10 bold").
+					Class("p-h2 m-tb10").
 					Text("My friends!"),
 				app.Ul().Body(
 					app.Li().Body(
@@ -78,31 +77,5 @@ func (b *galaxiesPanel) Render() app.UI {
 					),
 				),
 			),
-		app.Div().
-			Body(
-				app.P().
-					Class("p-h2 mt-20 mb-10 bold").
-					Text("Neat webspaces"),
-				app.P().
-					Class("m-t5").
-					Style("margin-left", "10px").
-					Text(`Just very neat websites I found. Not necessarily by people I know.
-					I just thought it would be nice to share them here!`),
-				app.Ul().Body(
-					app.Li().Body(
-						app.Div().Body(
-							// TODO: Create a modal popup for each name!!!
-							app.A().Href("https://evillious.ylimegirl.com/").
-								Class("p-h3 m-t5").
-								Text("Evillious Chronicles fan guide"),
-							app.P().
-								Class("m-t5").
-								Text(`A VERY cool website made by Ylimegirl! They wrote a whole
-								website dedicated to Evillious Chronicles, which is a super 
-								good Japanese light novel and vocaloid series!! Definitely look it up!`),
-						),
-					),
-				),
-			),
 	).Class("content")
 }

components/homepage.go

@@ -36,7 +36,6 @@ func (p *Homepage) Render() app.UI {
 				p.showGuestbook = !p.showGuestbook
 			},
 		},
-		&bannerPanel{},
 		&guestbookForm{
 			OnSubmit: func(name, message string) {
 				var comment entity.Comment

components/homepanel.go

@@ -16,17 +16,9 @@ func newHomePanel() *homePanel {
 func (p *homePanel) Render() app.UI {
 	return app.Div().Body(
 		app.P().Text("Welcome, internet surfer!").Class("p-h1"),
-		app.Div().Body(
-			app.P().Text("Please sign my guestbook!").Class("small"),
-			app.Img().Src("/web/static/images/email3.gif").Style("width", "40px").Style("position", "absolute").Style("bottom", "0px").Style("right", "0px"),
-		).Style("position", "absolute").Style("top", "10px").Style("right", "5px").
-			OnClick(func(ctx app.Context, e app.Event) {
-				e.PreventDefault()
-				p.onShowClick()
-			}),
 		app.Img().
 			Style("float", "right").
-			Style("margin-bottom", "10px").
+			Style("margin-bottom", "50px").
 			Height(230).
 			Src("/web/static/images/rin-len1.webp"),
 		app.Raw(
@@ -50,6 +42,14 @@ func (p *homePanel) Render() app.UI {
 					Class("content-text").
 					Text("An update is available! Reload to update!"),
 			)),
+		app.Div().Body(
+			app.P().Text("Please sign my guestbook!").Class("small"),
+			app.Img().Src("/web/static/images/email3.gif").Style("width", "40px").Style("position", "absolute").Style("bottom", "0px").Style("right", "0px"),
+		).Style("position", "absolute").Style("bottom", "5px").Style("right", "5px").
+			OnClick(func(ctx app.Context, e app.Event) {
+				e.PreventDefault()
+				p.onShowClick()
+			}),
 	).Class("content")
 }
 

web/static/style.css

@@ -17,7 +17,6 @@ body {
 	border: 3px solid;
 	border-radius: 4px;
 	border-color: rgb(252, 230, 255);
-	margin-bottom: 5px;
 	background-color: rgb(54, 39, 48);
 	font-size: 5em;
 	font-family: anisha;
@@ -32,7 +31,6 @@ body {
 	border: 3px solid;
 	border-radius: 4px;
 	border-color: rgb(252, 230, 255);
-	margin-bottom: 5px;
 	background-color: rgb(54, 39, 48);
 	position: relative;
 	float:left;
@@ -46,17 +44,6 @@ body {
 	color:rgb(252, 230, 255)
 }
 
-.leftbar {
-	border: 3px solid;
-	border-radius: 4px;
-	border-color: rgb(252, 230, 255);
-	background-color: rgb(54, 39, 48);
-	position: relative;
-	float:left;
-	width: 250px;
-	padding: 5px 0px;
-}
-
 .content {
 	border: 3px solid;
 	border-radius: 4px;
@@ -77,6 +64,7 @@ body {
 	margin-bottom: 5px;
 }
 
+.
 
 /*
 .content p {
@@ -226,18 +214,6 @@ div.comment-message p{
 	margin-bottom: 10px;
 }
 
-.mt-20 {
-	margin-top: 20px;
-}
-
-.mb-10 {
-	margin-bottom: 10px;
-}
-
-.bold {
-	font-weight: 700;
-}
-
 .fit { 
 	width: fit-content;
 }