From 92b8ece1c30dc1dd479fd50de17fcee29664c36c Mon Sep 17 00:00:00 2001
From: Julien Oculi <xdrz.jot.sr@gmail.com>
Date: Mon, 17 Jun 2024 12:06:12 +0200
Subject: [PATCH] refactor(templates): move some css styles to avoid
 duplication

---
 templates/Welcome.tsx     | 25 ++++++++-----------------
 templates/styles/base.tsx | 16 ++++++++++++++++
 2 files changed, 24 insertions(+), 17 deletions(-)

diff --git a/templates/Welcome.tsx b/templates/Welcome.tsx
index 76afbb2..698616a 100644
--- a/templates/Welcome.tsx
+++ b/templates/Welcome.tsx
@@ -12,7 +12,14 @@ import {
 import { Signature } from './components/Signature.tsx'
 import type { Template } from '../types.ts'
 import type { JSX } from 'preact'
-import { bodyCss, messageCss, rootCss, textCss } from './styles/base.tsx'
+import {
+	bodyCss,
+	buttonCss,
+	headingCss,
+	messageCss,
+	rootCss,
+	textCss,
+} from './styles/base.tsx'
 import { BaseStyle } from './styles/base.tsx'
 
 function Welcome(
@@ -104,14 +111,6 @@ function Welcome(
 	)
 }
 
-const headingCss: JSX.CSSProperties = {
-	fontFamily: 'Garamond, serif',
-	color: rootCss.accentColor,
-	textAlign: 'center',
-	margin: '-1rem 0 3rem',
-	fontSize: '2.5rem',
-}
-
 const preCss: JSX.CSSProperties = {
 	fontFamily: 'monospace',
 	fontSize: '1rem',
@@ -120,14 +119,6 @@ const preCss: JSX.CSSProperties = {
 	backgroundColor: rootCss.backgroundColor,
 }
 
-const buttonCss: JSX.CSSProperties = {
-	color: 'white',
-	padding: '1rem',
-	borderRadius: '0.4rem',
-	fontSize: '1.2rem',
-	backgroundColor: rootCss.accentColor,
-}
-
 const imgCss: JSX.CSSProperties = {
 	display: 'inline',
 	padding: '1rem',
diff --git a/templates/styles/base.tsx b/templates/styles/base.tsx
index 01e9302..cabedd5 100644
--- a/templates/styles/base.tsx
+++ b/templates/styles/base.tsx
@@ -19,10 +19,26 @@ export const messageCss: JSX.CSSProperties = {
 	textWrap: 'balance',
 }
 
+export const headingCss: JSX.CSSProperties = {
+	fontFamily: 'Garamond, serif',
+	color: rootCss.accentColor,
+	textAlign: 'center',
+	margin: '-1rem 0 3rem',
+	fontSize: '2.5rem',
+}
+
 export const textCss: JSX.CSSProperties = {
 	fontSize: '1rem',
 }
 
+export const buttonCss: JSX.CSSProperties = {
+	color: 'white',
+	padding: '1rem',
+	borderRadius: '0.4rem',
+	fontSize: '1.2rem',
+	backgroundColor: rootCss.accentColor,
+}
+
 export const rawCss = `
 	a {
 		color: ${rootCss.accentColor};