Skip to content

Commit

Permalink
More blog improvements
Browse files Browse the repository at this point in the history
  • Loading branch information
riasvdv committed Oct 4, 2024
1 parent 1ceff5e commit de61fc4
Show file tree
Hide file tree
Showing 7 changed files with 45 additions and 48 deletions.
4 changes: 2 additions & 2 deletions app/Models/Enums/TechnologyType.php
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,12 @@ public static function toLabels(): array
];
}

public function toLivewire()
public function toLivewire(): mixed
{
return [$this->value];
}

public static function fromLivewire($value)
public static function fromLivewire($value): Enum
{
return new self($value[0]);
}
Expand Down
2 changes: 1 addition & 1 deletion resources/views/components/headers/h1.blade.php
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
@php
$tag = $tag ?? 'h1';
@endphp
<{{ $tag }} {{ $attributes->twMerge('font-druk uppercase text-72 lg:text-144 leading-80 font-bold') }}>
<{{ $tag }} {{ $attributes->twMerge('font-druk uppercase text-72 lg:text-144 leading-72 lg:leading-[125px] font-bold') }}>
{{ $slot }}
</{{ $tag }}>
17 changes: 10 additions & 7 deletions resources/views/components/insights/highlight.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,15 @@

<x-layout.wrapper as="article" :class="twMerge(['flex gap-16', $attributes->get('class')])">
<figure>
{{-- @todo Thumbnail --}}
<div class="w-[440px] h-[440px] bg-oss-green-pale rounded-8 shadow-oss-card"></div>
<div class="w-[440px] h-[440px] bg-oss-green-pale rounded-8">
@if ($insight->header_image)
<img class="w-full h-full object-cover" src="{{ $insight->header_image }}" alt="">
@endif
</div>
</figure>
<div class="pt-28 flex flex-col gap-9">
<p class="flex items-center gap-3">
<a href="{{ route('insights.show', $insight->slug) }}" class="bg-oss-green-pale font-semibold rounded-8 px-2 py-0.5">
<div class="pt-24 flex flex-col gap-9">
<p class="flex items-center gap-3 text-sm">
<a href="{{ route('insights.show', $insight->slug) }}" class="bg-oss-green-pale font-semibold rounded-8 px-2 py-1.5">
Latest article
</a>
<a href="{{ route('insights.show', $insight->slug) }}">
Expand All @@ -18,12 +21,12 @@
</time>
</a>
</p>
<x-headers.h2 class="w-2/3">
<x-headers.h2 class="">
<a href="{{ route('insights.show', $insight->slug) }}">
{{ $insight->title }}
</a>
</x-headers.h2>
<div class="w-3/4">
<div class="leading-snug">
{!! $insight->summary !!}
</div>
</div>
Expand Down
36 changes: 14 additions & 22 deletions resources/views/components/insights/list-item.blade.php
Original file line number Diff line number Diff line change
@@ -1,33 +1,25 @@
<?php /** @var \Spatie\ContentApi\Data\Post $insight */ ?>
<article class="relative flex gap-8 group p-9">
<a wire:navigate href="{{ route('insights.show', $insight->slug) }}" class="relative flex gap-8 group p-9">
<div class="absolute inset-0 rounded-[20px] pointer-events-none w-full h-full opacity-50 border border-transparent group-hover:bg-link-card-light-hover group-hover:border-oss-gray-dark"></div>
<a wire:navigate href="{{ route('insights.show', $insight->slug) }}">
<figure class="pt-1">
<div class="w-[120px] h-[120px] bg-oss-green-pale rounded-8">
@if ($insight->header_image)
<img class="w-full h-full object-cover" src="{{ $insight->header_image }}" alt="">
@endif
</div>
</figure>
</a>
<figure class="pt-1">
<div class="w-[120px] h-[120px] bg-oss-green-pale rounded-8">
@if ($insight->header_image)
<img class="w-full h-full object-cover" src="{{ $insight->header_image }}" alt="">
@endif
</div>
</figure>
<div>
<h3 class="text-24 font-bold group-hover:text-oss-spatie-blue hover:text-oss-spatie-blue">
<a wire:navigate href="{{ route('insights.show', $insight->slug) }}">
{{ $insight->title }}
</a>
{{ $insight->title }}
</h3>
<div class="mt-3 [&_p]:mt-2 [&_code]:text-16 [&_code]:bg-transparent">
<a wire:navigate href="{{ route('insights.show', $insight->slug) }}">
{!! $insight->summary !!}
</a>
{!! strip_tags($insight->summary, ['p', 'strong', 'em', 'b', 'i', 'code']) !!}
</div>
<div class="mt-4 flex gap-3 text-14">
@isset($insight->date)
<a wire:navigate href="{{ route('insights.show', $insight->slug) }}">
<time datetime="{{ $insight->date->format('Y-m-d') }}">
{{ $insight->date->format('F d, Y') }}
</time>
</a>
<time datetime="{{ $insight->date->format('Y-m-d') }}">
{{ $insight->date->format('F d, Y') }}
</time>
@endisset
@if (count($insight->tags))
<ul class="contents font-bold">
Expand All @@ -38,4 +30,4 @@
@endif
</div>
</div>
</article>
</a>
7 changes: 3 additions & 4 deletions resources/views/front/pages/insights/index.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,16 @@
</x-layout.wrapper>

