Use content-padding-half constant

layout/sidebar/sidebar.pixy

@@ -40,12 +40,12 @@ component Sidebar(user *arn.User)
 		SidebarButton("Companies", "/companies", "building")
 		SidebarButton("Users", "/users", "globe")
 
-		if user != nil
-			SidebarButton("Support", "/support", "heart")
-		
 		if arn.IsDevelopment()
 			SidebarButton("Groups", "/groups", "users")
 
+		if user != nil
+			SidebarButton("Support", "/support", "heart")
+
 		//- Disabled:
 		//- SidebarButton("Dash", "/dashboard", "tachometer")
 		//- SidebarButton("Artworks", "/artworks", "paint-brush")

pages/anime/amvs.scarlet

@@ -5,4 +5,4 @@
 	.anime-amvs
 		.amv
 			max-width 200px
-			margin calc(content-padding / 2)
+			margin content-padding-half

pages/anime/soundtracks.scarlet

@@ -18,7 +18,7 @@
 
 		.soundtrack
 			max-width 200px
-			margin calc(content-padding / 2)
+			margin content-padding-half
 
 		.soundtrack-content
 			min-height 112px

pages/animelist/animelist.scarlet

@@ -1,7 +1,7 @@
 .anime-list-user-avatar
 	position absolute
-	top calc(content-padding / 2)
+	top content-padding-half
-	left calc(content-padding / 2)
+	left content-padding-half
 
 .anime-list-container
 	width 100%

pages/animelistitem/animelistitem.scarlet

@@ -3,7 +3,7 @@
 	width 100%
 	max-width 530px
 	margin 0 auto
-	margin-top calc(content-padding / 2)
+	margin-top content-padding-half
 
 .anime-list-item-others
 	display grid

pages/companies/popular.scarlet

@@ -8,7 +8,7 @@ const popular-company-height = 246px
 	vertical
 	width 100%
 	margin 0
-	margin-bottom calc(content-padding / 2)
+	margin-bottom content-padding-half
 	padding 0.5rem 0.75rem
 	overflow hidden
 	ui-element
@@ -40,7 +40,7 @@ const popular-company-height = 246px
 		height popular-company-height
 		max-height popular-company-height
 		padding 0.75rem 1rem
-		margin calc(content-padding / 2)
+		margin content-padding-half
 
 	.popular-company-body
 		display block

pages/explore/explore.scarlet

@@ -1,10 +1,10 @@
 .explore-filters
 	horizontal
 	justify-content center
-	margin-bottom calc(content-padding / 2)
+	margin-bottom content-padding-half
 
 .explore-anime
-	margin-top calc(content-padding / 2)
+	margin-top content-padding-half
 
 .option-any
 	color reverse-light-hover-color

pages/groups/groups.scarlet

@@ -3,7 +3,7 @@ const group-padding-x = 0.75rem
 
 .groups
 	display grid
-	grid-gap calc(content-padding / 2)
+	grid-gap content-padding-half
 	// grid-template-columns repeat(auto-fill, min(100%, 520px))
 	// justify-content center
 

pages/profile/profile.scarlet

@@ -46,7 +46,7 @@ const profile-image-size = 280px
 .profile-column
 	// border 1px solid red
 	// height 100px
-	padding calc(content-padding / 2)
+	padding content-padding-half
 
 .profile-column-header
 	font-style bold

pages/soundtrack/lyrics.scarlet

@@ -6,7 +6,7 @@
 	flex 1
 	min-width 300px
 	max-width 500px
-	padding calc(content-padding / 2)
+	padding content-padding-half
 
 .lyrics-paragraph
 	margin 1rem 0

pages/users/users.scarlet

@@ -14,7 +14,7 @@
 		flex-basis 170px
 		flex-grow 0
 		height 230px
-		margin calc(content-padding / 2)
+		margin content-padding-half
 		position relative
 		border ui-border
 		box-shadow shadow-light

styles/include/config.scarlet

@@ -122,6 +122,7 @@ outline-shadow-heavy = 0 0 6px rgba(0, 0, 0, 0.6)
 // Distances
 const content-padding = 1.6rem
 const content-padding-top = 1.6rem
+const content-padding-half = calc(content-padding / 2)
 const content-line-height = 1.7em
 const typography-margin = 0.4rem
 const media-bottom-margin = 2rem

styles/status-message.scarlet

@@ -4,7 +4,7 @@
 	bottom 0
 	left 0
 	width 100%
-	padding calc(content-padding / 2) content-padding
+	padding content-padding-half content-padding
 	pointer-events none
 	z-index 1000
 

styles/widgets.scarlet

@@ -1,7 +1,7 @@
 .widget
 	vertical
 	flex 1
-	margin calc(content-padding / 2)
+	margin content-padding-half
 
 .widget-section
 	vertical