Credit Section and some Minor Development

codefrydev · Jun 9, 2024 · ecf7c0a · ecf7c0a
1 parent 3651750
commit ecf7c0a
Show file tree

Hide file tree

Showing 18 changed files with 243 additions and 40 deletions.
diff --git a/content/blog/announce.md b/content/blog/announce.md
@@ -1,5 +1,5 @@
 ---
-title: "Announce"
+title: "In development"
 lead: alternativeHeadline
 description: description
 author: Codefrydev

diff --git a/data/credit.yaml b/data/credit.yaml
@@ -0,0 +1,12 @@
+cards:
+  - accent_color: "#0f6493"
+    title: "Hugo"
+    content: "This Website is Created Using Hugo"
+    icon: "fa-solid fa-comments"
+    url: "https://gohugo.io/"
+
+  - accent_color: "#0f6493"
+    title: "MarkBoots"
+    content: "Main Web Page Layout Inspiration from his work."
+    icon: "fa-solid fa-comments"
+    url: "https://codepen.io/MarkBoots"
diff --git a/data/games.yaml b/data/games.yaml
@@ -3,12 +3,15 @@ data:
   - name: "Chain Reaction"
     icon: "fa-brands fa-fantasy-flight-games"
     url: "https://codefrydev.in/ChainReaction/"
+
   - name: "Wordle"
     icon: "fa-regular fa-file-word"
     url: "https://codefrydev.in/Wordle/"
+
   - name: "Snake"
     icon: "fa-solid fa-snake"
     url: "https://codefrydev.in/Snake"
+
   - name: "Game"
     icon: "fa-brands fa-galactic-senate"
     url: "https://play.google.com/store/apps/details?id=org.codefrydev.developer.abhijeet.galacticgunner"

diff --git a/data/history.yaml b/data/history.yaml
@@ -1,34 +1,46 @@
 history:
+  - date: "09 June 2024"
+    title: "Code Fry Dev"
+    description: "Now Website dynamically Generated using Hugo"
+    link: "https://gohugo.io/"
+    accent_color: "#3558b6"
+
   - date: "08 June 2024"
     title: "Snake Game"
     description: "Play Chaotic Snakee Game"
     link: "https://codefrydev.in/Snake"
-    accent_color: "#cbe3ea"
+    accent_color: "#258749"
+
   - date: "05 June 2024"
     title: "Tom & Jerry"
     description: "Watch Live Tom And Jerry 1940"
     link: "https://codefrydev.in/TomAndJerry/"
     accent_color: "#FFC97A"
+
   - date: "19 May 2024"
     title: "Wordle"
     description: "Play with words"
     link: "https://codefrydev.in/Wordle/"
-    accent_color: "#9FE2BF"
+    accent_color: "#88443F"
+
   - date: "06 May 2024"
     title: "Chain Reaction"
     description: "Play with your friend with fusion and fission"
     link: "https://codefrydev.in/ChainReaction/"
     accent_color: "#639fab"
+
   - date: "12 April 2024"
     title: "Wallpaper App"
     description: "Wallpaper Humanly Created or Programmatically Generated"
     link: "/projects/Wallpaper/Index.html"
     accent_color: "#ffb703"
+
   - date: "26 March 2024"
     title: "Challenge App"
     description: "Consistency is the Key"
     link: "/projects/Challenge/Index.html"
     accent_color: "#1B5F8C"
+
   - date: "01 March 2024"
     title: "Crispy Launch, Dinner 🍻"
     description: "Early version Website Launched"

diff --git a/data/home.yaml b/data/home.yaml
@@ -3,33 +3,43 @@ data:
   - name: "Chain Reaction"
     icon: "fa-brands fa-fantasy-flight-games"
     url: "https://codefrydev.in/ChainReaction/"
+
   - name: "Wordle"
     icon: "fa-regular fa-file-word"
     url: "https://codefrydev.in/Wordle/"
+
   - name: "Tom & Jerry"
     icon: "fa-solid fa-cat"
     url: "https://codefrydev.in/TomAndJerry/"
+
   - name: "Snake"
     icon: "fa-solid fa-snake"
     url: "https://codefrydev.in/Snake"
+
   - name: "Wallpaper"
     icon: "fa-solid fa-image"
     url: "https://codefrydev.in/Wallpaper/"
+
   - name: "Challenge"
     icon: "fa-solid fa-chart-line"
     url: "https://codefrydev.in/Challenge/"
