Skip to content

Commit

Permalink
chore: update hovers and form states style
Browse files Browse the repository at this point in the history 
Signed-off-by: Raman Yasel <[email protected]>
  • Loading branch information
@yasell
yasell committed Apr 25, 2024
1 parent df6fc84 commit 731eb88
Show file tree
Hide file tree
Showing 7 changed files with 197 additions and 159 deletions.
12 changes: 3 additions & 9 deletions docs/assets/scss/footer.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,8 @@
.td-home & {
font-family: "Manrope", sans-serif;

.container {
padding: 0 52px;

@media (max-width: $tablet) {
padding: 0 0;
}
.container-fluid {
max-width: 1238px;
}
}

Expand Down Expand Up @@ -148,10 +144,8 @@
}

@media (max-width: $mobile) {
flex-direction: column;
row-gap: 10px;
margin-top: 40px;
padding: 30px 16px 0 16px;
padding: 30px 4px 0 4px;
}

p {
Expand Down
68 changes: 43 additions & 25 deletions docs/assets/scss/home/cards.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,7 @@
}

&__item {
display: flex;
align-items: center;
gap: 18px;
border: 1px solid #E0E6F0;
border-radius: 12px;
overflow: hidden;


@media (max-width: $desktop) {
gap: 15px;
Expand All @@ -47,6 +42,42 @@
}
}

&__link {
display: flex;
align-items: center;
gap: 18px;
height: 100%;
border: 1px solid #E0E6F0;
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease-in-out;

.button {
margin-top: 14px;
font-size: 15px;
font-weight: 700;
line-height: 1;
color: #253737;
}

&:focus,
&:hover {
box-shadow: 0 3px 8px 0 rgba(201,206,207,0.8);

.button {
color: #5C6D70 !important;
}
}

@media (max-width: $desktop) {
margin-top: 17px;
}

@media (max-width: $tablet) {
margin-top: 12px;
}
}

&__text-wrapper {
display: flex;
flex-direction: column;
Expand All @@ -68,9 +99,10 @@

&__title {
margin-bottom: 0;
font-size: 22px;
font-weight: 600;
line-height: 137%;
font-size: 22px;
line-height: 1.375;
color: #253737;

@media (max-width: $desktop) {
font-size: 20px;
Expand All @@ -88,6 +120,8 @@
&__description {
margin-top: 7px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.375;
color: #5E636E;

@media (max-width: $mobile) {
Expand All @@ -96,34 +130,18 @@
}
}

&__link {
margin-top: 14px;
font-size: 15px;
font-weight: 700;
line-height: 100%;

@media (max-width: $desktop) {
margin-top: 17px;
}

@media (max-width: $tablet) {
margin-top: 12px;
}
}

&__img {
z-index: -1;
position: relative;
flex-shrink: 0;
height: auto;

@media (max-width: $desktop) {
max-width: 32%;
height: auto;
}

@media (max-width: $tablet) {
max-width: 21%;
height: auto;
}

@media (max-width: $mobile) {
Expand Down
30 changes: 18 additions & 12 deletions docs/assets/scss/home/contact.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -170,12 +170,12 @@
textarea {
display: block;
width: 100%;
padding: 13px 20px;
padding: 13px 18px;
text-overflow: ellipsis;
font-size: 16px;
color: #5E636E;
color: #5e636e;
background: #fff;
border: 1px solid #E0E6F0;
border: 1px solid #e0e6f0;
border-radius: 4px;
transition: all 0.3s ease;
-webkit-appearance: none;
Expand All @@ -184,13 +184,18 @@
padding: 6px 16px;
}

&:hover {
outline: none;
border-color: #c1cde1;
}

&:focus {
outline: none;
border-color: #253737;
border-color: #70a0ff;
}

&[aria-invalid="true"] {
border-color: #eb4748;
border-color: #ff7070;
}

&:disabled {
Expand Down Expand Up @@ -265,12 +270,12 @@
}

&:focus + span {
border-color: #253737;
border-color: #c1cde1;
}

&:checked + span {
background-color: #D6F5D6;
border-color: #D6F5D6;
background-color: #d6f5d6;
border-color: #d6f5d6;

&:after {
opacity: 1;
Expand All @@ -282,10 +287,11 @@
.error {
position: absolute;
left: 0;
bottom: -22px;
font-size: 14px;
font-weight: 300;
color: #eb4748;
bottom: -17px;
margin: 0;
font-size: 12px;
font-weight: 500;
color: #ff7070;
}

p {
Expand Down
82 changes: 48 additions & 34 deletions docs/assets/scss/home/tools.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,12 +60,6 @@
}
}

&__promo__text-wrapper {
display: flex;
flex-direction: column;
gap: 14px;
}

&__list {
display: flex;
gap: 32px;
Expand All @@ -85,31 +79,27 @@
}

&__item {
display: flex;
flex-direction: column;
gap: 8px;
padding: 28px;
background-color: #ffffff;
border-radius: 12px;
box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.12);
width: 280px;

@media (max-width: $desktop) {
padding: 20px;
width: 215px;
}

@media (max-width: $tablet) {
padding: 24px;
width: 285px;
}

@media (max-width: $mobile) {
padding: 18px 16px;
padding-right: 33px;
width: 100%;
}

.button {
margin-top: auto;
color: #253737;
font-size: 15px;
font-weight: 700;
}

img {
height: auto;

Expand All @@ -123,12 +113,49 @@
}
}

&__link {
display: flex;
flex-direction: column;
height: 100%;
padding: 28px;
gap: 8px;
background-color: #ffffff;
border: 1px solid #e0e6f0;
border-radius: 12px;
transition: all 0.3s ease-in-out;

&:focus,
&:hover {
box-shadow: 0 3px 8px 0 rgba(201,206,207,0.8);

.button {
color: #5C6D70 !important;
}
}

@media (max-width: $desktop) {
padding: 20px;
font-size: 14px;
}

@media (max-width: $tablet) {
padding: 24px;
font-size: 15px;
}

@media (max-width: $mobile) {
padding: 18px 16px;
padding-right: 33px;
}
}

&__item-title {
margin-top: 6px;
margin-bottom: 0;
font-size: 20px;
line-height: 1.375;
font-weight: 600;
line-height: 27px;
color: #253737;

@media (max-width: $desktop) {
font-size: 16px;
Expand All @@ -138,6 +165,9 @@

&__item-description {
margin-bottom: 0;
font-size: 16px;
line-height: 1.375;
color: #5E636E;

@media (max-width: $desktop) {
margin-top: -5px;
Expand Down Expand Up @@ -171,20 +201,4 @@
line-height: 1.5;
}
}

&__link {
color: #253737;
font-size: 15px;
font-weight: 700;
margin-top: auto;

@media (max-width: $desktop) {
font-size: 14px;
}

@media (max-width: $tablet) {
margin-top: 5px;
font-size: 15px;
}
}
}
1 change: 1 addition & 0 deletions docs/assets/scss/home/videos.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,7 @@

img {
width: 100%;
height: auto;
}
}
}
Expand Down
Loading

0 comments on commit 731eb88

Please sign in to comment.