shrink too wide buttons by 50%

krustowski · Aug 25, 2024 · e378fca · e378fca
1 parent 6ffa46e
commit e378fca
Show file tree

Hide file tree

Showing 10 changed files with 42 additions and 38 deletions.
diff --git a/.env.example b/.env.example
@@ -3,5 +3,5 @@
 #
 
 APP_NAME=litter-go
-APP_VERSION=0.38.3
+APP_VERSION=0.38.4
 GOLANG_VERSION=1.22
diff --git a/api/swagger.json b/api/swagger.json
@@ -13,7 +13,7 @@
             "name": "MIT",
             "url": "https://github.com/krustowski/litter-go/blob/master/LICENSE"
         },
-        "version": "0.38.3"
+        "version": "0.38.4"
     },
     "host": "littr.eu",
     "basePath": "/api/v1",

diff --git a/pkg/backend/router.go b/pkg/backend/router.go
@@ -1,5 +1,5 @@
 // @title		litter-go
-// @version	 	0.38.3
+// @version	 	0.38.4
 // @description		nanoblogging platform as PWA built on go-app framework
 // @termsOfService	https://littr.eu/tos
 

diff --git a/pkg/frontend/login.go b/pkg/frontend/login.go
@@ -222,33 +222,37 @@ func (c *loginContent) Render() app.UI {
 				app.Span().Text("log-in for 30 days"),
 			),
 		),
-		app.Div().Class("medium-space"),
+		app.Div().Class("space"),
 
 		// login button
