1
0
mirror of https://github.com/Damillora/Yuika synced 2024-11-22 09:17:33 +00:00

Theme tweaks

This commit is contained in:
Damillora 2020-06-16 17:47:02 +07:00
parent 36d8fb6dcb
commit 80a1d7ef6f
3 changed files with 65 additions and 36 deletions

View File

@ -16,13 +16,23 @@ header {
@apply transition-bg;
}
.index-navbar header {
@apply transition-bg;
background-color: transparent;
}
.index-navbar:hover header {
@apply bg-yuika-blue-700 transition-bg;
}
.index-header {
min-height: 300px;
height: 50vh;
}
@screen md {
.index-header {
height: 70vh;
}
}
.no-image {
@apply bg-yuika-blue-500
}
@ -65,7 +75,7 @@ header {
@apply border-l-4 border-yuika-blue-700 pl-8;
}
#post pre {
@apply bg-gray-200 text-yuika-blue-700 px-2 py-2 border border-yuika-blue-500;
@apply bg-gray-200 text-yuika-blue-700 px-2 py-2 px-2 border border-yuika-blue-500;
}
#post .kg-card {
@apply py-4 flex flex-col items-center object-contain my-4 mx-0;
@ -165,7 +175,7 @@ footer {
line-height: 2rem;
}
.nav li:hover {
@apply bg-yuika-blue-700 transition-bg;
@apply bg-yuika-blue-500 transition-bg;
}
@screen md {
@ -182,7 +192,7 @@ footer {
}
.post-article {
@apply pb-32;
@apply pb-32 pt-8;
}
.content {
@ -221,7 +231,10 @@ footer {
}
.primary-tag-header {
@apply bg-green-700 w-auto inline-block px-2 py-1 text-white text-sm;
@apply bg-blue-700 w-auto inline-block px-2 py-1 text-white text-sm transition-bg;
}
.primary-tag-header:hover {
@apply bg-blue-900 transition-bg;
}
.tag-header {
@apply bg-blue-700 w-auto inline-block px-2 py-1 text-white text-sm;
@ -229,6 +242,20 @@ footer {
.author-header {
@apply bg-red-700 w-auto inline-block px-2 py-1 text-white text-sm;
}
.author-list {
@apply flex flex-row items-center my-2 py-2 transition-bg;
}
.author-list:hover {
@apply bg-red-700 transition-bg;
}
.author-images {
@apply flex flex-row;
}
.author-names {
@apply flex-grow flex flex-col;
}
@tailwind components;
@tailwind utilities;

View File

@ -19,8 +19,8 @@
<div class="mt-0 text-xs text-white group-hover:text-gray-300">
<p><span class="post-card-byline-date"><time datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMM YYYY"}}</time> <span class="bull">&bull;</span> {{reading_time}}</span></p>
</div>
<div class="flex flex-row items-center my-2">
<div class="flex flex-row">
<div class="author-list text-xs text-white">
<div class="author-images">
{{#foreach authors}}
{{#if profile_image}}
<div class="h-8 ml-1 mr-3">
@ -31,7 +31,7 @@
{{/if}}
{{/foreach}}
</div>
<div class="flex-grow flex flex-col text-xs text-white">
<div class="author-names">
<div>
<p>{{#has author="count:>2"}}Multiple authors{{else}}{{authors}}{{/has}}</p>
</div>

View File

@ -22,7 +22,8 @@
<div class="mb-4">
<p><span class="text-white text-sm"><time datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMM YYYY"}}</time> <span class="bull">&bull;</span> {{reading_time}}</span></p>
</div>
<div class="flex flex-row">
<div class="author-list text-base text-white">
<div class="author-images">
{{#foreach authors}}
{{#if profile_image}}
<div class="h-8 ml-1 mr-3">
@ -30,16 +31,17 @@
<img class="h-full rounded-full" src="{{img_url profile_image size="xs"}}" alt="{{name}}"/>
</a>
</div>
{{else}}
<a href="{{url}}" class="static-avatar author-profile-image">{{> "icons/avatar"}}</a>
{{/if}}
{{/foreach}}
<div class="text-white">
</div>
<div class="author-names">
<div>
<p>{{#has author="count:>2"}}Multiple authors{{else}}{{authors}}{{/has}}</p>
</div>
</div>
</div>
</div>
</div>
</div>
<article class="post-article">