1
0
Fork 0

update ui

This commit is contained in:
nanxiaobei 2023-06-02 18:43:49 +08:00
parent df66f99fcd
commit c0d5285fa0
3 changed files with 35 additions and 38 deletions

View file

@ -1162,16 +1162,6 @@ body {
margin-bottom: 2.5rem; margin-bottom: 2.5rem;
} }
.my-2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.my-2\.5 {
margin-top: 0.625rem;
margin-bottom: 0.625rem;
}
.-mr-8 { .-mr-8 {
margin-right: -2rem; margin-right: -2rem;
} }
@ -1192,10 +1182,6 @@ body {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.mb-2\.5 {
margin-bottom: 0.625rem;
}
.mb-20 { .mb-20 {
margin-bottom: 5rem; margin-bottom: 5rem;
} }
@ -1212,8 +1198,8 @@ body {
margin-left: 0.375rem; margin-left: 0.375rem;
} }
.ml-6 { .ml-4 {
margin-left: 1.5rem; margin-left: 1rem;
} }
.ml-auto { .ml-auto {
@ -1244,6 +1230,10 @@ body {
margin-top: 6rem; margin-top: 6rem;
} }
.mt-3 {
margin-top: 0.75rem;
}
.block { .block {
display: block; display: block;
} }
@ -1473,16 +1463,15 @@ body {
line-height: 2rem; line-height: 2rem;
} }
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.text-9xl { .text-9xl {
font-size: 8rem; font-size: 8rem;
line-height: 1; line-height: 1;
} }
.text-\[0\.8rem\] {
font-size: 0.8rem;
}
.text-\[0\.9em\] { .text-\[0\.9em\] {
font-size: 0.9em; font-size: 0.9em;
} }
@ -1491,6 +1480,10 @@ body {
font-size: 0; font-size: 0;
} }
.text-\[1\.6rem\] {
font-size: 1.6rem;
}
.text-lg { .text-lg {
font-size: 1.125rem; font-size: 1.125rem;
line-height: 1.75rem; line-height: 1.75rem;
@ -1501,15 +1494,14 @@ body {
line-height: 1.25rem; line-height: 1.25rem;
} }
.text-xs {
font-size: 0.75rem;
line-height: 1rem;
}
.font-bold { .font-bold {
font-weight: 700; font-weight: 700;
} }
.font-medium {
font-weight: 500;
}
.font-semibold { .font-semibold {
font-weight: 600; font-weight: 600;
} }
@ -1526,8 +1518,13 @@ body {
line-height: 5rem; line-height: 5rem;
} }
.tracking-wide { .tracking-wider {
letter-spacing: 0.025em; letter-spacing: 0.05em;
}
.text-\[\#ff3b2d\] {
--tw-text-opacity: 1;
color: rgb(255 59 45 / var(--tw-text-opacity));
} }
.text-black { .text-black {
@ -1547,9 +1544,9 @@ body {
opacity: 0.7; opacity: 0.7;
} }
.shadow-xl { .shadow-sm {
--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
} }
@ -1581,7 +1578,7 @@ body {
content: var(--tw-content); content: var(--tw-content);
} }
:is(.dark .btn-menu)::before,:is(.dark :is(.dark .btn-menu)::before,:is(.dark
.btn-menu)::after { .btn-menu)::after {
--tw-invert: invert(100%); --tw-invert: invert(100%);
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);

View file

@ -23,7 +23,7 @@
<div class="-mt-2 mb-20 flex items-center"> <div class="-mt-2 mb-20 flex items-center">
{{ if $avatar_url }} {{ if $avatar_url }}
<div <div
class="mr-5 shrink-0 rounded-full border-[0.5px] border-black/10 bg-white/50 p-3 shadow-xl dark:bg-white/80" class="mr-5 shrink-0 rounded-full border-[0.5px] border-black/10 bg-white/50 p-3 shadow-sm dark:bg-white/80"
> >
<img <img
class="my-0 aspect-square w-16 rounded-full !bg-black/5 hover:animate-spin dark:!bg-black/80" class="my-0 aspect-square w-16 rounded-full !bg-black/5 hover:animate-spin dark:!bg-black/80"
@ -34,7 +34,7 @@
{{ end }}<!----> {{ end }}<!---->
{{ if site.Params.name }} {{ if site.Params.name }}
<div> <div>
<h1 class="my-2.5 text-3xl font-bold">{{ site.Params.name }}</h1> <h1 class="mb-2 mt-3 text-[1.6rem] font-bold">{{ site.Params.name }}</h1>
<div class="break-words"> <div class="break-words">
{{ site.Params.bio | default (print `A personal blog by ` {{ site.Params.bio | default (print `A personal blog by `
site.Params.name) }} site.Params.name) }}
@ -49,11 +49,11 @@
<section class="relative my-10 first-of-type:mt-0 last-of-type:mb-0"> <section class="relative my-10 first-of-type:mt-0 last-of-type:mb-0">
{{ if gt .Weight 0 }} {{ if gt .Weight 0 }}
<span <span
class="mb-2.5 inline-block text-xs font-semibold uppercase tracking-wide opacity-70" class="mb-2 inline-block text-[0.8rem] font-medium uppercase tracking-wider text-[#ff3b2d] opacity-70"
>Featured</span >Featured</span
> >
{{ end }} {{ end }}
<h2 class="!my-0 pb-1 !leading-none">{{ .Title }}</h2> <h2 class="!my-0 pb-1 font-bold !leading-none">{{ .Title }}</h2>
<time class="text-sm opacity-60" <time class="text-sm opacity-60"
>{{ .Date | time.Format ":date_medium" }}</time >{{ .Date | time.Format ":date_medium" }}</time
> >

View file

@ -1,12 +1,12 @@
<header class="mx-auto flex h-[5rem] max-w-3xl px-8 lg:justify-center"> <header class="mx-auto flex h-[5rem] max-w-3xl px-8 lg:justify-center">
<div class="relative z-50 mr-auto flex items-center"> <div class="relative z-50 mr-auto flex items-center">
<a <a
class="-translate-x-[1px] -translate-y-0.5 text-3xl font-bold" class="-translate-x-[1px] -translate-y-0.5 text-2xl font-semibold"
href="{{ `/` | absURL }}" href="{{ `/` | absURL }}"
>{{ site.Title }}</a >{{ site.Title }}</a
> >
<div <div
class="btn-dark text-[0] ml-6 h-6 w-6 shrink-0 cursor-pointer {{ if site.Params.monoDarkIcon }}[background:url(./theme.svg)_left_center/cover_no-repeat] dark:invert{{ else }}[background:url(./theme.png)_left_center/_auto_theme('spacing.6')_no-repeat] [transition:_background-position_0.4s_steps(5)]{{ end }} dark:[background-position:right]" class="btn-dark text-[0] ml-4 h-6 w-6 shrink-0 cursor-pointer {{ if site.Params.monoDarkIcon }}[background:url(./theme.svg)_left_center/cover_no-repeat] dark:invert{{ else }}[background:url(./theme.png)_left_center/_auto_theme('spacing.6')_no-repeat] [transition:_background-position_0.4s_steps(5)]{{ end }} dark:[background-position:right]"
role="button" role="button"
aria-label="Dark" aria-label="Dark"
></div> ></div>