kloeckner.com.ar

Index Commits Files Refs README LICENSE

commit b48bb450b3b108ba7fa3efc1fb8595d3397fc1a0
parent 8760dd7960705d91c747de6e23c8f1395ae247bd
Author: mjkloeckner <martinjkloeckner@gmail.com>
Date:   Sat, 17 Feb 2024 21:51:43 -0300

Add animation to "Contact me!" title on about section

Also add other improvements to the stylesheet

Diffstat:
M
css/about_style.css
 | 
33
+++++++++++++++++++++------------
M
css/article_style.css
 | 
7
+++----

2 files changed, 24 insertions(+), 16 deletions(-)
diff --git a/css/about_style.css b/css/about_style.css
@@ -1,23 +1,24 @@
-p {
-    padding-bottom: .5em;
-}
-
 ul {
-    padding-bottom: 1em;
+    padding-left: 0;
     list-style-position: inside;
 }
 
+h4 {
+    padding: 0 0 .5em 0;
+}
+
 .presentation {
     float: left;
     margin-right: 1em;
-    margin-bottom: 1em;
+    /* margin-bottom: 1em; */
+    text-align: center;
 }
 
 .profile_img {
     margin-left: auto;
     margin-right: auto;
 
-    max-width: 16em;
+    max-width: 10em;
 
     border-style: dashed;
     border-color: peru;
@@ -27,6 +28,10 @@ ul {
     box-shadow: 1px 1px 5px black;
 }
 
+.contact_me {
+    animation: blinker 1s linear infinite;
+}
+
 @media (max-width: 800px) {
     .article_bottom_bar{
         width: 45%;
@@ -37,11 +42,9 @@ ul {
         margin-left: auto;
         margin-right: auto;
     }
-    article {
-        text-align: center;
-    }
-    ul {
-        text-align: left;
+    .profile_img {
+        max-width: 75%;
+        margin-bottom: 1em;
     }
 }
 
@@ -50,3 +53,9 @@ ul {
         border-top: 1px dashed #191919;
     }
 }
+
+@keyframes blinker {
+    50% {
+        color: white;
+    }
+}
diff --git a/css/article_style.css b/css/article_style.css
@@ -56,7 +56,6 @@ h2 {
 }
 h3 { font-size: 1.25em; }
 h4 { padding-bottom: .5em; }
-p { padding-bottom: 1em; }
 em { font-weight: bold; }
 
 ul {
@@ -175,6 +174,8 @@ ul {
     #article-title {
         padding-top: .25em;
         padding-bottom: .5em;
+        font-size: 1.5em;
+
     }
     #article-title-with-icon {
         padding-bottom: .75em;
@@ -186,7 +187,6 @@ ul {
     #article-icon {
         padding-right: .5em
     }
-    p { padding-bottom: .5em; }
 }
 
 @media (max-width: 400px) {
@@ -196,7 +196,7 @@ ul {
     #article-title {
         padding-top: .25em;
         padding-bottom: .5em;
-        font-size: 1.5em;
+        font-size: 1.4em;
     }
     #article-title-with-icon {
         padding-bottom: .5em;
@@ -208,7 +208,6 @@ ul {
     #article-icon {
         padding-right: .25em
     }
-    p { padding-bottom: .75em; }
     h2 { padding-bottom: .5em; }
 }