Update (ui)

This commit is contained in:
2023-12-03 13:14:42 +08:00
parent 2b9c5f88bc
commit 8309fd467c
22 changed files with 191 additions and 98 deletions

View File

@@ -0,0 +1,68 @@
<template>
<div>
<!-- Button to open the modal -->
<button type="button" :class="thisClass" @click="openModal">
🍪 Read Bite ({{ minRead }})
</button>
<!-- Bootstrap Modal -->
<div
class="modal"
ref="modal"
tabindex="-1"
role="dialog"
aria-labelledby="modalLabel"
aria-hidden="true"
>
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div
class="modal-header text-start font-family-roboto-condensed fw-bolder"
>
<h5 class="modal-title" id="modalLabel">The Bite: {{ title }}</h5>
<button
type="button"
class="btn-close"
@click="closeModal"
aria-label="Close"
></button>
</div>
<div class="modal-body text-start small">
<p v-html="bite"></p>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { Modal } from "bootstrap";
export default {
name: "OpenNewsBite",
props: ["title", "bite", "thisClass", "minRead"],
data() {
return {
modalInstance: null,
};
},
methods: {
openModal() {
this.modalInstance = new Modal(this.$refs.modal, {
keyboard: false,
});
this.modalInstance.show();
},
closeModal() {
if (this.modalInstance) {
this.modalInstance.hide();
}
},
},
};
</script>
<style scoped>
/* Add any additional styling here */
</style>

View File

