Skip to content

Commit

Permalink
Merge pull request #598 from cocopon/css-inset
Browse files Browse the repository at this point in the history
Replace bottom/left/tight/top with inset
  • Loading branch information
cocopon authored Jan 11, 2024
2 parents 4b454f5 + 9440876 commit 5563102
Show file tree
Hide file tree
Showing 8 changed files with 11 additions and 44 deletions.
5 changes: 1 addition & 4 deletions packages/core/lib/sass/view/_checkbox.scss
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,12 @@
width: tp.cssVar('container-unit-size');

svg {
bottom: 0;
display: block;
height: 16px;
left: 0;
inset: 0;
margin: auto;
opacity: 0;
position: absolute;
right: 0;
top: 0;
width: 16px;

path {
Expand Down
10 changes: 2 additions & 8 deletions packages/core/lib/sass/view/_color-picker.scss
Original file line number Diff line number Diff line change
Expand Up @@ -162,11 +162,8 @@ $track-width: 4px;
width: 100%;
}
&_c {
bottom: 0;
left: 0;
inset: 0;
position: absolute;
right: 0;
top: 0;
}
&_m {
@include color.checkerboard(tp.$slider-knob-size);
Expand All @@ -187,11 +184,8 @@ $track-width: 4px;
border-radius: tp.cssVar('blade-border-radius');
border: $marker-border-color solid 2px;
box-sizing: border-box;
bottom: 0;
left: 0;
inset: 0;
position: absolute;
right: 0;
top: 0;
}
&:focus &_p {
border-color: $marker-border-color-focus;
Expand Down
5 changes: 1 addition & 4 deletions packages/core/lib/sass/view/_color-swatch.scss
Original file line number Diff line number Diff line change
Expand Up @@ -30,13 +30,10 @@
&:focus::after {
border: rgba(white, 0.75) solid 2px;
border-radius: tp.cssVar('blade-border-radius');
bottom: 0;
content: '';
display: block;
left: 0;
inset: 0;
position: absolute;
right: 0;
top: 0;
}
}
}
10 changes: 2 additions & 8 deletions packages/core/lib/sass/view/_slider.scss
Original file line number Diff line number Diff line change
Expand Up @@ -17,15 +17,12 @@
&::before {
background-color: tp.cssVar('input-bg');
border-radius: 1px;
bottom: 0;
content: '';
display: block;
height: 2px;
left: 0;
inset: 0;
margin: auto;
position: absolute;
right: 0;
top: 0;
}
}
&_k {
Expand All @@ -37,16 +34,13 @@
&::before {
background-color: tp.cssVar('input-fg');
border-radius: 1px;
bottom: 0;
content: '';
display: block;
height: 2px;
left: 0;
inset: 0;
margin-bottom: auto;
margin-top: auto;
position: absolute;
right: 0;
top: 0;
}
&::after {
background-color: tp.cssVar('button-bg');
Expand Down
5 changes: 1 addition & 4 deletions packages/core/lib/sass/view/_tab.scss
Original file line number Diff line number Diff line change
Expand Up @@ -111,13 +111,10 @@

&::before {
background-color: tp.cssVar('container-bg');
bottom: 2px;
content: '';
left: 0;
inset: 0 0 2px;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
}
&:hover::before {
background-color: tp.cssVar('container-bg-hover');
Expand Down
5 changes: 1 addition & 4 deletions packages/tweakpane/src/doc/sass/_pages.scss
Original file line number Diff line number Diff line change
Expand Up @@ -45,12 +45,9 @@
);
background-position: center;
background-size: 16px 16px;
bottom: 0;
content: '';
left: 0;
inset: 0;
position: absolute;
right: 0;
top: 0;
}

.paneContainer {
Expand Down
5 changes: 1 addition & 4 deletions packages/tweakpane/src/doc/sass/components/_page-header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,9 @@
}
}
&_sketchContainer {
bottom: 0;
left: 0;
inset: 0;
overflow: hidden;
position: absolute;
right: 0;
top: 0;

svg {
display: block;
Expand Down
10 changes: 2 additions & 8 deletions packages/tweakpane/src/doc/sass/components/_theme-builder.scss
Original file line number Diff line number Diff line change
Expand Up @@ -46,11 +46,8 @@
background: url(https://source.unsplash.com/74ft3aciAY0/900x1600) no-repeat
center;
background-size: cover;
bottom: -16px;
left: -16px;
inset: -16px;
position: absolute;
right: -16px;
top: -16px;

&::before {
background-image: radial-gradient(
Expand All @@ -59,12 +56,9 @@
);
background-position: center;
background-size: 16px 16px;
bottom: 0;
content: '';
left: 0;
inset: 0;
position: absolute;
right: 0;
top: 0;
}
}
}

0 comments on commit 5563102

Please sign in to comment.