diff --git a/.vscode/settings.json b/.vscode/settings.json index 6b665aaa..94bc3283 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,6 @@ { - "liveServer.settings.port": 5501 + "liveServer.settings.port": 5501, + "githubPullRequests.ignoredPullRequestBranches": [ + "master" + ] } diff --git a/package-lock.json b/package-lock.json index 35df92a2..0506c94c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7,6 +7,9 @@ "": { "name": "htmlacademy-gulp-template", "version": "2.0.6", + "dependencies": { + "nouislider": "^15.8.0" + }, "devDependencies": { "@htmlacademy/editorconfig-cli": "3.0.0", "@linthtml/linthtml": "0.9.6", @@ -10701,6 +10704,11 @@ "node": ">=0.10.0" } }, + "node_modules/nouislider": { + "version": "15.8.0", + "resolved": "https://registry.npmjs.org/nouislider/-/nouislider-15.8.0.tgz", + "integrity": "sha512-E7Rvt2Uc5IIl7Hv7+mO8XH8uFyqe3ofxi5j2QMi2B7w8JHVLAEzTpgDBk0oYZBaplsk60QOso3qrq8qk3JPHEQ==" + }, "node_modules/now-and-later": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/now-and-later/-/now-and-later-2.0.1.tgz", diff --git a/package.json b/package.json index ba92b3c4..966f5405 100644 --- a/package.json +++ b/package.json @@ -60,8 +60,8 @@ "gulp-sharp-responsive": "0.4.1", "gulp-stacksvg": "4.0.0", "gulp-svgmin": "4.1.0", - "htmlacademy-backstopjs": "6.6.1", "html-validate": "^8.5.0", + "htmlacademy-backstopjs": "6.6.1", "linthtml-config-htmlacademy": "1.0.25", "npm-run-all": "4.1.5", "postcss": "8.4.38", @@ -71,5 +71,8 @@ "stylelint": "16.6.1", "stylelint-config-htmlacademy": "4.2.3", "w3c-html-validator": "1.8.1" + }, + "dependencies": { + "nouislider": "^15.8.0" } } diff --git a/source/fonts/Montserrat-Bold.woff b/source/fonts/Montserrat-Bold.woff new file mode 100644 index 00000000..b475832c Binary files /dev/null and b/source/fonts/Montserrat-Bold.woff differ diff --git a/source/fonts/Montserrat-Bold.woff2 b/source/fonts/Montserrat-Bold.woff2 new file mode 100644 index 00000000..b1e1d215 Binary files /dev/null and b/source/fonts/Montserrat-Bold.woff2 differ diff --git a/source/fonts/Montserrat-Medium.woff b/source/fonts/Montserrat-Medium.woff new file mode 100644 index 00000000..db0f779e Binary files /dev/null and b/source/fonts/Montserrat-Medium.woff differ diff --git a/source/fonts/Montserrat-Medium.woff2 b/source/fonts/Montserrat-Medium.woff2 new file mode 100644 index 00000000..6af9451d Binary files /dev/null and b/source/fonts/Montserrat-Medium.woff2 differ diff --git a/source/fonts/Montserrat-Regular.woff b/source/fonts/Montserrat-Regular.woff new file mode 100644 index 00000000..84bfc7a9 Binary files /dev/null and b/source/fonts/Montserrat-Regular.woff differ diff --git a/source/fonts/Montserrat-Regular.woff2 b/source/fonts/Montserrat-Regular.woff2 new file mode 100644 index 00000000..d7dd638a Binary files /dev/null and b/source/fonts/Montserrat-Regular.woff2 differ diff --git a/source/fonts/Montserrat-SemiBold.woff b/source/fonts/Montserrat-SemiBold.woff new file mode 100644 index 00000000..77e0cafc Binary files /dev/null and b/source/fonts/Montserrat-SemiBold.woff differ diff --git a/source/fonts/Montserrat-SemiBold.woff2 b/source/fonts/Montserrat-SemiBold.woff2 new file mode 100644 index 00000000..2c9e8ffc Binary files /dev/null and b/source/fonts/Montserrat-SemiBold.woff2 differ diff --git a/source/fonts/Montserrat.woff b/source/fonts/Montserrat.woff deleted file mode 100644 index e69de29b..00000000 diff --git a/source/fonts/Montserrat.woff2 b/source/fonts/Montserrat.woff2 deleted file mode 100644 index e69de29b..00000000 diff --git a/source/icons/address.svg b/source/icons/address.svg new file mode 100644 index 00000000..8602e710 --- /dev/null +++ b/source/icons/address.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/basket.svg b/source/icons/basket.svg new file mode 100644 index 00000000..b38a8367 --- /dev/null +++ b/source/icons/basket.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/comfortable.svg b/source/icons/comfortable.svg new file mode 100644 index 00000000..c1c15a90 --- /dev/null +++ b/source/icons/comfortable.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/cross.svg b/source/icons/cross.svg new file mode 100644 index 00000000..5cb1b261 --- /dev/null +++ b/source/icons/cross.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/eco.svg b/source/icons/eco.svg new file mode 100644 index 00000000..b7b7e505 --- /dev/null +++ b/source/icons/eco.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/energy.svg b/source/icons/energy.svg new file mode 100644 index 00000000..55d3d332 --- /dev/null +++ b/source/icons/energy.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/logo-academy.svg b/source/icons/logo-academy.svg new file mode 100644 index 00000000..70598e48 --- /dev/null +++ b/source/icons/logo-academy.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/menu.svg b/source/icons/menu.svg new file mode 100644 index 00000000..7e8f5e9d --- /dev/null +++ b/source/icons/menu.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/ok.svg b/source/icons/ok.svg new file mode 100644 index 00000000..17f051e9 --- /dev/null +++ b/source/icons/ok.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/pinterest.svg b/source/icons/pinterest.svg new file mode 100644 index 00000000..263dd51a --- /dev/null +++ b/source/icons/pinterest.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/stroke.svg b/source/icons/stroke.svg new file mode 100644 index 00000000..521ad7e1 --- /dev/null +++ b/source/icons/stroke.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/tel.svg b/source/icons/tel.svg new file mode 100644 index 00000000..b209d3b3 --- /dev/null +++ b/source/icons/tel.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/time.svg b/source/icons/time.svg new file mode 100644 index 00000000..7844a5eb --- /dev/null +++ b/source/icons/time.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/union.svg b/source/icons/union.svg new file mode 100644 index 00000000..090136a7 --- /dev/null +++ b/source/icons/union.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/user.svg b/source/icons/user.svg new file mode 100644 index 00000000..246e07ad --- /dev/null +++ b/source/icons/user.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/icons/vk.svg b/source/icons/vk.svg new file mode 100644 index 00000000..fb1a68d6 --- /dev/null +++ b/source/icons/vk.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/card-1@1x.png b/source/images/card-1@1x.png new file mode 100644 index 00000000..ed5e9a82 Binary files /dev/null and b/source/images/card-1@1x.png differ diff --git a/source/images/card-1@1x.webp b/source/images/card-1@1x.webp new file mode 100644 index 00000000..db921a2a Binary files /dev/null and b/source/images/card-1@1x.webp differ diff --git a/source/images/card-1@2x.png b/source/images/card-1@2x.png new file mode 100644 index 00000000..06209605 Binary files /dev/null and b/source/images/card-1@2x.png differ diff --git a/source/images/card-1@2x.webp b/source/images/card-1@2x.webp new file mode 100644 index 00000000..ad0f6471 Binary files /dev/null and b/source/images/card-1@2x.webp differ diff --git a/source/images/card-2@1x.png b/source/images/card-2@1x.png new file mode 100644 index 00000000..d9c82e3c Binary files /dev/null and b/source/images/card-2@1x.png differ diff --git a/source/images/card-2@1x.webp b/source/images/card-2@1x.webp new file mode 100644 index 00000000..89240a77 Binary files /dev/null and b/source/images/card-2@1x.webp differ diff --git a/source/images/card-2@2x.png b/source/images/card-2@2x.png new file mode 100644 index 00000000..1ebb8c8a Binary files /dev/null and b/source/images/card-2@2x.png differ diff --git a/source/images/card-2@2x.webp b/source/images/card-2@2x.webp new file mode 100644 index 00000000..2189e41c Binary files /dev/null and b/source/images/card-2@2x.webp differ diff --git a/source/images/card-3@1x.png b/source/images/card-3@1x.png new file mode 100644 index 00000000..fedd9df9 Binary files /dev/null and b/source/images/card-3@1x.png differ diff --git a/source/images/card-3@1x.webp b/source/images/card-3@1x.webp new file mode 100644 index 00000000..cf4bab11 Binary files /dev/null and b/source/images/card-3@1x.webp differ diff --git a/source/images/card-3@2x.png b/source/images/card-3@2x.png new file mode 100644 index 00000000..3174c95c Binary files /dev/null and b/source/images/card-3@2x.png differ diff --git a/source/images/card-3@2x.webp b/source/images/card-3@2x.webp new file mode 100644 index 00000000..bac1a69f Binary files /dev/null and b/source/images/card-3@2x.webp differ diff --git a/source/images/card-4@1x.png b/source/images/card-4@1x.png new file mode 100644 index 00000000..efa9f3a9 Binary files /dev/null and b/source/images/card-4@1x.png differ diff --git a/source/images/card-4@1x.webp b/source/images/card-4@1x.webp new file mode 100644 index 00000000..04340a5c Binary files /dev/null and b/source/images/card-4@1x.webp differ diff --git a/source/images/card-4@2x.png b/source/images/card-4@2x.png new file mode 100644 index 00000000..3b0de9bc Binary files /dev/null and b/source/images/card-4@2x.png differ diff --git a/source/images/card-4@2x.webp b/source/images/card-4@2x.webp new file mode 100644 index 00000000..2186e527 Binary files /dev/null and b/source/images/card-4@2x.webp differ diff --git a/source/images/card-5@1x.png b/source/images/card-5@1x.png new file mode 100644 index 00000000..e187a4aa Binary files /dev/null and b/source/images/card-5@1x.png differ diff --git a/source/images/card-5@1x.webp b/source/images/card-5@1x.webp new file mode 100644 index 00000000..3e37ec5a Binary files /dev/null and b/source/images/card-5@1x.webp differ diff --git a/source/images/card-5@2x.png b/source/images/card-5@2x.png new file mode 100644 index 00000000..53e7b558 Binary files /dev/null and b/source/images/card-5@2x.png differ diff --git a/source/images/card-5@2x.webp b/source/images/card-5@2x.webp new file mode 100644 index 00000000..505e90dc Binary files /dev/null and b/source/images/card-5@2x.webp differ diff --git a/source/images/card-6@1x.png b/source/images/card-6@1x.png new file mode 100644 index 00000000..39f2458c Binary files /dev/null and b/source/images/card-6@1x.png differ diff --git a/source/images/card-6@1x.webp b/source/images/card-6@1x.webp new file mode 100644 index 00000000..dfc355c7 Binary files /dev/null and b/source/images/card-6@1x.webp differ diff --git a/source/images/card-6@2x.png b/source/images/card-6@2x.png new file mode 100644 index 00000000..9f37b25f Binary files /dev/null and b/source/images/card-6@2x.png differ diff --git a/source/images/card-6@2x.webp b/source/images/card-6@2x.webp new file mode 100644 index 00000000..1a0c959c Binary files /dev/null and b/source/images/card-6@2x.webp differ diff --git a/source/images/logo-desktop.svg b/source/images/logo-desktop.svg new file mode 100644 index 00000000..2755c497 --- /dev/null +++ b/source/images/logo-desktop.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/logo-mobile.svg b/source/images/logo-mobile.svg new file mode 100644 index 00000000..58075719 --- /dev/null +++ b/source/images/logo-mobile.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/logo-tablet.svg b/source/images/logo-tablet.svg new file mode 100644 index 00000000..e61d4e02 --- /dev/null +++ b/source/images/logo-tablet.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/images/map-desctop@1x.png b/source/images/map-desctop@1x.png new file mode 100644 index 00000000..7dc22c51 Binary files /dev/null and b/source/images/map-desctop@1x.png differ diff --git a/source/images/map-desctop@1x.webp b/source/images/map-desctop@1x.webp new file mode 100644 index 00000000..d40392d8 Binary files /dev/null and b/source/images/map-desctop@1x.webp differ diff --git a/source/images/map-desctop@2x.png b/source/images/map-desctop@2x.png new file mode 100644 index 00000000..99193b23 Binary files /dev/null and b/source/images/map-desctop@2x.png differ diff --git a/source/images/map-desctop@2x.webp b/source/images/map-desctop@2x.webp new file mode 100644 index 00000000..32635886 Binary files /dev/null and b/source/images/map-desctop@2x.webp differ diff --git a/source/images/map-mobile@1x.png b/source/images/map-mobile@1x.png new file mode 100644 index 00000000..adcf7a59 Binary files /dev/null and b/source/images/map-mobile@1x.png differ diff --git a/source/images/map-mobile@1x.webp b/source/images/map-mobile@1x.webp new file mode 100644 index 00000000..b077d8fd Binary files /dev/null and b/source/images/map-mobile@1x.webp differ diff --git a/source/images/map-mobile@2x.png b/source/images/map-mobile@2x.png new file mode 100644 index 00000000..e302f16a Binary files /dev/null and b/source/images/map-mobile@2x.png differ diff --git a/source/images/map-mobile@2x.webp b/source/images/map-mobile@2x.webp new file mode 100644 index 00000000..76699e34 Binary files /dev/null and b/source/images/map-mobile@2x.webp differ diff --git a/source/images/map-tablet@1x.png b/source/images/map-tablet@1x.png new file mode 100644 index 00000000..6201635a Binary files /dev/null and b/source/images/map-tablet@1x.png differ diff --git a/source/images/map-tablet@1x.webp b/source/images/map-tablet@1x.webp new file mode 100644 index 00000000..ee181530 Binary files /dev/null and b/source/images/map-tablet@1x.webp differ diff --git a/source/images/map-tablet@2x.png b/source/images/map-tablet@2x.png new file mode 100644 index 00000000..fbde92ba Binary files /dev/null and b/source/images/map-tablet@2x.png differ diff --git a/source/images/map-tablet@2x.webp b/source/images/map-tablet@2x.webp new file mode 100644 index 00000000..b515b00c Binary files /dev/null and b/source/images/map-tablet@2x.webp differ diff --git a/source/images/slider-black-desktop@1x.png b/source/images/slider-black-desktop@1x.png new file mode 100644 index 00000000..f18b463d Binary files /dev/null and b/source/images/slider-black-desktop@1x.png differ diff --git a/source/images/slider-black-desktop@1x.webp b/source/images/slider-black-desktop@1x.webp new file mode 100644 index 00000000..a99755e1 Binary files /dev/null and b/source/images/slider-black-desktop@1x.webp differ diff --git a/source/images/slider-black-desktop@2x.png b/source/images/slider-black-desktop@2x.png new file mode 100644 index 00000000..4bb6b15d Binary files /dev/null and b/source/images/slider-black-desktop@2x.png differ diff --git a/source/images/slider-black-desktop@2x.webp b/source/images/slider-black-desktop@2x.webp new file mode 100644 index 00000000..8eed529f Binary files /dev/null and b/source/images/slider-black-desktop@2x.webp differ diff --git a/source/images/slider-black-mobile@1x.png b/source/images/slider-black-mobile@1x.png new file mode 100644 index 00000000..4fff147f Binary files /dev/null and b/source/images/slider-black-mobile@1x.png differ diff --git a/source/images/slider-black-mobile@1x.webp b/source/images/slider-black-mobile@1x.webp new file mode 100644 index 00000000..dd82fb09 Binary files /dev/null and b/source/images/slider-black-mobile@1x.webp differ diff --git a/source/images/slider-black-mobile@2x.png b/source/images/slider-black-mobile@2x.png new file mode 100644 index 00000000..5dc8cab3 Binary files /dev/null and b/source/images/slider-black-mobile@2x.png differ diff --git a/source/images/slider-black-mobile@2x.webp b/source/images/slider-black-mobile@2x.webp new file mode 100644 index 00000000..cb7a3fa1 Binary files /dev/null and b/source/images/slider-black-mobile@2x.webp differ diff --git a/source/images/slider-black-tablet@1x.png b/source/images/slider-black-tablet@1x.png new file mode 100644 index 00000000..b2e4f7e1 Binary files /dev/null and b/source/images/slider-black-tablet@1x.png differ diff --git a/source/images/slider-black-tablet@1x.webp b/source/images/slider-black-tablet@1x.webp new file mode 100644 index 00000000..6473afaa Binary files /dev/null and b/source/images/slider-black-tablet@1x.webp differ diff --git a/source/images/slider-black-tablet@2x.png b/source/images/slider-black-tablet@2x.png new file mode 100644 index 00000000..af082fb0 Binary files /dev/null and b/source/images/slider-black-tablet@2x.png differ diff --git a/source/images/slider-black-tablet@2x.webp b/source/images/slider-black-tablet@2x.webp new file mode 100644 index 00000000..90d2b1a1 Binary files /dev/null and b/source/images/slider-black-tablet@2x.webp differ diff --git a/source/images/slider-lavender-desktop@1x.png b/source/images/slider-lavender-desktop@1x.png new file mode 100644 index 00000000..f7a2e692 Binary files /dev/null and b/source/images/slider-lavender-desktop@1x.png differ diff --git a/source/images/slider-lavender-desktop@1x.webp b/source/images/slider-lavender-desktop@1x.webp new file mode 100644 index 00000000..e2b4b755 Binary files /dev/null and b/source/images/slider-lavender-desktop@1x.webp differ diff --git a/source/images/slider-lavender-desktop@2x.png b/source/images/slider-lavender-desktop@2x.png new file mode 100644 index 00000000..f85e990f Binary files /dev/null and b/source/images/slider-lavender-desktop@2x.png differ diff --git a/source/images/slider-lavender-desktop@2x.webp b/source/images/slider-lavender-desktop@2x.webp new file mode 100644 index 00000000..599b5391 Binary files /dev/null and b/source/images/slider-lavender-desktop@2x.webp differ diff --git a/source/images/slider-lavender-mobile@1x.png b/source/images/slider-lavender-mobile@1x.png new file mode 100644 index 00000000..a71b323d Binary files /dev/null and b/source/images/slider-lavender-mobile@1x.png differ diff --git a/source/images/slider-lavender-mobile@1x.webp b/source/images/slider-lavender-mobile@1x.webp new file mode 100644 index 00000000..404642d4 Binary files /dev/null and b/source/images/slider-lavender-mobile@1x.webp differ diff --git a/source/images/slider-lavender-mobile@2x.png b/source/images/slider-lavender-mobile@2x.png new file mode 100644 index 00000000..4af54042 Binary files /dev/null and b/source/images/slider-lavender-mobile@2x.png differ diff --git a/source/images/slider-lavender-mobile@2x.webp b/source/images/slider-lavender-mobile@2x.webp new file mode 100644 index 00000000..d46597d1 Binary files /dev/null and b/source/images/slider-lavender-mobile@2x.webp differ diff --git a/source/images/slider-lavender-tablet@1x.png b/source/images/slider-lavender-tablet@1x.png new file mode 100644 index 00000000..09072c0f Binary files /dev/null and b/source/images/slider-lavender-tablet@1x.png differ diff --git a/source/images/slider-lavender-tablet@1x.webp b/source/images/slider-lavender-tablet@1x.webp new file mode 100644 index 00000000..2ea81045 Binary files /dev/null and b/source/images/slider-lavender-tablet@1x.webp differ diff --git a/source/images/slider-lavender-tablet@2x.png b/source/images/slider-lavender-tablet@2x.png new file mode 100644 index 00000000..99d264cd Binary files /dev/null and b/source/images/slider-lavender-tablet@2x.png differ diff --git a/source/images/slider-lavender-tablet@2x.webp b/source/images/slider-lavender-tablet@2x.webp new file mode 100644 index 00000000..08636b87 Binary files /dev/null and b/source/images/slider-lavender-tablet@2x.webp differ diff --git a/source/images/slider-white-desktop@1x.png b/source/images/slider-white-desktop@1x.png new file mode 100644 index 00000000..1af511d1 Binary files /dev/null and b/source/images/slider-white-desktop@1x.png differ diff --git a/source/images/slider-white-desktop@1x.webp b/source/images/slider-white-desktop@1x.webp new file mode 100644 index 00000000..28f83e39 Binary files /dev/null and b/source/images/slider-white-desktop@1x.webp differ diff --git a/source/images/slider-white-desktop@2x.png b/source/images/slider-white-desktop@2x.png new file mode 100644 index 00000000..3e16a03c Binary files /dev/null and b/source/images/slider-white-desktop@2x.png differ diff --git a/source/images/slider-white-desktop@2x.webp b/source/images/slider-white-desktop@2x.webp new file mode 100644 index 00000000..42a4b59d Binary files /dev/null and b/source/images/slider-white-desktop@2x.webp differ diff --git a/source/images/slider-white-mobile@1x.png b/source/images/slider-white-mobile@1x.png new file mode 100644 index 00000000..5d09c1fd Binary files /dev/null and b/source/images/slider-white-mobile@1x.png differ diff --git a/source/images/slider-white-mobile@1x.webp b/source/images/slider-white-mobile@1x.webp new file mode 100644 index 00000000..9c2f5181 Binary files /dev/null and b/source/images/slider-white-mobile@1x.webp differ diff --git a/source/images/slider-white-mobile@2x.png b/source/images/slider-white-mobile@2x.png new file mode 100644 index 00000000..097ba4ee Binary files /dev/null and b/source/images/slider-white-mobile@2x.png differ diff --git a/source/images/slider-white-mobile@2x.webp b/source/images/slider-white-mobile@2x.webp new file mode 100644 index 00000000..1984a91f Binary files /dev/null and b/source/images/slider-white-mobile@2x.webp differ diff --git a/source/images/slider-white-tablet@1x.png b/source/images/slider-white-tablet@1x.png new file mode 100644 index 00000000..abea8ce7 Binary files /dev/null and b/source/images/slider-white-tablet@1x.png differ diff --git a/source/images/slider-white-tablet@1x.webp b/source/images/slider-white-tablet@1x.webp new file mode 100644 index 00000000..0d2832df Binary files /dev/null and b/source/images/slider-white-tablet@1x.webp differ diff --git a/source/images/slider-white-tablet@2x.png b/source/images/slider-white-tablet@2x.png new file mode 100644 index 00000000..345c4301 Binary files /dev/null and b/source/images/slider-white-tablet@2x.png differ diff --git a/source/images/slider-white-tablet@2x.webp b/source/images/slider-white-tablet@2x.webp new file mode 100644 index 00000000..ffe319e0 Binary files /dev/null and b/source/images/slider-white-tablet@2x.webp differ diff --git a/source/index.html b/source/index.html index 41d85b6a..e94604d7 100644 --- a/source/index.html +++ b/source/index.html @@ -4,29 +4,33 @@ Drink2Go - - + + + + + +
- -
- Новинка! -

