mirror of
https://github.com/10h30/astroplate.git
synced 2026-07-11 18:56:06 +09:00
update theme variable
This commit is contained in:
+18
-7
@@ -5,20 +5,28 @@
|
||||
"primary": "#121212",
|
||||
"body": "#fff",
|
||||
"border": "#eaeaea",
|
||||
"theme_light": "#f6f6f6",
|
||||
"theme_dark": ""
|
||||
"light": "#f6f6f6",
|
||||
"dark": "#040404"
|
||||
},
|
||||
"text_color": { "text": "#444444", "dark": "#040404", "light": "#717171" }
|
||||
"text_color": {
|
||||
"text": "#444444",
|
||||
"text-dark": "#040404",
|
||||
"text-light": "#717171"
|
||||
}
|
||||
},
|
||||
"darkmode": {
|
||||
"theme_color": {
|
||||
"primary": "#fff",
|
||||
"body": "#1c1c1c",
|
||||
"border": "#3E3E3E",
|
||||
"theme_light": "#222222",
|
||||
"theme_dark": ""
|
||||
"light": "#222222",
|
||||
"dark": "#fff"
|
||||
},
|
||||
"text_color": { "text": "#B4AFB6", "dark": "#fff", "light": "#B4AFB6" }
|
||||
"text_color": {
|
||||
"text": "#B4AFB6",
|
||||
"text-dark": "#fff",
|
||||
"text-light": "#B4AFB6"
|
||||
}
|
||||
}
|
||||
},
|
||||
"fonts": {
|
||||
@@ -28,6 +36,9 @@
|
||||
"secondary": "Signika:wght@500;700",
|
||||
"secondary_type": "sans-serif"
|
||||
},
|
||||
"font_size": { "base": "16", "scale": "1.2" }
|
||||
"font_size": {
|
||||
"base": "16",
|
||||
"scale": "1.2"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -6,9 +6,9 @@ import { getSinglePage } from "@/lib/contentParser.astro";
|
||||
import dateFormat from "@/lib/utils/dateFormat";
|
||||
import similarItems from "@/lib/utils/similarItems";
|
||||
import { humanize, markdownify, slugify } from "@/lib/utils/textConverter";
|
||||
import { render } from "astro:content";
|
||||
import { FaRegClock, FaRegFolder, FaRegUserCircle } from "react-icons/fa";
|
||||
import ImageMod from "./components/ImageMod.astro";
|
||||
import { render } from "astro:content";
|
||||
|
||||
const COLLECTION_FOLDER = "blog";
|
||||
const { post } = Astro.props;
|
||||
@@ -72,7 +72,7 @@ const { title, description, author, categories, image, date, tags } = post.data;
|
||||
tags.map((tag: string) => (
|
||||
<li class="inline-block">
|
||||
<a
|
||||
class="m-1 block rounded bg-theme-light px-3 py-1 hover:bg-primary hover:text-white dark:bg-darkmode-theme-light dark:hover:bg-darkmode-primary dark:hover:text-dark"
|
||||
class="m-1 block rounded bg-light px-3 py-1 hover:bg-primary hover:text-white dark:bg-darkmode-light dark:hover:bg-darkmode-primary dark:hover:text-text-dark"
|
||||
href={`/tags/${slugify(tag)}`}
|
||||
>
|
||||
{humanize(tag)}
|
||||
|
||||
@@ -7,9 +7,7 @@ const { data } = Astro.props;
|
||||
const { title, image, social } = data.data;
|
||||
---
|
||||
|
||||
<div
|
||||
class="rounded bg-theme-light p-8 text-center dark:bg-darkmode-theme-light"
|
||||
>
|
||||
<div class="rounded bg-light p-8 text-center dark:bg-darkmode-light">
|
||||
{
|
||||
image && (
|
||||
<ImageMod
|
||||
|
||||
@@ -34,7 +34,9 @@ paths.forEach((label: string, i: number) => {
|
||||
{label}
|
||||
</a>
|
||||
) : (
|
||||
<span class="text-light dark:text-darkmode-light">{label}</span>
|
||||
<span class="text-text-light dark:text-darkmode-text-light">
|
||||
{label}
|
||||
</span>
|
||||
)}
|
||||
</li>
|
||||
))
|
||||
|
||||
@@ -30,7 +30,7 @@ for (let i = 1; i <= totalPages; i++) {
|
||||
? `${section ? "/" + section : "/"}`
|
||||
: `${section ? "/" + section : ""}/page/${currentPage - 1}`
|
||||
}
|
||||
class="rounded px-2 py-1.5 text-dark hover:bg-theme-light dark:text-darkmode-dark dark:hover:bg-darkmode-theme-light"
|
||||
class="rounded px-2 py-1.5 text-text-dark hover:bg-light dark:text-darkmode-text-dark dark:hover:bg-darkmode-light"
|
||||
>
|
||||
<span class="sr-only">Previous</span>
|
||||
<svg
|
||||
@@ -48,7 +48,7 @@ for (let i = 1; i <= totalPages; i++) {
|
||||
</svg>
|
||||
</a>
|
||||
) : (
|
||||
<span class="rounded px-2 py-1.5 text-light">
|
||||
<span class="rounded px-2 py-1.5 text-text-light">
|
||||
<span class="sr-only">Previous</span>
|
||||
<svg
|
||||
viewBox="0 0 20 20"
|
||||
@@ -71,7 +71,7 @@ for (let i = 1; i <= totalPages; i++) {
|
||||
pagination === currentPage ? (
|
||||
<span
|
||||
aria-current="page"
|
||||
class="rounded bg-primary px-4 py-2 text-white dark:bg-darkmode-primary dark:text-dark"
|
||||
class="rounded bg-primary px-4 py-2 text-white dark:bg-darkmode-primary dark:text-text-dark"
|
||||
>
|
||||
{pagination}
|
||||
</span>
|
||||
@@ -83,7 +83,7 @@ for (let i = 1; i <= totalPages; i++) {
|
||||
: `${section ? "/" + section : ""}/page/${pagination}`
|
||||
}
|
||||
aria-current="page"
|
||||
class="rounded px-4 py-2 text-dark hover:bg-theme-light dark:text-darkmode-dark dark:hover:bg-darkmode-theme-light"
|
||||
class="rounded px-4 py-2 text-text-dark hover:bg-light dark:text-darkmode-text-dark dark:hover:bg-darkmode-light"
|
||||
>
|
||||
{pagination}
|
||||
</a>
|
||||
@@ -94,7 +94,7 @@ for (let i = 1; i <= totalPages; i++) {
|
||||
{hasNextPage ? (
|
||||
<a
|
||||
href={`${section ? "/" + section : ""}/page/${currentPage + 1}`}
|
||||
class="rounded px-2 py-1.5 text-dark hover:bg-theme-light dark:text-darkmode-dark dark:hover:bg-darkmode-theme-light"
|
||||
class="rounded px-2 py-1.5 text-text-dark hover:bg-light dark:text-darkmode-text-dark dark:hover:bg-darkmode-light"
|
||||
>
|
||||
<span class="sr-only">Next</span>
|
||||
<svg
|
||||
@@ -112,7 +112,7 @@ for (let i = 1; i <= totalPages; i++) {
|
||||
</svg>
|
||||
</a>
|
||||
) : (
|
||||
<span class="rounded px-2 py-1.5 text-light">
|
||||
<span class="rounded px-2 py-1.5 text-text-light">
|
||||
<span class="sr-only">Next</span>
|
||||
<svg
|
||||
viewBox="0 0 20 20"
|
||||
|
||||
@@ -8,7 +8,7 @@ const { call_to_action } = Astro.props;
|
||||
call_to_action.data.enable && (
|
||||
<section class="mb-28">
|
||||
<div class="container">
|
||||
<div class="rounded-xl bg-theme-light px-4 py-16 dark:bg-darkmode-theme-light xl:p-20">
|
||||
<div class="rounded-xl bg-light px-4 py-16 dark:bg-darkmode-light xl:p-20">
|
||||
<div class="row items-center justify-between">
|
||||
<div class="mb-10 md:col-5 lg:col-4 md:order-2 md:mb-0">
|
||||
<ImageMod
|
||||
|
||||
@@ -9,7 +9,7 @@ import { markdownify } from "@/lib/utils/textConverter";
|
||||
const { footer }: { footer: { name: string; url: string }[] } = menu;
|
||||
---
|
||||
|
||||
<footer class="bg-theme-light dark:bg-darkmode-theme-light">
|
||||
<footer class="bg-light dark:bg-darkmode-light">
|
||||
<div class="container">
|
||||
<div class="row items-center py-10">
|
||||
<div class="mb-8 text-center lg:col-3 lg:mb-0 lg:text-left">
|
||||
@@ -32,7 +32,9 @@ const { footer }: { footer: { name: string; url: string }[] } = menu;
|
||||
</div>
|
||||
</div>
|
||||
<div class="border-t border-border py-7 dark:border-darkmode-border">
|
||||
<div class="container text-center text-light dark:text-darkmode-light">
|
||||
<div
|
||||
class="container text-center text-text-light dark:text-darkmode-text-light"
|
||||
>
|
||||
<p set:html={markdownify(config.params.copyright)} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -32,7 +32,7 @@ const { pathname } = Astro.url;
|
||||
<input id="nav-toggle" type="checkbox" class="hidden" />
|
||||
<label
|
||||
for="nav-toggle"
|
||||
class="order-3 cursor-pointer flex items-center lg:hidden text-dark dark:text-white lg:order-1"
|
||||
class="order-3 cursor-pointer flex items-center lg:hidden text-text-dark dark:text-white lg:order-1"
|
||||
>
|
||||
<svg id="show-button" class="h-6 fill-current block" viewBox="0 0 20 20">
|
||||
<title>Menu Open</title>
|
||||
@@ -121,7 +121,7 @@ const { pathname } = Astro.url;
|
||||
{
|
||||
settings.search && (
|
||||
<button
|
||||
class="border-border text-dark hover:text-primary dark:border-darkmode-border mr-5 inline-block border-r pr-5 text-xl dark:text-white dark:hover:text-darkmode-primary"
|
||||
class="border-border text-text-dark hover:text-primary dark:border-darkmode-border mr-5 inline-block border-r pr-5 text-xl dark:text-white dark:hover:text-darkmode-primary"
|
||||
aria-label="search"
|
||||
data-search-trigger
|
||||
>
|
||||
|
||||
@@ -8,7 +8,7 @@ const { title = "" }: { title?: string } = Astro.props;
|
||||
<section>
|
||||
<div class="container text-center">
|
||||
<div
|
||||
class="rounded-2xl bg-gradient-to-b from-body to-theme-light px-8 py-14 dark:from-darkmode-body dark:to-darkmode-theme-light"
|
||||
class="rounded-2xl bg-gradient-to-b from-body to-light px-8 py-14 dark:from-darkmode-body dark:to-darkmode-light"
|
||||
>
|
||||
<h1 set:text={humanize(title)} />
|
||||
<Breadcrumbs className="mt-6" />
|
||||
|
||||
@@ -8,7 +8,7 @@ const { tags, categories, allCategories } = Astro.props;
|
||||
<!-- categories -->
|
||||
<div class="mb-8">
|
||||
<h5 class="mb-6">Categories</h5>
|
||||
<div class="rounded bg-theme-light p-8 dark:bg-darkmode-theme-light">
|
||||
<div class="rounded bg-light p-8 dark:bg-darkmode-light">
|
||||
<ul class="space-y-4">
|
||||
{
|
||||
categories.map((category: any) => {
|
||||
@@ -33,14 +33,14 @@ const { tags, categories, allCategories } = Astro.props;
|
||||
<!-- tags -->
|
||||
<div class="mb-8">
|
||||
<h5 class="mb-6">Tags</h5>
|
||||
<div class="rounded bg-theme-light p-6 dark:bg-darkmode-theme-light">
|
||||
<div class="rounded bg-light p-6 dark:bg-darkmode-light">
|
||||
<ul>
|
||||
{
|
||||
tags.map((tag: any) => {
|
||||
return (
|
||||
<li class="inline-block">
|
||||
<a
|
||||
class="m-1 block rounded bg-white px-3 py-1 hover:bg-primary hover:text-white dark:bg-darkmode-body dark:hover:bg-darkmode-primary dark:hover:text-dark"
|
||||
class="m-1 block rounded bg-white px-3 py-1 hover:bg-primary hover:text-white dark:bg-darkmode-body dark:hover:bg-darkmode-primary dark:hover:text-text-dark"
|
||||
href={`/tags/${tag}`}
|
||||
>
|
||||
{humanize(tag)}
|
||||
|
||||
@@ -24,8 +24,8 @@ const { testimonial } = Astro.props;
|
||||
designation: string;
|
||||
}) => (
|
||||
<div class="swiper-slide">
|
||||
<div class="rounded-lg bg-theme-light px-7 py-10 dark:bg-darkmode-theme-light">
|
||||
<div class="text-dark dark:text-white">
|
||||
<div class="rounded-lg bg-light px-7 py-10 dark:bg-darkmode-light">
|
||||
<div class="text-text-dark dark:text-white">
|
||||
<svg
|
||||
width="33"
|
||||
height="20"
|
||||
@@ -44,7 +44,7 @@ const { testimonial } = Astro.props;
|
||||
set:html={markdownify(item.content)}
|
||||
/>
|
||||
<div class="mt-11 flex items-center">
|
||||
<div class="text-dark dark:text-white">
|
||||
<div class="text-text-dark dark:text-white">
|
||||
<ImageMod
|
||||
height={50}
|
||||
width={50}
|
||||
@@ -61,13 +61,13 @@ const { testimonial } = Astro.props;
|
||||
/>
|
||||
<p
|
||||
set:text={item.designation}
|
||||
class="text-dark dark:text-white"
|
||||
class="text-text-dark dark:text-white"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
),
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
<div class="testimonial-slider-pagination mt-9 flex items-center justify-center text-center" />
|
||||
|
||||
+1
-1
@@ -8,7 +8,7 @@ import Base from "@/layouts/Base.astro";
|
||||
<div class="row justify-center">
|
||||
<div class="sm:col-10 md:col-8 lg:col-6">
|
||||
<span
|
||||
class="text-[8rem] block font-bold text-dark dark:text-darkmode-dark"
|
||||
class="text-[8rem] block font-bold text-text-dark dark:text-darkmode-text-dark"
|
||||
>
|
||||
404
|
||||
</span>
|
||||
|
||||
@@ -22,7 +22,7 @@ const allCategories = await getAllTaxonomy(BLOG_FOLDER, "categories");
|
||||
<li class="m-3 inline-block">
|
||||
<a
|
||||
href={`/categories/${category}`}
|
||||
class="block rounded bg-theme-light px-4 py-2 text-xl text-dark dark:bg-darkmode-theme-light dark:text-darkmode-dark"
|
||||
class="block rounded bg-light px-4 py-2 text-xl text-text-dark dark:bg-darkmode-light dark:text-darkmode-text-dark"
|
||||
>
|
||||
{humanize(category)}{" "}
|
||||
<span class="ml-2 rounded bg-body px-2 dark:bg-darkmode-body">
|
||||
|
||||
@@ -22,7 +22,7 @@ const allTags = await getAllTaxonomy(BLOG_FOLDER, "tags");
|
||||
<li class="m-3 inline-block">
|
||||
<a
|
||||
href={`/tags/${tag}`}
|
||||
class="block rounded bg-theme-light px-4 py-2 text-xl text-dark dark:bg-darkmode-theme-light dark:text-darkmode-dark"
|
||||
class="block rounded bg-light px-4 py-2 text-xl text-text-dark dark:bg-darkmode-light dark:text-darkmode-text-dark"
|
||||
>
|
||||
{humanize(tag)}{" "}
|
||||
<span class="ml-2 rounded bg-body px-2 dark:bg-darkmode-body">
|
||||
|
||||
+1
-1
@@ -12,7 +12,7 @@ h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
@apply font-secondary font-bold leading-tight text-dark dark:text-darkmode-dark;
|
||||
@apply font-secondary font-bold leading-tight text-text-dark dark:text-darkmode-text-dark;
|
||||
}
|
||||
|
||||
h1,
|
||||
|
||||
@@ -7,9 +7,9 @@
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply border-primary bg-primary dark:border-darkmode-primary dark:text-dark text-white dark:bg-darkmode-primary;
|
||||
@apply border-primary bg-primary dark:border-darkmode-primary dark:text-text-dark text-white dark:bg-darkmode-primary;
|
||||
}
|
||||
|
||||
.btn-outline-primary {
|
||||
@apply border-dark text-dark hover:bg-dark dark:hover:text-dark bg-transparent hover:text-white dark:border-darkmode-primary dark:text-white dark:hover:bg-darkmode-primary;
|
||||
@apply border-dark text-text-dark hover:bg-dark dark:hover:text-text-dark bg-transparent hover:text-white dark:border-darkmode-primary dark:text-white dark:hover:bg-darkmode-primary;
|
||||
}
|
||||
|
||||
+13
-13
@@ -20,7 +20,7 @@
|
||||
@apply inline-block;
|
||||
}
|
||||
.social-icons li a {
|
||||
@apply flex h-9 w-9 items-center justify-center rounded-sm bg-primary text-center leading-9 text-white dark:bg-darkmode-primary dark:text-dark;
|
||||
@apply flex h-9 w-9 items-center justify-center rounded-sm bg-primary text-center leading-9 text-white dark:bg-darkmode-primary dark:text-text-dark;
|
||||
}
|
||||
.social-icons li a svg {
|
||||
@apply h-5 w-5;
|
||||
@@ -40,7 +40,7 @@
|
||||
}
|
||||
|
||||
.notice-head p {
|
||||
@apply font-secondary text-xl font-semibold text-dark dark:text-darkmode-light;
|
||||
@apply font-secondary text-xl font-semibold text-text-dark dark:text-darkmode-text-light;
|
||||
}
|
||||
|
||||
.notice-body {
|
||||
@@ -77,11 +77,11 @@
|
||||
}
|
||||
|
||||
.tab-nav {
|
||||
@apply flex border-b border-border bg-theme-light dark:border-darkmode-border dark:bg-darkmode-theme-light !m-0 !list-none;
|
||||
@apply flex border-b border-border bg-light dark:border-darkmode-border dark:bg-darkmode-light !m-0 !list-none;
|
||||
}
|
||||
|
||||
.tab-nav-item {
|
||||
@apply cursor-pointer border-b-[3px] border-border py-2 text-lg text-dark opacity-80 dark:border-light !my-0 !px-8;
|
||||
@apply cursor-pointer border-b-[3px] border-border py-2 text-lg text-text-dark opacity-80 dark:border-light !my-0 !px-8;
|
||||
}
|
||||
|
||||
.tab-nav-item.active {
|
||||
@@ -106,11 +106,11 @@
|
||||
|
||||
/* accordion */
|
||||
.accordion {
|
||||
@apply mb-6 overflow-hidden rounded-lg border border-border bg-theme-light dark:border-darkmode-border dark:bg-darkmode-theme-light;
|
||||
@apply mb-6 overflow-hidden rounded-lg border border-border bg-light dark:border-darkmode-border dark:bg-darkmode-light;
|
||||
}
|
||||
|
||||
.accordion-header {
|
||||
@apply flex w-full cursor-pointer items-center justify-between px-8 py-4 text-lg text-dark dark:bg-darkmode-theme-light dark:text-darkmode-light;
|
||||
@apply flex w-full cursor-pointer items-center justify-between px-8 py-4 text-lg text-text-dark dark:bg-darkmode-light dark:text-darkmode-text-light;
|
||||
}
|
||||
|
||||
.accordion-icon {
|
||||
@@ -143,28 +143,28 @@
|
||||
}
|
||||
|
||||
.modal-close {
|
||||
@apply absolute right-3 top-3 h-8 w-8 rounded-full bg-theme-light text-center leading-8 text-dark dark:bg-darkmode-theme-light dark:text-darkmode-dark;
|
||||
@apply absolute right-3 top-3 h-8 w-8 rounded-full bg-light text-center leading-8 text-text-dark dark:bg-darkmode-light dark:text-darkmode-text-dark;
|
||||
}
|
||||
|
||||
/* content style */
|
||||
.content {
|
||||
@apply prose max-w-none;
|
||||
@apply prose-headings:mb-[.3em] prose-headings:mt-[.6em] prose-headings:text-dark dark:prose-headings:text-darkmode-dark;
|
||||
@apply prose-headings:mb-[.3em] prose-headings:mt-[.6em] prose-headings:text-text-dark dark:prose-headings:text-darkmode-text-dark;
|
||||
@apply prose-h1:text-h1-sm md:prose-h1:text-h1;
|
||||
@apply prose-h2:text-h2-sm md:prose-h2:text-h2;
|
||||
@apply prose-h3:text-h3-sm md:prose-h3:text-h3;
|
||||
@apply prose-img:max-w-full prose-img:rounded;
|
||||
@apply prose-hr:border-border dark:prose-hr:border-darkmode-border;
|
||||
@apply prose-p:text-base prose-p:text-text dark:prose-p:text-darkmode-text;
|
||||
@apply prose-blockquote:rounded-lg prose-blockquote:border prose-blockquote:border-l-[10px] prose-blockquote:border-primary prose-blockquote:bg-theme-light prose-blockquote:px-8 prose-blockquote:py-10 prose-blockquote:font-secondary prose-blockquote:text-2xl prose-blockquote:not-italic prose-blockquote:text-dark dark:prose-blockquote:border-darkmode-primary dark:prose-blockquote:bg-darkmode-theme-light dark:prose-blockquote:text-darkmode-light;
|
||||
@apply prose-pre:rounded-lg prose-pre:bg-theme-light dark:prose-pre:bg-darkmode-theme-light;
|
||||
@apply prose-blockquote:rounded-lg prose-blockquote:border prose-blockquote:border-l-[10px] prose-blockquote:border-primary prose-blockquote:bg-light prose-blockquote:px-8 prose-blockquote:py-10 prose-blockquote:font-secondary prose-blockquote:text-2xl prose-blockquote:not-italic prose-blockquote:text-text-dark dark:prose-blockquote:border-darkmode-primary dark:prose-blockquote:bg-darkmode-light dark:prose-blockquote:text-darkmode-text-light;
|
||||
@apply prose-pre:rounded-lg prose-pre:bg-light dark:prose-pre:bg-darkmode-light;
|
||||
@apply prose-code:px-1 prose-code:text-primary dark:prose-code:text-darkmode-primary;
|
||||
@apply prose-strong:text-dark dark:prose-strong:text-darkmode-text;
|
||||
@apply prose-strong:text-text-dark dark:prose-strong:text-darkmode-text;
|
||||
@apply prose-a:text-text prose-a:underline prose-a:hover:text-primary dark:prose-a:text-darkmode-text dark:prose-a:hover:text-darkmode-primary;
|
||||
@apply prose-li:text-text dark:prose-li:text-darkmode-text;
|
||||
@apply prose-table:relative prose-table:overflow-hidden prose-table:rounded-lg prose-table:before:absolute prose-table:before:left-0 prose-table:before:top-0 prose-table:before:h-full prose-table:before:w-full prose-table:before:rounded-[inherit] prose-table:before:border prose-table:before:content-[""] dark:prose-table:before:border-darkmode-border;
|
||||
@apply prose-thead:border-border prose-thead:bg-theme-light dark:prose-thead:border-darkmode-border dark:prose-thead:bg-darkmode-theme-light;
|
||||
@apply prose-th:relative prose-th:z-10 prose-th:px-4 prose-th:py-[18px] prose-th:text-dark dark:prose-th:text-darkmode-text;
|
||||
@apply prose-thead:border-border prose-thead:bg-light dark:prose-thead:border-darkmode-border dark:prose-thead:bg-darkmode-light;
|
||||
@apply prose-th:relative prose-th:z-10 prose-th:px-4 prose-th:py-[18px] prose-th:text-text-dark dark:prose-th:text-darkmode-text;
|
||||
@apply prose-tr:border-border dark:prose-tr:border-darkmode-border;
|
||||
@apply prose-td:relative prose-td:z-10 prose-td:px-3 prose-td:py-[18px] dark:prose-td:text-darkmode-text;
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
@apply text-dark dark:text-darkmode-dark text-xl font-semibold;
|
||||
@apply text-text-dark dark:text-darkmode-text-dark text-xl font-semibold;
|
||||
image {
|
||||
@apply max-h-full max-w-full;
|
||||
}
|
||||
@@ -19,7 +19,7 @@
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
@apply text-dark hover:text-primary dark:text-darkmode-dark dark:hover:text-darkmode-primary block p-3 cursor-pointer font-semibold transition lg:px-2 lg:py-3;
|
||||
@apply text-text-dark hover:text-primary dark:text-darkmode-text-dark dark:hover:text-darkmode-primary block p-3 cursor-pointer font-semibold transition lg:px-2 lg:py-3;
|
||||
}
|
||||
|
||||
.nav-dropdown {
|
||||
@@ -43,7 +43,7 @@
|
||||
}
|
||||
|
||||
.nav-dropdown-link {
|
||||
@apply text-dark hover:text-primary dark:text-darkmode-text dark:hover:text-darkmode-primary block py-1 font-semibold transition;
|
||||
@apply text-text-dark hover:text-primary dark:text-darkmode-text dark:hover:text-darkmode-primary block py-1 font-semibold transition;
|
||||
}
|
||||
|
||||
/* theme-switcher */
|
||||
|
||||
+1
-1
@@ -1,7 +1,7 @@
|
||||
/* swiper pagination */
|
||||
.testimonial-slider-pagination {
|
||||
.swiper-pagination-bullet {
|
||||
@apply h-2.5 w-2.5 bg-theme-light opacity-100 dark:bg-darkmode-theme-light;
|
||||
@apply h-2.5 w-2.5 bg-light opacity-100 dark:bg-darkmode-light;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet-active {
|
||||
|
||||
@@ -14,16 +14,16 @@
|
||||
@apply p-4 relative;
|
||||
}
|
||||
.search-wrapper-header-input {
|
||||
@apply border border-solid w-full focus:ring-0 focus:border-dark border-border rounded-[4px] h-12 pr-4 pl-10 transition duration-200 outline-none dark:bg-darkmode-theme-light dark:text-darkmode-text dark:border-darkmode-border dark:focus:border-darkmode-primary;
|
||||
@apply border border-solid w-full focus:ring-0 focus:border-dark border-border rounded-[4px] h-12 pr-4 pl-10 transition duration-200 outline-none dark:bg-darkmode-light dark:text-darkmode-text dark:border-darkmode-border dark:focus:border-darkmode-primary;
|
||||
}
|
||||
.search-wrapper-body {
|
||||
@apply dark:bg-darkmode-theme-light dark:shadow-none max-h-[calc(100vh-350px)] overflow-y-auto bg-theme-light shadow-[inset_0_2px_18px_#ddd] p-4 rounded;
|
||||
@apply dark:bg-darkmode-light dark:shadow-none max-h-[calc(100vh-350px)] overflow-y-auto bg-light shadow-[inset_0_2px_18px_#ddd] p-4 rounded;
|
||||
}
|
||||
.search-wrapper-footer {
|
||||
@apply text-xs select-none leading-none md:flex items-center px-3.5 py-2 hidden;
|
||||
}
|
||||
.search-wrapper-footer kbd {
|
||||
@apply bg-theme-light dark:bg-darkmode-theme-light text-xs leading-none text-center mr-[3px] px-1 py-0.5 rounded-[3px];
|
||||
@apply bg-light dark:bg-darkmode-light text-xs leading-none text-center mr-[3px] px-1 py-0.5 rounded-[3px];
|
||||
}
|
||||
.search-wrapper-footer span:not(:last-child) {
|
||||
@apply mr-4;
|
||||
@@ -38,7 +38,7 @@
|
||||
@apply mb-4;
|
||||
}
|
||||
.search-result-group-title {
|
||||
@apply text-lg text-dark dark:text-darkmode-dark mb-[5px] px-3;
|
||||
@apply text-lg text-text-dark dark:text-darkmode-text-dark mb-[5px] px-3;
|
||||
}
|
||||
.search-result-item {
|
||||
@apply rounded border bg-white dark:bg-darkmode-body dark:border-darkmode-border flex items-start mb-1 p-4 scroll-my-[30px] border-solid border-border relative;
|
||||
@@ -47,7 +47,7 @@
|
||||
@apply bg-yellow-200 rounded-[2px];
|
||||
}
|
||||
.search-result-item-title {
|
||||
@apply text-lg font-bold text-dark dark:text-darkmode-dark leading-none;
|
||||
@apply text-lg font-bold text-text-dark dark:text-darkmode-text-dark leading-none;
|
||||
}
|
||||
.search-result-item-link::after {
|
||||
@apply absolute top-0 right-0 bottom-0 left-0 z-10 content-[""];
|
||||
@@ -65,7 +65,7 @@
|
||||
@apply mx-0 my-1.5 empty:hidden line-clamp-1;
|
||||
}
|
||||
.search-result-item-taxonomies {
|
||||
@apply text-sm flex flex-wrap items-center text-light dark:text-darkmode-light;
|
||||
@apply text-sm flex flex-wrap items-center text-text-light dark:text-darkmode-text-light;
|
||||
}
|
||||
.search-result-item-taxonomies svg {
|
||||
@apply inline-block mr-1;
|
||||
|
||||
@@ -12,7 +12,7 @@ input#nav-toggle:checked ~ #nav-menu {
|
||||
}
|
||||
|
||||
.bg-gradient {
|
||||
@apply bg-linear-to-b from-[rgba(249,249,249,1)] from-[0.53%] to-white to-[83.28%] dark:from-darkmode-theme-light dark:to-darkmode-body;
|
||||
@apply bg-linear-to-b from-[rgba(249,249,249,1)] from-[0.53%] to-white to-[83.28%] dark:from-darkmode-light dark:to-darkmode-body;
|
||||
}
|
||||
|
||||
.shadow {
|
||||
@@ -21,9 +21,9 @@ input#nav-toggle:checked ~ #nav-menu {
|
||||
|
||||
/* form style */
|
||||
.form-input {
|
||||
@apply w-full rounded border-transparent bg-theme-light px-6 py-4 text-dark placeholder:text-light focus:border-primary dark:focus:border-darkmode-primary focus:ring-transparent dark:border-darkmode-border dark:bg-darkmode-theme-light dark:text-darkmode-light;
|
||||
@apply w-full rounded border-transparent bg-light px-6 py-4 text-text-dark placeholder:text-text-light focus:border-primary dark:focus:border-darkmode-primary focus:ring-transparent dark:border-darkmode-border dark:bg-darkmode-light dark:text-darkmode-text-light;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
@apply mb-4 block font-secondary text-xl font-normal text-dark dark:text-darkmode-light;
|
||||
@apply mb-4 block font-secondary text-xl font-normal text-text-dark dark:text-darkmode-text-light;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user