From f160fd34d019f0ec31aa96ea8cf4e4f68f0323a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Crist=C3=B3bal=20Sep=C3=BAlveda?=
 <31328132+crizconzeta@users.noreply.github.com>
Date: Tue, 28 Jan 2025 16:32:46 -0300
Subject: [PATCH 1/3] =?UTF-8?q?Propuesta=20de=20dise=C3=B1o=20en=20base=20?=
 =?UTF-8?q?a=20colores=20para=20identidad=20visual?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pycltheme/static/css/cl.css         | 128 +++++++++++++++++++++-------
 pycltheme/templates/footer.html     |   2 +-
 pycltheme/templates/headermeta.html |   1 +
 pycltheme/templates/index.html      |   2 +-
 4 files changed, 100 insertions(+), 33 deletions(-)

diff --git a/pycltheme/static/css/cl.css b/pycltheme/static/css/cl.css
index 70d7cec..f5378e6 100644
--- a/pycltheme/static/css/cl.css
+++ b/pycltheme/static/css/cl.css
@@ -1,18 +1,54 @@
 :root {
     --cl-blue: #0057a8;
     --cl-red: #e22914;
+
+    /* Colores principales (brand) */
+    --color-primary: #007BFF;     
+    --color-primary-light: #4DAFFF; 
+    
+    /* Colores de énfasis y acción */
+    --color-accent: #D41C0F;     
+    --color-highlight: #FFC300;  
+    
+    /* Colores neutrales/base */
+    --color-text: #151F27;        
+    --color-text-secondary: #333333; 
+    
+    /* Colores de fondo */
+    --color-background: #FFFFFF;   
+    --color-background-alt: #FAFAFA; 
+    --color-background-dark: #151F27; 
+
+    /* Colores de interfaz */
+    --color-border: #C4C4C4;     
+}
+
+.bg-gradiente {
+  background: linear-gradient(to bottom, var(--cl-blue) 0%, var(--color-primary) 90%, var(--color-primary-light) 100%);
 }
 
 * {
   font-family: 'Open Sans', sans-serif;
 }
 
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 700;
+}
+
+
+.body {
+  background-color: var(--color-background);
+  color: var(--color-text);
+}
+
 .navbar-dark .navbar-nav .nav-link {
   color: white;
 }
 
 .navbar-dark .navbar-nav .nav-link:hover {
-  color: #e1432e;
+  color: var(--color-highlight);
 }
 
 .navbar-dark .navbar-brand {
@@ -21,12 +57,12 @@
 }
 
 a {
-    color: var(--cl-blue);
+    color: var(--color-primary);
     text-decoration: underline;
 }
 
 a:hover {
-    color: var(--cl-red);
+    color: var(--color-accent);
 }
 
 