Декаф Флэт Уайт

-

Свежесваренный кофе без кофеина из Эфиопии - с натуральным фермерским молоком — то, что нужно - для расслабления после тяжёлого рабочего дня

- 295₽ - 225₽ - Заказать + +
+
+
+ + + + + + + Кофейный напиток. + + + + + + + + Кофейный напиток. + + + + + + + + Кофейный напиток. + +
+
+
+ Новинка! +

Декаф Флэт Уайт

+

Свежесваренный кофе без кофеина из Эфиопии + с натуральным фермерским молоком — то, что нужно + для расслабления после тяжёлого рабочего дня

+
+ 295₽ + 225₽ + Заказать +
+
+
+
- Преимущества -

Главные причины выбрать Drink2Go

+ Преимущества +

Главные причины выбрать Drink2Go

    -
  • -

    Скорость

    +
  • +

    Скорость

    Готовый напиток всегда под рукой — просто открой банку

    • -
  • -

    Удобство

    -

    Легко помещается и в карман, +

  • +

    Удобство

    +

    Легко помещается и в карман, и в маленькую сумочку

    • -
  • -

    Бодрость

    +
  • +

    Бодрость

    Сбалансированная доза кофеина даст мощный заряд энергии

    • -
  • -

    Экологичность

    -

    Вся упаковка сделана +

  • +

    Экологичность

    +

    Вся упаковка сделана
    из перерабатываемых материалов

