Skip to content

Commit 053cf7e

Browse files
dcoadcoa
committed
fix: update to no breaking change
1 parent 2b4d58e commit 053cf7e

6 files changed

Lines changed: 46 additions & 46 deletions

File tree

‎dist/Menu/menu.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
position: absolute;
77
top: 100%;
88
z-index: 10;
9-
background: var(--pgn-color-white);
9+
background: var(--pgn-color-white, $white);
1010
min-width: 10rem;
1111

1212
&.pin-left {

‎dist/index.scss‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
2+
$spacer: 1rem;
3+
$white: #fff;
4+
15
@import './Menu/menu.scss';
26
@import './studio-header/StudioHeader.scss';
37

@@ -33,16 +37,12 @@
3337
white-space: nowrap;
3438
overflow: hidden;
3539
text-overflow: ellipsis;
36-
padding-bottom: calc(var(--pgn-spacing-spacer-base)* 0.1);
40+
padding-bottom: calc(var(--pgn-spacing-spacer-base, $spacer)* 0.1);
3741
}
3842
}
3943

4044
.user-dropdown .btn {
4145
height: 3rem;
42-
43-
@media (--max-pgn-size-breakpoint-xs) {
44-
padding: 0 .5rem;
45-
}
4646
}
4747
}
4848

@@ -68,7 +68,7 @@
6868

