Skip to content

Commit 0442c8d

Browse files
committed
fix footer, faq, content-wrapper for sections
1 parent 723415f commit 0442c8d

File tree

11 files changed

+149
-129
lines changed

11 files changed

+149
-129
lines changed

src/pages/index.twig

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
{% extends 'src/templates/layouts/base.twig' %}
22

33
{% block content %}
4-
{% include 'src/templates/partials/banner_section.twig' %}
5-
{% include 'src/templates/partials/catalog_section.twig' %}
6-
{% include 'src/templates/partials/blog_section.twig' %}
7-
{% include 'src/templates/partials/about_section.twig' %}
8-
{% include 'src/templates/partials/team_section.twig' %}
9-
{% include 'src/templates/partials/faq_section.twig' %}
4+
{% include 'src/templates/partials/banner_section.twig' %}
5+
{% include 'src/templates/partials/catalog_section.twig' %}
6+
{% include 'src/templates/partials/blog_section.twig' %}
7+
{% include 'src/templates/partials/about_section.twig' %}
8+
{% include 'src/templates/partials/team_section.twig' %}
9+
{% include 'src/templates/partials/faq_section.twig' %}
1010
{% endblock %}

src/styles/base/_base.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
max-width: 1600px;
55
margin-inline: auto;
66
padding-inline: $padding-4xl;
7-
width: 100%;
7+
width: 100%;;
88
}
99

1010
.hero-section {

src/styles/components/_faq-info.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,16 @@
66
font-weight: $fw-regular;
77
font-size: $fontsize-lg;
88
line-height: $lh-xl;
9+
padding: 24px;
910
}
1011

1112
&__answer {
1213
font-weight: $fw-regular;
1314
line-height: $lh-sm;
15+
margin: 16px 24px 8px 24px;
16+
padding-top: 16px;
17+
padding-bottom: 8px;
18+
border-top: 2px solid $seporatorbold-color;
1419
}
1520

