From 6a6fab074586377b925ece337c7e387db1e4bd53 Mon Sep 17 00:00:00 2001 From: Cashass Date: Mon, 3 Oct 2022 19:55:38 +0200 Subject: [PATCH 01/12] add files popup --- submissions/Cashass/HTML-CSS-Popup/index.html | 100 ++++++++++ submissions/Cashass/HTML-CSS-Popup/style.css | 173 ++++++++++++++++++ 2 files changed, 273 insertions(+) create mode 100644 submissions/Cashass/HTML-CSS-Popup/index.html create mode 100644 submissions/Cashass/HTML-CSS-Popup/style.css diff --git a/submissions/Cashass/HTML-CSS-Popup/index.html b/submissions/Cashass/HTML-CSS-Popup/index.html new file mode 100644 index 0000000000..092144c78f --- /dev/null +++ b/submissions/Cashass/HTML-CSS-Popup/index.html @@ -0,0 +1,100 @@ + + + + + Popup-menu + + + + + + + +
+
+ +
+
+ + + diff --git a/submissions/Cashass/HTML-CSS-Popup/style.css b/submissions/Cashass/HTML-CSS-Popup/style.css new file mode 100644 index 0000000000..2e373afdd9 --- /dev/null +++ b/submissions/Cashass/HTML-CSS-Popup/style.css @@ -0,0 +1,173 @@ +* { + padding: 0; + margin: 0; +} + +html,body{ + height: 100%; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + font-size: 16px; +} + +.wraper { + max-width: 100%; + margin: 0 auto; + display: grid; + grid-template-rows: auto 1fr auto; + min-height: 100vh; + background-color: #ffe6cc; +} + +.header { + display: flex; + justify-content: end; +} + +.header__lists { + display: flex; + list-style: none; +} + +.header__list { + margin: 10px; + position: relative; + vertical-align: middle; + align-items: center; + display: flex; +} + +.header__link { + display: block; + padding: 10px; + font-size: 20px; + color: #000; + border-radius: 5px; + text-decoration: none; +} + +.header__link:focus, +.header__link:focus-within, +.header__link:hover { + border: 1px solid #7a7a52; + border-radius: 5px; +} + +.header__input { + appearance: none; + position: absolute; +} + +.header__logo-menu, +.sub__check-label { + display: block; + cursor: pointer; +} + +.popup { + position: absolute; + display: none; + top: 80px; + right: -150px; + width: 380px; + height: 310px; + overflow: scroll; + overflow-x: hidden; + border: 1px solid #7a7a52; + border-radius: 5px; + padding: 10px; + background-color: #ffffe6; +} + +.header__input:checked~.popup { + display: block; +} +.header__lists-popup { + display: grid; + grid-template-columns: repeat(3, 100px); + grid-template-rows: repeat(1, 1fr); + gap: 1em; + padding: 5px; + align-items: end; + +} +.header__input-label { + position: relative; +} + +.popup-img { + display: block; + max-width: 90%; + max-height: 90%; + margin: auto; +} + +.popup__link { + padding: 5px; + width: 100px; + height: 60px; + text-align: center; + text-decoration: none; + font-size: 16px; + color: #000; +} + +.popup__link:focus, +.popup__link:hover { + border: 1px solid #7a7a52; + border-radius: 5px; +} + +.sub__check-label { + display: block; + padding: 0; + margin: 30px 0px 30px 0px; + font-size: 20px; + text-align: center; + text-transform: uppercase; + background-color: #d6d6c2; + border: 1px solid transparent; +} + +.sub__check-label:focus, +.sub__check-label:focus-within, +.sub__check-label:hover { + border: 1px solid #7a7a52; +} + +.sub__check-input { + appearance: none; + position: absolute; +} + +.sub__check-input:checked~.sub__lists-popup { + display: block; + display: grid; +} + +.sub__check-input:checked~.sub__check-label { + display: none; +} + +.sub__lists-popup { + display: grid; + gap: 1em; + align-items: end; + display: none; + grid-template-columns: repeat(3, 100px); + grid-template-rows: repeat(1, 1fr); + padding-top: 30px; + margin-top: 30px; + border-top: 1px solid #7a7a52; +} + +.sub__popup-img { + display: block; + max-width: 90%; + max-height: 90%; + margin: 0px auto; +} + +.notification, +.avatar { + display: block; +} From d1022c537bf6beef73cbf5fb241068384e1ce75c Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Tue, 4 Oct 2022 18:05:45 +0200 Subject: [PATCH 02/12] Update index.html amended document --- submissions/Cashass/HTML-CSS-Popup/index.html | 183 +++++++++--------- 1 file changed, 89 insertions(+), 94 deletions(-) diff --git a/submissions/Cashass/HTML-CSS-Popup/index.html b/submissions/Cashass/HTML-CSS-Popup/index.html index 092144c78f..bfef275fd2 100644 --- a/submissions/Cashass/HTML-CSS-Popup/index.html +++ b/submissions/Cashass/HTML-CSS-Popup/index.html @@ -1,100 +1,95 @@ + + Popup-menu + + + + + - - Popup-menu - - - - - + +
+
+ +
+
+ From b3582e27d78150407f10c5f3a8bc5b1c376d5c8b Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Tue, 4 Oct 2022 18:09:32 +0200 Subject: [PATCH 03/12] Update style.css amended document --- submissions/Cashass/HTML-CSS-Popup/style.css | 202 +++++++++---------- 1 file changed, 101 insertions(+), 101 deletions(-) diff --git a/submissions/Cashass/HTML-CSS-Popup/style.css b/submissions/Cashass/HTML-CSS-Popup/style.css index 2e373afdd9..940944929a 100644 --- a/submissions/Cashass/HTML-CSS-Popup/style.css +++ b/submissions/Cashass/HTML-CSS-Popup/style.css @@ -1,173 +1,173 @@ * { - padding: 0; - margin: 0; + padding: 0; + margin: 0; } -html,body{ - height: 100%; - font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; - font-size: 16px; +html, +body { + height: 100%; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + font-size: 16px; } .wraper { - max-width: 100%; - margin: 0 auto; - display: grid; - grid-template-rows: auto 1fr auto; - min-height: 100vh; - background-color: #ffe6cc; + max-width: 100%; + margin: 0 auto; + display: grid; + grid-template-rows: auto 1fr auto; + min-height: 100vh; + background-color: #ffe6cc; } .header { - display: flex; - justify-content: end; + display: flex; + justify-content: end; } .header__lists { - display: flex; - list-style: none; + display: flex; + list-style: none; } .header__list { - margin: 10px; - position: relative; - vertical-align: middle; - align-items: center; - display: flex; + margin: 10px; + position: relative; + vertical-align: middle; + align-items: center; + display: flex; } .header__link { - display: block; - padding: 10px; - font-size: 20px; - color: #000; - border-radius: 5px; - text-decoration: none; + display: block; + padding: 10px; + font-size: 20px; + color: #000; + border-radius: 5px; + text-decoration: none; } .header__link:focus, .header__link:focus-within, .header__link:hover { - border: 1px solid #7a7a52; - border-radius: 5px; + border: 1px solid #7a7a52; + border-radius: 5px; } .header__input { - appearance: none; - position: absolute; + appearance: none; + position: absolute; } .header__logo-menu, .sub__check-label { - display: block; - cursor: pointer; + display: block; + cursor: pointer; } .popup { - position: absolute; - display: none; - top: 80px; - right: -150px; - width: 380px; - height: 310px; - overflow: scroll; - overflow-x: hidden; - border: 1px solid #7a7a52; - border-radius: 5px; - padding: 10px; - background-color: #ffffe6; -} - -.header__input:checked~.popup { - display: block; + position: absolute; + display: none; + top: 80px; + right: -150px; + width: 380px; + height: 310px; + overflow: scroll; + overflow-x: hidden; + border: 1px solid #7a7a52; + border-radius: 5px; + padding: 10px; + background-color: #ffffe6; +} + +.header__input:checked ~ .popup { + display: block; } .header__lists-popup { - display: grid; - grid-template-columns: repeat(3, 100px); - grid-template-rows: repeat(1, 1fr); - gap: 1em; - padding: 5px; - align-items: end; - + display: grid; + grid-template-columns: repeat(3, 100px); + grid-template-rows: repeat(1, 1fr); + gap: 1em; + padding: 5px; + align-items: end; } .header__input-label { - position: relative; + position: relative; } .popup-img { - display: block; - max-width: 90%; - max-height: 90%; - margin: auto; + display: block; + max-width: 90%; + max-height: 90%; + margin: auto; } .popup__link { - padding: 5px; - width: 100px; - height: 60px; - text-align: center; - text-decoration: none; - font-size: 16px; - color: #000; + padding: 5px; + width: 100px; + height: 60px; + text-align: center; + text-decoration: none; + font-size: 16px; + color: #000; } .popup__link:focus, .popup__link:hover { - border: 1px solid #7a7a52; - border-radius: 5px; + border: 1px solid #7a7a52; + border-radius: 5px; } -.sub__check-label { - display: block; - padding: 0; - margin: 30px 0px 30px 0px; - font-size: 20px; - text-align: center; - text-transform: uppercase; - background-color: #d6d6c2; - border: 1px solid transparent; +.sub__check-label { + display: block; + padding: 0; + margin: 30px 0px 30px 0px; + font-size: 20px; + text-align: center; + text-transform: uppercase; + background-color: #d6d6c2; + border: 1px solid transparent; } .sub__check-label:focus, .sub__check-label:focus-within, .sub__check-label:hover { - border: 1px solid #7a7a52; + border: 1px solid #7a7a52; } .sub__check-input { - appearance: none; - position: absolute; + appearance: none; + position: absolute; } -.sub__check-input:checked~.sub__lists-popup { - display: block; - display: grid; +.sub__check-input:checked ~ .sub__lists-popup { + display: block; + display: grid; } -.sub__check-input:checked~.sub__check-label { - display: none; +.sub__check-input:checked ~ .sub__check-label { + display: none; } .sub__lists-popup { - display: grid; - gap: 1em; - align-items: end; - display: none; - grid-template-columns: repeat(3, 100px); - grid-template-rows: repeat(1, 1fr); - padding-top: 30px; - margin-top: 30px; - border-top: 1px solid #7a7a52; + display: grid; + gap: 1em; + align-items: end; + display: none; + grid-template-columns: repeat(3, 100px); + grid-template-rows: repeat(1, 1fr); + padding-top: 30px; + margin-top: 30px; + border-top: 1px solid #7a7a52; } .sub__popup-img { - display: block; - max-width: 90%; - max-height: 90%; - margin: 0px auto; + display: block; + max-width: 90%; + max-height: 90%; + margin: 0px auto; } .notification, .avatar { - display: block; + display: block; } From dda9bd581fba750a888493ee204a533c726101c4 Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Fri, 7 Oct 2022 12:20:36 +0200 Subject: [PATCH 04/12] Update index.html added li --- submissions/Cashass/HTML-CSS-Popup/index.html | 191 +++++++++++++----- 1 file changed, 143 insertions(+), 48 deletions(-) diff --git a/submissions/Cashass/HTML-CSS-Popup/index.html b/submissions/Cashass/HTML-CSS-Popup/index.html index bfef275fd2..06dbe18bfb 100644 --- a/submissions/Cashass/HTML-CSS-Popup/index.html +++ b/submissions/Cashass/HTML-CSS-Popup/index.html @@ -2,7 +2,7 @@ Popup-menu - + @@ -21,64 +21,159 @@ Images
  • - Повідомлення + Повідомлення
  • From 94c31a11eb4156184868d7cb52afbccf7d4f2ada Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Fri, 7 Oct 2022 12:21:47 +0200 Subject: [PATCH 05/12] Update style.css made changes in connection with the addition li to html --- submissions/Cashass/HTML-CSS-Popup/style.css | 53 +++++++++++++------- 1 file changed, 34 insertions(+), 19 deletions(-) diff --git a/submissions/Cashass/HTML-CSS-Popup/style.css b/submissions/Cashass/HTML-CSS-Popup/style.css index 940944929a..1259f34583 100644 --- a/submissions/Cashass/HTML-CSS-Popup/style.css +++ b/submissions/Cashass/HTML-CSS-Popup/style.css @@ -70,7 +70,7 @@ body { top: 80px; right: -150px; width: 380px; - height: 310px; + height: 300px; overflow: scroll; overflow-x: hidden; border: 1px solid #7a7a52; @@ -82,33 +82,41 @@ body { .header__input:checked ~ .popup { display: block; } + .header__lists-popup { display: grid; - grid-template-columns: repeat(3, 100px); + grid-template-columns: repeat(3, 110px); grid-template-rows: repeat(1, 1fr); - gap: 1em; + gap: 15px; padding: 5px; align-items: end; + list-style-type: none; } + .header__input-label { position: relative; } +.popup__list { + padding: 5px; + width: 110px; + height: 60px; + text-align: center; + font-size: 16px; +} + .popup-img { display: block; max-width: 90%; max-height: 90%; - margin: auto; + margin: 0 auto; } .popup__link { - padding: 5px; - width: 100px; - height: 60px; - text-align: center; + display: block; text-decoration: none; - font-size: 16px; color: #000; + padding: 3px; } .popup__link:focus, @@ -128,20 +136,22 @@ body { border: 1px solid transparent; } -.sub__check-label:focus, -.sub__check-label:focus-within, -.sub__check-label:hover { - border: 1px solid #7a7a52; -} - .sub__check-input { appearance: none; position: absolute; + margin-top: 29px; + border: 1px solid transparent; + width: 362px; + height: 27px; } +.sub__check-input:focus, +.sub__check-input:focus-within, +.sub__check-input:hover { + border: 1px solid #7a7a52; +} .sub__check-input:checked ~ .sub__lists-popup { display: block; - display: grid; } .sub__check-input:checked ~ .sub__check-label { @@ -149,11 +159,16 @@ body { } .sub__lists-popup { + display: none; + padding: 5px; +} + +.sub__lists { display: grid; - gap: 1em; + gap: 15px; align-items: end; - display: none; - grid-template-columns: repeat(3, 100px); + list-style-type: none; + grid-template-columns: repeat(3, 110px); grid-template-rows: repeat(1, 1fr); padding-top: 30px; margin-top: 30px; From be70f5f5690127deff3063af0b8441ccf75ebb3f Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Sun, 9 Oct 2022 10:11:32 +0200 Subject: [PATCH 06/12] Update style.css Add (.sub__check-input:checked display: none; ) --- submissions/Cashass/HTML-CSS-Popup/style.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/submissions/Cashass/HTML-CSS-Popup/style.css b/submissions/Cashass/HTML-CSS-Popup/style.css index 1259f34583..eb727f9394 100644 --- a/submissions/Cashass/HTML-CSS-Popup/style.css +++ b/submissions/Cashass/HTML-CSS-Popup/style.css @@ -158,6 +158,10 @@ body { display: none; } +.sub__check-input:checked { + display: none; +} + .sub__lists-popup { display: none; padding: 5px; From ae8df53fc2f380f84f2b63e939219be4864cccc2 Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Sun, 9 Oct 2022 11:00:34 +0200 Subject: [PATCH 07/12] Update index.html MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Added # in Новини, no matter how the page reloads. --- submissions/Cashass/HTML-CSS-Popup/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/submissions/Cashass/HTML-CSS-Popup/index.html b/submissions/Cashass/HTML-CSS-Popup/index.html index 06dbe18bfb..216428c437 100644 --- a/submissions/Cashass/HTML-CSS-Popup/index.html +++ b/submissions/Cashass/HTML-CSS-Popup/index.html @@ -90,7 +90,7 @@ >
  • @@ -49,7 +49,7 @@ КалендарКалендар @@ -58,7 +58,7 @@ КалькуляторКалькулятор @@ -67,7 +67,7 @@ КонтактиКонтакти @@ -76,7 +76,7 @@ КонтролерКонтролер @@ -85,7 +85,7 @@ МапаМапа @@ -94,7 +94,7 @@ НовиниНовини @@ -103,7 +103,7 @@ НотаткиНотатки @@ -112,7 +112,7 @@ ПоділитисяПоділитися @@ -132,7 +132,7 @@ ПорадиПоради @@ -141,7 +141,7 @@ ПоштаПошта @@ -150,7 +150,7 @@ МесенджерМесенджер @@ -159,7 +159,7 @@ СинхронізаціяСинхронізація @@ -178,7 +178,7 @@
  • - Аватар + Аватар
  • From d9aa8e605ce7de043836abcd9305b5f29df10e0f Mon Sep 17 00:00:00 2001 From: Vitalii <93769277+Cashass@users.noreply.github.com> Date: Sun, 13 Nov 2022 20:10:41 +0100 Subject: [PATCH 12/12] Update index.html File names changed to English. add alt="" --- submissions/Cashass/HTML-CSS-Popup/index.html | 54 +++++++++---------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/submissions/Cashass/HTML-CSS-Popup/index.html b/submissions/Cashass/HTML-CSS-Popup/index.html index 00d65a5c18..617aca930d 100644 --- a/submissions/Cashass/HTML-CSS-Popup/index.html +++ b/submissions/Cashass/HTML-CSS-Popup/index.html @@ -39,8 +39,8 @@ Безпека @@ -48,8 +48,8 @@ Календар @@ -57,8 +57,8 @@ Калькулятор @@ -66,8 +66,8 @@ Контакти @@ -75,8 +75,8 @@ Контролер @@ -84,8 +84,8 @@ Мапа @@ -93,8 +93,8 @@ Новини @@ -102,8 +102,8 @@ Нотатки @@ -111,8 +111,8 @@ Поділитися @@ -131,8 +131,8 @@ Поради @@ -140,8 +140,8 @@ Пошта @@ -149,8 +149,8 @@ Месенджер @@ -158,8 +158,8 @@ Синхронізація @@ -178,7 +178,7 @@
  • - Аватар +