Style fixes and improvements
This commit is contained in:
87447
public/css/app.css
vendored
87447
public/css/app.css
vendored
File diff suppressed because one or more lines are too long
38443
public/js/app.js
vendored
38443
public/js/app.js
vendored
File diff suppressed because one or more lines are too long
@@ -2,65 +2,55 @@
|
||||
<div class="mb-10">
|
||||
<div>
|
||||
<h3
|
||||
class="text-gray-800 font-bold text-3xl text-right mt-3 mb-2 mr-3 MvAamu"
|
||||
class="text-gray-800 font-bold text-3xl text-center mt-3 mb-2 mr-3 MvAamu"
|
||||
>
|
||||
ފަހުގެ ޙަބަރުތަށް
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end">
|
||||
<!-- post cards -->
|
||||
<div class="w-full lg:w-2/3">
|
||||
<div v-for="story in recentStories" :key="story.id">
|
||||
<div class="container mx-auto">
|
||||
<div class="flex md:-mx-4 flex-wrap mb-7 md:px-0">
|
||||
<div
|
||||
class="w-1/2 md:w-1/4 px-4 py-4 flex-grow"
|
||||
v-for="story in recentStories"
|
||||
:key="story.id"
|
||||
>
|
||||
<a :href="'/article/' + story.id">
|
||||
<div
|
||||
class="w-full h-auto overflow-hidden relative rounded"
|
||||
>
|
||||
<img :src="story.featured_image" />
|
||||
</div>
|
||||
</a>
|
||||
<div class="w-full h-auto text-right overflow-hidden mt-3">
|
||||
<a
|
||||
:href="'/article/' + story.id"
|
||||
class="block w-full lg:flex mb-10 shadow rounded-lg"
|
||||
>
|
||||
<div
|
||||
class="bg-white rounded px-4 flex flex-col flex-grow justify-between leading-normal"
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
class="mt-5 text-gray-700 font-semibold text-2xl mb-2 text-right MvTyper hover:underline"
|
||||
class="text-md leading-normal font-semibold text-right text-gray-700 py-3 MvTyper hover:underline"
|
||||
style="direction:rtl;"
|
||||
v-text="story.title"
|
||||
></div>
|
||||
|
||||
<div
|
||||
class="flex items-center justify-end mt-3 mb-3"
|
||||
>
|
||||
></a>
|
||||
<div class="flex items-center justify-end mt-3 mb-3">
|
||||
<a :href="'/source/' + story.source.slug">
|
||||
<div class="flex justify-end items-center">
|
||||
<div>
|
||||
<p
|
||||
class="font-semibold text-gray-700 text-sm capitalize MvTyper py-4"
|
||||
class="font-semibold text-gray-700 text-sm capitalize MvTyper"
|
||||
v-text="story.source.name"
|
||||
></p>
|
||||
<p class="text-gray-600 text-xs ml-1">
|
||||
—
|
||||
{{
|
||||
story.published_date
|
||||
| moment("calendar")
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<p
|
||||
class="text-gray-700 text-base text-right MvTyper"
|
||||
style="direction:rtl;"
|
||||
>
|
||||
{{ story.body[0] }}
|
||||
</p>
|
||||
<img
|
||||
:src="story.source.logo"
|
||||
class="h-10 w-10 rounded-full ml-1 object-cover"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="h-48 lg:w-48 flex-none bg-cover text-center overflow-hidden rounded object-right dark-img"
|
||||
:style="{
|
||||
'background-image':
|
||||
'url(' + story.featured_image + ')'
|
||||
}"
|
||||
:title="story.meta.title"
|
||||
></div>
|
||||
</a>
|
||||
</div>
|
||||
<span class="text-gray-600 text-xs ml-1">
|
||||
{{ story.published_date | moment("calendar") }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@@ -64,9 +64,20 @@
|
||||
{{$block}}
|
||||
<br>
|
||||
<br>
|
||||
@break($key == 2)
|
||||
|
||||
</p>
|
||||
@endforeach
|
||||
<div class="flex justify-center mb-4">
|
||||
<div class="flex flex-col items-center">
|
||||
<svg class="animate-bounce w-6 h-6 text-gray-900" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path d="M19 14l-7 7m0 0l-7-7m7 7V3"></path>
|
||||
</svg>
|
||||
<a href="{{$article->url}}" class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded inline-flex items-center">
|
||||
<span>View the full article on {{$article->source->slug}}</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-b"></div>
|
||||
<h5 class="MvTyper text-md font-bold text-center mb-2 mt-2">މައުޟޫޢުތަށް</h5>
|
||||
|
Reference in New Issue
Block a user