Skip to content

Commit

Permalink
news design fixed
Browse files Browse the repository at this point in the history
  • Loading branch information
@davewibisono
davewibisono committed Aug 27, 2024
1 parent 16bdf8e commit 24bfd0f
Showing 1 changed file with 26 additions and 12 deletions.
38 changes: 26 additions & 12 deletions layouts/news/single.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ <h1 class="inter-700 text-48 text-white text-center z-4">{{ . | markdownify }}</
{{/* Main Section */}}
<section class="section bg-dark-100">
<div class="container-lg">
<div class="row flex-column-reverse flex-md-row justify-content-between mb-5">
<div class="d-sm-flex justify-content-between col-md-8 pt-5 pt-md-0">
<div class="row flex-column-reverse flex-lg-row justify-content-between mb-5 ps-lg-0">
<div class="d-sm-flex justify-content-between col-lg-8 pt-5 pt-lg-0 ps-lg-0">
<h3 class="inter-700 dark-900 text-48-responsive">{{ .Title | markdownify }}</h3>
</div>
<div class="col-md-4 d-flex align-items-center pe-0">
<div class="col-lg-4 d-flex align-items-center pe-0 ps-lg-5">
<div class="d-flex align-items-center border-dark-50 bg-white rounded-3 w-100" id="search">
{{/* <input type="text" id="search" class="border-0 inter-400 text-16 slate w-75 bg-white"
placeholder="Search">
Expand All @@ -28,8 +28,8 @@ <h3 class="inter-700 dark-900 text-48-responsive">{{ .Title | markdownify }}</h3
</div>
</div>
</div>
<div class="row justify-content-between g-5">
<div class="col-lg-8 px-0">
<div class="row justify-content-between">
<div class="col-lg-8">
<div>
<img src="{{ .Params.image }}" alt="" class="rounded-top-3"
style="width: 100% !important; height: 240px !important; object-fit: cover !important;">
Expand Down Expand Up @@ -66,21 +66,32 @@ <h3 class="inter-700 dark-900 text-48-responsive">{{ .Title | markdownify }}</h3
</div>
<div class="mt-4 pb-5 d-flex flex-wrap gap-3">
<div>
<a class="btn btn-primary btn-lg border-0" style="background-color: #55acee;" target="_blank" href="https://twitter.com/intent/tweet?text={{ .Title }}&url={{ .Permalink | safeURL }}" role="button"><i class="bi bi-twitter me-2"></i>Twitter</a>
<a class="btn btn-primary btn-lg border-0" style="background-color: #55acee;"
target="_blank"
href="https://twitter.com/intent/tweet?text={{ .Title }}&url={{ .Permalink | safeURL }}"
role="button"><i class="bi bi-twitter me-2"></i>Twitter</a>
</div>
<div>
<a class="btn btn-primary btn-lg border-0" style="background-color: #1b84d4;" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink | safeURL }}" role="button"><i class="bi bi-facebook me-2"></i>Facebook</a>
<a class="btn btn-primary btn-lg border-0" style="background-color: #1b84d4;"
target="_blank"
href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink | safeURL }}"
role="button"><i class="bi bi-facebook me-2"></i>Facebook</a>
</div>
<div>
<a class="btn btn-primary btn-lg border-0" style="background-color: #066cb9;" target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url={{ .Permalink | safeURL }}&title={{ .Title | urlquery }}" role="button"><i class="bi bi-linkedin me-2"></i>LinkedIn</a>
<a class="btn btn-primary btn-lg border-0" style="background-color: #066cb9;"
target="_blank"
href="https://www.linkedin.com/shareArticle?mini=true&url={{ .Permalink | safeURL }}&title={{ .Title | urlquery }}"
role="button"><i class="bi bi-linkedin me-2"></i>LinkedIn</a>
</div>
<div>
<a class="btn btn-primary btn-lg border-0 bg-secondary" target="_blank" href="mailto:?subject={{ .Title | urlquery }}&body=Check out this article: {{ .Permalink | safeURL }}" role="button"><i class="bi bi-envelope me-2"></i>Email</a>
<a class="btn btn-primary btn-lg border-0 bg-secondary" target="_blank"
href="mailto:?subject={{ .Title | urlquery }}&body=Check out this article: {{ .Permalink | safeURL }}"
role="button"><i class="bi bi-envelope me-2"></i>Email</a>
</div>
</div>
</div>
</div>
<div class="bg-white p-5 shadow">
<div class="bg-white p-5">
{{ with .Params.author_details }}
<div class="p-3 bg-slate border">
<div class="d-flex flex-wrap gap-3 align-items-center">
Expand All @@ -99,18 +110,21 @@ <h3 class="inter-700 dark-900 text-48-responsive">{{ .Title | markdownify }}</h3
<p class="inter-700 dark-700 text-20 mb-1">Related Posts</p>
</div>
<div class="mt-4 row justify-content-between gy-4">
{{ range first 3 (where .Site.RegularPages ".Params.author" .Params.author) }}
{{ $currentAuthor := .Params.author_details.name }}
{{ with where .Site.RegularPages "Section" "news" }}
{{ range first 3 (where . "Params.author_details.name" $currentAuthor) }}
<a href="{{ .Permalink }}" class="col-sm-6 col-md-4" style="text-decoration: none;">
<h2 class="inter-700 dark-900 text-20 underline-hover">{{ .Title }}</h2>
<p class="inter-400 dark-700 mb-0">{{ .Params.subtitle | truncate 70 }}</p>
</a>
{{ end }}
{{ end }}
</div>
</div>
</div>
</div>

<div class="col-lg-4 mt-5 px-lg-0 ps-lg-2">
<div class="col-lg-4 mt-5 ps-lg-5">
<h4 class="inter-600 text-24 dark-900">Recent News</h4>
<div class="row g-2" data-pagefind-body>
{{ $pages := where .Site.RegularPages "Section" "news" }}
Expand Down

0 comments on commit 24bfd0f

Please sign in to comment.