feat: adjust button colours on dark background

This commit is contained in:
Björn Fromme
2025-06-23 11:14:05 +02:00
parent 62864c24ef
commit ef62ecd376
7 changed files with 18 additions and 6 deletions
@@ -42,6 +42,18 @@
@apply suz:bg-suz-primary;
@apply uch:bg-uch-primary;
@apply ser:bg-ser-secondary;
@apply hover:bg-ep-primary-dark hover:text-white;
@apply sbw:hover:bg-sbw-primary-dark;
@apply snz:hover:bg-snz-primary-dark;
@apply suz:hover:bg-suz-primary-dark;
@apply uch:hover:bg-uch-primary-dark;
@apply ser:hover:bg-ser-primary;
@apply peer-hover:bg-ep-primary-dark peer-hover:text-white;
@apply sbw:peer-hover:bg-sbw-primary-dark;
@apply snz:peer-hover:bg-snz-primary-dark;
@apply suz:peer-hover:bg-suz-primary-dark;
@apply uch:peer-hover:bg-uch-primary-dark;
@apply ser:peer-hover:bg-ser-primary;
}
&--muted {
@@ -45,7 +45,7 @@
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 lg:gap-8">
<f:for each="{data.flexForm.buttons}" as="button">
<f:link.typolink parameter="{button.container.link}"
class="button bg-button shadow-lg">
class="button bg-button--secondary shadow-lg">
{button.container.label}
</f:link.typolink>
</f:for>
@@ -25,7 +25,7 @@
<div class="flex flex-col space-y-4 md:flex-row md:items-center md:space-y-0 md:space-x-4">
<f:for each="{data.flexForm.buttons}" as="button" iteration="iteration">
<f:if condition="{iteration.cycle} <= 3">
<f:link.typolink parameter="{button.container.link}" class="button bg-button shadow-lg">
<f:link.typolink parameter="{button.container.link}" class="button bg-button--secondary shadow-lg">
{button.container.label}
</f:link.typolink>
</f:if>
@@ -46,7 +46,7 @@
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 lg:gap-8">
<f:for each="{data.flexForm.buttons}" as="button">
<f:link.typolink parameter="{button.container.link}"
class="button bg-button shadow-lg">
class="button bg-button--secondary shadow-lg">
{button.container.label}
</f:link.typolink>
</f:for>
@@ -12,7 +12,7 @@
</div>
<div>
{data.flexForm.buttons -> v:iterator.first() -> v:variable.set(name: 'button')}
<a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info">
<a href="{f:uri.typolink(parameter: button.container.link)}" class="button bg-button--secondary">
{button.container.label -> f:format.raw()}
</a>
</div>
@@ -25,7 +25,7 @@
<div class="flex flex-col space-y-4 md:flex-row md:items-center md:space-y-0 md:space-x-4">
<f:for each="{data.flexForm.buttons}" as="button" iteration="iteration">
<f:if condition="{iteration.cycle} <= 3">
<f:link.typolink parameter="{button.container.link}" class="button bg-button shadow-lg">
<f:link.typolink parameter="{button.container.link}" class="button bg-button--secondary shadow-lg">
{button.container.label}
</f:link.typolink>
</f:if>
@@ -35,7 +35,7 @@
<f:if condition="{slide.button}">
<f:link.typolink parameter="{slide.page_uid}"
additionalAttributes="{'tabindex': '-1'}"
class="button bg-button inline-block">
class="button bg-button--secondary inline-block">
{slide.button}
</f:link.typolink>
</f:if>