1621
&--highlighted {

src/styles/layout/_faq.scss

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,11 @@
22
@use "../mixin/summary" as *;
33

44
.faq {
5-
5+
width: 100%;
6+
max-width: 1600px;
67
display: grid;
78
gap: 24px;
9+
margin: 40px 0 104px;
810

911
&__title {
1012
font-family: $font-secondary;

src/styles/mixin/summary.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
content: "";
1010
width: 16px;
1111
height: 16px;
12+
float: right;
1213
display: inline-block;
1314
background-color: $main-color;
1415
mask: url('/src/assets/icons/plus.svg') no-repeat center / contain
Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,21 @@
1-
<section class="about content-wrapper">
2-
<h2 class="about__title">{{ index.about.title }}</h2>
3-
<p class="about__description">{{ index.about.text }}</p>
4-
<ol class="about__list counted-list">
5-
{% for item in index.about.items %}
6-
<li class="counted-list__item">
7-
<h3 class="counted-list__title">{{ item.title }}</h3>
8-
<span class="counted-list__text">{{ item.text }}</span>
9-
</li>
10-
{% endfor %}
11-
</ol>
12-
<ul>
13-
<li>
14-
<a href="#" class="button button--primary button--large">
15-
{{ index.about.button_primary }}
16-
</a>
17-
</li>
18-
</ul>
19-
</section>
1+
<div class="content-wrapper">
2+
<section class="about">
3+
<h2 class="about__title">{{ index.about.title }}</h2>
4+
<p class="about__description">{{ index.about.text }}</p>
5+
<ol class="about__list counted-list">
6+
{% for item in index.about.items %}
7+
<li class="counted-list__item">
8+
<h3 class="counted-list__title">{{ item.title }}</h3>
9+
<span class="counted-list__text">{{ item.text }}</span>
10+
</li>
11+
{% endfor %}
12+
</ol>
13+
<ul>
14+
<li>
15+
<a href="#" class="button button--primary button--large">
16+
{{ index.about.button_primary }}
17+
</a>
18+
</li>
19+
</ul>
20+
</section>
21+
</div>
Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
1-
<section class="blog-section content-wrapper">
2-
<h2 class="blog-section__title">{{ index.blog.title }}</h2>
3-
<ul class="blog-section__list">
4-
{% for item in index.blog.items %}
5-
<li class="blog-section__item">
6-
{% include "../partials/blog_item.twig" %}
7-
</li>
8-
{% endfor %}
1+
<div class="content-wrapper">
2+
<section class="blog-section">
3+
<h2 class="blog-section__title">{{ index.blog.title }}</h2>
4+
<ul class="blog-section__list">
5+
{% for item in index.blog.items %}
6+
<li class="blog-section__item">
7+
{% include "../partials/blog_item.twig" %}
8+
</li>
9+
{% endfor %}
910

10-
<li>
11-
<a href="#" class="button button--primary button--large">
12-
{{ index.blog.button_primary }}
13-
</a>
14-
</li>
11+
<li>
12+
<a href="#" class="button button--primary button--large">
13+
{{ index.blog.button_primary }}
14+
</a>
15+
</li>
1516

16-
</ul>
17-
</section>
17+
</ul>
18+
</section>
19+
</div>
Lines changed: 31 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,33 @@
11
{% from '../macro/icon.twig' import icon %}
2-
<section class="catalog content-wrapper">
3-
<div class="catalog__control">
4-
<h2 class="catalog__title">
5-
{{ icon("catalog__icon", "folder", 24, 24) }}
6-
{{ index.catalog.title }}</h2>
7-
<div class="separator-horizontal"> </div>
8-
<div class="catalog__nav catalog__nav--separator">
9-
<button class="button button--primary button--large">
10-
{{ index.catalog.slider.button_all }}
11-
</button>
12-
<button class="button button--primary button--large catalog__nav-pagination button--separator_left">
13-
<p class="button__content">
14-
{{ icon("button__icon button__icon--left", "arrow_left", 24, 24) }}
15-
{{ index.catalog.slider.button_left }}
16-
</p>
17-
</button>
18-
<button class="button button--secondary button--large catalog__nav-pagination">
19-
<p class="button__content">
20-
{{ icon("button__icon button__icon--right", "arrow_right", 24, 24) }}
21-
{{ index.catalog.slider.button_right }}
22-
</p>
23-
</button>
2+
<div class="content-wrapper">
3+
<section class="catalog">
4+
<div class="catalog__control">
5+
<h2 class="catalog__title">
6+
{{ icon("catalog__icon", "folder", 24, 24) }}
7+
{{ index.catalog.title }}</h2>
8+
<div class="separator-horizontal"></div>
9+
<div class="catalog__nav catalog__nav--separator">
10+
<button class="button button--primary button--large">
11+
{{ index.catalog.slider.button_all }}
12+
</button>
13+
<button class="button button--primary button--large catalog__nav-pagination button--separator_left">
14+
<p class="button__content">
15+
{{ icon("button__icon button__icon--left", "arrow_left", 24, 24) }}
16+
{{ index.catalog.slider.button_left }}
17+
</p>
18+
</button>
19+
<button class="button button--secondary button--large catalog__nav-pagination">
20+
<p class="button__content">
21+
{{ icon("button__icon button__icon--right", "arrow_right", 24, 24) }}
22+
{{ index.catalog.slider.button_right }}
23+
</p>
24+
</button>
25+
</div>
2426
</div>
25-
</div>
26-
</div>
27-
<div class="catalog__list">
28-
{% for item in index.catalog.items %}
29-
{% include "../partials/catalog_item.twig" %}
30-
{% endfor %}
31-
</div>
32-
</section>
27+
<div class="catalog__list">
28+
{% for item in index.catalog.items %}
29+
{% include "../partials/catalog_item.twig" %}
30+
{% endfor %}
31+
</div>
32+
</section>
33+
</div>
Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
1-
<section class="faq content-wrapper">
2-
<h2 class="faq__title">{{ index.faq.title }}</h2>
3-
{% for qa in index.faq.questions %}
4-
<details class="faq__phrase faq-info">
5-
<summary class="faq-info__title">{{ qa.question }}</summary>
6-
<p class="faqs-info__answer"><span class="faqs-info--highlighted">{{ qa.answer_link }} </span> {{ qa.answer }}</p>
7-
</details>
8-
{% endfor %}
9-
</section>
1+
<div class="content-wrapper">
2+
<section class="faq">
3+
<h2 class="faq__title">{{ index.faq.title }}</h2>
4+
{% for qa in index.faq.questions %}
5+
<details class="faq__phrase faq-info">
6+
<summary class="faq-info__title">{{ qa.question }}</summary>
7+
<p class="faq-info__answer"><span
8+
class="faqs-info--highlighted">{{ qa.answer_link }} </span> {{ qa.answer }}</p>
9+
</details>
10+
{% endfor %}
11+
</section>
12+
</div>

src/templates/partials/footer.twig

Lines changed: 40 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,47 @@
11
{% from '../macro/icon.twig' import icon %}
2-
<footer class="footer content-wrapper">
3-
<div class="footer__wrapper">
4-
<div class="footer__content">
5-
<div class="footer__brand">
6-
<a class="footer__logo" href="#">
7-
<svg class="icon footer__logo-picture" width="36" height="40">
8-
<use href="/src/assets/icons/graph_logo.svg" />
9-
</svg>
10-
<svg class="icon footer__logo-name" width="134" height="21">
11-
<use href="/src/assets/icons/binabox.svg" />
12-
</svg>
13-
{# {{ icon("footer-logo__picture", "blue_logo", 188, 42) }} #}
14-
{# <img class="footer-logo__picture" src="{{ footer.logo.icon }}" alt="{{ footer.logo.alt }}"> #}
15-
</a>
16-
<p class="footer__slogan">{{ footer.logo.slogan }}</p>
17-
</div>
2+
<footer class="footer">
3+
<div class="content-wrapper">
4+
<div class="footer__wrapper">
5+
<div class="footer__content">
6+
<div class="footer__brand">
7+
<a class="footer__logo" href="#">
8+
<svg class="icon footer__logo-picture" width="36" height="40">
9+
<use href="/src/assets/icons/graph_logo.svg" />
10+
</svg>
11+
<svg class="icon footer__logo-name" width="134" height="21">
12+
<use href="/src/assets/icons/binabox.svg" />
13+
</svg>
14+
{# {{ icon("footer-logo__picture", "blue_logo", 188, 42) }} #}
15+
{# <img class="footer-logo__picture" src="{{ footer.logo.icon }}" alt="{{ footer.logo.alt }}"> #}
16+
</a>
17+
<p class="footer__slogan">{{ footer.logo.slogan }}</p>
18+
</div>
1819

19-
<nav class="footer--nav">
20-
<h2 class="footer__nav-subtitle">{{ footer.nav.title }}</h2>
21-
<ul class="footer__nav-list">
22-
{% for link in footer.nav.links %}
23-
<li class="footer__nav-item">
24-
<a class="link link--tertiary" href="{{ link.href }}">{{ link.label }}</a>
25-
</li>
26-
{% endfor %}
27-
</ul>
28-
</nav>
20+
<nav class="footer--nav">
21+
<h2 class="footer__nav-subtitle">{{ footer.nav.title }}</h2>
22+
<ul class="footer__nav-list">
23+
{% for link in footer.nav.links %}
24+
<li class="footer__nav-item">
25+
<a class="link link--tertiary" href="{{ link.href }}">{{ link.label }}</a>
26+
</li>
27+
{% endfor %}
28+
</ul>
29+
</nav>
2930

31+
</div>
3032
</div>
31-
</div>
3233

33-
<div class="footer__copyright">
34-
<p class="footer__rights">{{ footer.text_rights }}</p>
35-
<ul class="footer__social social-list">
36-
{% for link in footer.social %}
37-
<li>
38-
<a class="social-list__link" href="{{ link.href }}">
39-
{{ icon("social-list__logo", link.icon, 24,24) }}
40-
</a>
41-
</li>
42-
{% endfor %}
43-
</ul>
34+
<div class="footer__copyright">
35+
<p class="footer__rights">{{ footer.text_rights }}</p>
36+
<ul class="footer__social social-list">
37+
{% for link in footer.social %}
38+
<li>
39+
<a class="social-list__link" href="{{ link.href }}">
40+
{{ icon("social-list__logo", link.icon, 24,24) }}
41+
</a>
42+
</li>
43+
{% endfor %}
44+
</ul>
45+
</div>
4446
</div>
4547
</footer>

0 commit comments

Comments
 (0)