lukeonline - commit aa65779

diff --git a/src/components/Header.astro b/src/components/Header.astro index 72796df..6060fae 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -1,11 +1,9 @@ --- +import { BUTTON_STYLING_SHARED } from '../consts.ts' const { title } = Astro.props const linkStyling = - 'border-solid border-1 border-gray-300' + - ' bg-gray-50 p-1 pl-2 hover:text-blue-500 grow' + - ' hover:underline focus:bg-blue-50 focus:rounded hover:bg-gray-200' + - ' items-center gap-3' + BUTTON_STYLING_SHARED + ' h-8 p-1 pl-2 grow items-center gap-3' --- <header class="flex flex-col gap-2"> diff --git a/src/components/IconButton.astro b/src/components/IconButton.astro index 7bdead9..80f6ae9 100644 --- a/src/components/IconButton.astro +++ b/src/components/IconButton.astro @@ -1,11 +1,8 @@ --- +import { BUTTON_STYLING_SHARED } from '../consts.ts' const { image, link } = Astro.props -const buttonStyling = - 'border-solid border-1 border-gray-300' + - ' bg-gray-50 flex flex-row gap-1 p-2 hover:text-blue-500' + - ' hover:underline focus:bg-blue-50 focus:rounded hover:bg-gray-200' + - ' items-center gap-3' +const buttonStyling = BUTTON_STYLING_SHARED + ' flex-row items-center gap-3' --- <a href={link} class={buttonStyling}> diff --git a/src/components/LargeButton.astro b/src/components/LargeButton.astro index cbbea04..f82b44c 100644 --- a/src/components/LargeButton.astro +++ b/src/components/LargeButton.astro @@ -1,10 +1,8 @@ --- +import { BUTTON_STYLING_SHARED } from '../consts.ts' const { image, title, desc, link } = Astro.props -const buttonStyling = - 'border-solid border-1 border-gray-300' + - ' bg-gray-50 flex flex-col gap-1 p-2 hover:text-blue-500' + - ' hover:underline focus:bg-blue-50 focus:rounded hover:bg-gray-200' +const buttonStyling = BUTTON_STYLING_SHARED + ' flex-col ' --- <a href={link} class={buttonStyling}> diff --git a/src/components/Webring.astro b/src/components/Webring.astro index de3b4ab..1a8f2ed 100644 --- a/src/components/Webring.astro +++ b/src/components/Webring.astro @@ -1,9 +1,7 @@ --- -const buttonStyling = - 'border-solid border-1 border-gray-300' + - ' bg-gray-50 flex flex-row gap-1 p-2 h-8 hover:text-blue-500' + - ' hover:underline focus:bg-blue-50 focus:rounded hover:bg-gray-200' + - ' items-center gap-2' +import { BUTTON_STYLING_SHARED } from '../consts.ts' + +const buttonStyling = BUTTON_STYLING_SHARED + ' flex-row h-8 items-center gap-2' --- <div class="flex flex-row gap-2"> diff --git a/src/consts.ts b/src/consts.ts index 3e2f55f..52e3b0a 100644 --- a/src/consts.ts +++ b/src/consts.ts @@ -1 +1,6 @@ export const SITE_TITLE = 'lukeonline' + +export const BUTTON_STYLING_SHARED = + 'border-solid border-1 border-gray-300' + + ' bg-gray-50 flex gap-1 p-2 hover:text-blue-500' + + ' hover:underline focus:bg-blue-50 focus:rounded hover:bg-gray-200'