From 9df4d4c043e8488bd0fab6734c01a06e265fcb5a Mon Sep 17 00:00:00 2001 From: TeshuKatepalli Date: Thu, 7 Dec 2023 13:34:00 +0530 Subject: [PATCH] Updated minor css issues --- blocks/connect/connect.css | 3 +- blocks/timeline-slide/timeline-slide.css | 48 ++++++++++++------------ blocks/vimeo/vimeo.css | 3 +- styles/Typo.css | 2 +- templates/Anniversary/Anniversary.css | 21 ++++++----- 5 files changed, 39 insertions(+), 38 deletions(-) diff --git a/blocks/connect/connect.css b/blocks/connect/connect.css index fb540281..a0dfa350 100644 --- a/blocks/connect/connect.css +++ b/blocks/connect/connect.css @@ -1,7 +1,6 @@ /* connet css */ .linkedin-bottom { - padding-top: 80px; - padding-bottom: 80px; + padding: 70px 0; } .linkedin-bottom .outer { diff --git a/blocks/timeline-slide/timeline-slide.css b/blocks/timeline-slide/timeline-slide.css index 31f84ad5..cb161dfd 100644 --- a/blocks/timeline-slide/timeline-slide.css +++ b/blocks/timeline-slide/timeline-slide.css @@ -3,12 +3,12 @@ display: flex; flex-direction: column; align-items: center; - padding: 80px 0; + padding-top: 70px; overflow: hidden; } /* Slider styles */ - #year-slider { + .timeline-slide #year-slider { display: flex; overflow: hidden; transform: translate3d(43%, 0, 0); @@ -17,7 +17,7 @@ padding-bottom: 20px; } - .year { + .timeline-slide .year { cursor: pointer; border-radius: 5px; color: #dbdbdb; @@ -28,18 +28,18 @@ width: 160px; } - .year.active { + .timeline-slide .year.active { color: #f49600; transition: 0.3s all ease-in-out; } /* Content area styles */ - #content-slider-container { + .timeline-slide #content-slider-container { position: relative; width: 100%; } - #content-slider { + .timeline-slide #content-slider { /* width: 100%; */ display: flex; align-items: center; @@ -49,7 +49,7 @@ overflow: hidden; } - #content-slider li::before { + .timeline-slide #content-slider li::before { color: var(--primary-color); content: "\25A0"; font-family: Arial; @@ -60,7 +60,7 @@ top: 0.45em; } - .year-content { +.timeline-slide .year-content { display: none; transition: transform 0.5s ease, opacity 0.5s ease; opacity: 0; @@ -68,14 +68,14 @@ right: 0; } - .year-content.active { + .timeline-slide .year-content.active { display: block; opacity: 1; transform: translateX(0); } /* buttons */ - .button-container { + .timeline-slide .button-container { width: 100%; position: absolute; height: 100%; @@ -88,13 +88,13 @@ justify-content: space-between; } - .button-container .hide { + .timeline-slide .button-container .hide { opacity: .35; cursor: auto; pointer-events: none; } - .button-prev { + .timeline-slide .button-prev { border: 2px solid #f49600; border-radius: 50%; color: #f49600; @@ -109,7 +109,7 @@ margin: 15px; } - .button-prev::after { + .timeline-slide .button-prev::after { content: ''; border: 2px solid #f49600; border-width: 0 2px 2px 0; @@ -123,7 +123,7 @@ height: 20px; } - .button-next { + .timeline-slide .button-next { border: 2px solid #f49600; border-radius: 50%; color: #f49600; @@ -140,24 +140,24 @@ - .button-next:hover { + .timeline-slide .button-next:hover { background-color: #f49600; } - .button-next:hover::after { + .timeline-slide .button-next:hover::after { border-color: #fff; } - .button-prev:hover { + .timeline-slide .button-prev:hover { background-color: #f49600; } - .button-prev:hover::after { + .timeline-slide .button-prev:hover::after { border-color: #fff; } - .button-next::after { + .timeline-slide .button-next::after { content: ''; border: 2px solid #f49600; border-width: 0 2px 2px 0; @@ -172,26 +172,26 @@ } @media (max-width: 767px) { - .timeline-slide { + .timeline-slide .timeline-slide { padding: 60px 0; } - #content-slider { + .timeline-slide #content-slider { margin: 0 30px; } - .button-container { + .timeline-slide .button-container { position: relative; justify-content: center; margin-top: 32px; height: 54px; } - .button-prev { + .timeline-slide .button-prev { margin-right: 5px; } - .year { + .timeline-slide .year { width: 150px; } } \ No newline at end of file diff --git a/blocks/vimeo/vimeo.css b/blocks/vimeo/vimeo.css index 5d8f6e16..bfefd6af 100644 --- a/blocks/vimeo/vimeo.css +++ b/blocks/vimeo/vimeo.css @@ -1,4 +1,3 @@ .vimeo { - padding-top: 50px; - padding-bottom: 50px; + padding-top: 70px; } \ No newline at end of file diff --git a/styles/Typo.css b/styles/Typo.css index 2eeaf512..64614592 100644 --- a/styles/Typo.css +++ b/styles/Typo.css @@ -639,7 +639,7 @@ input[type="submit"] { .button.secondary { background-color: transparent; - padding: 0; + padding: 0!important; border: none; color: #ec8f2d; text-transform: none; diff --git a/templates/Anniversary/Anniversary.css b/templates/Anniversary/Anniversary.css index ef6388c2..9c51edc1 100644 --- a/templates/Anniversary/Anniversary.css +++ b/templates/Anniversary/Anniversary.css @@ -1,38 +1,41 @@ /* Default template css */ -.default-content-wrapper { +.anniversary .default-content-wrapper { text-align: left!important; } -.default-content-wrapper h2:first-child { +.anniversary .default-content-wrapper h2:first-child { margin-top: 0px!important; } -.outer { +.anniversary .sidebar-section #content-wrapper .outer { display: flex; justify-content: space-between; } -#main { +.anniversary .sidebar-section #content-wrapper #content { + padding-bottom: 0px; +} + +.anniversary #main { float: none; } -#sidebar { +.anniversary #sidebar { position: sticky; top: 130px; - float: none; } @media (max-width: 960px) { - #sidebar { + .anniversary #sidebar { top: 80px; } } @media (max-width: 860px) { - .outer { + .anniversary .sidebar-section #content-wrapper .outer { flex-direction: column; } - #sidebar { + .anniversary #sidebar { max-height: none; } } \ No newline at end of file