refactor(styles): Replace inline styles with BoxShadow, TextShadow, FontWeight classes, remove comments, simplify utility functions in Projects, Articles, and CodeTheme.

Author: Ayfri

src/jsMain/kotlin/io/github/ayfri/CodeTheme.kt

@@ -1,6 +1,7 @@
 package io.github.ayfri
 
 import com.varabyte.kobweb.compose.css.FontStyle
+import com.varabyte.kobweb.compose.css.TextShadow
 import com.varabyte.kobweb.compose.css.fontStyle
 import com.varabyte.kobweb.compose.css.textShadow
 import io.github.ayfri.utils.Cursor
@@ -52,7 +53,7 @@ object CodeTheme : StyleSheet() {
 
 		child(type("pre") + attrContains("class", "language-"), type("code") + attrContains("class", "language-")) style {
 			color(textColor)
-			textShadow(color = transparent, offsetX = 0.px, offsetY = 0.px, blurRadius = 0.px)
+			textShadow(TextShadow.of(color = transparent, offsetX = 0.px, offsetY = 0.px, blurRadius = 0.px))
 		}
 
 		scope("comment") style {

src/jsMain/kotlin/io/github/ayfri/Main.kt

@@ -44,8 +44,7 @@ fun AppEntry(content: @Composable () -> Unit) {
 
 @InitKobweb
 fun initKobweb(context: InitKobwebContext) {
-	context.router.setErrorHandler {
-		if (it != 404) return@setErrorHandler
+	context.router.setErrorPage {
 		context.router.navigateTo(
 			"/",
 			openExternalLinksStrategy = OpenLinkStrategy.IN_PLACE,

src/jsMain/kotlin/io/github/ayfri/components/articles/ShareSection.kt

@@ -13,6 +13,7 @@ import kotlinx.coroutines.launch
 import org.jetbrains.compose.web.ExperimentalComposeWebApi
 import org.jetbrains.compose.web.css.*
 import org.jetbrains.compose.web.dom.*
+import web.clipboard.writeText
 import web.navigator.navigator
 
 @Composable

src/jsMain/kotlin/io/github/ayfri/pages/articles/Index.kt

@@ -227,10 +227,10 @@ object BlogPageStyle : StyleSheet() {
 			stop(Color("#00D4FF"))
 			stop(Color("#FF0080"))
 		})
-		property("-webkit-background-clip", "text")
-		property("background-clip", "text")
-		property("-webkit-text-fill-color", "transparent")
-		property("text-shadow", "0 0 20px rgba(0, 212, 255, 0.5)")
+		backgroundClip(BackgroundClip.Text)
+		textShadow(TextShadow.of(color = rgba(0, 212, 255, 0.5), offsetX = 0.px, offsetY = 0.px, blurRadius = 10.px))
+		property("-webkit-background-clip", BackgroundClip.Text)
+		property("-webkit-text-fill-color", Color.transparent)
 	}
 
 	val intro by style {
@@ -259,7 +259,7 @@ object BlogPageStyle : StyleSheet() {
 	val searchWrapper by style {
 		alignItems(AlignItems.Center)
 		backgroundColor(Color("#1A1225"))
-		border(2.px, LineStyle.Solid, Color("transparent"))
+		border(2.px, LineStyle.Solid, Color.transparent)
 		borderRadius(2.cssRem)
 		color(Color("#FFFFFFB0"))
 		display(DisplayStyle.Flex)
@@ -284,16 +284,16 @@ object BlogPageStyle : StyleSheet() {
 
 	@OptIn(ExperimentalComposeWebApi::class)
 	val searchInput by style {
-		backgroundColor(Color("transparent"))
+		backgroundColor(Color.transparent)
 		borderStyle(LineStyle.None)
-		color("inherit")
+		color(CSSColor.Inherit)
 		padding(0.px)
-		outline("none")
+		outlineStyle(LineStyle.None)
 		paddingLeft(0.75.cssRem)
 		width(100.percent)
 
 		focus style {
-			outline("none")
+			outlineStyle(LineStyle.None)
 			borderColor(Color("#FFFFFF80"))
 			backgroundColor(Color("#FFFFFF15"))
 			boxShadow(0.px, 0.px, 10.px, 0.px, Color("#FFFFFF20"))
@@ -332,7 +332,7 @@ object BlogPageStyle : StyleSheet() {
 		border {
 			width(1.px)
 			style(LineStyle.Solid)
-			color(Color("transparent"))
+			color(Color.transparent)
 		}
 		property("background", """
 			linear-gradient(#1A1225, #1A1225) padding-box,
@@ -362,7 +362,7 @@ object BlogPageStyle : StyleSheet() {
 
 	val tagSelected by style {
 		backgroundColor(Color("#1A1225"))
-		border(2.px, LineStyle.Solid, Color("transparent"))
+		border(2.px, LineStyle.Solid, Color.transparent)
 		property("background", """
 			linear-gradient(#1A1225, #1A1225) padding-box,
 			linear-gradient(45deg, #FF0080, #00D4FF) border-box
@@ -395,7 +395,7 @@ object BlogPageStyle : StyleSheet() {
 		cursor(Cursor.Pointer)
 
 		focus style {
-			outline("none")
+			outlineStyle(LineStyle.None)
 			borderColor(Color("#FFFFFF80"))
 		}
 
@@ -409,7 +409,7 @@ object BlogPageStyle : StyleSheet() {
 		color(Color("#FFFFFF80"))
 		fontSize(0.9.cssRem)
 		marginBottom(1.cssRem)
-		fontStyle("italic")
+		fontStyle(FontStyle.Italic)
 	}
 
 	val noResults by style {