From 596ca4e71dad8a0c8ec9d0c2a7b144ab47959fc2 Mon Sep 17 00:00:00 2001 From: Andrey Shulga Date: Mon, 26 Feb 2024 02:33:43 +0200 Subject: [PATCH] refactoring --- .stylelintcache | 1 - src/assets/scss/fonts.scss | 41 ++++++++++++++++++++++------------ src/assets/scss/reset.scss | 3 ++- src/assets/scss/shared.scss | 14 ++++++++++++ src/assets/scss/variables.scss | 4 ++-- 5 files changed, 45 insertions(+), 18 deletions(-) delete mode 100644 .stylelintcache diff --git a/.stylelintcache b/.stylelintcache deleted file mode 100644 index 7a878f70f..000000000 --- a/.stylelintcache +++ /dev/null @@ -1 +0,0 @@ -[{"C:\\1\\middle.messenger.praktikum.yandex\\src\\pages\\registration\\styles.scss":"1","C:\\1\\middle.messenger.praktikum.yandex\\src\\pages\\error\\styles.scss":"2","C:\\1\\middle.messenger.praktikum.yandex\\src\\pages\\login\\styles.scss":"3","C:\\1\\middle.messenger.praktikum.yandex\\src\\components\\Input\\styles.scss":"4","C:\\1\\middle.messenger.praktikum.yandex\\src\\components\\Form\\styles.scss":"5","C:\\1\\middle.messenger.praktikum.yandex\\src\\pages\\chat\\styles.scss":"6","C:\\1\\middle.messenger.praktikum.yandex\\src\\pages\\account\\styles.scss":"7","C:\\1\\middle.messenger.praktikum.yandex\\src\\assets\\scss\\styles.scss":"8","C:\\1\\middle.messenger.praktikum.yandex\\src\\components\\Button\\styles.scss":"9"},{"size":135,"mtime":1708892428481,"hashOfConfig":"10"},{"size":395,"mtime":1708892428472,"hashOfConfig":"10"},{"size":128,"mtime":1708892428478,"hashOfConfig":"10"},{"size":853,"mtime":1708907080241,"hashOfConfig":"10"},{"size":851,"mtime":1708907078157,"hashOfConfig":"10"},{"size":13341,"mtime":1708899129616,"hashOfConfig":"10"},{"size":3606,"mtime":1708907159972,"hashOfConfig":"10"},{"size":277,"mtime":1708907106141,"hashOfConfig":"10"},{"size":390,"mtime":1708907040933,"hashOfConfig":"10"},"1v6j01t"] \ No newline at end of file diff --git a/src/assets/scss/fonts.scss b/src/assets/scss/fonts.scss index e97f41163..c54c4adf5 100644 --- a/src/assets/scss/fonts.scss +++ b/src/assets/scss/fonts.scss @@ -3,136 +3,149 @@ font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2") format("woff2"); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } + /* cyrillic */ @font-face { font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } + /* greek-ext */ @font-face { font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2") format("woff2"); unicode-range: U+1F00-1FFF; } + /* greek */ @font-face { font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2") format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } + /* vietnamese */ @font-face { font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2") format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } + /* latin-ext */ @font-face { font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2") format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } + /* latin */ @font-face { font-family: Inter; font-style: normal; font-weight: 500; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } + /* cyrillic-ext */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2") format("woff2"); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } + /* cyrillic */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } + /* greek-ext */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2") format("woff2"); unicode-range: U+1F00-1FFF; } + /* greek */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2") format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } + /* vietnamese */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2") format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } + /* latin-ext */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2") format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } + /* latin */ @font-face { font-family: Inter; font-style: normal; font-weight: 600; - src: url(https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2) + src: url("https://fonts.gstatic.com/s/inter/v13/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, diff --git a/src/assets/scss/reset.scss b/src/assets/scss/reset.scss index 3888f51b8..d54c985cd 100644 --- a/src/assets/scss/reset.scss +++ b/src/assets/scss/reset.scss @@ -23,6 +23,7 @@ button { cursor: revert; border: none; outline: none; + &:focus { border: none; } @@ -51,7 +52,7 @@ table { input, textarea { border: none; - -webkit-user-select: auto; + user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ diff --git a/src/assets/scss/shared.scss b/src/assets/scss/shared.scss index 266e09350..078d0c71a 100644 --- a/src/assets/scss/shared.scss +++ b/src/assets/scss/shared.scss @@ -6,12 +6,15 @@ display: flex; flex-wrap: wrap; } + h2 { font-size: 16px; } + h3 { font-size: 15px; } + .btn { transition: 0.2s; cursor: pointer; @@ -25,28 +28,34 @@ h3 { text-align: center; color: #fff; background-color: $primary-color; + &:hover { transition: 0.2s; background-color: $dark-primary-color; } } + .link { transition: 0.2s; cursor: pointer; font-size: 11px; color: $primary-color; + &.red { color: $red-color; + &:hover { transition: 0.2s; opacity: 0.8; } } + &:hover { transition: 0.2s; color: $dark-primary-color; } } + .title { font-size: 20px; width: 100%; @@ -64,18 +73,22 @@ h3 { top: 50%; transform: translate(-50%, -50%); background-color: #fff; + .title { font-size: 15px; } + button { margin-top: 16px; } + &.active { transition: 0.4s; opacity: 1; visibility: visible; } } + .overlay { transition: 0.4s; opacity: 0; @@ -88,6 +101,7 @@ h3 { width: 100vw; height: 100vh; background-color: #000; + &.active { transition: 0.4s; opacity: 0.4; diff --git a/src/assets/scss/variables.scss b/src/assets/scss/variables.scss index d1270fc2f..b7bc31506 100644 --- a/src/assets/scss/variables.scss +++ b/src/assets/scss/variables.scss @@ -1,7 +1,7 @@ $text-color: #1e1e1e; $light-text-color: #999; -$primary-color: #3369f3; +$primary-color: #2a5ad3; $light-primary-color: #e4edfd; -$dark-primary-color: darken($primary-color, 10%); +$dark-primary-color: #224ab1; $red-color: #f00; $bg-color: #efefef;