@@ -1,4 +1,4 @@
const Ziggy = {"url":"https:\/\/futurewalker.co","port":null,"defaults":{},"routes":{"debugbar.openhandler":{"uri":"_debugbar\/open","methods":["GET","HEAD"]},"debugbar.clockwork":{"uri":"_debugbar\/clockwork\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"debugbar.assets.css":{"uri":"_debugbar\/assets\/stylesheets","methods":["GET","HEAD"]},"debugbar.assets.js":{"uri":"_debugbar\/assets\/javascript","methods":["GET","HEAD"]},"debugbar.cache.delete":{"uri":"_debugbar\/cache\/{key}\/{tags?}","methods":["DELETE"],"parameters":["key","tags"]},"horizon.stats.index":{"uri":"chorizo\/api\/stats","methods":["GET","HEAD"]},"horizon.workload.index":{"uri":"chorizo\/api\/workload","methods":["GET","HEAD"]},"horizon.masters.index":{"uri":"chorizo\/api\/masters","methods":["GET","HEAD"]},"horizon.monitoring.index":{"uri":"chorizo\/api\/monitoring","methods":["GET","HEAD"]},"horizon.monitoring.store":{"uri":"chorizo\/api\/monitoring","methods":["POST"]},"horizon.monitoring-tag.paginate":{"uri":"chorizo\/api\/monitoring\/{tag}","methods":["GET","HEAD"],"parameters":["tag"]},"horizon.monitoring-tag.destroy":{"uri":"chorizo\/api\/monitoring\/{tag}","methods":["DELETE"],"wheres":{"tag":".*"},"parameters":["tag"]},"horizon.jobs-metrics.index":{"uri":"chorizo\/api\/metrics\/jobs","methods":["GET","HEAD"]},"horizon.jobs-metrics.show":{"uri":"chorizo\/api\/metrics\/jobs\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.queues-metrics.index":{"uri":"chorizo\/api\/metrics\/queues","methods":["GET","HEAD"]},"horizon.queues-metrics.show":{"uri":"chorizo\/api\/metrics\/queues\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.jobs-batches.index":{"uri":"chorizo\/api\/batches","methods":["GET","HEAD"]},"horizon.jobs-batches.show":{"uri":"chorizo\/api\/batches\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.jobs-batches.retry":{"uri":"chorizo\/api\/batches\/retry\/{id}","methods":["POST"],"parameters":["id"]},"horizon.pending-jobs.index":{"uri":"chorizo\/api\/jobs\/pending","methods":["GET","HEAD"]},"horizon.completed-jobs.index":{"uri":"chorizo\/api\/jobs\/completed","methods":["GET","HEAD"]},"horizon.silenced-jobs.index":{"uri":"chorizo\/api\/jobs\/silenced","methods":["GET","HEAD"]},"horizon.failed-jobs.index":{"uri":"chorizo\/api\/jobs\/failed","methods":["GET","HEAD"]},"horizon.failed-jobs.show":{"uri":"chorizo\/api\/jobs\/failed\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.retry-jobs.show":{"uri":"chorizo\/api\/jobs\/retry\/{id}","methods":["POST"],"parameters":["id"]},"horizon.jobs.show":{"uri":"chorizo\/api\/jobs\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.index":{"uri":"chorizo\/{view?}","methods":["GET","HEAD"],"wheres":{"view":"(.*)"},"parameters":["view"]},"sanctum.csrf-cookie":{"uri":"sanctum\/csrf-cookie","methods":["GET","HEAD"]},"laravelpwa.manifest":{"uri":"manifest.json","methods":["GET","HEAD"]},"laravelpwa.":{"uri":"offline","methods":["GET","HEAD"]},"ignition.healthCheck":{"uri":"_ignition\/health-check","methods":["GET","HEAD"]},"ignition.executeSolution":{"uri":"_ignition\/execute-solution","methods":["POST"]},"ignition.updateConfig":{"uri":"_ignition\/update-config","methods":["POST"]},"feeds.main":{"uri":"feeds\/posts-feed","methods":["GET","HEAD"]},"front.home":{"uri":"\/","methods":["GET","HEAD"]},"front.terms":{"uri":"terms","methods":["GET","HEAD"]},"front.privacy":{"uri":"privacy","methods":["GET","HEAD"]},"front.disclaimer":{"uri":"disclaimer","methods":["GET","HEAD"]},"front.all":{"uri":"bites","methods":["GET","HEAD"]},"front.search":{"uri":"search","methods":["POST"]},"front.search.results":{"uri":"bites\/{query}","methods":["GET","HEAD"],"parameters":["query"]},"front.post":{"uri":"{category_slug}\/{slug}","methods":["GET","HEAD"],"parameters":["category_slug","slug"]},"front.category":{"uri":"{category_slug}","methods":["GET","HEAD"],"wheres":{"category_slug":"^(updates|opinions|features|new-launches|how-tos|reviews)$"},"parameters":["category_slug"]}}};
const Ziggy = {"url":"https:\/\/futurewalker.co","port":null,"defaults":{},"routes":{"debugbar.openhandler":{"uri":"_debugbar\/open","methods":["GET","HEAD"]},"debugbar.clockwork":{"uri":"_debugbar\/clockwork\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"debugbar.assets.css":{"uri":"_debugbar\/assets\/stylesheets","methods":["GET","HEAD"]},"debugbar.assets.js":{"uri":"_debugbar\/assets\/javascript","methods":["GET","HEAD"]},"debugbar.cache.delete":{"uri":"_debugbar\/cache\/{key}\/{tags?}","methods":["DELETE"],"parameters":["key","tags"]},"horizon.stats.index":{"uri":"chorizo\/api\/stats","methods":["GET","HEAD"]},"horizon.workload.index":{"uri":"chorizo\/api\/workload","methods":["GET","HEAD"]},"horizon.masters.index":{"uri":"chorizo\/api\/masters","methods":["GET","HEAD"]},"horizon.monitoring.index":{"uri":"chorizo\/api\/monitoring","methods":["GET","HEAD"]},"horizon.monitoring.store":{"uri":"chorizo\/api\/monitoring","methods":["POST"]},"horizon.monitoring-tag.paginate":{"uri":"chorizo\/api\/monitoring\/{tag}","methods":["GET","HEAD"],"parameters":["tag"]},"horizon.monitoring-tag.destroy":{"uri":"chorizo\/api\/monitoring\/{tag}","methods":["DELETE"],"wheres":{"tag":".*"},"parameters":["tag"]},"horizon.jobs-metrics.index":{"uri":"chorizo\/api\/metrics\/jobs","methods":["GET","HEAD"]},"horizon.jobs-metrics.show":{"uri":"chorizo\/api\/metrics\/jobs\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.queues-metrics.index":{"uri":"chorizo\/api\/metrics\/queues","methods":["GET","HEAD"]},"horizon.queues-metrics.show":{"uri":"chorizo\/api\/metrics\/queues\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.jobs-batches.index":{"uri":"chorizo\/api\/batches","methods":["GET","HEAD"]},"horizon.jobs-batches.show":{"uri":"chorizo\/api\/batches\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.jobs-batches.retry":{"uri":"chorizo\/api\/batches\/retry\/{id}","methods":["POST"],"parameters":["id"]},"horizon.pending-jobs.index":{"uri":"chorizo\/api\/jobs\/pending","methods":["GET","HEAD"]},"horizon.completed-jobs.index":{"uri":"chorizo\/api\/jobs\/completed","methods":["GET","HEAD"]},"horizon.silenced-jobs.index":{"uri":"chorizo\/api\/jobs\/silenced","methods":["GET","HEAD"]},"horizon.failed-jobs.index":{"uri":"chorizo\/api\/jobs\/failed","methods":["GET","HEAD"]},"horizon.failed-jobs.show":{"uri":"chorizo\/api\/jobs\/failed\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.retry-jobs.show":{"uri":"chorizo\/api\/jobs\/retry\/{id}","methods":["POST"],"parameters":["id"]},"horizon.jobs.show":{"uri":"chorizo\/api\/jobs\/{id}","methods":["GET","HEAD"],"parameters":["id"]},"horizon.index":{"uri":"chorizo\/{view?}","methods":["GET","HEAD"],"wheres":{"view":"(.*)"},"parameters":["view"]},"sanctum.csrf-cookie":{"uri":"sanctum\/csrf-cookie","methods":["GET","HEAD"]},"laravelpwa.manifest":{"uri":"manifest.json","methods":["GET","HEAD"]},"laravelpwa.":{"uri":"offline","methods":["GET","HEAD"]},"ignition.healthCheck":{"uri":"_ignition\/health-check","methods":["GET","HEAD"]},"ignition.executeSolution":{"uri":"_ignition\/execute-solution","methods":["POST"]},"ignition.updateConfig":{"uri":"_ignition\/update-config","methods":["POST"]},"feeds.main":{"uri":"feeds\/posts-feed","methods":["GET","HEAD"]},"front.home":{"uri":"\/","methods":["GET","HEAD"]},"front.terms":{"uri":"terms","methods":["GET","HEAD"]},"front.privacy":{"uri":"privacy","methods":["GET","HEAD"]},"front.disclaimer":{"uri":"disclaimer","methods":["GET","HEAD"]},"front.all":{"uri":"news","methods":["GET","HEAD"]},"front.search":{"uri":"search","methods":["POST"]},"front.search.results":{"uri":"news\/{query}","methods":["GET","HEAD"],"parameters":["query"]},"front.post":{"uri":"{category_slug}\/{slug}","methods":["GET","HEAD"],"parameters":["category_slug","slug"]},"front.category":{"uri":"{category_slug}","methods":["GET","HEAD"],"wheres":{"category_slug":"^(updates|opinions|features|new-launches|how-tos|reviews)$"},"parameters":["category_slug"]}}};
if (typeof window !== 'undefined' && typeof window.Ziggy !== 'undefined') {
Object.assign(Ziggy.routes, window.Ziggy.routes);

View File

@@ -28,7 +28,8 @@
<div class="text-center text-md-end">
<div class="d-flex d-justify-content-end">
<div data-nosnippet class="align-self-center d-none d-md-block">Digital news shaping your future</div>
<div data-nosnippet class="align-self-center d-none d-md-block">Digital news shaping your future
</div>
<button type="button"
class="align-self-center ms-1 btn btn-link text-white btn-lg px-1 hover-opacity"

View File

@@ -2,34 +2,35 @@
<div class="card mb-1">
<div class="card-body">
<div class="d-grid d-md-flex justify-content-md-between">
<div class="w-100">
<h3 class="h6 mb-1 fw fw-semibold font-family-roboto-condensed">
<div class="w-100 mb-2">
<h3 class="h5 mb-1 fw fw-semibold font-family-roboto-condensed">
{{ $post->title }}
</h3>
@if ($post->entities_keywords->count() > 0)
<div class="d-flex flex-wrap mb-1 gap-1">
{{-- @if ($post->entities) --}}
@foreach ($post->entities_keywords as $keyword)
{{-- @if ($keyword->type == 'entity') --}}
@if ($loop->iteration <= 3)
@if ($keyword->is_main)
<h4 class="mb-0 pb-1 d-inline badge bg-secondary border-secondary text-white border small fw-bold">
{{ $keyword->value }}
</h4>
@else
<h4 class="mb-0 pb-1 d-inline badge text-bg-light border small fw-normal">
{{ $keyword->value }}
</h4>
@endif
@elseif ($loop->iteration > 3 && count($post->entities_keywords) > 3)
<h4 class="mb-0 pb-1 d-inline badge text-bg-light border small fw-normal">
+{{ count($post->entities_keywords) - 3 }} more
</h4>
@break
@endif
{{-- @endif --}}
@endforeach
{{-- @if ($post->entities) --}}
@foreach ($post->entities_keywords as $keyword)
{{-- @if ($keyword->type == 'entity') --}}
@if ($loop->iteration <= 3)
@if ($keyword->is_main)
<h4
class="mb-0 pb-1 d-inline badge bg-secondary border-secondary text-white border small fw-bold">
{{ $keyword->value }}
</h4>
@else
<h4 class="mb-0 pb-1 d-inline badge text-bg-light border small fw-normal">
{{ $keyword->value }}
</h4>
@endif
@elseif ($loop->iteration > 3 && count($post->entities_keywords) > 3)
<h4 class="mb-0 pb-1 d-inline badge text-bg-light border small fw-normal">
+{{ count($post->entities_keywords) - 3 }} more
</h4>
@break
@endif
{{-- @endif --}}
@endforeach
{{-- @endif --}}
@@ -57,11 +58,6 @@ class="font-family-roboto-condensed mb-0 pb-1 d-inline badge bg-danger border-da
</span>
@if (!is_empty($post->bites))
<i class="bi bi-dot"></i>
<span class="d-inline text-secondary small">{{ min_read($post->bites) }}</span>
@endif
<i class="bi bi-dot"></i>
<span class="d-inline text-secondary small">
{{ get_domain_from_url($post->post_url) }}
@@ -69,10 +65,16 @@ class="font-family-roboto-condensed mb-0 pb-1 d-inline badge bg-danger border-da
</div>
</div>
<div class="text-end d-flex justify-content-end w-100">
<div class="align-self-center">
<div class="text-end d-flex justify-content-center justify-content-md-end w-100">
<div class="align-self-center d-flex d-md-grid gap-1">
<open-news-bite
this-class="btn btn-outline-secondary btn-sm rounded-pill px-3 text-decoration-none"
title="{{ $post->title }}" bite="{{ $post->bites }}"
min-read="{{ min_read($post->bites, 'bite') }}"></open-news-bite>
<a class="btn btn-outline-secondary btn-sm rounded-pill px-3 text-decoration-none"
target="_blank" rel="nofollow noopener noreferrer" href="{{ $post->post_url }}">👉 Read article</a>
target="_blank" rel="nofollow noopener noreferrer" href="{{ $post->post_url }}">👉 Read
full
article</a>
</div>
</div>
</div>

View File

@@ -7,8 +7,9 @@
<div class="col-12 col-md-10 col-lg-8">
<h1 class="fw-bolder font-family-roboto-condensed mb-3">Latest AI & tech news in 1 hyper-focused platform</h1>
{{-- <div class="display-6 fw-bold font-family-roboto-condensed mb-2">Your Future Depends<wbr> on Today's
<h1 class="fw-bolder font-family-roboto-condensed mb-3">Latest AI & tech news in 1 hyper-focused
platform</h1>
{{-- <div class="display-6 fw-bold font-family-roboto-condensed mb-2">Your Future Depends<wbr> on Today's
News</div>
<h1 class="h4 fw-normal mb-4">In the fast-evolving world of AI and tech, staying updated is not
optional—it's critical for your future success. Stay updated with hourly news
@@ -18,29 +19,30 @@
<a href="#latest-news" class="btn btn-primary px-4 rounded-pill text-decoration-none">Start reading
now</a>
</div> --}}
</div>
<div class="text-center row justify-content-center">
<div class="col-12 col-md-10 col-lg-6">
</div>
<div class="text-center row justify-content-center">
<div class="col-12 col-md-10 col-lg-6">
<p data-nosnippet class="h4 mb-3">📡 Top keywords identified for the past 24 hours across
{{ $rss_count }} articles identified by AI</p>
<div class="d-flex justify-content-center flex-wrap gap-1">
@foreach ($top_rss_keywords as $rss_keyword)
<a href="{{ get_route_search_result($rss_keyword->value_lowercased) }}"
class=" pb-1 badge text-primary border fw-bold shadow hover-grow">
<span class="h6">#{{ $rss_keyword->value }}</span>
</a>
@endforeach
</div>
<p data-nosnippet class="h4 mb-3">📡 Top keywords identified for the past 24 hours across {{ $rss_count }} articles identified by GPT</p>
<div class="d-flex justify-content-center flex-wrap gap-1">
@foreach ($top_rss_keywords as $rss_keyword)
<a href="{{ get_route_search_result($rss_keyword->value_lowercased) }}"
class=" pb-1 badge text-primary border fw-bold shadow hover-grow">
<span class="h6">#{{ $rss_keyword->value }}</span>
</a>
@endforeach
</div>
</div>
</div>
</div>
</div>
{{-- @if ($featured_posts->count() > 0)
{{-- @if ($featured_posts->count() > 0)
<div class="container-lg py-4">
<div class="text-center">
<h2 id="latest-news" class="font-family-roboto-condensed mb-3 h2">Featured News</h2>
@@ -75,36 +77,39 @@ class="text-secondary">{{ $post->published_at->diffForHumans() }}</small>
@endif --}}
<div id="latest-news" class="container-lg py-4">
<div id="latest-news" class="container-lg py-4">
<div class="row">
<div class="col-12 col-lg-8 mb-3">
<div class="row">
<div class="col-12 col-lg-8 mb-3">
@if ($rss_posts->count() > 0)
<div class="text-start mb-3">
<div class="d-flex">
<h2 class="align-self-center fw-bold font-family-roboto-condensed mb-1 h2">
This Just In 🛰️</h2>
<div class="align-self-center">
<span
class="mb-2 ms-2 badge illuminated-slow bg-gradient-rainbow text-white d-inline-flex font-family-roboto-condensed"><i
class="bi bi-clock-history me-1"></i> UPDATED HOURLY</span>
</div>
@if ($rss_posts->count() > 0)
<div class="text-start mb-3">
<div class="d-flex">
<h2 class="align-self-center fw-bold font-family-roboto-condensed mb-1 h2">
This Just In 🛰️</h2>
<div class="align-self-center">
<span
class="mb-2 ms-2 badge illuminated-slow bg-gradient-rainbow text-white d-inline-flex font-family-roboto-condensed"><i
class="bi bi-clock-history me-1"></i> UPDATED HOURLY</span>
</div>
<p class="text-secondary font-family-roboto-condensed">No time to read the full article?
Read the 🍪 bite, summarised by AI!</p>
</div>
</div>
@include('front.partials.news_bites')
@include('front.partials.news_bites')
<div class="w-full text-center mt-3 mb-3">
<a href="{{ route('front.all') }}"
class="btn btn-primary px-4 rounded-pill text-decoration-none">Discover more news</a>
</div>
@endif
<div class="w-full text-center mt-3 mb-3">
<a href="{{ route('front.all') }}"
class="btn btn-primary px-4 rounded-pill text-decoration-none">Discover more news</a>
</div>
@endif
{{-- @if ($latest_posts->count() > 0)
{{-- @if ($latest_posts->count() > 0)
<div class="text-start">
<h2 id="latest-news" class="fw-semibold font-family-roboto-condensed mb-3 h2">Latest News</h2>
</div>
@@ -172,17 +177,17 @@ class="btn btn-primary px-4 rounded-pill text-decoration-none">Discover More
</div>
@endif --}}
</div>
<div class="col-12 col-lg-4 mb-3">
<div class="position-sticky" style="top: 8rem;">
@include('front.partials.sidebar')
</div>
<div class="col-12 col-lg-4 mb-3">
<div class="position-sticky" style="top: 8rem;">
@include('front.partials.sidebar')
</div>
</div>
</div>
</div>
</div>
</div>
</main>
@endsection