-		app.Div().Class("row").Body(
-			app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(3).OnClick(c.onClick).Disabled(c.loginButtonDisabled).Body(
+		app.Div().Class("row center-align").Body(
+			app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(3).OnClick(c.onClick).Disabled(c.loginButtonDisabled).Body(
 				app.Text("login"),
 			),
 		),
 		app.Div().Class("space"),
 
 		// reset button
-		app.Div().Class("row max").Body(
-			app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(4).OnClick(c.onClickReset).Disabled(c.loginButtonDisabled).Body(
+		app.Div().Class("row center-align").Body(
+			app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(4).OnClick(c.onClickReset).Disabled(c.loginButtonDisabled).Body(
 				app.Text("recover forgotten passphrase"),
 			),
+		),
+		app.Div().Class("space"),
 
+		// register button
+		app.Div().Class("row center-align").Body(
 			// register button
 			app.If(app.Getenv("REGISTRATION_ENABLED") == "true",
-				app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(5).OnClick(c.onClickRegister).Disabled(c.loginButtonDisabled).Body(
+				app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(5).OnClick(c.onClickRegister).Disabled(c.loginButtonDisabled).Body(
 					app.Text("register"),
 				),
 			).Else(
-				app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(5).OnClick(nil).Disabled(true).Body(
+				app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(5).OnClick(nil).Disabled(true).Body(
 					app.Text("register"),
 				),
 			),
 		),
-		app.Div().Class("space"),
+		app.Div().Class("medium-space"),
 	)
 }
diff --git a/pkg/frontend/post.go b/pkg/frontend/post.go
@@ -306,7 +306,7 @@ func (c *postContent) Render() app.UI {
 			app.I().Text("image"),
 		),
 		app.Div().Class("row").Body(
-			app.Button().ID("post").Class("max deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(c.onClick).Disabled(c.postButtonsDisabled).On("keydown", c.onKeyDown).TabIndex(3).Body(
+			app.Button().ID("post").Class("max shrink center deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(c.onClick).Disabled(c.postButtonsDisabled).On("keydown", c.onKeyDown).TabIndex(3).Body(
 				app.If(c.postButtonsDisabled,
 					app.Progress().Class("circle white-border small"),
 				),
@@ -343,7 +343,7 @@ func (c *postContent) Render() app.UI {
 			app.Label().Text("option three (optional)").Class("active deep-orange-text"),
 		),
 		app.Div().Class("row").Body(
-			app.Button().ID("poll").Class("max deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(c.onClick).Disabled(c.postButtonsDisabled).TabIndex(8).Body(
+			app.Button().ID("poll").Class("max shrink center deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(c.onClick).Disabled(c.postButtonsDisabled).TabIndex(8).Body(
 				app.If(c.postButtonsDisabled,
 					app.Progress().Class("circle white-border small"),
 				),

diff --git a/pkg/frontend/register.go b/pkg/frontend/register.go
@@ -304,21 +304,21 @@ func (c *registerContent) Render() app.UI {
 				app.P().Text("you can flush your account data and published posts simply on the settings page after a log-in"),
 			),
 		),
-		app.Div().Class("medium-space"),
+		app.Div().Class("space"),
 
 		// register button
-		app.Div().Class("row").Body(
+		app.Div().Class("row center-align").Body(
 			app.If(app.Getenv("REGISTRATION_ENABLED") == "true",
-				app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(c.onClickRegister).Disabled(c.registerButtonDisabled).TabIndex(5).Body(
+				app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(c.onClickRegister).Disabled(c.registerButtonDisabled).TabIndex(5).Body(
 					app.Text("register"),
 				),
 			).Else(
-				app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(nil).Disabled(true).Body(
+				app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").OnClick(nil).Disabled(true).Body(
 					app.Text("registration off"),
 				),
 			),
 		),
 
-		app.Div().Class("space"),
+		app.Div().Class("medium-space"),
 	)
 }
diff --git a/pkg/frontend/reset.go b/pkg/frontend/reset.go
@@ -275,8 +275,8 @@ func (c *resetContent) Render() app.UI {
 			//app.Div().Class("small-space"),
 
 			// request button
-			app.Div().Class("row").Body(
-				app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(1).OnClick(c.onClickRequest).Disabled(c.buttonsDisabled).TabIndex(2).Body(
+			app.Div().Class("row center-align").Body(
+				app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(1).OnClick(c.onClickRequest).Disabled(c.buttonsDisabled).TabIndex(2).Body(
 					app.Text("request"),
 				),
 			),
@@ -303,8 +303,8 @@ func (c *resetContent) Render() app.UI {
 			//app.Div().Class("small-space"),
 
 			// pwd reset button
-			app.Div().Class("row").Body(
-				app.Button().Class("max deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(1).OnClick(c.onClickReset).Disabled(c.buttonsDisabled).TabIndex(2).Body(
+			app.Div().Class("row center-align").Body(
+				app.Button().Class("max shrink deep-orange7 white-text bold").Style("border-radius", "8px").TabIndex(1).OnClick(c.onClickReset).Disabled(c.buttonsDisabled).TabIndex(2).Body(
 					app.Text("reset"),
 				),
 			),

diff --git a/pkg/frontend/settings.go b/pkg/frontend/settings.go
@@ -545,7 +545,7 @@ func (c *settingsContent) Render() app.UI {
 		),
 
 		app.Div().Class("row").Body(
-			app.Button().Class("max deep-orange7 white-text bold").Text("change passphrase").Style("border-radius", "8px").OnClick(c.onClickPass).Disabled(c.settingsButtonDisabled),
+			app.Button().Class("max shrink center deep-orange7 white-text bold").Text("change passphrase").Style("border-radius", "8px").OnClick(c.onClickPass).Disabled(c.settingsButtonDisabled),
 		),
 
 		// about-you textarea
@@ -569,7 +569,7 @@ func (c *settingsContent) Render() app.UI {
 		),
 
 		app.Div().Class("row").Body(
-			app.Button().Class("max deep-orange7 white-text bold").Text("change about").Style("border-radius", "8px").OnClick(c.onClickAbout).Disabled(c.settingsButtonDisabled),
+			app.Button().Class("max shrink center deep-orange7 white-text bold").Text("change about").Style("border-radius", "8px").OnClick(c.onClickAbout).Disabled(c.settingsButtonDisabled),
 		),
 
 		// website link
@@ -593,7 +593,7 @@ func (c *settingsContent) Render() app.UI {
 		),
 
 		app.Div().Class("row").Body(
-			app.Button().Class("max deep-orange7 white-text bold").Text("change website").Style("border-radius", "8px").OnClick(c.onClickWebsite).Disabled(c.settingsButtonDisabled),
+			app.Button().Class("max shrink center deep-orange7 white-text bold").Text("change website").Style("border-radius", "8px").OnClick(c.onClickWebsite).Disabled(c.settingsButtonDisabled),
 		),
 
 		// acc deletion modal
@@ -635,7 +635,7 @@ func (c *settingsContent) Render() app.UI {
 		app.Div().Class("space"),
 
 		app.Div().Class("row").Body(
-			app.Button().Class("max red10 white-text bold").Text("delete account").Style("border-radius", "8px").OnClick(c.onClickDeleteAccountModalShow).Disabled(c.settingsButtonDisabled),
+			app.Button().Class("max shrink center red10 white-text bold").Text("delete account").Style("border-radius", "8px").OnClick(c.onClickDeleteAccountModalShow).Disabled(c.settingsButtonDisabled),
 		),
 
 		app.Div().Class("large-space"),

diff --git a/pkg/frontend/users.go b/pkg/frontend/users.go
@@ -989,42 +989,42 @@ func (c *usersContent) Render() app.UI {
 								),
 							),
 
-							app.Div().Class("row bottom-padding").Body(
+							app.Div().Class("row center-align bottom-padding").Body(
 								// flow list button
 
 								// make button inactive for logged user
 								app.If(user.Nickname == c.user.Nickname,
-									app.Button().Class("max deep-orange7 white-text bold").Disabled(true).Style("border-radius", "8px").Body(
+									app.Button().Class("max shrink deep-orange7 white-text bold").Disabled(true).Style("border-radius", "8px").Body(
 										app.Text("that's you"),
 									),
 								// if system acc
 								).ElseIf(user.Nickname == "system",
-									app.Button().Class("max deep-orange7 white-text bold").Disabled(true).Style("border-radius", "8px").Body(
+									app.Button().Class("max shrink deep-orange7 white-text bold").Disabled(true).Style("border-radius", "8px").Body(
 										app.Text("system acc"),
 									),
 								// private mode
 								).ElseIf(user.Private && !requested && !inFlow,
-									app.Button().Class("max yellow10 white-text bold").OnClick(c.onClickPrivateOn).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").ID(user.Nickname).Body(
-										app.Text("ask to see"),
+									app.Button().Class("max shrink yellow10 white-text bold").OnClick(c.onClickPrivateOn).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").ID(user.Nickname).Body(
+										app.Text("ask to follow"),
 									),
 								// private mode, requested already
 								).ElseIf(user.Private && requested && !inFlow,
-									app.Button().Class("max border gray white-text bold").OnClick(c.onClickPrivateOff).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").ID(user.Nickname).Body(
+									app.Button().Class("max shrink border gray white-text bold").OnClick(c.onClickPrivateOff).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").ID(user.Nickname).Body(
 										app.Text("cancel the request"),
 									),
 								// if shaded
 								).ElseIf(shaded || c.users[user.Nickname].ShadeList[c.user.Nickname],
-									app.Button().Class("max deep-orange7 white-text bold").Disabled(true).Style("border-radius", "8px").Body(
+									app.Button().Class("max shrink deep-orange7 white-text bold").Disabled(true).Style("border-radius", "8px").Body(
 										app.Text("shaded"),
 									),
 								// flow toggle off
 								).ElseIf(inFlow,
-									app.Button().Class("max border gray white-border white-text bold").ID(user.Nickname).OnClick(c.onClick).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").Body(
+									app.Button().Class("max shrink border gray white-border white-text bold").ID(user.Nickname).OnClick(c.onClick).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").Body(
 										app.Text("remove from flow"),
 									),
 								// flow toggle on
 								).Else(
-									app.Button().Class("max deep-orange7 white-text bold").ID(user.Nickname).OnClick(c.onClick).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").Body(
+									app.Button().Class("max shrink deep-orange7 white-text bold").ID(user.Nickname).OnClick(c.onClick).Disabled(c.usersButtonDisabled).Style("border-radius", "8px").Body(
 										app.Text("add to flow"),
 									),
 								),

diff --git a/web/litter.css b/web/litter.css
@@ -35,7 +35,7 @@ sub {
     main {
         max-width: 50% !important;
     }
-    /*button {
-        #max-width: 50%;
-    }*/
+    button.shrink {
+        max-width: 50%;
+    }
 }