+
   - name: "Application"
     icon: "fa-light fa-dna"
     url: "https://play.google.com/store/apps/details?id=com.priyadarshi.abhijeet.abintudyog"
+
   - name: "Game"
     icon: "fa-light fa-chart-mixed"
     url: "/games"
+
   - name: "Log"
     icon: "fa-solid fa-blog"
     url: "/blog"
+
   - name: "Credit"
     icon: "fa-regular fa-credit-card"
     url: "/Credit"
+
   - name: "Timeline"
     icon: "fa-light fa-atom"
     url: "/history"
diff --git a/layouts/blog/list.html b/layouts/blog/list.html
@@ -8,14 +8,13 @@
 </head>
 
 <body style="background-color: #e5e9f4;">
-    <header>
+    <!-- <header>
         <h1>{{ .Title }}</h1>
-    </header>
+    </header> --> 
     <main>
     <div class="d-flex justify-content-center">
     <ul>
-        {{ range .Paginator.Pages }}
-        <li>
+        {{ range .Paginator.Pages }} 
             <div class="d-flex flex-column mb-3">
                 <div class="card">
                     <h5 class="card-header">{{ .Title }}</h5>
@@ -31,8 +30,8 @@ <h5 class="card-header">{{ .Title }}</h5>
                     </div>
                 </div>
             </div>  
-            {{ end }}
-        </ul>
+        {{ end }}
+    </ul>
 
         <!-- Pagination -->
         <div class="pagination">

diff --git a/layouts/credit/credit.html b/layouts/credit/credit.html
@@ -2,15 +2,27 @@
 <html lang="en">
 <head> 
     {{ partial "header.html" . }} 
-    <link rel="stylesheet" href="/css/games.css">
+    <link rel="stylesheet" href="/css/credit.css">
 </head>
-<body style="background-color: #e5e9f4;">
+<body style="background-color: #e5e9f4;" >
     <header>
-        <h1>{{ .Title }}</h1>
+        <h1 onclick="window.location.href='/'">
+            <img style="align-items: center;" src="/images/IconCodefrydev.svg" alt="Codefrydev Logo" height="96px">
+            <br/>
+            {{ .Title }}
+        </h1>
     </header>
     <main>
         <section>
-            {{ .Content }}
+            <ol class="cards">
+                {{ range .Site.Data.credit.cards }}
+                <li class="card" style="--accent-color: {{ .accent_color }}" onclick="window.location.href='{{ .url }}'">
+                    <h2>{{ .title }}</h2>
+                    <p>{{ .content }}</p>
+                    <i class="{{ .icon }}"></i>
+                </li>
+                {{ end }}
+            </ol>
         </section>
     </main>
 </body>

diff --git a/public/blog/announce/index.html b/public/blog/announce/index.html
@@ -19,7 +19,7 @@
 <meta name="msapplication-TileColor" content="#28966a">
 <meta name="theme-color" content="#28966a">
 
-<title>Announce</title>
+<title>In development</title>
 
 
 
@@ -28,8 +28,8 @@
     "@context": "http://schema.org",
     "@type": "BlogPosting",
     "articleSection": "blog",
-    "name": "Announce",
-    "headline": "Announce",
+    "name": "In development",
+    "headline": "In development",
     "alternativeHeadline": "alternativeHeadline",
     "description": "description",
     "inLanguage": "en-us",
@@ -74,11 +74,11 @@
 }
 </script>
 
-    <title>Announce</title>
+    <title>In development</title>
 </head>
 <body>
     <header>
-        <h1>Announce</h1>
+        <h1>In development</h1>
     </header>
     <main>
 

diff --git a/public/blog/index.html b/public/blog/index.html
@@ -80,21 +80,18 @@
 </head>
 
 <body style="background-color: #e5e9f4;">
-    <header>
-        <h1>blogs</h1>
-    </header>
+
     <main>
     <div class="d-flex justify-content-center">
     <ul>
-
-        <li>
+
             <div class="d-flex flex-column mb-3">
                 <div class="card">
-                    <h5 class="card-header">Announce</h5>
+                    <h5 class="card-header">In development</h5>
                     <div class="card-body">
                         <time datetime="2024-06-09 14:56:05 &#43;0530 IST">Jun 9, 2024</time> 
                         <p class="card-text">description</p>
-                        <a href="http://localhost:1313/blog/announce/" class="btn btn-primary">Announce</a>
+                        <a href="http://localhost:1313/blog/announce/" class="btn btn-primary">In development</a>
                         <div class="tags">
 
                                 <a  href="games" type="button" class=" tag btn btn-outline-primary">games</a>