@@ -34,7 +70,7 @@ a:hover {
   color: white;
   height: 20vh;
   min-height: 230px;
-  background-color: #343a40;
+  background-color: var(--color-background-dark);
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
@@ -44,7 +80,7 @@ a:hover {
   color: white;
   height: 5vh;
   min-height: 80px;
-  background-color: #343a40;
+  background-color: var(--color-background-dark);
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
@@ -99,7 +135,7 @@ a:hover {
 }
 
 .entradas-blog {
-  background: #e3e3e3;
+  background: var(--color-background-alt);
 }
 
 .redes-sociales {
@@ -110,13 +146,15 @@ a:hover {
 
 .plataformas {
   /*background: #343a40;*/
-  background: var(--cl-blue);
+  /*background: var(--cl-blue);*/
+  background: linear-gradient(to bottom, var(--cl-blue) 0%, var(--color-primary) 60%, var(--color-primary-light) 100%);
+
   padding-top: 10px;
   padding-bottom: 10px;
 }
 
 .fondo-noche {
-  background: #132e45;
+  background: var(--color-background-dark);
   padding-top: 10px;
   padding-bottom: 10px;
 }
@@ -140,7 +178,7 @@ a:hover {
 }
 
 .fab:hover {
-  color: rgba(255, 67, 46, 1);
+  color: var(--color-highlight);
 }
 
 .patrocinadores {
@@ -154,6 +192,7 @@ a:hover {
   height: 8vw;
   object-fit: cover;
   max-height: 30vh;
+  border-radius: 1em 1em 0 0;
 }
 
 .card-img-top-coord {
@@ -167,22 +206,39 @@ a:hover {
   margin: 0 auto; /* Added */
   float: none; /* Added */
   margin-bottom: 10px; /* Added */
+  border-radius: 1em;
+  box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
 }
 
 .card-text-coord {
   font-size: 10pt;
 }
 
-.card-footer {
-  padding: 5px;
-}
-
 .card-title {
   font-size: 0.9em;
 }
 
 .card-subtitle {
+  font-size: 0.7em;
+}
+
+
+.card-footer {
+  padding: 1em;
   font-size: 0.9em;
+  color: white !important;
+  background-color: var(--color-border);
+  border-top: 1px solid var(--color-border);
+  border-radius: 0 0 1em 1em !important;
+}
+
+
+.card-footer .url.fn {
+  color: var(--color-highlight);
+  background-color: var(--color-background-dark);
+  padding: 0.5em;
+  border-radius: 0.5em;
+  font-size: 0.75em;
 }
 
 .list-inline-item {
@@ -191,8 +247,8 @@ a:hover {
 
 /* Footer */
 .footer {
-  background: var(--cl-blue);
-  color:white;
+  background: var(--color-background-dark);
+  color:white !important;
 }
 
 .enlaces ul {
@@ -236,19 +292,19 @@ a:hover {
 }
 
 .entry-subtitle {
-  color: #58636d;
-  border-left:  5px solid rgba(225, 45, 27, 0.8);
-  padding-left: 5px;
-  margin-left: 5px;
+  color: var(--color-text-secondary);
+  border-left:  0.5em solid var(--color-accent);
+  padding-left: 0.5em;
+  margin-left: 0.5em;
 }
 
 blockquote {
-  color: #58636d;
-  border-left:  5px solid rgba(1, 87, 168, 0.8);
+  color: var(--color-primary);
+  border-left:  5px solid var(--color-primary-light);
   padding-left: 15px;
   padding-top: 5px;
   padding-bottom: 5px;
-  background-color: #f5f8f8;
+  background-color: var(--color-background);
 }
 
 .vauto {
@@ -287,15 +343,19 @@ blockquote {
  .btn-default:active,
  .btn-default:visited,
  .btn-default:focus {
-    background-color: #132e45;
-    border-color: white;
+    background-color: var(--color-accent);
     color:white;
     display: flex;
     align-items: center;
-}
+    text-decoration: none;
+    font-weight: 600;
+    text-transform: uppercase;
+    padding: 0.5em;
+    border-radius: 0.8em !important;
+  }
  .btn-default:hover {
-   background-color: #859bee;
-   border-color: #859bee;
+   background-color: var(--cl-blue);
+   border-color: var(--cl-blue);
    text-decoration: none;
 }
 
@@ -435,7 +495,6 @@ ul.navbar-nav {
 
 .bg-pyladies {
   background-color: pink !important;
-
 }
 
 .bg-pyladies a {
@@ -450,8 +509,9 @@ ul.navbar-nav {
 }
 
 .titulo-bold {
-  color: #343a40;
-  font-weight: 800;
+  color: var(--color-text);
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 700;
 }
 
 .w-30 {
@@ -467,8 +527,13 @@ ul.navbar-nav {
 }
 
 .btn-primary {
-    background-color: var(--cl-blue);
+    background-color: var(--color-primary);
+    color: white;
     text-decoration: none;
+    font-weight: 600;
+    text-transform: uppercase;
+    padding: 0.5em;
+    border-radius: 0.8em !important;
 }
 
 
@@ -494,3 +559,4 @@ ul.navbar-nav {
   max-height: 75vh;
   object-fit: cover;
 }
+
diff --git a/pycltheme/templates/footer.html b/pycltheme/templates/footer.html
index 4129db4..950ecae 100644
--- a/pycltheme/templates/footer.html
+++ b/pycltheme/templates/footer.html
@@ -42,7 +42,7 @@ <h4 class="mt-lg-0 mt-sm-4">Contacto</h4>
       </div>
       <div class="row mt-5">
         <div class="col copyright text-center">
-          <p class=""><small class="text-white-50">Copyright © 2022 Python Chile. Todos los derechos reservados</small></p>
+          <p class=""><small class="text-white-50">Copyright © 2022 - 2025 Python Chile. Todos los derechos reservados</small></p>
         </div>
       </div>
     </div>
diff --git a/pycltheme/templates/headermeta.html b/pycltheme/templates/headermeta.html
index bf5372c..4db71b8 100644
--- a/pycltheme/templates/headermeta.html
+++ b/pycltheme/templates/headermeta.html
@@ -13,6 +13,7 @@
         <link rel="shortcut icon" type="image/png" href="{{ SITEURL }}/images/favicon.png"/>
         <link rel="preconnect" href="https://fonts.googleapis.com">
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
         <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap" rel="stylesheet">
         <script src="https://kit.fontawesome.com/6cf87c29c5.js" crossorigin="anonymous"></script>
 
diff --git a/pycltheme/templates/index.html b/pycltheme/templates/index.html
index 8edfc49..9626208 100644
--- a/pycltheme/templates/index.html
+++ b/pycltheme/templates/index.html
@@ -25,7 +25,7 @@ <h3 class="text-center pb-5 mb-3 titulo-bold">ÚLTIMAS ENTRADAS</h3>
 
 {% include 'communities.html'%}
 <!-- Patrocinios -->
-<section class="fondo-gris pt-3 pb-1">
+<section class="bg-gradiente pt-3 pb-1">
   <div class="container">
     <div class="text-white pb-3 text-center">
       <h2>Nuestros Patrocinantes</h2>

From d9c9840e60def6bddf9a2faf899c2291b4689e8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Crist=C3=B3bal=20Sep=C3=BAlveda?=
 <31328132+crizconzeta@users.noreply.github.com>
Date: Thu, 30 Jan 2025 19:22:30 -0300
Subject: [PATCH 2/3] Corregir color y peso para los tags

---
 pycltheme/static/css/cl.css | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/pycltheme/static/css/cl.css b/pycltheme/static/css/cl.css
index f5378e6..04462f1 100644
--- a/pycltheme/static/css/cl.css
+++ b/pycltheme/static/css/cl.css
@@ -166,7 +166,7 @@ a:hover {
 }
 
 .fondo-celeste {
-  background: #4182bf;
+  background: var(--color-primary);
   padding-top: 10px;
   padding-bottom: 10px;
 }
@@ -226,7 +226,6 @@ a:hover {
 .card-footer {
   padding: 1em;
   font-size: 0.9em;
-  color: white !important;
   background-color: var(--color-border);
   border-top: 1px solid var(--color-border);
   border-radius: 0 0 1em 1em !important;
@@ -234,8 +233,8 @@ a:hover {
 
 
 .card-footer .url.fn {
-  color: var(--color-highlight);
-  background-color: var(--color-background-dark);
+  color: var(--color-primary);
+  /*background-color: var(--color-background-dark);*/
   padding: 0.5em;
   border-radius: 0.5em;
   font-size: 0.75em;
@@ -283,7 +282,7 @@ a:hover {
 }
 
 .published {
-  color: #0157a8;
+  color: var(--cl-blue);
   font-size: 0.9em;
 }
 
@@ -322,7 +321,7 @@ blockquote {
 }
 
 .red {
-  color: #e12d1b;
+  color: var(--cl-red);
   font-style: normal;
 }
 

From 36b82243a3333b7ff7f5b5c447f23dabee4e6744 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Crist=C3=B3bal?=
 <31328132+crizconzeta@users.noreply.github.com>
Date: Fri, 31 Jan 2025 15:29:59 -0300
Subject: [PATCH 3/3] Update pycltheme/static/css/cl.css
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Agrega sugerencia respecto al tamaño del texto de los tags

Co-authored-by: Carlos Carrasco Varas <matrix.carlos@gmail.com>
---
 pycltheme/static/css/cl.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pycltheme/static/css/cl.css b/pycltheme/static/css/cl.css
index 04462f1..a0e2115 100644
--- a/pycltheme/static/css/cl.css
+++ b/pycltheme/static/css/cl.css
@@ -237,7 +237,7 @@ a:hover {
   /*background-color: var(--color-background-dark);*/
   padding: 0.5em;
   border-radius: 0.5em;
-  font-size: 0.75em;
+  font-size: 1em;
 }
 
 .list-inline-item {