**update** minor changes for tag page

This commit is contained in:
Aytac Kirmizi 2022-10-27 10:44:35 +02:00
parent 6bcc1d4c3a
commit bc594adbe2
8 changed files with 48 additions and 103 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -714,4 +714,8 @@ h6 {
a.social-share-link svg {
height: 32px;
width: 32px;
}
.post-card-title-custom{
text-transform: uppercase;
}

View File

@ -4,77 +4,8 @@
<div class="post-tag-grid">
{{#get 'tags' limit='15' include='count.posts' order='count.posts desc'}}
{{#foreach tags}}
<div class="post-tag-grid-item">
<a href='{{ url }}'>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="post-tag-grid-item-svg">
{{#if accent_color}}
<rect x="0" y="0" style="fill: {{accent_color}}" class="post-tag-grid-item-svg-first"></rect>
{{else}}
<rect x="0" y="0" class="post-tag-grid-item-svg-first"></rect>
{{/if}}
<foreignObject class="post-tag-grid-item-svg-first-obj">
<div class="post-tag-grid-item-svg-first-obj-text">{{ count.posts }}</div>
</foreignObject>
<rect class="post-tag-grid-item-svg-second"></rect>
<foreignObject class="post-tag-grid-item-svg-second-obj">
<div class="post-tag-grid-item-svg-second-obj-inner">
{{#if accent_color}}
<h2 style="color:{{accent_color}};">{{ name }}</h2>
{{else}}
<h2>{{ name }}</h2>
{{/if}}
{{#if description}}
<p class="post-tag-grid-item-svg-second-obj-description">{{description}}</p>
{{/if}}
</div>
</foreignObject>
</svg>
</a>
</div>
{{> "tag-card"}}
{{/foreach}}
{{/get}}
</div>
</section>
{{!-- <section class="post-content post-tag-content">
<div class="post-tag-grid">
{{#get 'tags' limit='15' include='count.posts' order='count.posts desc'}}
{{#foreach tags}}
<div class="post-tag-grid-item">
<a href='{{ url }}'>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="width: 260px;" class="post-tag-grid-item-svg">
{{#if accent_color}}
<rect x="0" y="0" height="150" width="80" style="fill: {{accent_color}}" class="post-tag-grid-item-svg-first"></rect>
{{else}}
<rect x="0" y="0" height="150" width="80" style="fill: var(--ghost-accent-color)" class="post-tag-grid-item-svg-first"></rect>
{{/if}}
<foreignObject x="0" y="55" height="28" width="80" class="post-tag-grid-item-svg-first">
<div style="color: white;font-size: 28px;height: 28px;">{{ count.posts }}</div>
</foreignObject>
<rect x="80" y="0" height="150" width="180" style=" fill: black" class="post-tag-grid-item-svg-second"></rect>
{{#if accent_color}}
<foreignObject x="80" y="0" height="150" width="180" style="color:{{accent_color}};" class="post-tag-grid-item-svg-second">
{{else}}
<foreignObject x="80" y="0" height="150" width="180" style="color:white;" class="post-tag-grid-item-svg-second">
{{/if}}
{{#if description}}
<div>
<h2>{{ name }}</h2>
<p style="color:white;">{{description}}</p>
</div>
{{else}}
<div style="margin-top: 30%;">
<h2>{{ name }}</h2>
</div>
{{/if}}
</foreignObject>
</svg>
</a>
</div>
{{/foreach}}
{{/get}}
</div>
</section> --}}
</section>

28
partials/tag-card.hbs Normal file
View File

@ -0,0 +1,28 @@
<div class="post-tag-grid-item">
<a href='{{ url }}'>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="post-tag-grid-item-svg">
{{#if accent_color}}
<rect x="0" y="0" style="fill: {{accent_color}}" class="post-tag-grid-item-svg-first"></rect>
{{else}}
<rect x="0" y="0" class="post-tag-grid-item-svg-first"></rect>
{{/if}}
<foreignObject class="post-tag-grid-item-svg-first-obj">
<div class="post-tag-grid-item-svg-first-obj-text">{{ count.posts }}</div>
</foreignObject>
<rect class="post-tag-grid-item-svg-second"></rect>
<foreignObject class="post-tag-grid-item-svg-second-obj">
<div class="post-tag-grid-item-svg-second-obj-inner">
{{#if accent_color}}
<h2 style="color:{{accent_color}};">{{ name }}</h2>
{{else}}
<h2>{{ name }}</h2>
{{/if}}
{{#if description}}
<p class="post-tag-grid-item-svg-second-obj-description">{{description}}</p>
{{/if}}
</div>
</foreignObject>
</svg>
</a>
</div>

38
tag.hbs
View File

@ -8,37 +8,19 @@
{{#tag}}
<section class="post-card post-card-large">
{{#if feature_image}}
<div class="post-card-image-link">
{{!-- This is a responsive image, it loads different sizes depending on device
https://medium.freecodecamp.org/a-guide-to-responsive-images-with-ready-to-use-templates-c400bd65c433 --}}
<img class="post-card-image"
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w,
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 400px, 800px"
src="{{img_url feature_image size="m"}}"
alt="{{title}}"
/>
</div>
{{/if}}
<div class="post-card-content">
<div class="post-card-content-link">
<header class="post-card-header">
<h2 class="post-card-title">{{name}}</h2>
</header>
<div class="post-card-excerpt">
{{#if description}}
{{description}}
{{else}}
A collection of {{plural ../pagination.total empty='zero posts' singular='% post' plural='% posts'}}
{{/if}}
<div class="post-card-content-link">
<header class="post-card-header">
<h2 class="post-card-title post-card-title-custom">{{name}}</h2>
</header>
<div class="post-card-excerpt">
{{#if description}}
{{description}}
{{/if}}
... A collection of {{plural ../pagination.total empty='zero posts' singular='% post' plural='% posts'}}
</div>
</div>
</div>
</div>
</section>
{{/tag}}