Skip to content

Commit

Permalink
Merge branch 'dev'
Browse files Browse the repository at this point in the history
  • Loading branch information
@XanxusX
XanxusX committed May 11, 2022
2 parents 04d4ec1 + 4148205 commit 2ace6fd
Show file tree
Hide file tree
Showing 12 changed files with 597 additions and 175 deletions.
338 changes: 256 additions & 82 deletions dist/css/pdis-design-system.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/css/pdis-design-system.css.map
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/css/pdis-design-system.min.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/css/pdis-design-system.min.css.map
View file

Large diffs are not rendered by default.

133 changes: 85 additions & 48 deletions scss/_accordion.scss
View file
Original file line number Diff line number Diff line change
@@ -1,64 +1,85 @@
.accordion {
.accordion-button {
@extend .body-text;
padding: 0.75rem;
background-color: var(--surface);
box-shadow: none;
.accordion-item {
border: 0;
margin-bottom: 0.5rem;

&::after {
@extend .body-text-lg;
color: var(--on-background);
background-image: none;
content: "\F64D"; /* plus */
font-family: "bootstrap-icons";
text-align: center;
width: auto;
height: auto;
&:last-child {
margin-bottom: 0;
border-radius: 0.5rem;
}

&:not(.collapsed) {
color: var(--on-background);
background-color: var(--surface-2);


.accordion-button {
@extend .body-text;
padding: 0.75rem;
background-color: var(--surface);
box-shadow: none;
border-radius: 0.5rem;

&::after {
@extend .body-text-lg;
@extend .body-text;
color: var(--on-background);
background-image: none;
content: "\F64D"; /* plus */
font-family: "bootstrap-icons";
text-align: center;
transform: rotate(-45deg);
width: auto;
height: auto;
}

&:not(.collapsed) {
color: var(--on-background);
background-color: var(--surface-2);
border-radius: 0.5rem 0.5rem 0 0;

&:last-of-type {
border-radius: 0.5rem 0.5rem 0 0;
}

&:hover {
background-color: var(--surface-3);
&::after {
@extend .body-text;
color: var(--on-background);
background-image: none;
content: "\F64D"; /* plus */
font-family: "bootstrap-icons";
text-align: center;
transform: rotate(-45deg);
}

&:hover {
background-color: var(--surface-3);
}
}
}

&:hover {
background-color: var(--surface-1);
}

&:active {
box-shadow: none !important;
}

&:focus {
box-shadow: none !important;
}

&:disabled {
color: var(--outline);
&:last-of-type {
border-radius: 0.5rem;
}

&:hover {
background-color: var(--surface-1);
}

&:active {
box-shadow: none !important;
}

&:focus {
box-shadow: none !important;
}

&:disabled {
color: var(--outline);
}
}
}

.accordion-body {
@extend .body-text-sm;
padding: 0.75rem;
background-color: var(--surface-2);

.accordion-body {
@extend .body-text-sm;
padding: 0.75rem;
background-color: var(--surface-2);
border-radius: 0 0 0.5rem 0.5rem;

p {
margin-bottom: 0;
p {
margin-bottom: 0;
}
}
}

Expand All @@ -83,7 +104,22 @@
.accordion-item {
border-radius: 0;
border: 0;

margin-bottom: 0;

&:last-child {
.accordion-button {
border-radius: 0 0 0.5rem 0.5rem !important;

&:not(.collapsed) {
border-radius: 0 !important;
}
}

.accordion-body {
border-radius: 0 0 0.5rem 0.5rem !important;
}
}

.accordion-header {
&::before {
content: '';
Expand Down Expand Up @@ -166,7 +202,8 @@
padding-right: 2rem;
background-color: var(--surface-variant);
color: var(--on-surface-variant);

border-radius: 0;

p {
margin-bottom: 0;
}
Expand Down
47 changes: 27 additions & 20 deletions scss/_button.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@
&:focus-visible, &:active {
color: var(--on-background);
background-color: var(--surface-1);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
border-color: var(--brand-flat-strong);
}

i {
Expand Down Expand Up @@ -47,7 +48,8 @@
&:focus-visible, &:active {
color: var(--on-background);
background-color: var(--surface-1);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
border-color: var(--brand-flat-strong);
}

i {
Expand Down Expand Up @@ -81,7 +83,8 @@
&:focus-visible, &:active {
color: var(--on-background);
background-color: var(--surface-1);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
border-color: var(--brand-flat-strong);
}

i {
Expand Down Expand Up @@ -113,6 +116,10 @@
margin-right: 0;
}

&:disabled {
opacity: .6;
}

@each $key, $value in $color-envs {
&.btn-#{$key} {
background-color: var(--#{$value});
Expand All @@ -131,12 +138,10 @@
border-color: var(--#{$value}-strong);
color: var(--on-#{$value});
//text-decoration: underline;
box-shadow: 0 0 0 2px var(--#{$value}-flat-strong) !important;
}

&:disabled {
color: var(--outline);
box-shadow: 0 0 0 2px var(--#{$value}-flat-strong) inset !important;
border-color: var(--#{$value}-flat-strong);
}

}

/* .btn-outline-#{$key} {
Expand Down Expand Up @@ -208,17 +213,18 @@
color: var(--on-brand-flat);
background: var(--brand-flat-strong);
border: none;
box-shadow: 0 0 0 2px var(--brand-flat-strong) !important;
box-shadow: 0 0 0 2px var(--surface-1) inset !important;
border-color: var(--surface-1);
}

&:disabled {
/* &:disabled {
color: var(--outline);
background-color: var(--surface);
}
} */
}


&.btn-semi-secondary {
&.btn-tertiary {
color: var(--on-brand-flat);
background-color: var(--surface);
border-color: var(--outline);
Expand All @@ -231,19 +237,19 @@

&:focus-visible, &:active {
color: var(--on-brand-flat);
box-shadow: 0 0 0 2px var(--brand-flat-strong) !important;
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset !important;
background: var(--surface-1);
border-color: var(--outline);
border-color: var(--brand-flat-strong);
}

&:disabled {
/* &:disabled {
color: var(--outline);
background-color: var(--surface);
border: 0;
}
} */
}

&.btn-tertiary {
&.btn-less-important {
background: none;
color: var(--on-brand-flat);

Expand All @@ -255,13 +261,14 @@
&:focus-visible, &:active {
background-color: var(--surface-1);
color: var(--on-brand-flat);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
border-color: var(--brand-flat-strong);
}

&:disabled {
/* &:disabled {
color: var(--outline);
background-color: var(--surface);
}
} */
}

&.btn-sm {
Expand Down
50 changes: 49 additions & 1 deletion scss/_footer.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,53 @@
footer {

background-color: var(--surface-variant);
padding-top: 2.25rem;
padding-bottom: 2.25rem;


.title {
@extend .title-text;
}

.nav {
margin: 0.5rem 0;

.nav-item {
margin: 0.25rem 0;
margin-right:1.25rem;

&:last-child {
margin-right: 0;
}
}

&.nav-secondary {
.nav-item {
margin: 0.25rem 0;
margin-right: 1rem;

&:first-child {
margin-left: 0;
}

&:last-child {
margin-right: 0;
}

a {
font-weight: 400;
}

}
}
}

p {
margin: 0.5rem 0;
}

/* hr {
margin: 0.75rem 0;
} */
}

// footer {
Expand Down
7 changes: 4 additions & 3 deletions scss/_general.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,21 @@

a {
@extend .body-text;
color: var(--on-brnad-flat);
color: var(--on-brand-flat);
font-weight: 500;
//text-underline-offset: 0.1em;

&:visited {
color: var(--on-accent-flat);
}

&:hover {
color: var(--on-brnad-flat);
color: var(--on-brand-flat);
background-color: var(--brand-flat);
}

&:active, &:focus-visible {
color: var(--on-brnad-flat);
color: var(--on-brand-flat);
background-color: var(--brand-flat-strong);
}
}
Expand Down
6 changes: 3 additions & 3 deletions scss/_tabs.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
&:focus, &:active {
color: var(--on-background);
background-color: var(--surface-1);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
}

i {
Expand Down Expand Up @@ -44,7 +44,7 @@
&:focus, &:active {
color: var(--on-background);
background-color: var(--surface-1);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
}

i {
Expand Down Expand Up @@ -79,7 +79,7 @@
&:focus, &:active {
color: var(--on-background);
background-color: var(--surface-1);
box-shadow: 0 0 0 2px var(--brand-flat-strong);
box-shadow: 0 0 0 2px var(--brand-flat-strong) inset;
}

i {
Expand Down
Loading

0 comments on commit 2ace6fd

Please sign in to comment.