From 5012a30abdc5248e42ccf774eff775d81d4d3b7b Mon Sep 17 00:00:00 2001 From: Pete Pearl Date: Sun, 18 Oct 2020 20:54:56 +0300 Subject: [PATCH 1/2] =?UTF-8?q?=D0=9F=D0=BE=D0=BF=D1=80=D0=B0=D0=B2=D0=B8?= =?UTF-8?q?=D1=82=D1=8C=20=D0=B2=D0=B5=D1=80=D1=81=D1=82=D0=BA=D1=83=20?= =?UTF-8?q?=D0=B1=D0=BB=D0=BE=D0=BA=D0=B0=20.footer=20(=D0=BF=D1=80=D0=B8?= =?UTF-8?q?=D0=B2=D0=B5=D1=81=D1=82=D0=B8=20=D0=B2=20=D1=81=D0=BE=D0=BE?= =?UTF-8?q?=D1=82=D0=B2=D0=B5=D1=82=D1=81=D1=82=D0=B2=D0=B8=D0=B5=20=D1=81?= =?UTF-8?q?=20=D0=BC=D0=B0=D0=BA=D0=B5=D1=82=D0=BE=D0=BC)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/includes/footer.njk | 10 ++--- src/styles/blocks/footer.css | 76 ++++++++++++++++++++---------------- 2 files changed, 48 insertions(+), 38 deletions(-) diff --git a/src/includes/footer.njk b/src/includes/footer.njk index e97fb3803..7a76586fc 100644 --- a/src/includes/footer.njk +++ b/src/includes/footer.njk @@ -3,11 +3,11 @@ Веб-стандарты, 2006–{{ site.buildYear }}

Дизайн сайта: diff --git a/src/styles/blocks/footer.css b/src/styles/blocks/footer.css index bc659b72c..5abe8e5d8 100644 --- a/src/styles/blocks/footer.css +++ b/src/styles/blocks/footer.css @@ -2,17 +2,32 @@ .footer { display: grid; - grid-template-rows: min-content 1fr; + grid-template-rows: 1fr min-content; grid-template-columns: 1fr 1fr; - gap: 10px; - padding: 16px 8px; + gap: 16px; + padding: 16px 16px 24px; color: var(--color-grey-lighter); + font-size: 12px; + line-height: 1.3; background-color: var(--color-grey-dark); } -@media (min-width: 1024px) { +@media (min-width: 500px) { + .footer { + font-size: 16px; + } +} + +@media (min-width: 768px) { + .footer { + row-gap: 8px; + padding: 24px 24px 32px; + } +} + +@media (min-width: 1000px) { .footer { - padding: 22px 48px 34px; + padding: 24px 32px 32px; } } @@ -24,16 +39,16 @@ } .footer__link[href]:link { - color: var(--color-grey-lightest); + color: white; } .footer__link[href]:visited { - color: white; + color: var(--color-grey-lightest); } @media (hover: hover) and (pointer: fine) { .footer__link[href]:hover { - color: white; + color: var(--color-grey-lightest); } } @@ -47,8 +62,6 @@ grid-row: 1 / auto; grid-column: 1 / 2; margin: 0; - font-size: 16px; - line-height: 1.3; } .footer__organization { @@ -67,17 +80,9 @@ .footer__design { grid-column: 1 / 2; margin: 0; - font-size: 14px; - line-height: 1.3; } -@media (min-width: 500px) { - .footer__design { - font-size: 16px; - } -} - -@media (min-width: 1024px) { +@media (min-width: 768px) { .footer__design { grid-column: 2; } @@ -96,29 +101,34 @@ /* Pages */ .footer__pages { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); - grid-auto-rows: max-content; grid-row: 1 / -1; grid-column: 2 / 3; - row-gap: 18px; margin: 0; padding: 0; - font-size: 14px; - column-gap: 18px; list-style: none; } -@media (min-width: 500px) { - .footer__pages { - font-size: 16px; - } +.footer__page { + display: block; + margin: 0 0 16px 0; } -@media (min-width: 1024px) { +.footer__page:last-child { + margin: 0; +} + +@media (min-width: 768px) { .footer__pages { - grid-template-columns: initial; - grid-auto-columns: max-content; - grid-auto-flow: column; + grid-row: 1; + } + + .footer__page { + display: inline-block; + margin: 0 0 8px 0; + padding: 0 8px 0 0; + } + + .footer__page:last-child { + margin: 0 0 8px 0; } } From 56855c1cbcb8b41fbcf701efe58efd2122beda67 Mon Sep 17 00:00:00 2001 From: Pete Pearl Date: Sun, 18 Oct 2020 21:11:01 +0300 Subject: [PATCH 2/2] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D1=82?= =?UTF-8?q?=D1=8C=20padding=20=D0=B2=20=D0=BF=D1=80=D0=B0=D0=B2=D1=83?= =?UTF-8?q?=D1=8E=20=D0=BA=D0=BE=D0=BB=D0=BE=D0=BD=D0=BA=D1=83=20=D0=BD?= =?UTF-8?q?=D0=B0=20=D0=B4=D0=B5=D1=81=D0=BA=D1=82=D0=BE=D0=BF=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/blocks/footer.css | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/styles/blocks/footer.css b/src/styles/blocks/footer.css index 5abe8e5d8..264933e88 100644 --- a/src/styles/blocks/footer.css +++ b/src/styles/blocks/footer.css @@ -88,6 +88,12 @@ } } +@media (min-width: 1000px) { + .footer__design { + padding: 0 0 0 90px; + } +} + .footer__design-caption { display: block; } @@ -132,3 +138,9 @@ margin: 0 0 8px 0; } } + +@media (min-width: 1000px) { + .footer__pages { + padding: 0 0 0 90px; + } +}