Template:Company: Difference between revisions

@@ Line 1: / Line 1: @@
-<!-- 🏢 Company Cards -->
+<!-- 📚 Scrollable Book Grid (2x2 style) -->
-<div style="display:flex; flex-wrap:wrap; gap:16px; padding:10px; justify-content:flex-start;">
+<div style="display:flex; overflow-x:auto; gap:14px; padding:14px; background:#f4f4f9; border-radius:10px; scrollbar-width:thin;">
-<style>
+<!-- Column 1 -->
-.company-card {
+<div style="display:flex; flex-direction:column; gap:14px;">
-  width:48%; /* 👈 2 cards per row */
-  background:#ffffff;
-  border-radius:12px;
-  box-shadow:0 3px 10px rgba(0,0,0,0.12);
-  padding:14px;
-  text-align:center;
-  font-family:Arial, sans-serif;
-  box-sizing:border-box;
-}
-.company-title {
-  font-weight:600;
-  margin-top:8px;
-}
-.company-industry {
-  font-size:85%;
-  color:#666;
-}
-.company-info {
-  font-size:80%;
-  margin-top:6px;
-  line-height:1.6;
-}
-</style>
-<!-- Company 1 -->
+  <!-- Book 1 -->
-<div class="company-card">
+  <div style="width:170px; background:#fff; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.12); padding:10px; text-align:center;">
-[[File:Medline Academy Logo.jpg|110px|frameless|center]]
+    [[File:Journey_Through_Broken_Dreams_Cover.jpg|120px|frameless|center]]
+    <div style="font-weight:bold; font-size:95%; margin-top:8px;">Broken Dreams</div>
+    <div style="color:#555; font-size:85%;">by [[Gaurav Singh Chouhan]]</div>
+    <div style="font-size:80%; font-style:italic; margin:6px 0;">"A new beginning..."</div>
+    <small>[[A JOURNEY THROUGH BROKEN DREAMS|Read more →]]</small>
+  </div>
-<div class="company-title">Medline Academy</div>
+  <!-- Book 2 -->
-<div class="company-industry">EdTech / Educational Institute</div>
+  <div style="width:170px; background:#fff; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.12); padding:10px; text-align:center;">
+    [[File:Ghost_of_Love.jpg|120px|frameless|center]]
+    <div style="font-weight:bold; font-size:95%; margin-top:8px;">Ghost of Love</div>
+    <div style="color:#555; font-size:85%;">by [[Md Imran Haque]]</div>
+    <div style="font-size:80%; font-style:italic; margin:6px 0;">"Romantic Psychological Epistolary Novel"</div>
+    <small>[[Ghost of Love|Read more →]]</small>
+  </div>
-<div class="company-info">
-[[India]]<br>
-Founded: 2016<br>
-Founder: [[Ainstin S Dennis]]
 </div>
-<small>[[Company Page|Read More →]]</small>
+<!-- Column 2 -->
-</div>
+<div style="display:flex; flex-direction:column; gap:14px;">
-<!-- Company 2 -->
-<div class="company-card">
-[[File:Logo2.png|110px|frameless|center]]
-<div class="company-title">Company Name</div>
-<div class="company-industry">Industry / Type</div>
-<div class="company-info">
-Country<br>
-Founded: Year<br>
-Founder: Name
-</div>
-<small>[[Company Page|Read More →]]</small>
-</div>
-<!-- Company 3 -->
+  <!-- Book 3 -->
-<div class="company-card">
+  <div style="width:170px; background:#fff; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.12); padding:10px; text-align:center;">
-[[File:Logo3.png|110px|frameless|center]]
+    [[File:Book3.jpg|120px|frameless|center]]
+    <div style="font-weight:bold; font-size:95%; margin-top:8px;">Book Name</div>
+    <div style="color:#555; font-size:85%;">by Author</div>
+    <div style="font-size:80%; font-style:italic; margin:6px 0;">"Short line..."</div>
+    <small>[[Book Page|Read more →]]</small>
+  </div>
-<div class="company-title">Company Name</div>
+  <!-- Book 4 -->
-<div class="company-industry">Industry / Type</div>
+  <div style="width:170px; background:#fff; border-radius:10px; box-shadow:0 2px 6px rgba(0,0,0,0.12); padding:10px; text-align:center;">
+    [[File:Book4.jpg|120px|frameless|center]]
-<div class="company-info">
+    <div style="font-weight:bold; font-size:95%; margin-top:8px;">Book Name</div>
-Country<br>
+    <div style="color:#555; font-size:85%;">by Author</div>
-Founded: Year<br>
+    <div style="font-size:80%; font-style:italic; margin:6px 0;">"Short line..."</div>
-Founder: Name
+    <small>[[Book Page|Read more →]]</small>
-</div>
+  </div>
-<small>[[Company Page|Read More →]]</small>
-</div>
-<!-- Company 4 -->
-<div class="company-card">
-[[File:Logo4.png|110px|frameless|center]]
-<div class="company-title">Company Name</div>
-<div class="company-industry">Industry / Type</div>
-<div class="company-info">
-Country<br>
-Founded: Year<br>
-Founder: Name
-</div>
-<small>[[Company Page|Read More →]]</small>
 </div>
 </div>