6969
.site-header-desktop {
7070
box-shadow: 0 1px 0 0 rgba(0, 0, 0, .1);
71-
background: var(--pgn-color-white);
71+
background: var(--pgn-color-white, $white);
7272

7373
.nav-link {
7474
text-decoration: none;
@@ -80,8 +80,8 @@
8080
position: relative;
8181
top: -.05em;
8282
height: 1.75rem;
83-
padding: var(--pgn-spacing-spacer-base) 0;
84-
margin-right: var(--pgn-spacing-spacer-base);
83+
padding: var(--pgn-spacing-spacer-base, $spacer) 0;
84+
margin-right: var(--pgn-spacing-spacer-base, $spacer);
8585

8686
img {
8787
display: block;
@@ -93,13 +93,13 @@
9393
.nav-link:focus,
9494
.nav-link.active,
9595
.expanded .nav-link {
96-
background: var(--pgn-color-bg-active);
97-
color: var(--pgn-color-active);
96+
background: var(--pgn-color-bg-active, $component-active-bg);
97+
color: var(--pgn-color-active, $component-active-color);
9898
}
9999
}
100100
.main-nav {
101101
.nav-link {
102-
padding: 1.125rem var(--pgn-spacing-spacer-base);
102+
padding: 1.125rem var(--pgn-spacing-spacer-base, $spacer);
103103
text-decoration: none;
104104
font-weight: 500;
105105
letter-spacing: .01em;
@@ -109,8 +109,8 @@
109109
.nav-link:focus,
110110
.nav-link.active,
111111
.expanded .nav-link {
112-
background: var(--pgn-color-bg-active);
113-
color: var(--pgn-color-active);
112+
background: var(--pgn-color-bg-active, $component-active-bg);
113+
color: var(--pgn-color-active, $component-active-color);
114114
}
115115

116116
.menu {
@@ -120,15 +120,15 @@
120120
border-top: solid 2px var(--pgn-color-bg-active);
121121
left: 0;
122122
right: 0;
123-
box-shadow: var(--pgn-elevation-box-shadow-down-1);
123+
box-shadow: var(--pgn-elevation-box-shadow-down-1, 0 1px 2px rgba(0,0,0,.25));
124124
border-bottom-left-radius: 2px;
125125
border-bottom-right-radius: 2px;
126-
padding: var(--pgn-spacing-spacer-base);
126+
padding: var(--pgn-spacing-spacer-base, $spacer);
127127
}
128128
}
129129
}
130130

131131
.search-input {
132-
border-radius: var(--pgn-size-rounded-pill);
132+
border-radius: var(--pgn-size-rounded-pill, $rounded-pill);
133133
}
134134
}

‎dist/studio-header/StudioHeader.scss‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44

55
height: 3.75rem;
66
box-shadow: 0 1px 0 0 rgb(0 0 0 / .1);
7-
background: var(--pgn-color-white);
7+
background: var(--pgn-color-white, $white);
88

99
.btn-outline-primary {
10-
border-color: var(--pgn-color-white);
10+
border-color: var(--pgn-color-white, $white);
1111
}
1212

1313
.logo {
@@ -16,8 +16,8 @@
1616
position: relative;
1717
top: -.05em;
1818
height: 1.75rem;
19-
padding: var(--pgn-spacing-spacer-base) 0;
20-
margin-right: var(--pgn-spacing-spacer-base);
19+
padding: var(--pgn-spacing-spacer-base, $spacer) 0;
20+
margin-right: var(--pgn-spacing-spacer-base, $spacer);
2121

2222
img {
2323
display: block;
@@ -30,13 +30,13 @@
3030

3131
@media only screen and (min-width: 769px) {
3232
padding: .5rem;
33-
padding-right: var(--pgn-spacing-spacer-base);
33+
padding-right: var(--pgn-spacing-spacer-base, $spacer);
3434
border-right: 1px solid #E5E5E5;
3535
width: 70%;
3636
}
3737

3838
span {
39-
color: var(--pgn-color-gray-800);
39+
color: var(--pgn-color-gray-800, #333333);
4040
white-space: nowrap;
4141
overflow: hidden;
4242
text-overflow: ellipsis;

‎src/Menu/menu.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
position: absolute;
77
top: 100%;
88
z-index: 10;
9-
background: var(--pgn-color-white);
9+
background: var(--pgn-color-white, $white);
1010
min-width: 10rem;
1111

1212
&.pin-left {

‎src/index.scss‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
2+
$spacer: 1rem;
3+
$white: #fff;
4+
15
@import './Menu/menu.scss';
26
@import './studio-header/StudioHeader.scss';
37

@@ -33,16 +37,12 @@
3337
white-space: nowrap;
3438
overflow: hidden;
3539
text-overflow: ellipsis;
36-
padding-bottom: calc(var(--pgn-spacing-spacer-base)* 0.1);
40+
padding-bottom: calc(var(--pgn-spacing-spacer-base, $spacer)* 0.1);
3741
}
3842
}
3943

4044
.user-dropdown .btn {
4145
height: 3rem;
42-
43-
@media (--max-pgn-size-breakpoint-xs) {
44-
padding: 0 .5rem;
45-
}
4646
}
4747
}
4848

@@ -68,7 +68,7 @@
6868

6969
.site-header-desktop {
7070
box-shadow: 0 1px 0 0 rgba(0, 0, 0, .1);
71-
background: var(--pgn-color-white);
71+
background: var(--pgn-color-white, $white);
7272

7373
.nav-link {
7474
text-decoration: none;
@@ -80,8 +80,8 @@
8080
position: relative;
8181
top: -.05em;
8282
height: 1.75rem;
83-
padding: var(--pgn-spacing-spacer-base) 0;
84-
margin-right: var(--pgn-spacing-spacer-base);
83+
padding: var(--pgn-spacing-spacer-base, $spacer) 0;
84+
margin-right: var(--pgn-spacing-spacer-base, $spacer);
8585

8686
img {
8787
display: block;
@@ -93,13 +93,13 @@
9393
.nav-link:focus,
9494
.nav-link.active,
9595
.expanded .nav-link {
96-
background: var(--pgn-color-bg-active);
97-
color: var(--pgn-color-active);
96+
background: var(--pgn-color-bg-active, $component-active-bg);
97+
color: var(--pgn-color-active, $component-active-color);
9898
}
9999
}
100100
.main-nav {
101101
.nav-link {
102-
padding: 1.125rem var(--pgn-spacing-spacer-base);
102+
padding: 1.125rem var(--pgn-spacing-spacer-base, $spacer);
103103
text-decoration: none;
104104
font-weight: 500;
105105
letter-spacing: .01em;
@@ -109,8 +109,8 @@
109109
.nav-link:focus,
110110
.nav-link.active,
111111
.expanded .nav-link {
112-
background: var(--pgn-color-bg-active);
113-
color: var(--pgn-color-active);
112+
background: var(--pgn-color-bg-active, $component-active-bg);
113+
color: var(--pgn-color-active, $component-active-color);
114114
}
115115

116116
.menu {
@@ -120,15 +120,15 @@
120120
border-top: solid 2px var(--pgn-color-bg-active);
121121
left: 0;
122122
right: 0;
123-
box-shadow: var(--pgn-elevation-box-shadow-down-1);
123+
box-shadow: var(--pgn-elevation-box-shadow-down-1, 0 1px 2px rgba(0,0,0,.25));
124124
border-bottom-left-radius: 2px;
125125
border-bottom-right-radius: 2px;
126-
padding: var(--pgn-spacing-spacer-base);
126+
padding: var(--pgn-spacing-spacer-base, $spacer);
127127
}
128128
}
129129
}
130130

131131
.search-input {
132-
border-radius: var(--pgn-size-rounded-pill);
132+
border-radius: var(--pgn-size-rounded-pill, $rounded-pill);
133133
}
134134
}

‎src/studio-header/StudioHeader.scss‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44

55
height: 3.75rem;
66
box-shadow: 0 1px 0 0 rgb(0 0 0 / .1);
7-
background: var(--pgn-color-white);
7+
background: var(--pgn-color-white, $white);
88

99
.btn-outline-primary {
10-
border-color: var(--pgn-color-white);
10+
border-color: var(--pgn-color-white, $white);
1111
}
1212

1313
.logo {
@@ -16,8 +16,8 @@
1616
position: relative;
1717
top: -.05em;
1818
height: 1.75rem;
19-
padding: var(--pgn-spacing-spacer-base) 0;
20-
margin-right: var(--pgn-spacing-spacer-base);
19+
padding: var(--pgn-spacing-spacer-base, $spacer) 0;
20+
margin-right: var(--pgn-spacing-spacer-base, $spacer);
2121

2222
img {
2323
display: block;
@@ -30,13 +30,13 @@
3030

3131
@media only screen and (min-width: 769px) {
3232
padding: .5rem;
33-
padding-right: var(--pgn-spacing-spacer-base);
33+
padding-right: var(--pgn-spacing-spacer-base, $spacer);
3434
border-right: 1px solid #E5E5E5;
3535
width: 70%;
3636
}
3737

3838
span {
39-
color: var(--pgn-color-gray-800);
39+
color: var(--pgn-color-gray-800, #333333);
4040
white-space: nowrap;
4141
overflow: hidden;
4242
text-overflow: ellipsis;

0 commit comments

Comments
 (0)