Skip to content

Commit

Permalink
style: add signup for more updates form css from xpro
Browse files Browse the repository at this point in the history
  • Loading branch information
mudassir-hafeez committed Mar 31, 2024
1 parent 51bc4a7 commit 5b81eaf
Show file tree
Hide file tree
Showing 2 changed files with 322 additions and 0 deletions.
160 changes: 160 additions & 0 deletions static/scss/detail/header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -219,6 +219,166 @@
}
}

form {
width: 100%;
height: auto;

.hs-form-field {
padding-bottom: 16px;

label {
color: #495057;
font-family: Rajdhani;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
}

input[type="text"],
input[type="email"],
input[type="tel"],
select {
height: 50px;
width: 100%;
align-self: stretch;
border-radius: 4px;
border: 1px solid #CED4DA;

Check failure on line 246 in static/scss/detail/header.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

Hex notation should all be lower case
background: $white;
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.05);
padding: 12px;
font-family: Rajdhani;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
outline: none;

&:focus {
border: 2px solid #CED4DA;

Check failure on line 258 in static/scss/detail/header.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

Hex notation should all be lower case
}
}

.hs-error-msgs {
padding: 0;
margin: 0;
list-style: none;

label {
color: $primary;
display: block;
}
}

.multi-container {
padding: 0;
margin: 0;
list-style: none;
display: flex;
flex-direction: row;
align-items: center;

.hs-form-radio {

label {
position: relative;

input {
height: 22px;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 22px;
}

span {
display: inline-block;
margin-left: 28px;
margin-right: 32px;

&::before {
color: #B8C2CC;

Check failure on line 301 in static/scss/detail/header.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

Hex notation should all be lower case
border: 2px solid;
content: "";
height: 22px;
left: 0;
position: absolute;
top: 0;
width: 22px;
border-radius: 50%;
}

&::after {
color: $primary;
content: "";
opacity: 0;
border: 6px solid;
border-radius: 50%;
position: absolute;
left: 5px;
top: 5px;
transition: opacity 0.2s ease-in-out;
}
}

input:checked + span::after {
opacity: 1;
}

input:checked + span::before {
color: $primary;
}

input:not(:checked):hover + span::before {
background: $close-hover-background;
color: $primary;
}

input:not(:checked):hover + span {
cursor: pointer;
}
}
}

.hs-form-checkbox {
span {
display: inline-block;
margin-left: 8px;
margin-right: 32px;
}
}
}
}

.hs-submit {
padding-bottom: 10px;
text-align: right;

input[type="submit"] {
@extend .btn;

Check failure on line 359 in static/scss/detail/header.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

@extend must be used with a %placeholder
@extend .btn-primary;

Check failure on line 360 in static/scss/detail/header.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

@extend must be used with a %placeholder
border-radius: 5px;
background: $primary;
padding: 19px 25px;
font-family: Rajdhani;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: uppercase;

&:hover {
text-decoration: none;
transition: all .2s ease-in;
}
}
}

.hs_error_rollup {
display: none;
}
}
}

.notifications {
Expand Down
162 changes: 162 additions & 0 deletions static/scss/detail/subnav.scss
Original file line number Diff line number Diff line change
Expand Up @@ -182,6 +182,168 @@

}
}

form {
width: 100%;
height: auto;

.hs-form-field {
padding-bottom: 16px;

label {
color: #495057;
font-family: Rajdhani;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
}

input[type="text"],
input[type="email"],
input[type="tel"],
select {
height: 50px;
width: 100%;
align-self: stretch;
border-radius: 4px;
border: 1px solid #CED4DA;

Check failure on line 210 in static/scss/detail/subnav.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

Hex notation should all be lower case
background: $white;
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.05);
padding: 12px;
font-family: Rajdhani;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
outline: none;

&:focus {
border: 2px solid #CED4DA;

Check failure on line 222 in static/scss/detail/subnav.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

Hex notation should all be lower case
}
}

.hs-error-msgs {
padding: 0;
margin: 0;
list-style: none;

label {
color: $primary;
display: block;
}
}

.multi-container {
padding: 0;
margin: 0;
list-style: none;

display: flex;
flex-direction: row;
align-items: center;

.hs-form-radio {

label {
position: relative;

input {
height: 22px;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 22px;
}

span {
display: inline-block;
margin-left: 28px;
margin-right: 32px;

&::before {
color: #B8C2CC;

Check failure on line 266 in static/scss/detail/subnav.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

Hex notation should all be lower case
border: 2px solid;
content: "";
height: 22px;
left: 0;
position: absolute;
top: 0;
width: 22px;
border-radius: 50%;
}

&::after {
color: $primary;
content: "";
opacity: 0;
border: 6px solid;
border-radius: 50%;
position: absolute;
left: 5px;
top: 5px;
transition: opacity 0.2s ease-in-out;
}
}

input:checked + span::after {
opacity: 1;
}

input:checked + span::before {
color: $primary;
}

input:not(:checked):hover + span::before {
background: $close-hover-background;
color: $primary;
}

input:not(:checked):hover + span {
cursor: pointer;
}
}
}

.hs-form-checkbox {
span {
display: inline-block;
margin-left: 8px;
margin-right: 32px;
}
}
}
}

.hs-submit {
padding-bottom: 10px;
text-align: right;

input[type="submit"] {
@extend .btn;

Check failure on line 324 in static/scss/detail/subnav.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

@extend must be used with a %placeholder
@extend .btn-primary;

Check failure on line 325 in static/scss/detail/subnav.scss

View workflow job for this annotation

GitHub Actions / javascript-tests

@extend must be used with a %placeholder
border-radius: 5px;
background: $primary;
padding: 19px 25px;
font-family: Rajdhani;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: uppercase;

&:hover {
text-decoration: none;
transition: all .2s ease-in;
}
}
}

.hs_error_rollup {
display: none;
}
}
}
}

Expand Down

0 comments on commit 5b81eaf

Please sign in to comment.