add nice divider for menu items which are now responsive

RiddleTime · Jun 13, 2024 · 2b6efad · 2b6efad
1 parent 3bee603
commit 2b6efad
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 4 deletions.
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -15,6 +15,8 @@ import { SocialsComponent } from "./components/socials/socials.component";
         <p class="text-center font-['Conthrax']">Provides Solutions for Sim Racing</p>
       </div>
 
+      <div class="border-t-2 border-[orangered] mb-2 container mx-auto max-w-md md:max-w-xl" ></div>
+
       <div class="mx-auto container place-content-center grid max-w-xl md:max-w-3xl grid-cols-2 md:grid-cols-1">
 
         <nav class="select-none text-lg font-['Conthrax'] mx-auto place-content-start md:place-content-center md:text-2xl flex flex-wrap flex-col md:flex-row">
@@ -27,8 +29,8 @@ import { SocialsComponent } from "./components/socials/socials.component";
         <app-socials class="mx-auto" />
       </div>
 
-      <div class="border-t-2 border-[orangered] mt-4 md:mt-4 container mx-auto max-w-md md:max-w-xl" ></div>
-      <router-outlet class="mt-2 md:mt-4"></router-outlet>
+      <div class="border-t-2 border-[orangered] mt-1 md:mt-2 container mx-auto max-w-md md:max-w-xl" ></div>
+      <router-outlet class="mt-4 md:mt-4"></router-outlet>
 
       <br>
 

diff --git a/src/app/pages/guide/index.page.ts b/src/app/pages/guide/index.page.ts
@@ -11,7 +11,7 @@ import { CommonModule } from '@angular/common';
   imports: [RouterLink, CommonModule],
   template: `
   <div class="mx-auto px-7 rounded-lg shadow-lg select-none container">
-    <h1 class="font-['Conthrax'] text-4xl mb-2 md:mb-1 mt-1 text-center">Guides</h1>
+    <h1 class="font-['Conthrax'] text-4xl mb-2 md:mb-1 text-center">Guides</h1>
     <div class="container mx-auto flex-wrap">
       @for (post of posts;track post.attributes.slug) {
         <a [routerLink]="['/guide/', post.attributes.slug]">

diff --git a/src/app/pages/news/index.page.ts b/src/app/pages/news/index.page.ts
@@ -10,7 +10,7 @@ import { CommonModule } from '@angular/common';
   imports: [RouterLink, CommonModule],
   template: `
   <div class="mx-auto px-7 rounded-lg shadow-lg select-none container">
-    <h1 class="font-['Conthrax'] text-4xl mb-1 mt-1 text-center">News</h1>
+    <h1 class="font-['Conthrax'] text-4xl mb-1 text-center">News</h1>
     <div class="container mx-auto flex-wrap">
       @for (post of posts;track post.attributes.slug) {
         <a [routerLink]="['/news/', post.attributes.slug]">