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.

Sign up for GitHub

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

fix: replace hard coded bx prefix with variable #1381

Merged
merged 5 commits into from
Nov 2, 2018
Merged

fix: replace hard coded bx prefix with variable #1381

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
7ebdf59
fix(notification): add correct icon svgs for different types
alisonjoseph Oct 24, 2018
253f49e
chore: merge
alisonjoseph Oct 29, 2018
978b72e
chore: merge master
alisonjoseph Nov 2, 2018
c7039c5
fix: replace bx with prefix variable
alisonjoseph Nov 2, 2018
2f84ec2
Merge branch 'master' into missing-prefix
tw15egan Nov 2, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/components/combo-box/_combo-box.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
@import '../list-box/list-box';

@include exports('combo-box') {
.bx--combo-box > .bx--list-box__field {
.#{$prefix}--combo-box > .#{$prefix}--list-box__field {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Somewhat related to your PR, but I noticed that ComboBox has an extra box-shadow that could be bundled in with these changes

screen shot 2018-11-02 at 10 24 15 am

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like there is box shadow and also the border-bottom on the input inside the list box? 🤔

padding: 0;
}
}
4 changes: 2 additions & 2 deletions src/components/multi-select/_multi-select.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,11 @@
@import '../list-box/list-box';

@include exports('multi-select') {
.bx--multi-select.bx--combo-box > .bx--list-box__field {
.#{$prefix}--multi-select.#{$prefix}--combo-box > .#{$prefix}--list-box__field {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm also noticing that box-shadow here, but it looks like we never added the gray-50 border bottom. Perhaps this is a bigger change than I thought

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might be better in a separate issue around list box styles, there is a lot going on here 🙃

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I'll work on that this morning and fix that up. Disregard!

padding: 0 1rem;
}

.bx--multi-select.bx--combo-box input[role='combobox'] {
.#{$prefix}--multi-select.#{$prefix}--combo-box input[role='combobox'] {
padding: 0;
outline: none;
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/overflow-menu/_overflow-menu.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@
}

.#{$prefix}--overflow-menu-options__option--danger {
.bx--overflow-menu-options__btn {
.#{$prefix}--overflow-menu-options__btn {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure if this has always been the case, but the overflow-menu doesn't show up in experimental mode

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this is related to product switcher? We can fix this when we build out the experimental overflow menu.
screen shot 2018-11-02 at 10 47 45 am

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah I can work on that one next week and get it figured out 👍

&:hover,
&:focus {
color: $inverse-01;
Expand Down
8 changes: 4 additions & 4 deletions src/components/select/_select.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -257,7 +257,7 @@
}
}

.#{$prefix}--select-input:disabled ~ .bx--select__arrow {
.#{$prefix}--select-input:disabled ~ .#{$prefix}--select__arrow {
fill: $disabled;
}

Expand Down Expand Up @@ -346,7 +346,7 @@
@include focus-outline('invalid');
}

.#{$prefix}--select--inline .bx--select-input:disabled {
.#{$prefix}--select--inline .#{$prefix}--select-input:disabled {
color: $disabled;
cursor: not-allowed;

Expand All @@ -369,15 +369,15 @@
}
}

.#{$prefix}--select--inline .bx--select-input:disabled {
.#{$prefix}--select--inline .#{$prefix}--select-input:disabled {
cursor: not-allowed;
// THIS SHOULD BE MOVED TO AN INLINE SVG IN NEXT MAJOR RELEASE
background-image: url("data:image/svg+xml;charset=UTF-8, %3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' width='16' height='16' class='ibm-icons ibm-icons--error--filled' fill='%23bebebe'%3e%3cpath d='M6.95 26.66A14 14 0 0 0 26.67 6.93zM16 2A14 14 0 0 0 5.35 25.07L25.08 5.34A13.93 13.93 0 0 0 16 2z'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: calc(100% - 8px) 50%;
}

.#{$prefix}--select--inline .bx--select-input:disabled ~ .#{$prefix}--select__arrow {
.#{$prefix}--select--inline .#{$prefix}--select-input:disabled ~ .#{$prefix}--select__arrow {
display: none;
}

Expand Down
4 changes: 2 additions & 2 deletions src/components/structured-list/_structured-list.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@
}
}

.bx--structured-list-th span {
.#{$prefix}--structured-list-th span {
@include skeleton;
width: 75%;
height: 1rem;
Expand Down Expand Up @@ -316,7 +316,7 @@
}
}

.bx--structured-list-th span {
.#{$prefix}--structured-list-th span {
@include skeleton;
width: 75%;
height: 1rem;
Expand Down
2 changes: 1 addition & 1 deletion src/components/tile/_tile.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -291,7 +291,7 @@
outline-offset: -1px;
}

.#{$prefix}--tile--is-selected .bx--tile__checkmark {
.#{$prefix}--tile--is-selected .#{$prefix}--tile__checkmark {
opacity: 1;
}

Expand Down