all repos — website @ a6cc416a55737dbd6dd4514a8b38848320ea0229

personal website hosted at prithu.xyz, built using hugo

add css transitions
Prithu Goswami prithugoswami524@gmail.com
Sat, 09 May 2020 12:30:09 +0530
commit

a6cc416a55737dbd6dd4514a8b38848320ea0229

parent

a7f64a048672720837c034994dbdc01bde7f9bfb

2 files changed, 11 insertions(+), 19 deletions(-)

jump to
M hugo-site/static/css/blog.csshugo-site/static/css/blog.css

@@ -45,16 +45,16 @@

.post-labels{ display:flex; flex-wrap: wrap; - margin-left: -0.4rem; + margin-left: -0.2rem; margin-bottom: 2rem; } .post-label{ background-color: rgba(0, 0, 0, 0.15); - border-radius: 0.4rem; - padding: 0.2rem 1rem; - font-size: 0.8rem; - margin: 0.2rem 0.4rem; + border-radius: 0.3rem; + padding: 0.2rem 0.8rem; + font-size: 0.85rem; + margin: 0.2rem 0.2rem; } .posts{

@@ -111,7 +111,6 @@ margin: 0 auto;

} .post-text p{ - text-align: justify; line-height: 1.5; margin: 1rem 0; }
M hugo-site/static/css/main.csshugo-site/static/css/main.css

@@ -79,16 +79,6 @@ /* flex-flow: column; */

/* margin-top: 6rem; */ /* } */ -@keyframes btnup{ - from { - transform: translate(0, 0); - } - to { - transform: translate(0, -2px); - box-shadow: 0px 7px 7px rgba(0,0,0,0.15); - box-shadow: 0 10px 18px rgba(50, 50, 93, 0.25), 0 3px 6px rgba(0, 0, 0, 0.08); - } -} #intro{ margin-top: 6rem;

@@ -216,6 +206,7 @@

.sb{ padding: 15px; display: flex; + transition: transform 150ms ease; box-shadow: 0px 7px 10px rgba(0,0,0,0.20); border-radius: 6px; }

@@ -236,7 +227,7 @@

.sb:hover{ color: #7795f8; transform: translateY(-2px); - box-shadow: 0 10px 18px rgba(50, 50, 93, 0.25), 0 3px 6px rgba(0, 0, 0, 0.08); + box-shadow: 0 10px 18px rgba(50, 50, 93, 0.3), 0 3px 6px rgba(0, 0, 0, 0.08); } .sb:active{

@@ -266,7 +257,7 @@ margin-bottom: 10rem;

} #writeups a:hover{ - color: #4ED44C + color: inherit; } .page-section h1 {

@@ -308,6 +299,7 @@

.page-section .section-sub-text{ margin-left: 1.6rem; margin-bottom: 1rem; + color: rgba(0,0,0,0.7); } .section-item {

@@ -327,10 +319,11 @@ display: inline-block;

padding: 1rem 2rem; border-radius: 6px; box-shadow: 0px 7px 7px rgba(0,0,0,0.15); + transition: transform 150ms ease; } .btn:hover { - transform: translateY(-1px); + transform: translateY(-2px); box-shadow: 0px 7px 7px rgba(0,0,0,0.15); box-shadow: 0 10px 18px rgba(50, 50, 93, 0.25), 0 3px 6px rgba(0, 0, 0, 0.08); }