- Каталог + Каталог

Каталог кофейных напитков

Цена -
- -
+
+
- +
- +
@@ -174,8 +239,8 @@

Каталог кофейных напитков

  • -
  • -
    • + Сортировка:
    - -
    - + + + + + + + Карта интернет-магазина. +
    diff --git a/source/scripts/index.js b/source/scripts/index.js index 7a738cea..265a7379 100644 --- a/source/scripts/index.js +++ b/source/scripts/index.js @@ -1 +1,37 @@ -/* в этот файл добавляет скрипты*/ +// Получаем элементы слайдера +const slider = document.querySelector('.slider'); +const prevButton = document.querySelector('.slider-button-prev'); +const nextButton = document.querySelector('.slider-button-next'); +const slides = Array.from(slider.querySelectorAll('picture')); +const slideCount = slides.length; +let slideIndex = 0; + +// Устанавливаем обработчики событий для кнопок +prevButton.addEventListener('click', showPreviousSlide); +nextButton.addEventListener('click', showNextSlide); + +// Функция для показа предыдущего слайда +function showPreviousSlide() { + slideIndex = (slideIndex - 1 + slideCount) % slideCount; + updateSlider(); +} + +// Функция для показа следующего слайда +function showNextSlide() { + slideIndex = (slideIndex + 1) % slideCount; + updateSlider(); +} + +// Функция для обновления отображения слайдера +function updateSlider() { + slides.forEach((slide, index) => { + if (index === slideIndex) { + slide.style.display = 'block'; + } else { + slide.style.display = 'none'; + } + }); +} + +// Инициализация слайдера +updateSlider(); diff --git a/source/styles/blocks/badge-style.scss b/source/styles/blocks/badge-style.scss new file mode 100644 index 00000000..6318bd1e --- /dev/null +++ b/source/styles/blocks/badge-style.scss @@ -0,0 +1,9 @@ +.badge-style { + display: block; + font-weight: 700; + font-size: 12px; + line-height: 16px; + letter-spacing: 0.04em; + text-transform: uppercase; + color: $base-primary; +} diff --git a/source/styles/blocks/button-filter.scss b/source/styles/blocks/button-filter.scss index dd1c0bce..1e5890b1 100644 --- a/source/styles/blocks/button-filter.scss +++ b/source/styles/blocks/button-filter.scss @@ -1 +1,5 @@ -// button-filter +.button-filter { + display: flex; + flex-direction: column; + gap: 20px; +} diff --git a/source/styles/blocks/button.scss b/source/styles/blocks/button.scss index b1a4b8cc..3b440b2a 100644 --- a/source/styles/blocks/button.scss +++ b/source/styles/blocks/button.scss @@ -1 +1,33 @@ -// button +.button { + padding: 8px 20px; + font-family: $font-montserrat; + font-weight: 400; + font-size: 16px; + line-height: 150%; + text-align: center; + color: $base-white; + background-color: $base-primary; + text-decoration: none; + border: none; + border-radius: 4px; +} + +.button--basket { + min-width: 141px; + font-weight: 400; + font-size: 14px; + line-height: 20px; + position: relative; + text-align: end; + + &::after { + position: absolute; + content: ""; + top: 0; + left: 0; + width: 20px; + height: 16px; + background-image: url("../../icons/basket.svg"); + color: $base-white; + } +} diff --git a/source/styles/blocks/catalog-item.scss b/source/styles/blocks/catalog-item.scss index edfea7fa..fb28a213 100644 --- a/source/styles/blocks/catalog-item.scss +++ b/source/styles/blocks/catalog-item.scss @@ -1,5 +1,36 @@ -// catalog-item -// catalog-item__title -// catalog-item__card-wrapper -// catalog-item__text -// catalog-item__price +.catalog-item { + padding: 40px 20px 20px; + list-style: none; + background-color: $base-white; + border-radius: 4px; + text-align: center; + margin-bottom: 20px; +} + +.catalog-item__title { + font-weight: 700; + font-size: 18px; + line-height: 32px; + text-align: left; + color: $base-black; +} + +.catalog-item__card-wrapper { + display: flex; + margin: 0; + justify-content: space-between; +} + +.catalog-item__text { + font-weight: 400; + font-size: 14px; + line-height: 20px; + text-align: left; +} + +.catalog-item__price { + margin: 0; + font-weight: 600; + font-size: 20px; + line-height: 32px; +} diff --git a/source/styles/blocks/catalog-link.scss b/source/styles/blocks/catalog-link.scss index a614dad1..47d649ae 100644 --- a/source/styles/blocks/catalog-link.scss +++ b/source/styles/blocks/catalog-link.scss @@ -1,2 +1,5 @@ -// catalog-link +.catalog-link { + text-decoration: none; +} + // catalog-link__picture diff --git a/source/styles/blocks/catalog-list.scss b/source/styles/blocks/catalog-list.scss index b927fc75..7356ff09 100644 --- a/source/styles/blocks/catalog-list.scss +++ b/source/styles/blocks/catalog-list.scss @@ -1 +1,4 @@ -// catalog-list +.catalog-list { + padding: 0 20px 20px; + margin: 0; +} diff --git a/source/styles/blocks/catalog.scss b/source/styles/blocks/catalog.scss index 4c2490d4..96a3689c 100644 --- a/source/styles/blocks/catalog.scss +++ b/source/styles/blocks/catalog.scss @@ -1,3 +1,18 @@ -// catalog -// catalog__badge -// catalog__title +.catalog { + padding: 50px 0 44px; + background: $bg-lightest-grey; +} + +.catalog__badge { + margin-bottom: 5px; + text-align: center; +} + +.catalog__title { + margin: 0; + margin-bottom: 20px; + font-weight: 700; + font-size: 24px; + line-height: 36px; + text-align: center; +} diff --git a/source/styles/blocks/features.scss b/source/styles/blocks/features.scss index 9da83e10..2a78d1e2 100644 --- a/source/styles/blocks/features.scss +++ b/source/styles/blocks/features.scss @@ -1,10 +1,248 @@ -// features -// features__badge-advatages +.features { + text-align: center; + padding: 50px 20px 26px; + + @media (min-width: $min-width-tablet) { + padding: 60px 30px 100px; + } + + @media (min-width: $min-width-desktop) { + padding: 100px 40px 120px; + } +} + +.features__badge-advatages { + margin-bottom: 5px; + + @media (min-width: $min-width-desktop) { + margin-bottom: 18px; + } + + @media (min-width: $min-width-desktop) { + margin-bottom: 4px; + } +} // features__wrapper -// features__list -// features__item -// features__title -// features__advantages-discription +.features__list { + padding: 0; + margin: 0; + + @media (min-width: $min-width-tablet) { + display: flex; + flex-wrap: wrap; + gap: 4px 30px; + } + + @media (min-width: $min-width-desktop) { + min-height: 170px; + } +} + +.features__item { + min-height: 140px; + list-style: none; + margin-bottom: 34px; + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + + @media (min-width: $min-width-tablet) { + max-width: 339px; + text-align: justify; + justify-content: flex-start; + margin-bottom: 0; + } + + @media (min-width: $min-width-desktop) { + max-width: 318px; + text-align: center; + justify-content: flex-end; + } +} + +.features__item--time { + position: relative; + + &::after { + position: absolute; + content: ""; + top: -2px; + left: 114px; + width: 52px; + height: 56px; + background-image: url("../../icons/time.svg"); + margin-bottom: 10px; + } + + @media (min-width: $min-width-tablet) { + &::after { + top: 3px; + left: 0; + } + } + + @media (min-width: $min-width-desktop) { + min-width: 318px; + + &::after { + top: 0; + left: 133px; + } + } +} + +.features__item--comfortable { + position: relative; + + &::after { + position: absolute; + content: ""; + top: -2px; + left: 114px; + width: 52px; + height: 56px; + background-image: url("../../icons/comfortable.svg"); + margin-bottom: 10px; + } + + @media (min-width: $min-width-tablet) { + &::after { + left: 0; + } + } + + @media (min-width: $min-width-desktop) { + min-width: 317px; + + &::after { + top: 0; + left: 133px; + } + } +} + +.features__item--energy { + position: relative; + + &::after { + position: absolute; + content: ""; + top: -2px; + left: 114px; + width: 52px; + height: 56px; + background-image: url("../../icons/energy.svg"); + margin-bottom: 10px; + } + + @media (min-width: $min-width-tablet) { + &::after { + left: 0; + } + } + + @media (min-width: $min-width-desktop) { + min-width: 318px; + + &::after { + top: 0; + left: 133px; + } + } +} + +.features__item--eco { + position: relative; + + &::after { + position: absolute; + content: ""; + top: -2px; + left: 114px; + width: 52px; + height: 56px; + background-image: url("../../icons/eco.svg"); + margin-bottom: 10px; + } + + @media (min-width: $min-width-tablet) { + &::after { + left: 0; + } + } + + @media (min-width: $min-width-desktop) { + min-width: 317px; + + &::after { + top: 0; + left: 133px; + } + } +} + +.features__title { + font-weight: 700; + margin: 0; + line-height: 20px; +} + +.features__title--big { + margin-bottom: 37px; + font-size: 24px; + line-height: 36px; + + @media (min-width: $min-width-tablet) { + margin-bottom: 59px; + font-size: 42px; + line-height: 64px; + } + + @media (min-width: $min-width-desktop) { + margin-bottom: 80px; + } +} + +.features__title--small { + font-size: 18px; + line-height: 32px; + margin-bottom: 5px; + + @media (min-width: $min-width-tablet) { + margin: 0 0 10px 72px; + font-size: 24px; + line-height: 36px; + } + + @media (min-width: $min-width-desktop) { + margin-left: 0; + } +} + +.features__advantages-discription { + margin: 0; + font-weight: 400; + font-size: 14px; + line-height: 20px; + + @media (min-width: $min-width-tablet) { + max-width: 267px; + margin-left: 72px; + font-size: 16px; + line-height: 24px; + } + + @media (min-width: $min-width-desktop) { + margin: 0; + max-width: 317px; + } +} + +.features__advantages-discription--width { + max-width: 230px; +} + // features__button-filter // features__search-filter // features__search-sorting diff --git a/source/styles/blocks/footer-decor.scss b/source/styles/blocks/footer-decor.scss new file mode 100644 index 00000000..272d5e63 --- /dev/null +++ b/source/styles/blocks/footer-decor.scss @@ -0,0 +1,13 @@ +.footer-decor { + position: relative; + + &::before { + position: absolute; + content: ""; + bottom: 0; + right: 0; + width: 320px; + height: 1px; + color: $base-secondary; + } +} diff --git a/source/styles/blocks/footer.scss b/source/styles/blocks/footer.scss index 1f1e3861..dd3311e2 100644 --- a/source/styles/blocks/footer.scss +++ b/source/styles/blocks/footer.scss @@ -1,21 +1,113 @@ // footer // footer__container -// footer__social + +.footer__social { + padding: 20px; + display: flex; +} + // footer__logo-image -// footer__title -// footer__social-list -// footer__social-item +.footer__title { + display: none; + + @media (min-width: $min-width-desktop) { + display: block; + } +} + +.footer__social-list { + padding: 0; + margin: 0; + list-style: none; + display: flex; +} + +.footer__social-item { + padding: 9px; + gap: 20px; +} // footer__social-link // footer__social-vk // footer__social-Pinterest // footer-social-odnoklassniki -// footer__shop-links -// footer__shop-title -// footer__nav-list -// footer__nav-item -// footer__nav-link -// footer__shop-media -// footer__contacts -// footer__contacts-address -// footer__about-text -// footer__contacts-address-phone +.footer__shop-links { + padding: 20px; +} + +.footer__shop-title { + margin: 0; + margin-bottom: 12px; + font-weight: 700; + font-size: 14px; + line-height: 20px; + color: $base-primary; +} + +.footer__nav-list { + padding: 0; + margin: 0; + list-style: none; +} + +.footer__nav-item { + margin: 8px 0; +} + +.footer__nav-link { + text-decoration: none; + color: $base-black; +} + +.footer__shop-media { + padding: 20px; +} + +.footer__contacts { + padding: 20px; +} + +.footer__contacts-address { + font-weight: 400; + font-size: 14px; + line-height: 20px; + font-style: normal; + display: flex; + gap: 16px; + flex-direction: column; +} + +.footer__about-text { + margin: 0; + margin-left: 19px; + position: relative; + + &::after { + position: absolute; + content: ""; + top: 0; + left: -19px; + width: 13px; + height: 16px; + background-image: url("../../icons/address.svg"); + color: $base-white; + } +} + +.footer__contacts-address-phone { + margin: 0; + margin-left: 19px; + text-decoration: none; + color: $base-black; + position: relative; + + &::after { + position: absolute; + content: ""; + top: 0; + left: -19px; + width: 13px; + height: 16px; + background-image: url("../../icons/tel.svg"); + color: $base-white; + } +} diff --git a/source/styles/blocks/form-details.scss b/source/styles/blocks/form-details.scss index b1e92bdb..b0fd91c5 100644 --- a/source/styles/blocks/form-details.scss +++ b/source/styles/blocks/form-details.scss @@ -1,13 +1,68 @@ -// form-details -// form-details__filter -// form-details__title +.form-details { + padding: 0 20px 40px; +} + +.form-details__filter { + padding: 0; + margin: 0; + border: none; + margin-bottom: 30px; +} + +.form-details__title { + padding: 0; + margin-bottom: 20px; + font-weight: 600; + font-size: 16px; + line-height: 24px; +} + // form-details__range -// form-details__wrapper +.form-details__wrapper { + display: flex; + justify-content: space-between; +} // form-details__price-min -// form-details__label -// form-details__input +// .form-details__label { + +// } + +.form-details__input { + width: 118px; + padding: 8px 10px; + margin: 0; + border: 2px solid $alt-primary-lighter; + border-radius: 4px; +} + +.form-details__label--disabled { + color: $base-grey; +} + // form-details__price-max -// form-details__list -// form-details__list-item -// form-details__radio + +.form-details__list { + display: flex; + flex-direction: column; + gap: 20px; + padding: 0; + margin: 0; + list-style: none; +} + +.form-details__list-item { + max-height: 24px; +} + +.form-details__radio { + position: relative; + bottom: 28px; + display: block; + width: 24px; + height: 24px; + border-radius: 20px; + border: 1px solid $base-grey; + background: $base-white; +} + // form-details__change diff --git a/source/styles/blocks/header.scss b/source/styles/blocks/header.scss index fb4bf223..e02b2af7 100644 --- a/source/styles/blocks/header.scss +++ b/source/styles/blocks/header.scss @@ -1,9 +1,120 @@ -// .header { -// } -// .header__logo -// header__logo-image -// header__info -// header__nav-wrapper -// header__nav-list -// header__nav-item -// header__nav-link +.header { + display: flex; + padding: 0 0 0 20px; + align-items: center; + justify-content: space-between; + min-height: 60px; + + @media (min-width: $min-width-tablet) { + min-height: 80px; + } + + @media (min-width: $min-width-desktop) { + padding: 0 40px; + } +} +// .header__logo-image { + +.header__logo { + margin-top: 4px; + + @media (min-width: $min-width-tablet) { + display: flex; + align-items: center; + gap: 20px; + } +} + +.header__info { + display: none; + + @media (min-width: $min-width-desktop) { + display: block; + max-width: 126px; + font-family: $font-montserrat; + font-weight: 400; + font-size: 12px; + line-height: 133%; + } +} + +.header__nav-wrapper { + @media (min-width: $min-width-desktop) { + display: flex; + } +} + +.header__nav-list { + padding: 0; + margin: 0; + list-style: none; + display: flex; +} + +.header__nav-list--off { + display: none; + + @media (min-width: $min-width-tablet) { + display: flex; + } + + @media (min-width: $min-width-desktop) { + gap: 20px; + } +} + +.header__nav-list--none { + // display: none; + + @media (min-width: $min-width-desktop) { + display: flex; + } +} + +.header__text { + display: none; +} + +.header__nav-item { + margin: 0 20px; + height: 80px; + display: flex; + align-items: center; + justify-content: center; +} + +.header__nav-item--style { + width: 60px; + height: 60px; + padding: 0; + margin: 0; +} + +.header__burger-btn { + width: 60px; + height: 60px; + border: none; + background: inherit; + + @media (min-width: $min-width-tablet) { + display: none; + } +} + +.header__burger-image { + margin-top: 3px; +} + +.header__nav-link { + text-decoration: none; +} + +.header__nav-link--user { + display: flex; + color: #333333; +} + +.header__nav-link--union { + margin-top: 4px; +} + diff --git a/source/styles/blocks/hero.scss b/source/styles/blocks/hero.scss index 71a5363f..c56ab403 100644 --- a/source/styles/blocks/hero.scss +++ b/source/styles/blocks/hero.scss @@ -1,14 +1,199 @@ .hero { + width: 100vw; + padding-top: 20px; + margin-left: calc(50% - 50vw); + display: flex; + flex-direction: row; + align-items: center; background-color: $bg-flat-white; + justify-content: center; + + @media (min-width: $min-width-tablet) { + min-height: 640px; + padding-top: 60px; + } + + @media (min-width: $min-width-desktop) { + padding: 30px 0 80px; + flex-direction: row; + min-width: 1440px; + justify-content: flex-start; + gap: 25px; + } +} + +.hero__toggle-left { + min-height: 636px; + padding: 0; + border: none; + background: inherit; + position: relative; + bottom: 9px; + + @media (min-width: $min-width-tablet) { + min-width: 80px; + bottom: 126px; + } + + @media (min-width: $min-width-desktop) { + min-height: 600px; + top: 26px; + bottom: 0; + } +} + +.hero__toggle-right { + min-height: 636px; + padding: 0; + border: none; + background: inherit; + transform: rotate(180deg); + position: relative; + bottom: 11px; + + @media (min-width: $min-width-tablet) { + min-width: 80px; + bottom: 126px; + } + + @media (min-width: $min-width-desktop) { + min-height: 600px; + top: 24px; + bottom: 0; + } +} + +.hero__position { display: flex; + flex-direction: column; + + @media (min-width: $min-width-desktop) { + flex-direction: row; + align-items: center; + } + + @media (min-width: $min-width-desktop) { + gap: 30px; + } +} + +.hero__position-slader { + // position: relative; + width: 280px; + height: 280px; + margin: 0 auto; + overflow: hidden; } -// hero__picture-position -// .hero__wrapper-info { -// color: red; -// } -// hero__badge-new -// hero__title -// hero__title-text -// hero__price -// hero__price-new +.hero__wrapper { + max-width: 320px; + padding: 0 25px; + display: flex; + align-items: center; + + @media (min-width: $min-width-desktop) { + padding: 0; + } +} + +.hero__wrapper-color { + @media (min-width: $min-width-tablet) { + width: 100%; + min-height: 188px; + background-color: $base-white; + } + + @media (min-width: $min-width-desktop) { + display: none; + } +} + +.hero__picture-position { + @media (min-width: $min-width-tablet) { + position: absolute; + top: 432px; + right: 19%; + } + + @media (min-width: $min-width-desktop) { + position: static; + } +} + +.hero__wrapper-info { + padding-top: 11px; + max-width: 280px; + min-height: 356px; + text-align: center; + + @media (min-width: $min-width-tablet) { + max-width: 608px; + min-height: 580px; + padding: 0; + display: flex; + flex-direction: column; + align-items: center; + } + + @media (min-width: $min-width-desktop) { + max-width: 625px; + min-height: 305px; + align-items: flex-start; + } +} + +.hero__badge-new { + margin-bottom: 4px; +} + +.hero__title { + margin: 0 0 9px; + font-weight: 700; + font-size: 36px; + line-height: 133%; + letter-spacing: 0.02em; + + @media (min-width: $min-width-tablet) { + margin-bottom: 15px; + font-size: 56px; + line-height: 143%; + letter-spacing: 0.02em; + } +} + +.hero__title-text { + max-width: 280px; + margin: 0; + margin-bottom: 20px; + font-weight: 400; + font-size: 14px; + line-height: 20px; + + @media (min-width: $min-width-tablet) { + max-width: 606px; + font-size: 20px; + line-height: 32px; + } + + @media (min-width: $min-width-desktop) { + max-width: 625px; + text-align: justify; + margin-bottom: 40px; + } +} + +.hero__price { + margin-right: 6px; + font-weight: 400; + font-size: 16px; + line-height: 200%; + text-decoration: line-through; + color: $base-primary; +} + +.hero__price-new { + margin-right: 21px; + font-weight: 600; + font-size: 20px; + line-height: 160%; +} diff --git a/source/styles/blocks/htmlacademy-link.scss b/source/styles/blocks/htmlacademy-link.scss deleted file mode 100644 index 66195dc5..00000000 --- a/source/styles/blocks/htmlacademy-link.scss +++ /dev/null @@ -1 +0,0 @@ -// htmlacademy-link diff --git a/source/styles/blocks/htmlacademy.scss b/source/styles/blocks/htmlacademy.scss new file mode 100644 index 00000000..d03be9ee --- /dev/null +++ b/source/styles/blocks/htmlacademy.scss @@ -0,0 +1,12 @@ +.htmlacademy { + padding: 20px 57px 30px; + margin: 0; + font-weight: 400; + font-size: 12px; + line-height: 16px; + color: $base-grey; +} + +// .htmlacademy--link { + +// } diff --git a/source/styles/blocks/image.scss b/source/styles/blocks/image.scss index ff6d9cee..7f45a6f3 100644 --- a/source/styles/blocks/image.scss +++ b/source/styles/blocks/image.scss @@ -1,2 +1,4 @@ -// image +// .image { +// text-align: center; +// } // image--color diff --git a/source/styles/blocks/map.scss b/source/styles/blocks/map.scss index 52fdddbe..dae9f0e7 100644 --- a/source/styles/blocks/map.scss +++ b/source/styles/blocks/map.scss @@ -1,3 +1,17 @@ -// map +.map { + min-width: 320px; + max-height: 420px; + background-color: $alt-primary-lighter; + + @media (min-width: $min-width-tablet) { + min-width: 768; + max-height: 480px; + } + + @media (min-width: $min-width-desktop) { + min-width: 1440px; + max-height: 540px; + } +} // map__position // map__image diff --git a/source/styles/blocks/pagination.scss b/source/styles/blocks/pagination.scss index 53347118..d897ec7a 100644 --- a/source/styles/blocks/pagination.scss +++ b/source/styles/blocks/pagination.scss @@ -1,3 +1,65 @@ -// pagination -// pagination__item -// pagination__current +.pagination { + padding: 0 20px; + margin: 0; + display: flex; + gap: 20px; +} + +.pagination__item { + list-style: none; + border-radius: 4px; + padding: 8px; + width: 40px; + height: 40px; + background-color: $base-white; + font-weight: 400; + font-size: 16px; + line-height: 24px; + text-align: center; +} + +.pagination__item--background { + background-color: inherit; +} + +.pagination__current { + text-decoration: none; + color: $base-primary; +} + +.pagination__current--active { + font-weight: 600; + font-size: 16px; + line-height: 24px; + background-color: inherit; + color: $base-black; +} + +.pagination__item--left { + position: relative; + + &::after { + position: absolute; + content: ""; + top: 15px; + left: 15px; + width: 6px; + height: 10px; + background-image: url("../../icons/stroke.svg"); + } +} + +.pagination__item--rigth { + position: relative; + + &::after { + position: absolute; + content: ""; + top: 7px; + left: -2px; + width: 6px; + height: 10px; + background-image: url("../../icons/stroke.svg"); + transform: rotate(180deg); + } +} diff --git a/source/styles/blocks/search-filter.scss b/source/styles/blocks/search-filter.scss index c09827e6..64852a98 100644 --- a/source/styles/blocks/search-filter.scss +++ b/source/styles/blocks/search-filter.scss @@ -1,3 +1,25 @@ -// search-filter -// search-filter__sorting -// search-filter__cheap +.search-filter { + padding: 0 23px; + display: flex; + justify-content: space-between; +} + +.search-filter__sorting { + border: none; + background: none; + color: $base-primary; + padding: 4px 10px; + font-size: 16px; +} + +.search-filter__name { + font-weight: 600; + font-size: 16px; + line-height: 24px; +} + +.search-filter__name--cheap { + font-weight: 600; + font-size: 16px; + line-height: 24px; +} diff --git a/source/styles/blocks/slider-button-next.scss b/source/styles/blocks/slider-button-next.scss new file mode 100644 index 00000000..ac6c968e --- /dev/null +++ b/source/styles/blocks/slider-button-next.scss @@ -0,0 +1,9 @@ +.slider-button-next { + position: absolute; + top: 59px; + right: -1px; + width: 20px; + height: 656px; + background-color: transparent; + border: none; +} diff --git a/source/styles/blocks/slider-button-prev.scss b/source/styles/blocks/slider-button-prev.scss new file mode 100644 index 00000000..ec4ab0c5 --- /dev/null +++ b/source/styles/blocks/slider-button-prev.scss @@ -0,0 +1,10 @@ +.slider-button-prev { + position: absolute; + bottom: 171px; + left: 0; + transform: translateY(-50%); + width: 20px; + height: 656px; + background-color: transparent; + border: none; +} diff --git a/source/styles/blocks/slider.scss b/source/styles/blocks/slider.scss new file mode 100644 index 00000000..158c62e0 --- /dev/null +++ b/source/styles/blocks/slider.scss @@ -0,0 +1,10 @@ +.slider { + display: flex; + transition: transform 0.5s ease-in-out; +} + +.slider picture { + width: 100%; + height: 100%; + object-fit: cover; +} diff --git a/source/styles/common/fonts.scss b/source/styles/common/fonts.scss index 7ab79bfe..6a08bb47 100644 --- a/source/styles/common/fonts.scss +++ b/source/styles/common/fonts.scss @@ -3,7 +3,7 @@ font-family: "Montserrat"; font-weight: 400; font-style: normal; - src: url("../../fonts/Montserrat.woff2") format("woff2"), url("../../fonts/Montserrat.woff") format("woff"); + src: url("../../fonts/Montserrat-Regular.woff2") format("woff2"), url("../../fonts/Montserrat-Regular.woff") format("woff"); font-display: swap; } @@ -11,7 +11,7 @@ font-family: "Montserrat"; font-weight: 500; font-style: normal; - src: url("../../fonts/Montserrat.woff2") format("woff2"), url("../../fonts/Montserrat.woff") format("woff"); + src: url("../../fonts/Montserrat-Medium.woff2") format("woff2"), url("../../fonts/Montserrat-Medium.woff") format("woff"); font-display: swap; } @@ -19,7 +19,7 @@ font-family: "Montserrat"; font-weight: 600; font-style: normal; - src: url("../../fonts/Montserrat.woff2") format("woff2"), url("../../fonts/Montserrat.woff") format("woff"); + src: url("../../fonts/Montserrat-SemiBold.woff2") format("woff2"), url("../../fonts/Montserrat-SemiBold.woff") format("woff"); font-display: swap; } @@ -27,6 +27,6 @@ font-family: "Montserrat"; font-weight: 700; font-style: normal; - src: url("../../fonts/Montserrat.woff2") format("woff2"), url("../../fonts/Montserrat.woff") format("woff"); + src: url("../../fonts/Montserrat-Bold.woff2") format("woff2"), url("../../fonts/Montserrat-Bold.woff") format("woff"); font-display: swap; } diff --git a/source/styles/styles.scss b/source/styles/styles.scss index 7451685e..fc899e66 100644 --- a/source/styles/styles.scss +++ b/source/styles/styles.scss @@ -5,20 +5,26 @@ @import "./common/visually-hidden.scss"; /* BLOCKS */ -// @import "./blocks/page-container.scss"; -// @import "./blocks/header.scss"; -// @import "./blocks/image.scss"; +@import "./blocks/page-container.scss"; +@import "./blocks/header.scss"; +@import "./blocks/image.scss"; // @import "./blocks/main-container.scss"; @import "./blocks/hero.scss"; -// @import "./blocks/button.scss"; -// @import "./blocks/features.scss"; -// @import "./blocks/catalog.scss"; -// @import "./blocks/form-details.scss"; -// @import "./blocks/search-filter.scss"; -// @import "./blocks/catalog-list.scss"; -// @import "./blocks/catalog-item.scss"; -// @import "./blocks/catalog-link.scss"; -// @import "./blocks/pagination.scss"; -// @import "./blocks/map.scss"; -// @import "./blocks/footer.scss"; -// @import "./blocks/htmlacademy-link.scss"; +@import "./blocks/slider-button-prev.scss"; +@import "./blocks/slider-button-next.scss"; +@import "./blocks/slider.scss"; +@import "./blocks/button.scss"; +@import "./blocks/button-filter.scss"; +@import "./blocks/features.scss"; +@import "./blocks/badge-style.scss"; +@import "./blocks/catalog.scss"; +@import "./blocks/form-details.scss"; +@import "./blocks/search-filter.scss"; +@import "./blocks/catalog-list.scss"; +@import "./blocks/catalog-item.scss"; +@import "./blocks/catalog-link.scss"; +@import "./blocks/pagination.scss"; +@import "./blocks/map.scss"; +@import "./blocks/footer.scss"; +@import "./blocks/footer-decor.scss"; +@import "./blocks/htmlacademy.scss";