Color fixed and logo

public/css/styles.css

@@ -24,3 +24,16 @@
 .MvWaheed {
     font-family: "MvWaheed";
 }
+
+.bg-main-link {
+    background-color: #1D1D1B;
+}
+
+.bg-main-link:hover {
+    background-color: #4A5568;
+}
+
+.topics {
+    background-color: #1D1D1B;
+    color: white;
+}

resources/views/articles/show.blade.php

@@ -29,7 +29,8 @@
         <img src="{{$article->source->logo}}" class="h-10 w-10 rounded-full mr-2 object-cover" />
         <div>
           <p class="font-semibold text-gray-200 text-md MvTyper">{{$article->source->name}}</p>
-                    <p class="font-semibold text-gray-400 text-xs MvTyper" style="direction: rtl;">{{$article->published_date->locale('dv')->isoFormat('Do MMMM YYYY | dddd | h:mm')}}</p>
+          <p class="font-semibold text-gray-400 text-xs MvTyper" style="direction: rtl;">
+            {{$article->published_date->locale('dv')->isoFormat('Do MMMM YYYY | dddd | h:mm')}}</p>
         </div>
       </div>
 
@@ -40,37 +41,30 @@
     <div class="flex justify-end mb-5 border-b">
       <form action="{{route('mylist.store', $article->id)}}" method="POST">
         @csrf
-        <button
+        <button type="submit"
-        type="submit"
+          class="flex items-center justify-center mb-2 shadow p-1 rounded hover:shadow-lg cursor-pointer">
-        class="flex items-center justify-center mb-2 shadow p-1 rounded hover:shadow-lg cursor-pointer"
-    >
           <p class="text-gray-700 text-sm MvTyper text-right mr-2">
             ރައްކާކުރޭ
           </p>
-        <svg
+          <svg class="h-5 w-5 text-gray-800" fill="currentcolor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
-            class="h-5 w-5 text-gray-800"
-            fill="currentcolor"
-            xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 64 64"
-        >
             <g data-name="Froppy disk">
               <path
-                    d="M61.707 10.293l-8-8A1 1 0 0053 2H7a5.006 5.006 0 00-5 5v50a5.006 5.006 0 005 5h50a5.006 5.006 0 005-5V11a1 1 0 00-.293-.707zM48 4v16a1 1 0 01-1 1H17a1 1 0 01-1-1V4zM10 60V35a3 3 0 013-3h38a3 3 0 013 3v25zm50-3a3 3 0 01-3 3h-1V35a5.006 5.006 0 00-5-5H13a5.006 5.006 0 00-5 5v25H7a3 3 0 01-3-3V7a3 3 0 013-3h7v16a3 3 0 003 3h30a3 3 0 003-3V4h2.586L60 11.414z"
+                d="M61.707 10.293l-8-8A1 1 0 0053 2H7a5.006 5.006 0 00-5 5v50a5.006 5.006 0 005 5h50a5.006 5.006 0 005-5V11a1 1 0 00-.293-.707zM48 4v16a1 1 0 01-1 1H17a1 1 0 01-1-1V4zM10 60V35a3 3 0 013-3h38a3 3 0 013 3v25zm50-3a3 3 0 01-3 3h-1V35a5.006 5.006 0 00-5-5H13a5.006 5.006 0 00-5 5v25H7a3 3 0 01-3-3V7a3 3 0 013-3h7v16a3 3 0 003 3h30a3 3 0 003-3V4h2.586L60 11.414z" />
-                />
               <path
-                    d="M39 19h6a1 1 0 001-1V7a1 1 0 00-1-1h-6a1 1 0 00-1 1v11a1 1 0 001 1zm1-11h4v9h-4zM47 45H17a1 1 0 000 2h30a1 1 0 000-2zM47 39H17a1 1 0 000 2h30a1 1 0 000-2zM47 51H17a1 1 0 000 2h30a1 1 0 000-2z"
+                d="M39 19h6a1 1 0 001-1V7a1 1 0 00-1-1h-6a1 1 0 00-1 1v11a1 1 0 001 1zm1-11h4v9h-4zM47 45H17a1 1 0 000 2h30a1 1 0 000-2zM47 39H17a1 1 0 000 2h30a1 1 0 000-2zM47 51H17a1 1 0 000 2h30a1 1 0 000-2z" />
-                />
             </g>
           </svg>
         </button>
       </form>
 
     </div>