@@ -105,8 +102,8 @@ <h5 class="card-header">Announce</h5>
                     </div>
                 </div>
             </div>  
-            
-        </ul>
+
+    </ul>
 
 
         <div class="pagination">

diff --git a/public/blog/index.xml b/public/blog/index.xml
@@ -9,7 +9,7 @@
     <lastBuildDate>Sun, 09 Jun 2024 14:56:05 +0530</lastBuildDate>
     <atom:link href="http://localhost:1313/blog/index.xml" rel="self" type="application/rss+xml" />
     <item>
-      <title>Announce</title>
+      <title>In development</title>
       <link>http://localhost:1313/blog/announce/</link>
       <pubDate>Sun, 09 Jun 2024 14:56:05 +0530</pubDate>
       <guid>http://localhost:1313/blog/announce/</guid>

diff --git a/public/credit/index.html b/public/credit/index.html
@@ -74,15 +74,33 @@
 }
 </script>
 
-    <link rel="stylesheet" href="/css/games.css">
+    <link rel="stylesheet" href="/css/credit.css">
 </head>
-<body style="background-color: #e5e9f4;">
+<body style="background-color: #e5e9f4;" >
     <header>
-        <h1>Credit</h1>
+        <h1 onclick="window.location.href='/'">
+            <img style="align-items: center;" src="/images/IconCodefrydev.svg" alt="Codefrydev Logo" height="96px">
+            <br/>
+            Credit
+        </h1>
     </header>
     <main>
         <section>
-
+            <ol class="cards">
+
+                <li class="card" style="--accent-color: #0f6493" onclick="window.location.href='https:\/\/gohugo.io\/'">
+                    <h2>Hugo</h2>
+                    <p>This Website is Created Using Hugo</p>
+                    <i class="fa-solid fa-comments"></i>
+                </li>
+
+                <li class="card" style="--accent-color: #0f6493" onclick="window.location.href='https:\/\/codepen.io\/MarkBoots'">
+                    <h2>MarkBoots</h2>
+                    <p>Main Web Page Layout Inspiration from his work.</p>
+                    <i class="fa-solid fa-comments"></i>
+                </li>
+
+            </ol>
         </section>
     </main>
 </body>

diff --git a/public/css/credit.css b/public/css/credit.css
@@ -0,0 +1,67 @@
+ol.cards {
+    display: grid;
+    gap: 2rem;
+    grid-template-columns: 1fr; /* Single column layout */
+    padding: 2rem;
+    margin: 0;
+    list-style: none;
+    counter-reset: cardCount;
+  }
+
+  ol.cards > .card {
+    color: hsl(0 0% 40%);
+    background-color: #ffffff;
+    text-align: center;
+
+    padding: 2rem;
+    border-radius: .5rem;
+    box-shadow: .5rem .5rem 1rem hsl(0 0% 0% / .25);
+
+    position: relative;
+    counter-increment: cardCount;
+  }
+
+  ol.cards > .card::before {
+    --top: -1.5rem; /* Adjust top position */
+    --left: 0; /* No left offset needed */
+
+    /* content: "Option " counter(cardCount, decimal-leading-zero); */
+    color: hsl(0 0% 100%);
+
+    padding: 0.5rem 1rem;
+    background-color: var(--accent-color);
+    border-radius: .5rem .5rem 0 0; /* Adjust border radius */
+    box-shadow: 0.125rem -0.125rem 0.25rem hsl(0 0% 0% / .25);
+
+    /* position */
+    position: absolute;
+    top: 100%;
+    left: 50%;
+    transform-origin: top left;
+    transform: translate(-50%, -100%);
+    white-space: nowrap;
+  }
+
+  ol.cards > .card > i {
+    color: var(--accent-color);
+    font-size: 2rem;
+  }
+
+  ol.cards > .card > h2 {
+    font-weight: 400;
+    color: var(--accent-color);
+    margin-top: 0;
+  }
+
+  header {
+    display: flex;
+    justify-content: center; /* Center horizontally */
+    align-items: center; /* Center vertically (if needed) */
+    width: 100%; /* Ensure the header takes up full width */
+    padding: 1rem; /* Add some padding if needed */
+}
+
+header h1 {
+    font-weight: 300; /* Set font-weight to a thin value */
+    text-align: center; /* Center the text */
+}