Skip to content

Commit

Permalink
откорректировал форм.
Browse files Browse the repository at this point in the history
  • Loading branch information
gadjster committed Feb 6, 2024
1 parent 5b622d3 commit 4b4e0d2
Showing 1 changed file with 45 additions and 69 deletions.
114 changes: 45 additions & 69 deletions styles/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,12 @@
*::before,
*::after {
box-sizing: border-box;

}

html {
block-size: 100%;

}

.page {
Expand All @@ -19,6 +21,7 @@ html {
background-color: #1b1919;
inline-size: 1200px;
block-size: 100%;

}

h1,
Expand All @@ -40,9 +43,6 @@ fieldset{

}




ul,
ol {
list-style: none;
Expand All @@ -55,14 +55,11 @@ ol {
min-width: 1140px;
height: 534px;

}

}

.result{
align-self:end;



}


Expand All @@ -71,8 +68,7 @@ ol {
display: flex;
justify-content: space-between;

}

}

.content__list{
position: relative;
Expand All @@ -81,16 +77,12 @@ ol {
height: 298px;
overflow:auto;

}

}

.content__list-item:not(:first-child){
margin-top: 30px;

}



}

.content__details{
display: flex;
Expand All @@ -99,45 +91,43 @@ ol {
width: 100%;
height: 100%;

}
}

.result__video-container{
position: relative;
width: 711px;
height: 386px;
margin-bottom: 16px;

}

}

.result__video{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;

}
}

.content__video-card{
display: flex;
justify-content: space-between;

}

}

.content__video-card-thumbnail{
width: 194px;
height: 103px;

}
}

.content__video-card-description-container{
display: flex;
flex-direction:column;
gap: 6px;
width: 100%;

}
}

.search-form__fieldset-title{
color: #FFF;
Expand All @@ -146,7 +136,7 @@ ol {
font-style: normal;
line-height: normal;

}
}

.title{
color: #FFF;
Expand All @@ -157,46 +147,43 @@ ol {
line-height: 94%; /* 70.5px */
text-transform: uppercase;

}
}

.content__accent{
color: #545050;

}
}

.content__card-link{
display:block;
margin: 2px;
color: #FFF;
text-decoration: none;

}
}


.content__card-link:hover{
text-decoration: underline;
cursor: pointer;

}
}

.content__card-link:focus{
border:none;
outline: none;
}

}

.content__card-link:focus-visible{
outline: 1px solid #FFF;

}

}

.content__card-link_current{
background-color:#545050;


}


}

.content__video-card-title{
margin-top: 5px;
Expand All @@ -208,7 +195,7 @@ ol {
line-height: 100%; /* 30px */
text-transform: uppercase;

}
}

.content__video-card-description{
margin-left: 5px;
Expand All @@ -218,7 +205,7 @@ ol {
font-style: normal;
line-height: 16.2px; /* 90% */

}
}

.visually-hidden {
position: absolute;
Expand All @@ -229,14 +216,13 @@ ol {
clip-path: inset(50%);
white-space: nowrap;

}
}

.search-form{
display: flex;

}


.search-form__fieldset{
outline: none;

Expand All @@ -252,8 +238,6 @@ ol {

}



.search-form__textfield{
width:fit-content;
border-top: 1px solid #FFF;
Expand All @@ -262,38 +246,35 @@ ol {
border-left: none;
appearance: none;


}
}

.search-form__textfield:active{
border: 1px solid #FFF;
outline: none;


}
}

.search-form__label:has(.search-form__textfield:focus-visible){
border-top:2px double #FFF;
border-right: 1px solid #FFF;
border-bottom: 2px double #FFF;
border-left: 1px solid #FFF;
outline: none;
}

}

.search-form__textfield:focus{
border:none;
outline:none;

}


}

.search-form__checkbox-list{
display: flex;
justify-content: space-between;
width: 212px;

}
}

.search-form__textfield{
width: 225px;
Expand All @@ -306,9 +287,8 @@ ol {
line-height: normal;
background-color: transparent;
appearance: none;

}

}

.search-form__textfield::placeholder{
color: rgba(255, 255, 255, 0.70);
Expand All @@ -318,23 +298,22 @@ ol {
font-style: normal;
line-height: normal;

}
}

.search-form__label{
display: flex;
align-content:center;
display: flex;
align-content:center;

}

.search-form__checkbox-list{
margin: 5px;
margin: 5px;

}

.search-form__label-text{
align-content:center;
margin-left: 2px;

color: rgba(255, 255, 255, 0.70);
font-family: "Fira Sans Condensed";
font-weight: 400;
Expand All @@ -345,7 +324,7 @@ margin: 5px;
}

.search-form__checkbox-list .search-form__label:hover{
text-decoration: underline;
text-decoration: underline;

}

Expand All @@ -358,15 +337,13 @@ text-decoration: underline;
height: 19px;
border: 1px solid #adb5bd;
border-radius: 1px;

}

.search-form__checkbox:checked + .search-form__pseudo-checkbox::before{
content: '';
display:inline-block;
margin: auto ;



width: 15px;
height: 15px;
background-color: #adb5bd;
Expand All @@ -392,44 +369,43 @@ text-decoration: underline;
background-color:transparent;
cursor: pointer;

}
}

.button:active{
background-color:#545050;


}
}

.button:hover{
text-decoration: underline;

}
}

.button:focus{
border: none;
outline: none;
}
}

.button:focus-visible{
border:none;
outline: 2px double #FFF;

}
}

.search-form__submit-button{
align-self:flex-end;
width: 194px;
height: 34px;

}
}

.more-button{
position: sticky;
width: 100%;
height: 34px;
margin-top: 30px;

}
}



Expand Down

0 comments on commit 4b4e0d2

Please sign in to comment.