-    @foreach ($article->body as $block)
+    @foreach ($article->body as $key => $block)
     <p class="MvTyper text-right" style="direction:rtl;">
+
       {{$block}}
       <br>
       <br>
+
     </p>
     @endforeach
 
@@ -79,9 +73,9 @@
     <div class="flex flex-wrap items-center justify-center">
 
       @foreach ($article->topics as $topic)
-      <a
+    
-    href="{{route('topics.show', $topic->slug)}}"
+      <a href="{{route('topics.show', $topic->slug)}}"
-        class="mt-4 mr-2 bg-gray-600 no-underline text-sm font-bold hover:bg-white px-3 py-2 rounded border border-gray-600 text-white hover:text-gray-600 MvTyper">
+        class="mt-4 mr-2 no-underline hover:border-gray-900 hover:text-gray-900 hover:bg-white border text-sm font-bold topics px-3 py-2 rounded MvTyper">
         {{$topic->name}}
       </a>
       @endforeach

resources/views/layouts/app.blade.php

@@ -8,7 +8,6 @@
     <link rel="stylesheet" href="/css/app.css">
     <link rel="stylesheet" href="/css/styles.css">
 
-
 </head>
 
 <body>

resources/views/partials/footer.blade.php

@@ -1,14 +1,37 @@
- <!-- footer -->
+<footer class="border-t mt-10">
- <footer class="border-t mt-12 pt-12 pb-32 px-4 lg:px-0">
+  <div class="container mx-auto flex flex-col items-center justify-center pt-10">
-    <div class="flex justify-center">
+    <div class="flex justify-center pb-8">
+      <img class="w-12 h-12" src="/images/icon.png" />
+    </div>
+    <ul class="flex flex-wrap font-medium text-gray-700 pb-8 justify-center max-w-xl">
+      <li>
+        <a href="/about" class="hover:underline">About</a>
+      </li>
+      <li class="pb-4 md:pb-2 px-4 md:px-2">
+        <a href="/privacy" class="hover:underline">Privacy</a>
+      </li>
+      <li class="pb-4 md:pb-2 px-4 md:px-2">
+        <a href="/concept" class="hover:underline">Concept</a>
+      </li>
 
-      <div>
+    </ul>
-        <p class="text-gray-600 hidden lg:block p-0 lg:pr-12 text-center">
+    <div class="flex flex-row w-2/3 lg:w-1/3">
-         Powered By Baraveli 💚
+      <div class="flex-col w-full">
-        </p>
+        <div class="flex w-full">
+          <input class="bg-gray-100 h-10 px-2 rounded flex-1" type="email" name="email"
+            placeholder="Subscribe for News Letters">
+          <button
+            class="ml-4 text-white h-10 flex items-center justify-center px-4 bg-main-link rounded shadow font-medium">
+            Subscribe
+          </button>
+        </div>
+      </div>
     </div>
 
+    <div class="py-8 flex">
 
+     <p class="text-gray-600">Powered by Baraveli.</p>
 
     </div>
+  </div>
 </footer>

resources/views/partials/header.blade.php

@@ -3,7 +3,9 @@
 
     <div class="p-4 flex flex-row items-center justify-between">
       <a href="/"
-        class="text-lg font-semibold tracking-widest text-gray-900 uppercase rounded-lg dark-mode:text-white focus:outline-none focus:shadow-outline">Karudhaas</a>
+        class="text-lg font-semibold tracking-widest text-gray-900 uppercase rounded-lg dark-mode:text-white focus:outline-none focus:shadow-outline">
+        <img class="w-40" src="/images/logo.png" />
+      </a>
     </div>
 
     <nav class="flex-grow pb-4 flex justify-end flex-row py-4 mr-3">