From 82491bfb248f31735056557ce0689466b6ba1fb4 Mon Sep 17 00:00:00 2001 From: Intetrix Date: Sat, 11 Mar 2023 20:20:15 +0300 Subject: [PATCH 01/17] feat: add html layout (Sat, Mar 11, 2023 08:20:15 PM) --- index.html | 80 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 80 insertions(+) diff --git a/index.html b/index.html index e69de29..9e81b6d 100644 --- a/index.html +++ b/index.html @@ -0,0 +1,80 @@ + + + + + + CSSBayan + + + +
+

CSS Bayan

+
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+
+
+ + From 3245087774814814512418335208df7b06a37280 Mon Sep 17 00:00:00 2001 From: Intetrix Date: Sat, 11 Mar 2023 20:30:15 +0300 Subject: [PATCH 02/17] feat: add container style (Sat, Mar 11, 2023 08:30:14 PM) --- style.css | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) diff --git a/style.css b/style.css index e69de29..92db6f2 100644 --- a/style.css +++ b/style.css @@ -0,0 +1,35 @@ +.container { + max-width: 50vw; + margin: 0 auto; +} + +.accordion__input { + display: none; +} + +h1 { + -webkit-text-stroke: 0.02em rgb(254, 254, 170); +} + +.accordion__icon { + width: 2vw; + transform: translateY(-50%); + transition: 0.5s; +} + +.accordion:hover { + -webkit-text-stroke: 0.01em rgb(254, 254, 170); +} + +.accordion__item-title { + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + font-size: 1.5em; + padding-top: 1em; + padding-bottom: 1em; + box-shadow: 0 -5px 5px -5px #333; + cursor: pointer; + transition: 0.3s all; +} From 5079f8160cbddd341ef879eb1d66554ea87aa6c1 Mon Sep 17 00:00:00 2001 From: Intetrix Date: Sat, 11 Mar 2023 21:24:03 +0300 Subject: [PATCH 03/17] feat: add animation (Sat, Mar 11, 2023 09:24:03 PM) --- style.css | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/style.css b/style.css index 92db6f2..15a07ee 100644 --- a/style.css +++ b/style.css @@ -33,3 +33,29 @@ h1 { cursor: pointer; transition: 0.3s all; } +.accordion__item:hover .accordion__icon { + transform: translateY(-50%) rotate(90deg); + transition: 0.9s; +} + +.accordion__input:checked ~ label .accordion__icon { + transform: translateY(-50%) rotate(180deg); +} + +.accordion__content { + /*width: 30vw;*/ + display: none; + margin-top: 1em; +} + +.accordion__img { + max-width: 100%; + display: block; +} + +.accordion__input:checked ~ label .accordion__img { +} + +.accordion__input:checked ~ label .accordion__content { + display: block; +} From 8561453253ce88701dadc658fb42d759b6269c22 Mon Sep 17 00:00:00 2001 From: Intetrix Date: Sat, 11 Mar 2023 22:38:06 +0300 Subject: [PATCH 04/17] fix: change html tegs (Sat, Mar 11, 2023 10:38:06 PM) --- index.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 9e81b6d..7cfdeea 100644 --- a/index.html +++ b/index.html @@ -19,7 +19,7 @@

CSS Bayan

checked />