@if($highlight)
<x-insights.highlight :insight="$highlight" class="-mt-8" />
<x-insights.highlight :insight="$highlight" />
@endif

<x-layout.wrapper class="mt-20">
<x-layout.wrapper class="mt-20 pr-20">
<div class="flex">
<h2 class="w-1/4 text-24 font-bold mt-9">More insights</h2>
<div class="flex-1 flex flex-col gap-6">
@foreach($insights as $insight)
<x-insights.list-item :insight="$insight" />
@endforeach

</div>
</div>
@if ($insights->hasMorePages())
Expand All @@ -38,7 +37,7 @@
</x-layout.wrapper>

@isset($externalFeedItems)
<x-layout.wrapper class="mt-24 mb-20">
<x-layout.wrapper class="mt-24 mb-20 pr-20">
<div class="flex">
<h2 class="w-1/4 text-24 font-bold">From our team &&nbsp;products</h2>
<div class="flex-1 flex flex-col gap-10 pl-9">
Expand Down
23 changes: 13 additions & 10 deletions resources/views/front/pages/insights/show.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -49,17 +49,20 @@
</x-layout.wrapper>
</article>

<a href="{{ route('insights') }}">Back to insights</a>

@if(count($otherPosts))
<h2>Continue reading</h2>
@foreach($otherPosts as $otherPost)
<a href="{{ route('insights.show', $otherPost->slug) }}">
{{ $otherPost->title }}
{{ htmlspecialchars_decode(strip_tags($post->summary)) }}
</a>
@endforeach
<x-layout.wrapper class="mt-24 mb-20 pr-20">
<div class="flex">
<h2 class="w-1/4 text-24 font-bold">Continue reading</h2>
<div class="flex-1 flex flex-col gap-10 -mt-9 pl-9">
@foreach($otherPosts as $otherPost)
<x-insights.list-item :insight="$otherPost" />
@endforeach
</div>
</div>
</x-layout.wrapper>
@endif

<livewire:newsletter />
<x-layout.wrapper class="my-24">
<livewire:newsletter />
</x-layout.wrapper>
</x-page>
4 changes: 2 additions & 2 deletions resources/views/livewire/newsletter.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@
<div>
<div>
<div class="bg-white/80 py-4 px-6 rounded-md w-full flex justify-between items-center">
<div>
<input class="bg-transparent h-full placeholder-oss-royal-blue-light" name="email" wire:model="email" type="email" placeholder="Your email address">
<div class="flex-1">
<input class="bg-transparent w-full h-full placeholder-oss-royal-blue-light" name="email" wire:model="email" type="email" placeholder="Your email address">
@error('email')
<p class="text-oss-red text-xs">{{ $message }}</p>
@enderror
Expand Down

0 comments on commit de61fc4

Please sign in to comment.