Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP] get on for v2 #7

Open
wants to merge 13 commits into
base: dev
Choose a base branch
from
963 changes: 651 additions & 312 deletions css/main.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion css/main.css.map

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion scss/_alerts.scss
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@
}

&__info {
background: var(--color-primary-500);
background: var(--primary-color-500);
border: 1px dashed var(--line-border-2);
border-radius: 8px;
max-width: 576px;
Expand Down
70 changes: 70 additions & 0 deletions scss/_borders.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
.border {
&__all {
border: 1px solid var(--line-border);
&__2 {
border: 1px solid var(--line-border-2);
}
}

&__right {
Expand All @@ -19,12 +22,54 @@
border-bottom: 1px solid var(--line-border);
}

&--width__2 {
border-width: 2px;
}

&--width__3 {
border-width: 3px;
}

&--width__4 {
border-width: 4px;
}

&--none {
border: none !important;
}

&--top {
&__none {
border-top: none;
}
}

&--bottom {
&__none {
border-bottom: none;
}
}

&--left {
&__none {
border-left: none;
}
}

&--right {
&__none {
border-right: none;
}
}
}

.rounded {
&__0px {
border-radius: 0 !important;
}
&__2px {
border-radius: 2px;
}
&__4px {
border-radius: 4px;
}
Expand Down Expand Up @@ -80,4 +125,29 @@
&__30px {
border-radius: 30px;
}

&__50px {
border-radius: 30px;
}

&--top-left {
&__none {
border-top-left-radius: 0;
}
}
&--top-right {
&__none {
border-top-right-radius: 0;
}
}
&--bottom-left {
&__none {
border-bottom-left-radius: 0;
}
}
&--bottom-right {
&__none {
border-bottom-right-radius: 0;
}
}
}
35 changes: 25 additions & 10 deletions scss/_buttons.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,35 +2,39 @@
cursor: pointer;
border: none;
@extend .font__weight-500;
@extend .font__16px;
@extend .font__14px;
border-radius: 10px;
white-space: nowrap;
padding: 13px 40px;
min-width: 200px;
background: var(--btn-color, --primary-color);
// min-width: 200px;

&__primary {
--btn-color: linear-gradient(0deg, var(--primary-color-2) 0%, var(--primary-color) 100%);
--btn-color-hover: 0px 1px 1px rgba(var(--box-shadow), 0.1), inset 0px 2px 0px rgba(var(--color-white-rgb), 0.06);
--btn-text-color: var(--color-white-100);
border: 1px solid var(--primary-color);
background: var(--btn-color);
color: var(--btn-text-color);

&--without-gradient {
--btn-color: var(--primary-color);
--btn-color-hover: 0px 1px 1px rgba(var(--box-shadow), 0.1), inset 0px 2px 0px rgba(var(--color-white-rgb), 0.06);
--btn-text-color: var(--color-white-100);
border: 1px solid var(--primary-color);
background: var(--btn-color);
color: var(--btn-text-color);
}

&__light {
--btn-color: var(--primary-color-500);
--btn-text-color: var(--primary-color);
border: none;
}
}

&__danger {
--btn-color: var(--danger-color);
--btn-color-hover: rgba(var(--danger-color-rgb), 0.03);
--btn-text-color: var(--primary-color-inverse);
background: var(--btn-color);
color: var(--btn-text-color);
}

Expand All @@ -49,7 +53,7 @@

&__deactivate {
background: var(--color-deactivate);
border: 1px solid var(--color-primary-500);
border: 1px solid var(--primary-color-500);
box-sizing: border-box;
box-shadow: 0px 1px 1px rgba(var(--box-shadow), 0.05), inset 0px 2px 0px rgba(var(--color-white), 0.05);
@extend .font__weight-500;
Expand All @@ -63,7 +67,7 @@
}

&__white {
background: linear-gradient(0deg, var(--color-off-white) 0%, var(--color-white) 100%);
--btn-color: linear-gradient(0deg, var(--color-off-white) 0%, var(--color-white) 100%);
border: 1px solid var(--line-border);
box-shadow: 0px 1px 1px rgba(var(--box-shadow), 0.05), inset 0px 2px 0px rgba(var(--color-white-rgb), 0.05);
@extend .font__weight-500;
Expand Down Expand Up @@ -115,10 +119,11 @@

&__retry {
border: none;
background: var(--color-primary-500);
background: var(--primary-color-400);
border-radius: 4px;
padding: 6px 9px;
@extend .font__14px;
@extend .font__weight-400;
color: var(--primary-color);

&__force {
Expand Down Expand Up @@ -188,25 +193,32 @@
border: none;
height: fit-content;
padding: 0;

&.dark {
padding: 10px;
color: var(--color-black);
}
}

&__outline {
border: 1px solid var(--line-border-2);
color: var(--primary-color);
}

&__filter {
background: var(--color-white-100);
border: 1px solid var(--line-border-2);
box-sizing: border-box;
border-radius: 10px;
height: 36px;
padding: 5px 10px;
min-width: 110px;
min-width: 100px;
@extend .flex;
@extend .flex__align-items-center;
@extend .font__weight-500;
@extend .font__12px;
color: var(--grey-color);
@extend .flex__justify-between;

img {
width: 14px;
Expand All @@ -231,8 +243,11 @@
@extend .text--left;
color: var(--primary-color);
@extend .font__weight-500;
background: rgba(var(--primary-color-rgb), 0.1);
border: 1px solid var(--primary-color);

input {
width: 70px;
width: 63px;
}
}
}
Expand Down
3 changes: 2 additions & 1 deletion scss/_dropdown.scss
Original file line number Diff line number Diff line change
Expand Up @@ -103,8 +103,9 @@

&.active,
&:hover {
background: var(--color-primary-500);
background: var(--primary-color-500);
transition: 0.3s ease-in-out;
cursor: pointer;
}

&.no-hover {
Expand Down
8 changes: 8 additions & 0 deletions scss/_fonts.scss
Original file line number Diff line number Diff line change
Expand Up @@ -133,6 +133,10 @@ h4 {
&__danger {
color: var(--danger-color);
}

&__white {
color: var(--color-white);
}
}

.text {
Expand Down Expand Up @@ -163,6 +167,10 @@ h4 {
&--bold {
font-weight: bold;
}

&--underline {
text-decoration: underline;
}
}

.subtitle {
Expand Down
Loading