Многозадачность
Особенно сложно сосредоточиться, когда задач много и все они — важные. Где же легендарная многозадачность, когда она так нужна вам @@ -74,8 +74,8 @@
- Почему сосредоточиться так
сложно
+ Почему сосредоточиться так
сложно
-
-
+
- Многозадачность
+
+
+
+
Дофамин
С гормонами стресса всё понятно, но дальше — ещё интереснее. В нашей @@ -87,13 +87,13 @@
Дофамин
удовольствие. Получается замкнутый круг: чем больше отвлекаешься, тем больше удовольствия получаешь. -Что снижает концентрацию внимания?
-
+
- Многозадачность
Как концентрация может снижаться из-за… концентрации? Любая @@ -103,8 +103,8 @@
Многозадачность
— невозможно. Концентрация — мышца, и она может не выдержать, если не давать ей отдохнуть. -
+
+
- Еда
«Быстрые углеводы» — сахар, белый хлеб, сладости — молниеносно @@ -114,8 +114,8 @@
Еда
заканчивается, мы чувствуем усталость и сонливость. И хотим ещё больше быстрых углеводов. -
+
+
+
Гаджеты
Да-да, это та самая ситуация, когда на экране ноутбука — код, в @@ -126,14 +126,14 @@
Гаджеты
что чем больше времени мы проводим в гаджетах, тем больше времени затем нужно, чтобы вернуться к работе. -Как концентрироваться лучше, чем золотая рыбка (то есть дольше трёх секунд)
-
+
+
5 простых (на самом деле не очень) советов
@@ -183,45 +183,43 @@Читайте
секунд. А вот интересная книга способна затянуть и на несколько часов и круто тренирует направленное внимание. -
-
- 
- 
- 
- 
- 
-
+
- А можно в картинках? -
-
-
-
-
-
- + А можно в картинках? +
+
+
+
+
+
+
diff --git a/styles/dark.css b/styles/dark.css
index 93c37b1..517317a 100644
--- a/styles/dark.css
+++ b/styles/dark.css
@@ -9,8 +9,7 @@
чем стили в медиазапросе предпочтений пользователя
*/
-.page.theme_dark {
- --accent-font: 'IBM Plex mono';
+.page.theme_dark {
--bg-color: #000028; /* Цвет фона Dark*/
--nav-color: #FF0070; /* Цвет навигации кнопок */
--rec-color: #FF0070; /* Цвет эл. REC */
@@ -33,8 +32,7 @@
--bg-image: url(../images/cover-image-dark.png);
}
- :root {
- --accent-font: 'IBM Plex mono';
+ :root {
--bg-color: #000028; /* Цвет фона Dark*/
--nav-color: #FF0070; /* Цвет навигации кнопок */
--rec-color: #FF0070; /* Цвет эл. REC */
diff --git a/styles/globals.css b/styles/globals.css
index efc0831..0a7121a 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -9,8 +9,7 @@
body {
min-inline-size: 375px;
max-inline-size: 1440px;
- margin: 0 auto;
- overflow-x: hidden; /* Убрал гориз. скролл */
+ margin: 0 auto;
}
h1,
diff --git a/styles/light.css b/styles/light.css
index ab94926..1350934 100644
--- a/styles/light.css
+++ b/styles/light.css
@@ -9,8 +9,7 @@
чем стили в медиазапросе предпочтений пользователя
*/
-.page.theme_light {
- --accent-font: 'IBM Plex mono';
+.page.theme_light {
--bg-color: #FFC2E6; /* Цвет фона Light*/
--nav-color: #353430; /* Цвет навигации кнопок */
--title-color: #FFC2E6; /* Цвет Заголовка */
@@ -33,8 +32,7 @@
--bg-image: url(../images/cover-image-light.png);
}
- :root {
- --accent-font: 'IBM Plex mono';
+ :root {
--bg-color: #FFC2E6; /* Цвет фона Light*/
--nav-color: #353430; /* Цвет навигации кнопок */
--title-color: #FFC2E6; /* Цвет Заголовка */
diff --git a/styles/style.css b/styles/style.css
index 57d320e..fb9fcb8 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -7,7 +7,8 @@
/* 4. Медиазапросы */
.page {
- color: var(--text-color);
+ min-width: 375px;
+ color: var(--text-color, #F1B2CE);
font-family: var(--accent-font), serif;
font-size: var(--font-size);
background-color: var(--bg-color);
@@ -93,12 +94,11 @@
.header__theme-menu-button {
min-width: 70px;
min-height: 26px;
- border: none;
- padding-inline: 13px;
+ border: none;
color: var(--nav-color);
- font-weight: 400;
+ font-weight: normal;
line-height: 18px;
- text-align: center;
+ text-align: center;
background-color: transparent;
cursor: pointer; /* Добавил курсор при наведении на кнопку */
}
@@ -248,8 +248,8 @@
}
.footer_title {
- color: var(--title-color);
- font-family: var(--accent-font, sans-serif);
+ color: var(--title-color);
+ font-family: var(--accent-font), sans-serif;
font-weight: 700;
font-size: clamp(7.25rem, 7.0115rem + 1.0178vw, 7.5rem);
line-height: 82.5%;
@@ -271,7 +271,7 @@
/* ########################################## */
-@media (768px <= width < 1024px) {
+@media (width >= 768px) {
.decorated-zone::before {
inset-block-start: 20px;
@@ -370,10 +370,9 @@
.content__picture {
display: grid;
grid-template-columns: repeat(3, 1fr);
- grid-template-rows: repeat(3, 1fr);
+ grid-template-rows: repeat(3, auto);
grid-column-gap: 20px;
- grid-row-gap: 20px;
- max-height: 780px;
+ grid-row-gap: 20px;
margin-inline: 0;
margin-block-start: 20px;
}
@@ -400,26 +399,7 @@
}
@media (width >= 1024px) {
- .decorated-zone::before {
- inset-block-start: 20px;
- inset-inline-end: 20px;
- }
-
- .decorated-zone::after {
- inset-block-end: 20px;
- inset-inline-start: 20px;
- }
-
- .header__record_element {
- inset-block-start: 20px;
- inset-inline-end: 48px;
- }
- .header__record_element::after {
- inset-block-start: 8px;
- inset-inline-end: -19px;
- }
-
.header__theme-menu {
justify-content: center;
align-self: start;
@@ -429,127 +409,58 @@
.header__theme-menu-list {
flex-direction: row;
justify-content: center;
+ padding-inline-start: 10px;
}
- .header__title {
- padding-inline-start: 0;
- font-size: clamp(7.5rem, 0.5625rem + 14.4531vw, 9.8125rem);
- }
-
.header__paragraph {
margin-inline-end: 20px;
margin-block-end: 20px;
max-inline-size: 491px;
}
- .header__theme-menu {
- justify-content: center;
- align-self: start;
- margin-block-start: 20px;
- }
-
- .header__theme-menu-list {
- flex-direction: row;
- justify-content: center;
- }
-
- /* Блок Header Конец */
-
.section-one {
display: grid;
- grid-template-columns: 1fr 2fr;
+ grid-template-columns: auto 2fr;
gap: 20px;
margin-block-start: 60px;
}
.text_card-column {
- grid-column-start: 2;
- margin-inline-end: 20px;
- }
-
- .content__title {
- margin-inline-start: 20px;
- margin-block-start: 0;
+ grid-column-start: 2;
+ padding-inline-start: 35px;
}
- .subtitle {
- margin-inline: 0;
- margin-block-start: 0;
+ .content__title {
+ margin-block-start: 0;
+ max-inline-size: 315px;
}
.section-two {
display: grid;
- grid-template-columns: repeat(3, 1fr);
+ grid-template-columns: repeat(auto-fill, minmax(315px, 1fr));
+ grid-template-rows: repeat(3, auto);
gap: 20px;
margin-inline: 20px;
margin-block-start: 80px;
}
- .section__title-two {
- margin-inline-start: 0;
+ .section__title-one {
+ margin-inline-end: 0;
}
.text_card-column-two {
- grid-row-start: 2;
+ grid-row-start: 2;
+ max-inline-size: 315px;
}
-
- .section__text {
- margin-inline: 0;
- }
-
+
.section-three {
display: grid;
- grid-template-columns: 1fr 2fr;
+ grid-template-columns: auto 2fr;
gap: 20px;
- margin-block-start: 80px;
- }
-
- .subtitle_recommendation {
- margin-inline: 0;
- margin-block-start: 20px;
- }
-
- .section__title-three {
- margin-inline-start: 20px;
- }
-
- .section-four {
- margin-inline: 20px;
- margin-block-start: 80px;
- }
-
- .content__picture {
- display: grid;
- grid-template-columns: repeat(3, 1fr);
- grid-template-rows: repeat(3, auto);
- grid-column-gap: 20px;
- grid-row-gap: 20px;
- margin-inline: 0;
- margin-block-start: 20px;
- }
-
- .content__picture-image {
- object-fit: cover;
- inline-size: 100%;
- block-size: 100%;
- }
-
- .sunset { grid-area: 1 / 1 / 2 / 3; }
- .ice-cream { grid-area: 1 / 3 / 3 / 4; }
- .tape { grid-area: 2 / 1 / 4 / 2; }
- .books { grid-area: 2 / 2 / 3 / 3; }
- .street { grid-area: 3 / 2 / 4 / 4; }
-
- /* Блок Main Конец */
-
- .footer {
margin-block-start: 60px;
}
.footer_title {
font-size: clamp(7.5rem, 0.5625rem + 14.4531vw, 9.8125rem);
}
-
- /* Блок Footer Конец */
-
}
\ No newline at end of file
+
+
+
+