Orden en posteos

DemocraciaEnRed · Aug 6, 2024 · ff99ace · ff99ace
1 parent 1cab086
commit ff99ace
Showing 1 changed file with 66 additions and 10 deletions.
diff --git a/post/templates/post/post_page.html b/post/templates/post/post_page.html
@@ -17,26 +17,82 @@
   }
   .rich-text a {
     text-decoration: underline;
-    color: aqua;
+    color: blue;
   }
 </style>
 {% endblock %}
 
+{% block body_class %}bg-white{% endblock %}
+
 {% block content %}
 <div class="w-full aspect-5/1 overflow-hidden">
   {% srcset_image page.banner width-{400,800} class="w-full object-cover" style="height: 30vh!important" %}
 </div>
-<div class="py-20 container w-8/12 mx-auto text-white">
-  <h1 class="text-3xl text-white font-bold">{{ page.title }}</h1>
-  <p class="text-xl text-white my-4">Por {{ page.author }}</p>
-  <div class="[&>p]:pb-3 rich-text">
-    {{ page.body|richtext }}
+
+<div class="container mx-auto flex flex-row flex-wrap lg:justify-center py-20">
+  <div class=" lg:w-8/12">
+    <h1 class="text-3xl  font-bold">{{ page.title }}</h1>
+    <p class="text-xl  my-4">Por {{ page.author }}</p>
+    <div class="[&>p]:pb-3 rich-text text-justify">{{ page.body|richtext }}</div>
+      <p class="text-md text-center mt-4 mb-2">Compartí esta nota en:</p>
+      <div class="flex justify-center">
+        <a 
+          class="m-1 p-3 border"
+          href="https://www.instagram.com/democraciaenred/"
+          target="_blank"
+          rel="noopener noreferrer"          
+          > 
+            <i class="bi-whatsapp"></i> Whatsapp
+        </a>
+        <a 
+          class="m-1 p-3 border"
+          href="https://x.com/"
+          target="_blank"
+          rel="noopener noreferrer"          
+          > 
+            <i class="bi-twitter"></i> Twitter
+        </a>
+        <a 
+          class="m-1 p-3 border"
+          href="https://www.linkedin.com/company/democracia-en-red/"
+          target="_blank"
+          rel="noopener noreferrer"          
+          > 
+            <i class="bi-linkedin"></i> Linkedin
+        </a>
+        <!-- <a 
+          href="" 
+          class="m-1 p-3 border"
+          href="https://www.instagram.com/democraciaenred/"
+          target="_blank"
+          rel="noopener noreferrer"          
+          > 
+            <i class="bi-instagram"></i> Instagram
+        </a> -->
+      </div>
+      <div class="flex justify-center">
+        <a 
+          class="mt-8 p-3 border"
+          href="/"
+          > 
+            <i class="bi-arrow-return-left"></i> Volver al blog
+        </a>
+      </div>      
+    <!-- <p class="text-md  mt-5 mb-2">También te podría interesar</p> -->
+  </div>
+  <div class=" lg:w-2/12 lg:text-right">
+    <p class="text-md  font-bold mt-8">Autor/a</p>
+    <p class="text-sm  mt-1">{{ page.author }}</p>
+    <p class="text-md  font-bold mt-8">Publicado</p>
+    <p class="text-sm  mt-1">{{ page.date }}</p>    
+    <p class="text-md  font-bold mt-8">Etiquetas</p>
+    <p class="text-sm">
+      {% for tag in page.tags.all %}
+      <p class="mt-1 "><span class="py-1 px-2 bg-yellow text-black rounded-full text-xs">{{tag}}</span></p>
+    {% endfor %}      
+    </p>
   </div>
-<div>
-    <p>{{ page.date }}</p>
-</div>
 </div>
-
 
 
 {% endblock content %}