Skip to content

Commit

Permalink
Updates fixtures
Browse files Browse the repository at this point in the history
  • Loading branch information
@planktonic
planktonic committed May 17, 2023
1 parent 60f7ce7 commit c98538d
Show file tree
Hide file tree
Showing 6 changed files with 116 additions and 59 deletions.
4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,8 +83,8 @@
"react-dom": "^18.2.0",
"react-is": "^18.2.0",
"rimraf": "^3.0.0",
"sass": "^1.54.4",
"sass-loader": "^13.0.2",
"sass": "^1.61.0",
"sass-loader": "^13.2.2",
"storybook-addon-pseudo-states": "^1.15.5",
"storybook-zeplin": "^1.7.3",
"style-loader": "^3.3.1",
Expand Down
31 changes: 17 additions & 14 deletions scss/bitstyles/organisms/joined-ui/_index.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@

/* stylelint-disable scss/dollar-variable-default */

// prettier-ignore
$button-classname: classname.get($classname-items: 'button', $layer: 'atom');

// prettier-ignore
$button-border-top-left-radius-name: custom-property.get($items: ('button', 'border', 'top', 'left', 'radius'), $layer: 'atom');

Expand All @@ -29,28 +32,28 @@ $button-box-shadow-name: custom-property.get($items: ('button', 'box-shadow'), $
border-radius: settings.$border-radius;
box-shadow: settings.$box-shadow;

> :first-child .a-button,
> .a-button:first-child {
> :first-child #{$button-classname},
> #{$button-classname}:first-child {
#{$button-box-shadow-name}: none;
#{$button-border-top-right-radius-name}: 0;
#{$button-border-bottom-right-radius-name}: 0;
#{$button-border-top-right-radius-name}: #{0};
#{$button-border-bottom-right-radius-name}: #{0};
margin-right: calc(var(#{$button-border-width-name}) * -1);
}

> :last-child .a-button,
> .a-button:last-child {
> :last-child #{$button-classname},
> #{$button-classname}:last-child {
#{$button-box-shadow-name}: none;
#{$button-border-top-left-radius-name}: 0;
#{$button-border-bottom-left-radius-name}: 0;
#{$button-border-top-left-radius-name}: #{0};
#{$button-border-bottom-left-radius-name}: #{0};
margin-right: 0;
}

> :not(:first-child):not(:last-child) .a-button,
> .a-button:not(:first-child):not(:last-child) {
#{$button-border-top-left-radius-name}: 0;
#{$button-border-top-right-radius-name}: 0;
#{$button-border-bottom-right-radius-name}: 0;
#{$button-border-bottom-left-radius-name}: 0;
> :not(:first-child):not(:last-child) #{$button-classname},
> #{$button-classname}:not(:first-child):not(:last-child) {
#{$button-border-top-left-radius-name}: #{0};
#{$button-border-top-right-radius-name}: #{0};
#{$button-border-bottom-right-radius-name}: #{0};
#{$button-border-bottom-left-radius-name}: #{0};
margin-right: calc(var(#{$button-border-width-name}) * -1);
}
}
7 changes: 1 addition & 6 deletions scss/bitstyles/organisms/joined-ui/_settings.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,4 @@
@use '../../tools/size';

$border-radius: size.get('s3') !default;
$box-shadow: shadow.to-box-shadow(
shadow.generate(
$color: rgba(palette.get('brand-1', 'light-1-rgb'), 0.025),
$blur-radius: size.get('s5'),
)
) !default;
$box-shadow: none !default;
61 changes: 45 additions & 16 deletions test/scss/fixtures/bitstyles-overrides.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -883,11 +883,26 @@ table {
content: '';
}
.bs-at-button {
--bscpn-at-button-border-top-right-radius: var(
--bscpn-at-button-border-radius
);
--bscpn-at-button-border-bottom-right-radius: var(
--bscpn-at-button-border-radius
);
--bscpn-at-button-border-bottom-left-radius: var(
--bscpn-at-button-border-radius
);
--bscpn-at-button-border-top-left-radius: var(
--bscpn-at-button-border-radius
);
--bscpn-at-button-transition: none;
--bscpn-at-button-justify-content: center;
align-items: center;
-webkit-appearance: none;
border-radius: var(--bscpn-at-button-border-radius);
border-radius: var(--bscpn-at-button-border-top-left-radius)
var(--bscpn-at-button-border-top-right-radius)
var(--bscpn-at-button-border-bottom-right-radius)
var(--bscpn-at-button-border-bottom-left-radius);
border-style: solid;
border-width: var(--bscpn-at-button-border-width);
cursor: pointer;
Expand Down Expand Up @@ -924,11 +939,19 @@ table {
.bs-at-button:hover {
outline-width: 0;
text-decoration: none;
z-index: 1;
}
.bs-at-button:focus-visible {
outline: var(--bscpn-color-brand-2-base) solid
calc(var(--bscpn-size-s7) + var(--bscpn-size-s7) / 2);
outline-offset: var(--bscpn-size-s7);
z-index: 3;
}
.bs-at-button[aria-current],
.bs-at-button[aria-expanded='true'],
.bs-at-button[aria-pressed='true'],
.bs-at-button[aria-selected='true'] {
z-index: 2;
}
.bs-at-button:disabled,
.bs-at-button:disabled:focus,
Expand Down Expand Up @@ -2119,23 +2142,29 @@ table {
}
.bs-or-joined-ui {
border-radius: 10rem;
box-shadow: 0 0 calc(var(--bscpn-size-s5) / 4)
rgba(var(--bscpn-color-brand-1-light-1-rgb), 0.025),
0 0 calc(var(--bscpn-size-s5) / 3)
rgba(var(--bscpn-color-brand-1-light-1-rgb), 0.025),
0 0 calc(var(--bscpn-size-s5) / 2)
rgba(var(--bscpn-color-brand-1-light-1-rgb), 0.025),
0 0 calc(var(--bscpn-size-s5) / 1)
rgba(var(--bscpn-color-brand-1-light-1-rgb), 0.025);
}
.bs-or-joined-ui__item {
box-shadow: none;
}
.bs-or-joined-ui__item:active:not(.bs-or-joined-ui__last),
.bs-or-joined-ui__item:focus:not(.bs-or-joined-ui__last),
.bs-or-joined-ui__item:hover:not(.bs-or-joined-ui__last),
.bs-or-joined-ui__item:not(.bs-or-joined-ui__last) {
border-right: 0;
.bs-or-joined-ui > .bs-at-button:first-child,
.bs-or-joined-ui > :first-child .bs-at-button {
--bscpn-at-button-box-shadow: none;
--bscpn-at-button-border-top-right-radius: 0;
--bscpn-at-button-border-bottom-right-radius: 0;
margin-right: calc(var(--bscpn-at-button-border-width) * -1);
}
.bs-or-joined-ui > .bs-at-button:last-child,
.bs-or-joined-ui > :last-child .bs-at-button {
--bscpn-at-button-box-shadow: none;
--bscpn-at-button-border-top-left-radius: 0;
--bscpn-at-button-border-bottom-left-radius: 0;
margin-right: 0;
}
.bs-or-joined-ui > .bs-at-button:not(:first-child):not(:last-child),
.bs-or-joined-ui > :not(:first-child):not(:last-child) .bs-at-button {
--bscpn-at-button-border-top-left-radius: 0;
--bscpn-at-button-border-top-right-radius: 0;
--bscpn-at-button-border-bottom-right-radius: 0;
--bscpn-at-button-border-bottom-left-radius: 0;
margin-right: calc(var(--bscpn-at-button-border-width) * -1);
}
.bs-aspect-ratio-10-10 {
aspect-ratio: 1/1;
Expand Down
53 changes: 37 additions & 16 deletions test/scss/fixtures/bitstyles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1215,13 +1215,20 @@ table {
content: '';
}
.a-button {
--bs-a-button-border-top-right-radius: var(--bs-a-button-border-radius);
--bs-a-button-border-bottom-right-radius: var(--bs-a-button-border-radius);
--bs-a-button-border-bottom-left-radius: var(--bs-a-button-border-radius);
--bs-a-button-border-top-left-radius: var(--bs-a-button-border-radius);
--bs-a-button-transition: color 0.075s ease-in-out,
background-color 0.075s ease-in-out, border 0.075s ease-in-out,
box-shadow 0.075s ease-in-out, outline-offset 0.075s ease-in-out;
--bs-a-button-justify-content: center;
align-items: center;
-webkit-appearance: none;
border-radius: var(--bs-a-button-border-radius);
border-radius: var(--bs-a-button-border-top-left-radius)
var(--bs-a-button-border-top-right-radius)
var(--bs-a-button-border-bottom-right-radius)
var(--bs-a-button-border-bottom-left-radius);
border-style: solid;
border-width: var(--bs-a-button-border-width);
cursor: pointer;
Expand Down Expand Up @@ -1258,11 +1265,19 @@ table {
.a-button:hover {
outline-width: 0;
text-decoration: none;
z-index: 1;
}
.a-button:focus-visible {
outline: var(--bs-color-brand-2-base) solid
calc(var(--bs-size-s7) + var(--bs-size-s7) / 2);
outline-offset: var(--bs-size-s7);
z-index: 3;
}
.a-button[aria-current],
.a-button[aria-expanded='true'],
.a-button[aria-pressed='true'],
.a-button[aria-selected='true'] {
z-index: 2;
}
.a-button:disabled,
.a-button:disabled:focus,
Expand Down Expand Up @@ -2501,23 +2516,29 @@ table {
}
.o-joined-ui {
border-radius: var(--bs-size-s3);
box-shadow: 0 0 calc(var(--bs-size-s5) / 4)
rgba(var(--bs-color-brand-1-light-1-rgb), 0.025),
0 0 calc(var(--bs-size-s5) / 3)
rgba(var(--bs-color-brand-1-light-1-rgb), 0.025),
0 0 calc(var(--bs-size-s5) / 2)
rgba(var(--bs-color-brand-1-light-1-rgb), 0.025),
0 0 calc(var(--bs-size-s5) / 1)
rgba(var(--bs-color-brand-1-light-1-rgb), 0.025);
}
.o-joined-ui__item {
box-shadow: none;
}
.o-joined-ui__item:active:not(.o-joined-ui__last),
.o-joined-ui__item:focus:not(.o-joined-ui__last),
.o-joined-ui__item:hover:not(.o-joined-ui__last),
.o-joined-ui__item:not(.o-joined-ui__last) {
border-right: 0;
.o-joined-ui > .a-button:first-child,
.o-joined-ui > :first-child .a-button {
--bs-a-button-box-shadow: none;
--bs-a-button-border-top-right-radius: 0;
--bs-a-button-border-bottom-right-radius: 0;
margin-right: calc(var(--bs-a-button-border-width) * -1);
}
.o-joined-ui > .a-button:last-child,
.o-joined-ui > :last-child .a-button {
--bs-a-button-box-shadow: none;
--bs-a-button-border-top-left-radius: 0;
--bs-a-button-border-bottom-left-radius: 0;
margin-right: 0;
}
.o-joined-ui > .a-button:not(:first-child):not(:last-child),
.o-joined-ui > :not(:first-child):not(:last-child) .a-button {
--bs-a-button-border-top-left-radius: 0;
--bs-a-button-border-top-right-radius: 0;
--bs-a-button-border-bottom-right-radius: 0;
--bs-a-button-border-bottom-left-radius: 0;
margin-right: calc(var(--bs-a-button-border-width) * -1);
}
.u-aspect-ratio-1-1 {
aspect-ratio: 1/1;
Expand Down
19 changes: 14 additions & 5 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9770,15 +9770,15 @@ sane@^4.0.3:
minimist "^1.1.1"
walker "~1.0.5"

sass-loader@^13.0.2:
version "13.2.1"
resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-13.2.1.tgz#5255c9aa5ad6c8f8c869ddf5d48e71fd48ba4b81"
integrity sha512-VQUrgUa5/waIzMrzyuko3sj5WD9NMsYph91cNICx+OaODbRtLl6To2fswLx8MH2qNxXFqRtpvdPQIa7mE93YOA==
sass-loader@^13.2.2:
version "13.2.2"
resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-13.2.2.tgz#f97e803993b24012c10d7ba9676548bf7a6b18b9"
integrity sha512-nrIdVAAte3B9icfBiGWvmMhT/D+eCDwnk+yA7VE/76dp/WkHX+i44Q/pfo71NYbwj0Ap+PGsn0ekOuU1WFJ2AA==
dependencies:
klona "^2.0.6"
neo-async "^2.6.2"

sass@^1.34.1, sass@^1.54.4:
sass@^1.34.1:
version "1.59.3"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.59.3.tgz#a1ddf855d75c70c26b4555df4403e1bbf8e4403f"
integrity sha512-QCq98N3hX1jfTCoUAsF3eyGuXLsY7BCnCEg9qAact94Yc21npG2/mVOqoDvE0fCbWDqiM4WlcJQla0gWG2YlxQ==
Expand All @@ -9787,6 +9787,15 @@ sass@^1.34.1, sass@^1.54.4:
immutable "^4.0.0"
source-map-js ">=0.6.2 <2.0.0"

sass@^1.61.0:
version "1.61.0"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.61.0.tgz#d1f6761bb833887b8fdab32a24e052c40531d02b"
integrity sha512-PDsN7BrVkNZK2+dj/dpKQAWZavbAQ87IXqVvw2+oEYI+GwlTWkvbQtL7F2cCNbMqJEYKPh1EcjSxsnqIb/kyaQ==
dependencies:
chokidar ">=3.0.0 <4.0.0"
immutable "^4.0.0"
source-map-js ">=0.6.2 <2.0.0"

scheduler@^0.19.1:
version "0.19.1"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.19.1.tgz#4f3e2ed2c1a7d65681f4c854fa8c5a1ccb40f196"
Expand Down

0 comments on commit c98538d

Please sign in to comment.