Students
/
ITRadio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Авто исправление scss с учетом кастомных правил

This commit is contained in:
Norbaev 2024-07-29 17:28:35 +05:00
parent f780f12e4a
commit 0aba41a808
11 changed files with 149 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
client/src/assets/css/mixins/text.scss
View File

@ -34,6 +34,15 @@
@define-mixin h1 {
@mixin __p;
/* margin-top: 32px; */
margin-bottom: 1.5rem;
padding-bottom: 6px;
font-size: 100px;
font-weight: 500;
line-height: 1.2;
color: var(--color-white);
@mixin responsive-l {
font-size: 84px;
}
@ -45,29 +54,11 @@
@mixin responsive-s {
font-size: 36px;
}
/* margin-top: 32px; */
margin-bottom: 1.5rem;
padding-bottom: 6px;
font-size: 100px;
font-weight: 500;
line-height: 1.2;
color: var(--color-white);
}
@define-mixin h2 {
@mixin __p;
@mixin responsive-l {
font-size: 40px;
line-height: 1.1;
}
@mixin responsive-m {
font-size: 32px;
}
margin: 2.5rem 0;
padding-bottom: 6px;
@ -113,6 +104,15 @@
color: var(--color-white);
}
}
@mixin responsive-l {
font-size: 40px;
line-height: 1.1;
}
@mixin responsive-m {
font-size: 32px;
}
}
@define-mixin h3 {

56
client/src/assets/css/module/app-footer.scss
View File

@ -9,11 +9,6 @@
}
&__question {
@mixin responsive-xs {
flex-direction: column;
align-items: flex-start;
}
display: flex;
gap: 10px;
align-items: center;
@ -22,6 +17,11 @@
&-button {
margin-left: auto;
}
@mixin responsive-xs {
flex-direction: column;
align-items: flex-start;
}
}
&__bottom {
@ -31,20 +31,6 @@
}
&__menu {
@mixin responsive-m {
grid-row-gap: 10px;
grid-template-columns: min-content min-content min-content;
grid-template-rows: min-content;
width: 100%;
margin-bottom: var(--space-between-block);
}
@mixin responsive-s {
display: flex;
flex-wrap: wrap;
}
display: grid;
grid-gap: var(--space-between-block) var(--space-between-sections);
grid-template-columns: var(--space-between-sections) var(--space-between-sections);
@ -59,29 +45,43 @@
&-link {
font-size: 1.2rem;
}
@mixin responsive-m {
grid-row-gap: 10px;
grid-template-columns: min-content min-content min-content;
grid-template-rows: min-content;
width: 100%;
margin-bottom: var(--space-between-block);
}
@mixin responsive-s {
display: flex;
flex-wrap: wrap;
}
}
&__social {
display: flex;
flex-wrap: wrap;
gap: var(--space-between-block);
@mixin responsive-m {
grid-row-gap: 10px;
margin-bottom: var(--space-between-block);
}
display: flex;
flex-wrap: wrap;
gap: var(--space-between-block);
}
&__connection {
@mixin responsive-m {
align-items: flex-start;
width: 100%;
}
display: flex;
flex-direction: column;
gap: 1rem;
align-items: flex-end;
justify-content: space-between;
@mixin responsive-m {
align-items: flex-start;
width: 100%;
}
}
}

8
client/src/assets/css/module/app.scss
View File

@ -29,15 +29,15 @@
}
&__content {
@mixin responsive-l {
padding: 0 20px;
}
max-width: var(--container);
margin: 0 auto;
padding: 0 50px;
.m--indentation {
}
@mixin responsive-l {
padding: 0 20px;
}
}
}

20
client/src/assets/css/module/blog.scss
View File

