use 'dark' class locally in header, hero or custom sections. adapt dark styles.

This commit is contained in:
2023-11-08 14:32:14 +01:00
parent 2133aabfb9
commit e3c547979a
9 changed files with 102 additions and 46 deletions

View File

@@ -7,9 +7,11 @@
}
.btn-primary {
@apply border-primary bg-primary dark:border-darkmode-primary dark:text-dark text-white dark:bg-white;
@apply border-primary text-white bg-primary
dark:border-darkmode-primary dark:text-dark dark:bg-white;
}
.btn-outline-primary {
@apply border-dark text-dark hover:bg-dark dark:hover:text-dark bg-transparent hover:text-white dark:border-white dark:text-white dark:hover:bg-white;
@apply text-dark bg-transparent border-dark hover:bg-dark hover:text-white
dark:text-white dark:border-white dark:hover:text-dark dark:hover:bg-white;
}

View File

@@ -1,7 +1,7 @@
{{ define "main" }}
<!-- Banner -->
{{ with .Params.banner }}
<section class="section pt-14">
<section class="section pt-14 hero {{ with .class }}{{ . }}{{ end }}">
<div class="container">
<div class="row justify-center">
<div class="lg:col-7 mb-8 text-center">
@@ -31,7 +31,7 @@
<!-- Features -->
{{ range $i, $e:= .Params.features }}
<section class="section-sm {{ with .class }}{{ . }}{{ end }} {{ if (modBool $i 2) }}bg-gradient{{ end }}">
<section class="section-sm sn-{{ add $i 1 }} {{ with .class }}{{ . }}{{ end }}">
<div class="container">
<div class="row items-center justify-between">
<div

View File

@@ -1,3 +1,4 @@
<div class="dark">
<footer class="bg-theme-light dark:bg-darkmode-theme-light">
<div class="container">
<div class="row items-center py-10">
@@ -55,3 +56,4 @@
</div>
</div>
</footer>
</div>

View File

@@ -1,5 +1,5 @@
<header
class="header {{ if site.Params.navbar_fixed }}sticky top-0{{ end }} z-30">
class="header dark {{ if site.Params.navbar_fixed }}sticky top-0{{ end }} z-30">
<nav class="navbar container">
<!-- logo -->
<div class="order-0">
@@ -126,7 +126,7 @@
{{ if site.Params.navigation_button.enable }}
<a
href="{{ site.Params.navigation_button.link | relLangURL }}"
class="btn btn-outline-primary btn-sm hidden lg:inline-block">
class="btn btn-primary btn-sm hidden lg:inline-block">
{{ site.Params.navigation_button.label }}
</a>
{{ end }}