diff --git a/.github/workflows/test.yml-template b/.github/workflows/test.yml-template new file mode 100644 index 000000000..8b5743ecb --- /dev/null +++ b/.github/workflows/test.yml-template @@ -0,0 +1,29 @@ +name: Test + +on: + pull_request: + branches: [ master ] + +jobs: + build: + + runs-on: ubuntu-latest + + strategy: + matrix: + node-version: [20.x] + + steps: + - uses: actions/checkout@v2 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v1 + with: + node-version: ${{ matrix.node-version }} + - run: npm install + - run: npm test + - name: Upload HTML report(backstop data) + if: ${{ always() }} + uses: actions/upload-artifact@v2 + with: + name: report + path: backstop_data diff --git a/README.md b/README.md index 5f9e97051..d853d9799 100644 --- a/README.md +++ b/README.md @@ -49,7 +49,7 @@ Check font styles. Use [IBM Plex Sans](https://fonts.google.com/specimen/IBM+Ple 11. `git push origin develop` - to send you code for PR. 12. Create a Pull Request (PR) from your branch `develop` to branch `master` of original repo. 13. Replace `` with your Github username in the - [DEMO LINK](https://.github.io/Museum/). + [DEMO LINK](https://nikivivster.github.io/Museum/). 14. Copy `DEMO LINK` to the PR description. > To update you PR repeat steps 7-11. diff --git a/index.html b/index.html index d339e6856..e5253dffd 100644 --- a/index.html +++ b/index.html @@ -1,19 +1,448 @@ - + - Title + + Художній Музей НАМУ - -

Hello Mate Academy

+ +
+
+
+
+ + +

+ ХУДОЖНІЙ +
+ МУЗЕЙ +

+ + + КВИТКИ + + + arrow + + + +
+
ПОДІЇ
+
+
+
+ +
+
+
+
+
+
+ + + +
+ +
+
+
+

Актуальні події

+ +
+
+
+ go and back +
+
+
+
ВИСТАВКА
+
26.08-29.11.2019
+
+
+
Йду і повертаюсь
+
+ square +
+
+

+ Національний Художній Музей України презентує унікальну + частину колекції Градобанку - українське мистецтво другої + половини 1980-1995 років. +

+
+
+ +
+
+ memories +
+
+
+
ВИСТАВКА
+
26.08-29.11.2019
+
+
+
І спогади і мрії
+
+ square +
+
+

+ Національний художній музей України до 100 річчя від дня + народження видатної української художниці Тетяни Яблонської + відкриває ретроспективну ювілейну виставку «І спогади і мрії». +

+
+
+
+
+
+ +
+
+ image +
+ +
+
+
ЛЕКЦІЯ
+
26/08/2019 - 11:00
+
+ +

Від класицизму до романтизму

+
+
+ + + + +
+ +
+
+
+
+ + +
+ + + +
+
+ +
+
+
Графік роботи
+ +
+
+ 12:00 — 20:00 + середа +
+ +
+ 12:00 — 20:00 + четвер +
+ +
+ 12:00 — 20:00 + п'ятниця +
+ +
+ 11:00 — 19:00 + субота +
+ +
+ 11:00 — 19:00 + неділя +
+
+ +
+

+ Вихідні: + понеділок, вівторок +

+ +

Каса припиняє роботу за 1 годину до закриття музею

+
+
+ +
+
Контакти:
+ +
+

+ вул. М. Грушевського, 6; +
+ Київ, 01001 +

+ +

+ тел. +38 (044) 278-13-57 +
+ факс +38 (044) +
+ 278-74-54 +

+ +

e-mail: info@namu.kiev.ua

+
+
+ +
+ +
+ + arrow-up + +
+ +
+
+ +
+

+ Copyright © 2019. All Rights Reserved. +

+ +

Designed by Zhyriada Marina

+
+
+
diff --git a/package-lock.json b/package-lock.json index fbfeb1428..3bf64afbb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,7 @@ "@mate-academy/eslint-config": "latest", "@mate-academy/jest-mochawesome-reporter": "^1.0.0", "@mate-academy/linthtml-config": "latest", - "@mate-academy/scripts": "^2.1.1", + "@mate-academy/scripts": "^2.1.3", "@mate-academy/stylelint-config": "latest", "cypress": "^13.13.0", "eslint": "^8.57.0", @@ -1875,10 +1875,11 @@ "dev": true }, "node_modules/@mate-academy/scripts": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-2.1.2.tgz", - "integrity": "sha512-gUXFdqqOfYzF9R3RSx2pCa5GLdOkxB9bFbF+dpUpzucdgGAANqOGdqpmNnMj+e3xA9YHraUWq3xo9cwe5vD9pQ==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-2.1.3.tgz", + "integrity": "sha512-a07wHTj/1QUK2Aac5zHad+sGw4rIvcNl5lJmJpAD7OxeSbnCdyI6RXUHwXhjF5MaVo9YHrJ0xVahyERS2IIyBQ==", "dev": true, + "license": "MIT", "dependencies": { "@octokit/rest": "^17.11.2", "@types/get-port": "^4.2.0", diff --git a/package.json b/package.json index ab5f87b9b..d2c5a8560 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "@mate-academy/eslint-config": "latest", "@mate-academy/jest-mochawesome-reporter": "^1.0.0", "@mate-academy/linthtml-config": "latest", - "@mate-academy/scripts": "^2.1.1", + "@mate-academy/scripts": "^2.1.3", "@mate-academy/stylelint-config": "latest", "cypress": "^13.13.0", "eslint": "^8.57.0", diff --git a/src/fonts/IBM_Plex_Sans/IBMPlexSans-Italic-VariableFont_wdth,wght.ttf b/src/fonts/IBM_Plex_Sans/IBMPlexSans-Italic-VariableFont_wdth,wght.ttf new file mode 100644 index 000000000..6232aaa8c Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/IBMPlexSans-Italic-VariableFont_wdth,wght.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/IBMPlexSans-VariableFont_wdth,wght.ttf b/src/fonts/IBM_Plex_Sans/IBMPlexSans-VariableFont_wdth,wght.ttf new file mode 100644 index 000000000..9add87564 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/IBMPlexSans-VariableFont_wdth,wght.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/OFL.txt b/src/fonts/IBM_Plex_Sans/OFL.txt new file mode 100644 index 000000000..5bb330e99 --- /dev/null +++ b/src/fonts/IBM_Plex_Sans/OFL.txt @@ -0,0 +1,93 @@ +Copyright © 2017 IBM Corp. with Reserved Font Name "Plex" + +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: +https://openfontlicense.org + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/src/fonts/IBM_Plex_Sans/README.txt b/src/fonts/IBM_Plex_Sans/README.txt new file mode 100644 index 000000000..ada67b3fb --- /dev/null +++ b/src/fonts/IBM_Plex_Sans/README.txt @@ -0,0 +1,106 @@ +IBM Plex Sans Variable Font +=========================== + +This download contains IBM Plex Sans as both variable fonts and static fonts. + +IBM Plex Sans is a variable font with these axes: + wdth + wght + +This means all the styles are contained in these files: + IBM_Plex_Sans/IBMPlexSans-VariableFont_wdth,wght.ttf + IBM_Plex_Sans/IBMPlexSans-Italic-VariableFont_wdth,wght.ttf + +If your app fully supports variable fonts, you can now pick intermediate styles +that aren’t available as static fonts. Not all apps support variable fonts, and +in those cases you can use the static font files for IBM Plex Sans: + IBM_Plex_Sans/static/IBMPlexSans_Condensed-Thin.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLight.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-Light.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-Regular.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-Medium.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBold.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-Bold.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Thin.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLight.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Light.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Regular.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Medium.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBold.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Bold.ttf + IBM_Plex_Sans/static/IBMPlexSans-Thin.ttf + IBM_Plex_Sans/static/IBMPlexSans-ExtraLight.ttf + IBM_Plex_Sans/static/IBMPlexSans-Light.ttf + IBM_Plex_Sans/static/IBMPlexSans-Regular.ttf + IBM_Plex_Sans/static/IBMPlexSans-Medium.ttf + IBM_Plex_Sans/static/IBMPlexSans-SemiBold.ttf + IBM_Plex_Sans/static/IBMPlexSans-Bold.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-ThinItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLightItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-LightItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-Italic.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-MediumItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBoldItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_Condensed-BoldItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ThinItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLightItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-LightItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Italic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-MediumItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBoldItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-BoldItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans-ThinItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans-ExtraLightItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans-LightItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans-Italic.ttf + IBM_Plex_Sans/static/IBMPlexSans-MediumItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans-SemiBoldItalic.ttf + IBM_Plex_Sans/static/IBMPlexSans-BoldItalic.ttf + +Get started +----------- + +1. Install the font files you want to use + +2. Use your app's font picker to view the font family and all the +available styles + +Learn more about variable fonts +------------------------------- + + https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts + https://variablefonts.typenetwork.com + https://medium.com/variable-fonts + +In desktop apps + + https://theblog.adobe.com/can-variable-fonts-illustrator-cc + https://helpx.adobe.com/nz/photoshop/using/fonts.html#variable_fonts + +Online + + https://developers.google.com/fonts/docs/getting_started + https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide + https://developer.microsoft.com/en-us/microsoft-edge/testdrive/demos/variable-fonts + +Installing fonts + + MacOS: https://support.apple.com/en-us/HT201749 + Linux: https://www.google.com/search?q=how+to+install+a+font+on+gnu%2Blinux + Windows: https://support.microsoft.com/en-us/help/314960/how-to-install-or-remove-a-font-in-windows + +Android Apps + + https://developers.google.com/fonts/docs/android + https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts + +License +------- +Please read the full license text (OFL.txt) to understand the permissions, +restrictions and requirements for usage, redistribution, and modification. + +You can use them in your products & projects – print or digital, +commercial or otherwise. + +This isn't legal advice, please consider consulting a lawyer and see the full +license for all details. diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Bold.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Bold.ttf new file mode 100644 index 000000000..258c10a96 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Bold.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-BoldItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-BoldItalic.ttf new file mode 100644 index 000000000..fabdca044 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-BoldItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ExtraLight.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ExtraLight.ttf new file mode 100644 index 000000000..46f52c481 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ExtraLight.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ExtraLightItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ExtraLightItalic.ttf new file mode 100644 index 000000000..6fac7fa38 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ExtraLightItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Italic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Italic.ttf new file mode 100644 index 000000000..bf4395636 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Italic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Light.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Light.ttf new file mode 100644 index 000000000..56e7db7dc Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Light.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-LightItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-LightItalic.ttf new file mode 100644 index 000000000..1e2e86af8 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-LightItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Medium.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Medium.ttf new file mode 100644 index 000000000..fb75072d8 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Medium.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-MediumItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-MediumItalic.ttf new file mode 100644 index 000000000..1b059bebd Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-MediumItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-SemiBold.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-SemiBold.ttf new file mode 100644 index 000000000..a63f1c562 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-SemiBold.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-SemiBoldItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-SemiBoldItalic.ttf new file mode 100644 index 000000000..981d51425 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-SemiBoldItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Thin.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Thin.ttf new file mode 100644 index 000000000..918d4a0c4 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-Thin.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ThinItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ThinItalic.ttf new file mode 100644 index 000000000..f7d1dabae Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans-ThinItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Bold.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Bold.ttf new file mode 100644 index 000000000..064ffb443 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Bold.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-BoldItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-BoldItalic.ttf new file mode 100644 index 000000000..924b914f3 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-BoldItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLight.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLight.ttf new file mode 100644 index 000000000..cdf06a1ac Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLight.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLightItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLightItalic.ttf new file mode 100644 index 000000000..9b9f6cef6 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ExtraLightItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Italic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Italic.ttf new file mode 100644 index 000000000..03de618df Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Italic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Light.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Light.ttf new file mode 100644 index 000000000..f8f53b9d2 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Light.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-LightItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-LightItalic.ttf new file mode 100644 index 000000000..b0cd1b273 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-LightItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Medium.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Medium.ttf new file mode 100644 index 000000000..7ae38bab0 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Medium.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-MediumItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-MediumItalic.ttf new file mode 100644 index 000000000..0a09a4fa0 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-MediumItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBold.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBold.ttf new file mode 100644 index 000000000..a715d679a Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBold.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBoldItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBoldItalic.ttf new file mode 100644 index 000000000..1ca118079 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-SemiBoldItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Thin.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Thin.ttf new file mode 100644 index 000000000..f2bce483b Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-Thin.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ThinItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ThinItalic.ttf new file mode 100644 index 000000000..b2ff4b1f5 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_Condensed-ThinItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Bold.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Bold.ttf new file mode 100644 index 000000000..e6f743978 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Bold.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-BoldItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-BoldItalic.ttf new file mode 100644 index 000000000..15a7756d5 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-BoldItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLight.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLight.ttf new file mode 100644 index 000000000..cd729393c Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLight.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLightItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLightItalic.ttf new file mode 100644 index 000000000..ec6f0f0e3 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ExtraLightItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Italic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Italic.ttf new file mode 100644 index 000000000..0b6665d57 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Italic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Light.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Light.ttf new file mode 100644 index 000000000..3a2435964 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Light.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-LightItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-LightItalic.ttf new file mode 100644 index 000000000..64cb0e752 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-LightItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Medium.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Medium.ttf new file mode 100644 index 000000000..a43275857 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Medium.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-MediumItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-MediumItalic.ttf new file mode 100644 index 000000000..c8f51aad9 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-MediumItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Regular.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Regular.ttf new file mode 100644 index 000000000..ad9a6259b Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Regular.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBold.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBold.ttf new file mode 100644 index 000000000..77832b0b8 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBold.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBoldItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBoldItalic.ttf new file mode 100644 index 000000000..6f11e691f Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-SemiBoldItalic.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Thin.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Thin.ttf new file mode 100644 index 000000000..dda2e8af0 Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-Thin.ttf differ diff --git a/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ThinItalic.ttf b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ThinItalic.ttf new file mode 100644 index 000000000..4d4518e2a Binary files /dev/null and b/src/fonts/IBM_Plex_Sans/static/IBMPlexSans_SemiCondensed-ThinItalic.ttf differ diff --git a/src/fonts/Montserrat/Montserrat-Italic-VariableFont_wght.ttf b/src/fonts/Montserrat/Montserrat-Italic-VariableFont_wght.ttf new file mode 100644 index 000000000..76e3f9d25 Binary files /dev/null and b/src/fonts/Montserrat/Montserrat-Italic-VariableFont_wght.ttf differ diff --git a/src/fonts/Montserrat/Montserrat-VariableFont_wght.ttf b/src/fonts/Montserrat/Montserrat-VariableFont_wght.ttf new file mode 100644 index 000000000..451e69288 Binary files /dev/null and b/src/fonts/Montserrat/Montserrat-VariableFont_wght.ttf differ diff --git a/src/fonts/Montserrat/OFL.txt b/src/fonts/Montserrat/OFL.txt new file mode 100644 index 000000000..8e618c81a --- /dev/null +++ b/src/fonts/Montserrat/OFL.txt @@ -0,0 +1,93 @@ +Copyright 2024 The Montserrat.Git Project Authors (https://github.com/JulietaUla/Montserrat.git) + +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: +https://openfontlicense.org + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/src/fonts/Montserrat/README.txt b/src/fonts/Montserrat/README.txt new file mode 100644 index 000000000..930137df9 --- /dev/null +++ b/src/fonts/Montserrat/README.txt @@ -0,0 +1,81 @@ +Montserrat Variable Font +======================== + +This download contains Montserrat as both variable fonts and static fonts. + +Montserrat is a variable font with this axis: + wght + +This means all the styles are contained in these files: + Montserrat/Montserrat-VariableFont_wght.ttf + Montserrat/Montserrat-Italic-VariableFont_wght.ttf + +If your app fully supports variable fonts, you can now pick intermediate styles +that aren’t available as static fonts. Not all apps support variable fonts, and +in those cases you can use the static font files for Montserrat: + Montserrat/static/Montserrat-Thin.ttf + Montserrat/static/Montserrat-ExtraLight.ttf + Montserrat/static/Montserrat-Light.ttf + Montserrat/static/Montserrat-Regular.ttf + Montserrat/static/Montserrat-Medium.ttf + Montserrat/static/Montserrat-SemiBold.ttf + Montserrat/static/Montserrat-Bold.ttf + Montserrat/static/Montserrat-ExtraBold.ttf + Montserrat/static/Montserrat-Black.ttf + Montserrat/static/Montserrat-ThinItalic.ttf + Montserrat/static/Montserrat-ExtraLightItalic.ttf + Montserrat/static/Montserrat-LightItalic.ttf + Montserrat/static/Montserrat-Italic.ttf + Montserrat/static/Montserrat-MediumItalic.ttf + Montserrat/static/Montserrat-SemiBoldItalic.ttf + Montserrat/static/Montserrat-BoldItalic.ttf + Montserrat/static/Montserrat-ExtraBoldItalic.ttf + Montserrat/static/Montserrat-BlackItalic.ttf + +Get started +----------- + +1. Install the font files you want to use + +2. Use your app's font picker to view the font family and all the +available styles + +Learn more about variable fonts +------------------------------- + + https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts + https://variablefonts.typenetwork.com + https://medium.com/variable-fonts + +In desktop apps + + https://theblog.adobe.com/can-variable-fonts-illustrator-cc + https://helpx.adobe.com/nz/photoshop/using/fonts.html#variable_fonts + +Online + + https://developers.google.com/fonts/docs/getting_started + https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide + https://developer.microsoft.com/en-us/microsoft-edge/testdrive/demos/variable-fonts + +Installing fonts + + MacOS: https://support.apple.com/en-us/HT201749 + Linux: https://www.google.com/search?q=how+to+install+a+font+on+gnu%2Blinux + Windows: https://support.microsoft.com/en-us/help/314960/how-to-install-or-remove-a-font-in-windows + +Android Apps + + https://developers.google.com/fonts/docs/android + https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts + +License +------- +Please read the full license text (OFL.txt) to understand the permissions, +restrictions and requirements for usage, redistribution, and modification. + +You can use them in your products & projects – print or digital, +commercial or otherwise. + +This isn't legal advice, please consider consulting a lawyer and see the full +license for all details. diff --git a/src/fonts/Montserrat/static/Montserrat-Black.ttf b/src/fonts/Montserrat/static/Montserrat-Black.ttf new file mode 100644 index 000000000..2fab7ab04 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-Black.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-BlackItalic.ttf b/src/fonts/Montserrat/static/Montserrat-BlackItalic.ttf new file mode 100644 index 000000000..04d3b47f3 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-BlackItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-Bold.ttf b/src/fonts/Montserrat/static/Montserrat-Bold.ttf new file mode 100644 index 000000000..403358755 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-Bold.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-BoldItalic.ttf b/src/fonts/Montserrat/static/Montserrat-BoldItalic.ttf new file mode 100644 index 000000000..0cc5c2cb6 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-BoldItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-ExtraBold.ttf b/src/fonts/Montserrat/static/Montserrat-ExtraBold.ttf new file mode 100644 index 000000000..476ec30b6 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-ExtraBold.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-ExtraBoldItalic.ttf b/src/fonts/Montserrat/static/Montserrat-ExtraBoldItalic.ttf new file mode 100644 index 000000000..a1ac9a955 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-ExtraBoldItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-ExtraLight.ttf b/src/fonts/Montserrat/static/Montserrat-ExtraLight.ttf new file mode 100644 index 000000000..efaeab067 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-ExtraLight.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-ExtraLightItalic.ttf b/src/fonts/Montserrat/static/Montserrat-ExtraLightItalic.ttf new file mode 100644 index 000000000..a8d18decb Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-ExtraLightItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-Italic.ttf b/src/fonts/Montserrat/static/Montserrat-Italic.ttf new file mode 100644 index 000000000..5f08df020 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-Italic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-Light.ttf b/src/fonts/Montserrat/static/Montserrat-Light.ttf new file mode 100644 index 000000000..881f12d06 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-Light.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-LightItalic.ttf b/src/fonts/Montserrat/static/Montserrat-LightItalic.ttf new file mode 100644 index 000000000..b2991d025 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-LightItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-Medium.ttf b/src/fonts/Montserrat/static/Montserrat-Medium.ttf new file mode 100644 index 000000000..c9a39ea16 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-Medium.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-MediumItalic.ttf b/src/fonts/Montserrat/static/Montserrat-MediumItalic.ttf new file mode 100644 index 000000000..086dd6e44 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-MediumItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-SemiBold.ttf b/src/fonts/Montserrat/static/Montserrat-SemiBold.ttf new file mode 100644 index 000000000..161477a81 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-SemiBold.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-SemiBoldItalic.ttf b/src/fonts/Montserrat/static/Montserrat-SemiBoldItalic.ttf new file mode 100644 index 000000000..73dc6c61e Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-SemiBoldItalic.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-Thin.ttf b/src/fonts/Montserrat/static/Montserrat-Thin.ttf new file mode 100644 index 000000000..c9cf19565 Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-Thin.ttf differ diff --git a/src/fonts/Montserrat/static/Montserrat-ThinItalic.ttf b/src/fonts/Montserrat/static/Montserrat-ThinItalic.ttf new file mode 100644 index 000000000..e6dfc05dc Binary files /dev/null and b/src/fonts/Montserrat/static/Montserrat-ThinItalic.ttf differ diff --git a/src/fonts/Roboto-Regular-webfont.woff b/src/fonts/Roboto-Regular-webfont.woff deleted file mode 100755 index 8aa07d731..000000000 Binary files a/src/fonts/Roboto-Regular-webfont.woff and /dev/null differ diff --git a/src/fonts/ibm-plex-sans-v23-cyrillic_latin-300.woff2 b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-300.woff2 new file mode 100644 index 000000000..f82f0a48a Binary files /dev/null and b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-300.woff2 differ diff --git a/src/fonts/ibm-plex-sans-v23-cyrillic_latin-500.woff2 b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-500.woff2 new file mode 100644 index 000000000..288a1c703 Binary files /dev/null and b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-500.woff2 differ diff --git a/src/fonts/ibm-plex-sans-v23-cyrillic_latin-700.woff2 b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-700.woff2 new file mode 100644 index 000000000..38029ca9a Binary files /dev/null and b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-700.woff2 differ diff --git a/src/fonts/ibm-plex-sans-v23-cyrillic_latin-regular.woff2 b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-regular.woff2 new file mode 100644 index 000000000..b82e11732 Binary files /dev/null and b/src/fonts/ibm-plex-sans-v23-cyrillic_latin-regular.woff2 differ diff --git a/src/fonts/montserrat-v31-cyrillic_latin-700.woff2 b/src/fonts/montserrat-v31-cyrillic_latin-700.woff2 new file mode 100644 index 000000000..5c136d763 Binary files /dev/null and b/src/fonts/montserrat-v31-cyrillic_latin-700.woff2 differ diff --git a/src/fonts/montserrat-v31-cyrillic_latin-regular.woff2 b/src/fonts/montserrat-v31-cyrillic_latin-regular.woff2 new file mode 100644 index 000000000..d13c06aa5 Binary files /dev/null and b/src/fonts/montserrat-v31-cyrillic_latin-regular.woff2 differ diff --git a/src/images/gallery1.png b/src/images/gallery1.png new file mode 100644 index 000000000..79fba1fcf Binary files /dev/null and b/src/images/gallery1.png differ diff --git a/src/images/gallery2.png b/src/images/gallery2.png new file mode 100644 index 000000000..99317b008 Binary files /dev/null and b/src/images/gallery2.png differ diff --git a/src/images/gallery3.png b/src/images/gallery3.png new file mode 100644 index 000000000..b08856a9f Binary files /dev/null and b/src/images/gallery3.png differ diff --git a/src/images/gallery4.png b/src/images/gallery4.png new file mode 100644 index 000000000..0c716104c Binary files /dev/null and b/src/images/gallery4.png differ diff --git a/src/images/go_and_back.png b/src/images/go_and_back.png new file mode 100644 index 000000000..c1a3f4b68 Binary files /dev/null and b/src/images/go_and_back.png differ diff --git a/src/images/icons/Arrow-up.svg b/src/images/icons/Arrow-up.svg new file mode 100644 index 000000000..1653ccee7 --- /dev/null +++ b/src/images/icons/Arrow-up.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/images/icons/NA MU.png b/src/images/icons/NA MU.png new file mode 100644 index 000000000..e8c354e13 Binary files /dev/null and b/src/images/icons/NA MU.png differ diff --git a/src/images/icons/baseline-keyboard_arrow_right-24px.png b/src/images/icons/baseline-keyboard_arrow_right-24px.png new file mode 100644 index 000000000..e071ef0e7 Binary files /dev/null and b/src/images/icons/baseline-keyboard_arrow_right-24px.png differ diff --git a/src/images/icons/close.png b/src/images/icons/close.png new file mode 100644 index 000000000..ad27d4261 Binary files /dev/null and b/src/images/icons/close.png differ diff --git a/src/images/icons/facebook.png b/src/images/icons/facebook.png new file mode 100644 index 000000000..c377208c4 Binary files /dev/null and b/src/images/icons/facebook.png differ diff --git a/src/images/icons/instagram.png b/src/images/icons/instagram.png new file mode 100644 index 000000000..fc88d51a5 Binary files /dev/null and b/src/images/icons/instagram.png differ diff --git a/src/images/icons/menu.png b/src/images/icons/menu.png new file mode 100644 index 000000000..93fdad8bd Binary files /dev/null and b/src/images/icons/menu.png differ diff --git a/src/images/icons/square.png b/src/images/icons/square.png new file mode 100644 index 000000000..ba3e97192 Binary files /dev/null and b/src/images/icons/square.png differ diff --git a/src/images/memories.png b/src/images/memories.png new file mode 100644 index 000000000..69dff0216 Binary files /dev/null and b/src/images/memories.png differ diff --git a/src/images/museum.png b/src/images/museum.png new file mode 100644 index 000000000..52fd21435 Binary files /dev/null and b/src/images/museum.png differ diff --git a/src/images/wall.png b/src/images/wall.png new file mode 100644 index 000000000..d69bacb81 Binary files /dev/null and b/src/images/wall.png differ diff --git a/src/images/wallpaper.png b/src/images/wallpaper.png new file mode 100644 index 000000000..6aca45b6c Binary files /dev/null and b/src/images/wallpaper.png differ diff --git a/src/scripts/main.js b/src/scripts/main.js index ad9a93a7c..9bad6f3cd 100644 --- a/src/scripts/main.js +++ b/src/scripts/main.js @@ -1 +1,39 @@ 'use strict'; + +const form = document.querySelector('.subscribe__email'); + +form.addEventListener('submit', (event) => { + event.preventDefault(); + + form.reset(); + + window.scrollTo({ + top: 0, + behavior: 'smooth', + }); +}); + +const gallerySlider = document.querySelector('.gallery__slider'); +const galleryItems = document.querySelectorAll('.gallery__item'); +const galleryDots = document.querySelectorAll('.gallery__dot'); + +let currentSlide = 0; + +galleryDots.forEach((dot, index) => { + dot.addEventListener('click', () => { + currentSlide = index; + + const itemWidth = galleryItems[0].offsetWidth; + const gap = window.innerWidth <= 639 ? 16 : 20; + + const move = (itemWidth + gap) * currentSlide; + + gallerySlider.style.transform = `translateX(-${move}px)`; + + galleryDots.forEach((item) => { + item.classList.remove('gallery__dot--active'); + }); + + dot.classList.add('gallery__dot--active'); + }); +}); diff --git a/src/styles/_fonts.scss b/src/styles/_fonts.scss index 45cdd5400..b988871f2 100644 --- a/src/styles/_fonts.scss +++ b/src/styles/_fonts.scss @@ -1,6 +1,54 @@ @font-face { - font-family: Roboto, Arial, Helvetica, sans-serif; - src: url('../fonts/Roboto-Regular-webfont.woff') format('woff'); - font-weight: normal; + font-family: Montserrat; + font-weight: 400; font-style: normal; + src: url('../fonts/montserrat-v31-cyrillic_latin-regular.woff2') + format('woff2'); +} + +@font-face { + font-family: Montserrat; + font-weight: 700; + font-style: normal; + src: url('../fonts/montserrat-v31-cyrillic_latin-700.woff2') format('woff2'); +} + +@font-face { + font-family: 'IBM Plex Sans'; + font-weight: 300; + font-style: normal; + src: url('../fonts/ibm-plex-sans-v23-cyrillic_latin-300.woff2') + format('woff2'); +} + +@font-face { + font-family: 'IBM Plex Sans'; + font-weight: 400; + font-style: normal; + src: url('../fonts/ibm-plex-sans-v23-cyrillic_latin-regular.woff2') + format('woff2'); +} + +@font-face { + font-family: 'IBM Plex Sans'; + font-weight: 500; + font-style: normal; + src: url('../fonts/ibm-plex-sans-v23-cyrillic_latin-500.woff2') + format('woff2'); +} + +@font-face { + font-family: 'IBM Plex Sans'; + font-weight: 600; + font-style: normal; + src: url('../fonts/ibm-plex-sans-v23-cyrillic_latin-600.woff2') + format('woff2'); +} + +@font-face { + font-family: 'IBM Plex Sans'; + font-weight: 700; + font-style: normal; + src: url('../fonts/ibm-plex-sans-v23-cyrillic_latin-700.woff2') + format('woff2'); } diff --git a/src/styles/_utils.scss b/src/styles/_utils.scss index 3280c3fe1..7d978d279 100644 --- a/src/styles/_utils.scss +++ b/src/styles/_utils.scss @@ -1,3 +1,2 @@ -@import 'utils/vars'; @import 'utils/mixins'; @import 'utils/extends'; diff --git a/src/styles/blocks/_events.scss b/src/styles/blocks/_events.scss new file mode 100644 index 000000000..41c69e54f --- /dev/null +++ b/src/styles/blocks/_events.scss @@ -0,0 +1,175 @@ +.events { + display: flex; + justify-content: space-between; + + &__title { + margin-top: 200px; + margin-bottom: 56px; + + font-family: Montserrat, sans-serif; + font-size: 48px; + font-weight: 700; + + @include tablet { + margin-top: 88px; + margin-bottom: 48px; + } + + @include mobile { + margin-top: 70px; + margin-bottom: 40px; + font-size: 36px; + text-align: center; + } + } + + &__content { + grid-column: 1 / 8; + } + + &__card { + display: flex; + gap: 130px; + align-items: center; + margin-bottom: 104px; + + @include tablet { + flex-direction: column; + gap: 40px; + align-items: flex-start; + margin-bottom: 64px; + } + + @include mobile { + flex-direction: column; + gap: 20px; + margin-bottom: 60px; + } + } + + &__image { + overflow: hidden; + width: 100%; + height: 520px; + img { + width: 100%; + height: 100%; + object-fit: cover; + transition: transform 0.3s ease; + } + + &:hover img { + transform: scale(1.05); + } + + @include mobile { + width: 280px; + height: 210px; + } + } + + &__text { + position: relative; + width: 370px; + + @include tablet { + width: 460px; + } + + @include mobile { + width: 280px; + } + } + + &__showdate { + display: flex; + gap: 20px; + margin-bottom: 32px; + + @include mobile { + justify-content: space-between; + margin-bottom: 15px; + } + } + + &__show { + z-index: -1; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 500; + color: #687480; + + @include mobile { + font-size: 16px; + } + } + + &__date { + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 700; + color: #1a5a4c; + + @include mobile { + font-size: 16px; + } + } + + &__headline-block { + position: relative; + + display: flex; + gap: 15px; + align-items: center; + + width: 370px; + min-height: 39px; + + @include mobile { + width: 280px; + } + } + + &__headline { + flex: 1 1 auto; + + min-width: 0; + + font-family: Montserrat, sans-serif; + font-size: 36px; + font-weight: 400; + line-height: 100%; + color: #0f0e08; + + @include mobile { + max-height: none; + font-size: 28px; + } + } + + &__square { + position: absolute; + top: 50%; + right: 0; + transform: translateY(-50%); + + width: 15px; + height: 15px; + + @include mobile { + width: 10px; + height: 10px; + } + } + + &__main { + margin: 15px 0 0; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 16px; + font-weight: 300; + line-height: 150%; + color: #4e4e4e; + } +} diff --git a/src/styles/blocks/_footer.scss b/src/styles/blocks/_footer.scss new file mode 100644 index 000000000..c6b6385cf --- /dev/null +++ b/src/styles/blocks/_footer.scss @@ -0,0 +1,300 @@ +.footer { + margin-top: 47px; + + &__arrow-up { + display: none; + + @include mobile { + display: block; + width: 50px; + height: 50px; + margin-left: auto; + } + } + + &__content { + display: flex; + align-items: flex-start; + } + + &__brand { + width: 70px; + margin-right: 130px; + } + + &__logo { + width: 63px; + height: 72px; + } + + &__socials { + display: flex; + justify-content: space-between; + margin-top: 62px; + } + + &__social { + width: 22px; + height: 22px; + + img { + width: 100%; + height: 100%; + } + } + + &__info { + display: flex; + align-items: flex-start; + } + + &__schedule { + width: 170px; + margin-right: 31px; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + line-height: 150%; + color: #0f0e08; + } + + &__schedule-title { + margin-bottom: 20px; + font-weight: 400; + line-height: 141%; + } + + &__schedule-left { + margin-bottom: 20px; + line-height: 150%; + } + + &__hours { + font-weight: 600; + } + + &__days { + font-weight: 400; + } + + &__schedule-right { + p { + margin: 0; + } + } + + &__day { + font-weight: 600; + } + + &__contacts { + width: 170px; + margin-right: 65px; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + line-height: 150%; + color: #0f0e08; + } + + &__contacts-title { + margin-bottom: 20px; + font-size: 14px; + font-weight: 400; + line-height: 141%; + } + + &__contacts-content { + p { + margin: 0; + } + } + + &__line { + width: 1px; + height: 260px; + margin-right: 65px; + + opacity: 0.5; + background-color: #1a5a4c80; + } + + &__list { + display: grid; + grid-template-columns: repeat(2, auto); + gap: 20px 32px; + + margin: 0; + padding: 0; + + list-style: none; + + a { + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 400; + line-height: 100%; + color: #0f0e08; + text-decoration: none; + + transition: 0.3s; + + &:hover { + opacity: 0.7; + } + } + } + + &__bottom { + display: flex; + justify-content: space-between; + + margin-top: 87px; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 12px; + font-weight: 300; + line-height: 141%; + color: #0f0e08; + } + + @include tablet { + margin-top: 51px; + + &__content { + display: grid; + grid-template-columns: 80px 1fr; + column-gap: 36px; + align-items: start; + } + + &__brand { + grid-column: 1; + grid-row: 1; + width: 80px; + margin-right: 0; + } + + &__social { + width: 24px; + height: 24px; + } + + &__info { + display: grid; + grid-column: 2; + grid-row: 1; + grid-template-columns: 170px 170px; + column-gap: 31px; + align-items: start; + } + + &__schedule { + width: 170px; + margin-right: 0; + } + + &__contacts { + width: 170px; + margin-right: 0; + } + + &__line { + grid-column: 1 / -1; + + width: 100%; + height: 1px; + margin: 64px 0 0; + + opacity: 0.5; + background-color: #1a5a4c80; + } + + &__nav { + grid-column: 1 / -1; + margin-top: 64px; + } + + &__list { + grid-template-columns: repeat(2, 220px); + gap: 20px; + } + + &__bottom { + margin-top: 120px; + } + } + + @include mobile { + margin-top: 40px; + + &__content { + display: flex; + flex-direction: column; + } + + &__brand { + display: flex; + justify-content: space-between; + width: 100%; + margin-right: 0; + } + + &__socials { + gap: 20px; + margin: auto 0; + margin-top: 0; + } + + &__info { + display: grid; + grid-column: 2; + grid-row: 1; + grid-template-columns: 130px 130px; + column-gap: 20px; + align-items: start; + + width: 100%; + margin-top: 40px; + } + + &__schedule { + width: 100%; + margin-right: 0; + } + + &__contacts { + width: 100%; + } + + &__line { + width: 280px; + height: 1px; + margin: 70px 0 0; + } + + &__nav { + min-width: 280px; + } + + &__list { + grid-template-columns: repeat(2, 130px); + gap: 20px; + margin-top: 40px; + } + + &__bottom { + flex-direction: column; + margin-top: 80px; + text-align: center; + } + + &__copyright { + margin: 0; + } + + &__designer { + margin-top: 10px; + } + } +} diff --git a/src/styles/blocks/_gallery.scss b/src/styles/blocks/_gallery.scss new file mode 100644 index 000000000..e3e7a2dd5 --- /dev/null +++ b/src/styles/blocks/_gallery.scss @@ -0,0 +1,178 @@ +.gallery { + margin-top: 183px; + + &__dots { + display: none; + } + + &__title { + margin: 0 0 56px; + font-family: Montserrat, sans-serif; + font-size: 48px; + font-weight: 700; + + @include tablet { + margin-bottom: 48px; + } + + @include mobile { + margin-bottom: 40px; + font-size: 36px; + text-align: center; + } + } + + &__slider { + display: grid; + gap: 30px; + } + + &__item { + overflow: hidden; + gap: 30px; + max-height: 600px; + + &--1 { + grid-column: 1 / 5; + } + + &--2 { + grid-column: 5 / 13; + } + + &--3 { + grid-column: 1 / 9; + } + + &--4 { + grid-column: 9 / 13; + } + } + + &__image { + display: block; + + width: 100%; + height: 100%; + + object-fit: cover; + + transition: transform 0.3s ease; + + &:hover { + transform: scale(1.05); + } + } + + @include tablet { + margin-top: 88px; + + &__viewport { + overflow: hidden; + width: calc(100vw - 39px); + } + + &__slider { + display: flex; + gap: 20px; + transition: transform 0.3s ease; + } + + &__item { + flex: 0 0 340px; + height: 543px; + + &--1, + &--2, + &--3, + &--4 { + grid-column: auto; + } + } + + &__image { + display: block; + width: 100%; + height: 100%; + object-fit: cover; + } + + &__dots { + display: flex; + gap: 20px; + align-items: center; + justify-content: center; + + margin-top: 32px; + } + + &__dot { + width: 9px; + height: 9px; + border: none; + border-radius: 50%; + + background-color: #e0e0e0; + + &--active { + background-color: #1a5a4c; + } + } + } + + @include mobile { + margin-top: 100px; + + &__viewport { + overflow: hidden; + width: calc(100vw - 20px); + } + + &__slider { + display: flex; + gap: 16px; + transition: transform 0.3s ease; + } + + &__item { + flex: 0 0 280px; + height: 410px; + + &--1, + &--2, + &--3, + &--4 { + grid-column: auto; + } + } + + &__image { + display: block; + width: 100%; + height: 100%; + object-fit: cover; + } + + &__dots { + display: flex; + gap: 20px; + align-items: center; + justify-content: center; + + margin-top: 20px; + } + + &__dot { + width: 9px; + height: 9px; + border: none; + border-radius: 50%; + + background-color: #e0e0e0; + + &--active { + background-color: #1a5a4c; + } + } + } +} diff --git a/src/styles/blocks/_header.scss b/src/styles/blocks/_header.scss new file mode 100644 index 000000000..322b304b8 --- /dev/null +++ b/src/styles/blocks/_header.scss @@ -0,0 +1,185 @@ +.hero { + @include mobile { + display: flex; + flex-direction: column; + } + + &__content { + grid-column: 1 / 6; + + @include tablet { + grid-column: 1 / 4; + } + + @include mobile { + grid-column: 1 / -1; + grid-row: 2; + } + } + + &__title { + margin-top: 143px; + + font-family: Montserrat, sans-serif; + font-size: 72px; + font-weight: 700; + line-height: 120%; + + @include tablet { + margin-top: 64px; + font-size: 54px; + } + + @include mobile { + order: 2; + + margin-top: 0; + + font-size: 45px; + line-height: 100%; + text-align: center; + } + } + + &__image { + position: relative; + + grid-column: 6 / 13; + + width: calc(100% + 55px); + height: 655px; + + background-image: url('../images/museum.png'); + background-repeat: no-repeat; + background-position: center; + background-size: cover; + + @include tablet { + grid-column: 4 / 7; + width: calc(100% + 39px); + height: 384px; + } + + @include mobile { + transform: translateX(-20px); + + grid-column: 1 / -1; + grid-row: 1; + order: -1; + + width: calc(100% + 40px); + max-height: 300px; + } + } +} + +.tickets { + cursor: pointer; + + box-sizing: border-box; + width: 270px; + height: 70px; + margin-top: 90px; + margin-left: auto; + padding: 0; + border: 1px solid #1a5a4c; + + color: inherit; + text-decoration: none; + + @include flex-center; + + @include tablet { + margin-top: 38px; + margin-left: 0; + } + + @include mobile { + order: 3; + width: 280px; + height: 50px; + margin-top: 20px; + } + + &__text { + flex: 1; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 16px; + font-weight: 500; + text-align: center; + } + + &__arrow { + @include flex-center; + + justify-content: center; + width: 70px; + height: 100%; + background-color: #1a5a4c; + + @include mobile { + width: 50px; + } + } +} + +.namu { + position: absolute; + + width: 170px; + height: 72px; + margin-top: 15px; + + background-image: url('../images/icons/NA MU.png'); + background-repeat: no-repeat; + background-position: center; + + @include tablet { + width: 220px; + margin-left: 0; + } + + @include mobile { + left: 50%; + transform: translateX(-50%); + + width: 55px; + height: 61px; + margin-top: 9px; + } +} + +.action { + display: flex; + flex-direction: column; + gap: 20px; + + width: 14px; + margin-top: -40px; + + &__text { + transform: rotate(180deg); + + writing-mode: vertical-rl; + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 700; + color: #687480; + } + + &__line { + width: 1px; + height: 70px; + margin-left: 6px; + background-color: #1a5a4c; + } + + @include tablet { + display: none; + } + + @include mobile { + display: none; + } +} diff --git a/src/styles/blocks/_icon.scss b/src/styles/blocks/_icon.scss new file mode 100644 index 000000000..7bbd5569c --- /dev/null +++ b/src/styles/blocks/_icon.scss @@ -0,0 +1,25 @@ +.icon { + display: block; + + width: 24px; + height: 24px; + + background-position: center; + background-size: contain; + + &--menu { + margin-top: 40px; + background-image: url('../images/icons/menu.png'); + + @include mobile { + position: absolute; + top: 0; + left: 20px; + margin-top: 27px; + } + } + + &--close { + background-image: url('../images/icons/close.png'); + } +} diff --git a/src/styles/blocks/_lecture.scss b/src/styles/blocks/_lecture.scss new file mode 100644 index 000000000..0336e37e5 --- /dev/null +++ b/src/styles/blocks/_lecture.scss @@ -0,0 +1,101 @@ +.lecture { + @include tablet { + padding: 0 39px; + } + + &__image { + width: 100%; + height: 550px; + + @include tablet { + height: 390px; + } + + @include mobile { + height: 210px; + } + + img { + display: block; + width: 100%; + height: 100%; + object-fit: cover; + } + } + + &__card { + position: relative; + + box-sizing: border-box; + width: 570px; + margin: -101px auto 0; + padding: 45px 100px 50px; + + background-color: #fff; + box-shadow: 0 2px #1a5a4c40; + + @include tablet { + width: 570px; + padding: 45px 55px 50px; + } + + @include mobile { + width: 280px; + margin-top: -57px; + padding: 20px 0; + } + } + + &__info { + display: flex; + align-items: center; + justify-content: space-between; + margin: 0 21px 16px; + + @include mobile { + margin-bottom: 20px; + } + } + + &__type { + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 500; + color: #687480; + + @include mobile { + font-size: 16px; + } + } + + &__date { + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 700; + color: #1a5a4c; + + @include mobile { + font-size: 16px; + } + } + + &__title { + margin: 0; + + font-family: Montserrat, sans-serif; + font-size: 36px; + font-weight: 400; + line-height: 100%; + color: #0f0e08; + + @include tablet { + font-size: 36px; + } + + @include mobile { + align-items: center; + width: 100%; + font-size: 28px; + } + } +} diff --git a/src/styles/blocks/_menu.scss b/src/styles/blocks/_menu.scss new file mode 100644 index 000000000..55434fbdc --- /dev/null +++ b/src/styles/blocks/_menu.scss @@ -0,0 +1,212 @@ +.menu { + position: fixed; + z-index: 10; + top: 0; + left: 0; + transform: translateY(-100%); + + width: 100%; + height: 233px; + + background: #1a5a4c; + + transition: transform 0.4s ease; + + &:target { + transform: translateY(0); + } + + @include tablet { + height: 225px; + } + + @include mobile { + height: 399px; + } + + &__content { + display: grid; + grid-template-columns: 24px 368px 1px 370px; + column-gap: 102px; + align-items: start; + + padding: 40px 0; + + @include tablet { + grid-template-columns: 24px 220px 1px 340px; + column-gap: 38px; + } + + @include mobile { + grid-template-columns: 20px 1fr; + gap: 24px 28px; + padding: 27px 0; + } + } + + &__nav { + margin: 0; + + @include mobile { + max-width: 228px; + } + } + + &__list { + display: grid; + grid-template-columns: repeat(2, auto); + gap: 30px; + + margin: 0; + padding: 0; + + list-style: none; + + @include tablet { + grid-template-columns: repeat(2, 100px); + gap: 24px 20px; + } + + @include mobile { + grid-template-columns: repeat(2, 100px); + gap: 24px 28px; + height: 74px; + } + + a { + font-family: 'IBM Plex Sans', sans-serif; + font-size: 22px; + font-weight: 500; + line-height: 100%; + color: #fff; + text-decoration: none; + + @include hover(opacity, 0.7); + + @include tablet { + font-size: 16px; + } + + @include mobile { + font-size: 16px; + } + } + } + + &__line { + width: 1px; + height: 145px; + background: #fff; + + @include mobile { + width: 280px; + height: 1px; + } + } + + &__schedule { + max-width: 370px; + max-height: 145px; + + @include tablet { + max-width: 340px; + } + + @include mobile { + grid-column: 1 / -1; + max-width: 280px; + max-height: 224px; + } + + &-title { + margin-bottom: 20px; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + font-weight: 400; + line-height: 141%; + color: #fff; + } + + &-content { + display: grid; + grid-template-columns: 1fr 170px; + column-gap: 30px; + line-height: 130%; + + @include tablet { + grid-template-columns: 1fr 144px; + column-gap: 26px; + } + + @include mobile { + display: flex; + flex-direction: column; + } + } + } + + &__schedule-left, + &__schedule-right { + max-width: 170px; + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + color: #fff; + + @include mobile { + max-width: 280px; + } + } + + &__schedule-left { + @include mobile { + margin-bottom: 16px; + } + } + + &__schedule-right { + @include mobile { + max-width: 100%; + font-weight: 400; + } + + p { + margin: 0; + } + } + + &__hours { + font-weight: 600; + } + + &__days { + font-weight: 400; + } + + &__day { + font-weight: 600; + } +} + +.overlay { + position: fixed; + z-index: 9; + top: 0; + left: 0; + + width: 100%; + height: 100%; + + visibility: hidden; + opacity: 0; + background-color: rgba(0, 0, 0, 0.4); + + transition: + opacity 0.4s ease, + visibility 0.4s ease; +} + +.menu:target + .overlay { + visibility: visible; + opacity: 1; +} diff --git a/src/styles/blocks/_page.scss b/src/styles/blocks/_page.scss new file mode 100644 index 000000000..eb8275877 --- /dev/null +++ b/src/styles/blocks/_page.scss @@ -0,0 +1,42 @@ +html { + scroll-behavior: smooth; +} + +body { + box-sizing: border-box; + margin: 0; + background-color: #f0f0f0; +} + +.container { + box-sizing: border-box; + width: 100%; + max-width: 1280px; + margin: 0 auto; + padding: 0 55px; + + @include tablet { + max-width: 768px; + padding: 0 39px; + } + + @include mobile { + max-width: 320px; + padding: 0 20px; + } +} + +.grid { + display: grid; + grid-template-columns: repeat(12, 1fr); + gap: 30px; + + @include tablet { + grid-template-columns: repeat(6, 1fr); + } + + @include mobile { + grid-template-columns: repeat(2, 1fr); + gap: 20px; + } +} diff --git a/src/styles/blocks/_subscribe.scss b/src/styles/blocks/_subscribe.scss new file mode 100644 index 000000000..80cae57be --- /dev/null +++ b/src/styles/blocks/_subscribe.scss @@ -0,0 +1,140 @@ +.subscribe { + margin-top: 200px; + + @include tablet { + margin-top: 92px; + } + + @include mobile { + margin-top: 100px; + } + + &__wall { + display: flex; + align-items: center; + + height: 550px; + + background-image: + linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), + url('../images/wall.png'); + background-repeat: no-repeat; + background-position: center; + background-size: cover; + + @include tablet { + height: 380px; + } + + @include mobile { + height: 386px; + } + } + + &__card { + align-items: center; + justify-content: center; + + width: 570px; + margin: 0 auto; + + text-align: center; + + @include tablet { + width: 460px; + } + + @include mobile { + width: 280px; + } + } + + &__title { + margin: 0 0 16px; + + font-family: Montserrat, sans-serif; + font-size: 48px; + font-weight: 700; + color: #fff; + + @include mobile { + font-size: 36px; + } + } + + &__discribe { + font-family: 'IBM Plex Sans', sans-serif; + font-size: 18px; + font-weight: 400; + color: #fff; + + @include mobile { + line-height: 150%; + } + } + + &__email { + display: flex; + justify-content: space-between; + + width: 570px; + height: 70px; + margin-top: 72px; + + @include tablet { + width: 460px; + margin-top: 64px; + } + + @include mobile { + width: 280px; + height: 50px; + margin-top: 50px; + } + + input { + flex: 1; + + box-sizing: border-box; + min-width: 0; + max-width: 470px; + padding: 0 28px; + border: none; + + font-family: 'IBM Plex Sans', sans-serif; + font-size: 14px; + + @include tablet { + max-width: 374px; + } + + @include mobile { + max-width: 230px; + } + + &:focus { + outline: none; + } + } + + button { + cursor: pointer; + + width: 70px; + height: 70px; + border: none; + + font-size: 24px; + + background-color: #f14a27; + + @include mobile { + width: 50px; + height: 50px; + } + &:hover { + opacity: 0.8; + } + } + } +} diff --git a/src/styles/main.scss b/src/styles/main.scss index fb9195d12..dd3358453 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -2,6 +2,12 @@ @import 'fonts'; @import 'typography'; -body { - background: $c-gray; -} +@import './blocks/events'; +@import './blocks/footer'; +@import './blocks/gallery'; +@import './blocks/header'; +@import './blocks/icon'; +@import './blocks/lecture'; +@import './blocks/menu'; +@import './blocks/page'; +@import './blocks/subscribe'; diff --git a/src/styles/utils/_mixins.scss b/src/styles/utils/_mixins.scss index 80c79780d..d87c21a9d 100644 --- a/src/styles/utils/_mixins.scss +++ b/src/styles/utils/_mixins.scss @@ -1,6 +1,25 @@ @mixin hover($_property, $_toValue) { - transition: #{$_property} 0.3s; + transition: $_property 0.3s; + &:hover { #{$_property}: $_toValue; } } + +@mixin tablet { + @media (min-width: 640px) and (max-width: 1279px) { + @content; + } +} + +@mixin mobile { + @media (max-width: 639px) { + @content; + } +} + +@mixin flex-center { + display: flex; + align-items: center; + justify-content: center; +} diff --git a/src/styles/utils/_vars.scss b/src/styles/utils/_vars.scss deleted file mode 100644 index aeb006ffb..000000000 --- a/src/styles/utils/_vars.scss +++ /dev/null @@ -1 +0,0 @@ -$c-gray: #eee; diff --git a/src/styles/utils/vars b/src/styles/utils/vars new file mode 100644 index 000000000..e69de29bb