@ -15,29 +15,24 @@
}
&-btn {
margin-left: auto;
@mixin responsive-xxs {
width: 100%;
}
margin-left: auto;
}
}
&__content {
display: flex;
gap: 80px;
@mixin responsive-m {
flex-direction: column;
}
display: flex;
gap: 80px;
}
&__cover {
@mixin responsive-m {
height: calc(var(--base-content-size) / 2);
max-height: none;
}
position: relative;
z-index: 2;
@ -46,6 +41,11 @@
background: url('./assets/img/bg/blog.svg') no-repeat center;
background-size: cover;
@mixin responsive-m {
height: calc(var(--base-content-size) / 2);
max-height: none;
}
}
&__list {

12
client/src/assets/css/module/fiald.scss
View File

@ -63,18 +63,10 @@
font-size: 1rem;
color: var(--color-white-opacity);
&:hover {
cursor: url('./assets/img/icon/cursor.svg'), auto;
}
&::before {
cursor: pointer;
content: '';
user-select: none;
user-select: none;
user-select: none;
user-select: none;
user-select: none;
position: absolute;
left: 0;
@ -110,6 +102,10 @@
transition: all 0.3s ease;
}
&:hover {
cursor: url('./assets/img/icon/cursor.svg'), auto;
}
}
&-input {

95
client/src/assets/css/module/home.scss
View File

@ -65,10 +65,6 @@
}
&__subtitle {
@mixin responsive-l {
padding: 0 20px;
}
max-width: 600px;
margin: 0 auto;
text-align: center;
@ -106,6 +102,10 @@
span {
font-weight: 700;
}
@mixin responsive-l {
padding: 0 20px;
}
}
&__title {
@ -123,7 +123,6 @@
var(--color-white) 106.11%
);
background-clip: text;
background-clip: text;
span {
color: var(--color-black);
@ -148,31 +147,22 @@
}
&__description {
@mixin responsive-m {
gap: var(--space-between-block);
}
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: calc(var(--space-between-sections) / 2);
margin-bottom: var(--space-between-sections);
@mixin responsive-m {
gap: var(--space-between-block);
}
}
&__info {
@mixin responsive-m {
width: 100%;
}
width: 60%;
&--item {
@mixin responsive-s {
flex-direction: column;
gap: 10px;
}
display: flex;
justify-content: space-between;
@ -185,13 +175,6 @@
align-items: end;
&::before {
@mixin responsive-s {
width: 80px;
height: 80px;
margin-right: auto;
background-size: contain;
}
content: '';
display: block;
@ -200,10 +183,21 @@
height: 130px;
background: url('./assets/img/icon/circleGradient.svg') no-repeat center;
@mixin responsive-s {
width: 80px;
height: 80px;
margin-right: auto;
background-size: contain;
}
}
}
span {
width: 57%;
font-weight: 400;
color: var(--color-white);
@mixin responsive-m {
width: 75%;
}
@ -211,35 +205,23 @@
@mixin responsive-s {
width: 100%;
}
width: 57%;
font-weight: 400;
color: var(--color-white);
}
@mixin responsive-s {
flex-direction: column;
gap: 10px;
}
}
@mixin responsive-m {
width: 100%;
}
}
&__content {
@mixin responsive-m {
display: flex;
flex-wrap: wrap;
gap: calc(var(--space-between-block) / 2);
align-items: flex-start;
max-width: none;
}
max-width: 360px;
&--item {
@mixin responsive-m {
width: calc((100% - var(--space-between-block)) / 3);
}
@mixin responsive-s {
width: 100%;
}
position: relative;
z-index: 2;
@ -283,6 +265,23 @@
background-image: var(--linear-gradient);
background-clip: text;
}
@mixin responsive-m {
width: calc((100% - var(--space-between-block)) / 3);
}
@mixin responsive-s {
width: 100%;
}
}
@mixin responsive-m {
display: flex;
flex-wrap: wrap;
gap: calc(var(--space-between-block) / 2);
align-items: flex-start;
max-width: none;
}
}
@ -318,11 +317,11 @@
}
&--description {
max-width: 45%;
@mixin responsive-xs {
max-width: 100%;
}
max-width: 45%;
}
&--btns {

2
client/src/assets/css/module/pagination.scss
View File

@ -30,10 +30,8 @@
&::after {
content: '';
position: absolute;
inset: 0;
margin: 5px;
}

16
client/src/assets/css/module/rubric.scss
View File

@ -14,10 +14,6 @@
}
&__description{
@mixin responsive-xxs {
max-width: none;
}
max-width: 60%;
margin-bottom: 2.5rem;
@ -26,6 +22,10 @@
max-width: 50%;
margin-bottom: 0;
}
@mixin responsive-xxs {
max-width: none;
}
}
&__link{
@ -64,10 +64,6 @@
padding: 20px 0;
&:hover{
cursor: url("./assets/img/icon/cursor.svg"), auto;
}
&::after{
content: '';
@ -80,6 +76,10 @@
background: #000;
background: var(--linear-gradient);
}
&:hover{
cursor: url("./assets/img/icon/cursor.svg"), auto;
}
}
&__title{

8
client/src/assets/css/module/song.scss
View File

@ -10,10 +10,6 @@
}
&-item {
@mixin responsive-m {
width: 100%;
}
position: relative;
z-index: 2;
@ -215,6 +211,10 @@
align-items: center;
margin-left: auto;
}
@mixin responsive-m {
width: 100%;
}
}
}

4
client/src/assets/css/module/tabs.scss
View File

@ -4,14 +4,14 @@
margin-bottom: var(--space-between-block);
&.m--btns{
gap: 10px;
@mixin responsive-xs {
.button{
width: 100%;
}
}
gap: 10px;
}
&__item {

48
client/src/assets/css/module/team.scss
View File

@ -1,8 +1,4 @@
.team {
@mixin responsive-xl {
padding: 0 0 0 20px;
}
position: relative;
z-index: 2;
@ -11,6 +7,13 @@
margin-left: auto;
&__header {
display: flex;
max-width: var(--container);
margin-right: auto;
margin-bottom: var(--space-between-block);
padding: 0 50px;
@mixin responsive-xl {
column-gap: var(--space-between-block);
padding: 0 40px 0 0;
@ -19,13 +22,6 @@
@mixin responsive-s {
flex-wrap: wrap;
}
display: flex;
max-width: var(--container);
margin-right: auto;
margin-bottom: var(--space-between-block);
padding: 0 50px;
}
&__title {
@ -49,14 +45,6 @@
}
&__tools {
@mixin responsive-xl {
padding: 0 80px 0 35px;
}
@mixin responsive-l {
padding: 0 40px 0 0;
}
display: flex;
flex-wrap: wrap;
row-gap: 1.5rem;
@ -75,13 +63,17 @@
width: 100%;
}
}
@mixin responsive-xl {
padding: 0 80px 0 35px;
}
@mixin responsive-l {
padding: 0 40px 0 0;
}
}
&__progress {
@mixin responsive-s {
max-width: none;
}
position: relative;
overflow: hidden;
@ -104,6 +96,10 @@
background: var(--color-white);
}
@mixin responsive-s {
max-width: none;
}
}
&__cover {
@ -127,6 +123,8 @@
}
&__description {
max-width: 820px;
@mixin responsive-xl {
max-width: calc(100% - var(--space-between-block));
}
@ -135,7 +133,9 @@
width: 100%;
max-width: none;
}
}
max-width: 820px;
@mixin responsive-xl {
padding: 0 0 0 20px;
}
}