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

Jump to bottom

MNT Fix scss linting warnings #1774

Merged
merged 1 commit into from
Jun 11, 2024
Merged

MNT Fix scss linting warnings #1774

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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 .stylelintignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1 @@
client/src/styles/legacy/*
client/src/tinymce/*
2 changes: 1 addition & 1 deletion client/dist/styles/GridField_print.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion client/dist/styles/bundle.css
View file
Open in desktop

Large diffs are not rendered by default.

8 changes: 4 additions & 4 deletions client/src/components/Accordion/Accordion.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
text-decoration: none;
border-bottom: 1px solid $border-color;

&::before {
&:before {
padding: calc($spacer * .75) $panel-padding;
position: absolute;
right: 0;
Expand All @@ -29,20 +29,20 @@
color: lighten($body-color, 30);
text-align: center;
content: "7";
font-family: silverstripe;
font-family: "silverstripe";
}

&:hover,
&:active,
&:focus {
text-decoration: none;

&::before {
&:before {
color: $body-color;
}
}

&.collapsed::before {
&.collapsed:before {
content: "6";
display: block;
}
Expand Down
2 changes: 1 addition & 1 deletion client/src/components/ActionMenu/ActionMenu.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
}
}

.dropdown-item[class*="font-icon-"]::before {
.dropdown-item[class*="font-icon-"]:before {
position: relative;
margin-right: $btn-icon-spacing;
line-height: $line-height-base * $font-size-root;
Expand Down
6 changes: 4 additions & 2 deletions client/src/components/Breadcrumb/Breadcrumb.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@
display: block;
float: none;

&::after {
&:after {
content: "";
display: none;
}
Expand All @@ -78,12 +78,14 @@
font-size: $h3-font-size;
font-weight: normal;
line-height: 24px;

@include text-truncate;

display: flex;
align-items: center;
}

.breadcrumb__icon::before {
.breadcrumb__icon:before {
margin-left: 1rem;
font-size: 1.5rem;
cursor: pointer;
Expand Down
6 changes: 3 additions & 3 deletions client/src/components/FileStatusIcon/FileStatusIcon.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

// uses the pseudo element from 'font-icon' to display different icons
// e.g. class="icon file-status-icon font-icon-user-lock"
&::before {
&:before {
font-size: 1.385rem;
}
}
Expand All @@ -12,11 +12,11 @@
.file-status-icon--background .file-status-icon__icon {
height: 26px;
width: 26px;
background-color: white;
background-color: #fff;
border-radius: 100%;
text-align: center;

&::before {
&:before {
line-height: 2rem;
}
}
39 changes: 22 additions & 17 deletions client/src/components/Form/Form.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,20 +38,20 @@


// Form divider lines
.form__divider::after,
.form-group::after {
.form__divider:after,
.form-group:after {
border-bottom: 1px solid $border-color-light;
visibility: visible;
width: 100%;
content: "\0020";
display: block;
}

.form__divider::after {
.form__divider:after {
margin: $spacer 0;
}

.form-group::after {
.form-group:after {
margin: $spacer 0 #{-$spacer};
}

Expand All @@ -62,7 +62,7 @@
.form-field--no-divider {
padding-bottom: 0;

&::after {
&:after {
visibility: hidden;
content: "";
display: none;
Expand All @@ -75,7 +75,7 @@
.form-group {
padding-bottom: 0;

&::after {
&:after {
border-bottom: 0;
margin: 0;
visibility: hidden;
Expand Down Expand Up @@ -136,7 +136,7 @@
}

// Icons used in readonly fields (eg URL field in assetAdmin)
.form-control-static__icon::before {
.form-control-static__icon:before {
color: lighten($text-muted, 20%);
vertical-align: middle;
margin-right: 6px;
Expand All @@ -148,13 +148,11 @@
.form__field-holder input.readonly,
.form__field-holder span.readonly,
.readonly .form__field-holder > div:not(.form__field-description) {
padding-top: $input-padding-y;
padding-bottom: $input-padding-y;
padding-left: $input-btn-padding-x;
padding-right: $input-btn-padding-x;
padding: $input-padding-y $input-btn-padding-x $input-padding-y $input-btn-padding-x;
margin-bottom: 0;
background-color: $input-disabled-bg;
border: 1px solid darken($input-disabled-bg, 3%);

@include border-radius($input-border-radius);

&:focus {
Expand Down Expand Up @@ -230,11 +228,12 @@ input.radio {

.form__field-extra-label {
@include make-col(12);

margin-left: 0;
}
}

&::after {
&:after {
margin: $spacer $grid-gutter-width-half #{-$spacer};
width: calc(100% - #{$grid-gutter-width}); // IE10 fix for avoiding horizontal scrollbars
}
Expand Down Expand Up @@ -275,6 +274,7 @@ input.radio {
.stacked .form__field-holder {
@include make-col-ready();
@include make-col(12);

max-width: 100%;
}

Expand Down Expand Up @@ -325,6 +325,7 @@ input.radio {
// Based off of make-col-offset() mixin but adding the panel padding-x to offset
// the checkbox width
$_field-margin-left: percentage(calc(2 / $grid-columns));

margin-left: calc(#{$_field-margin-left} + #{$panel-padding-x});
}

Expand All @@ -341,6 +342,7 @@ input.radio {

.form__field-extra-label {
@include make-col(2);

margin-left: 0;
}
}
Expand All @@ -355,6 +357,7 @@ input.radio {
// Max-width to visually match other stacked fields + label
.form-group.htmleditor.stacked .form__field-holder {
@include make-col(12);

max-width: calc(#{$input-max-width} + 16.66667%);

// IE 11 renders the field wider than 100% with the above max-width
Expand All @@ -368,6 +371,7 @@ input.radio {

.form__field-extra-label {
@include make-col(3);

margin-left: 0;

// IE10 Possibly scrollbar effects the width to push columns
Expand All @@ -379,15 +383,16 @@ input.radio {
}

// Fix height of date-fields collapsing in IE
input[type=date],
input[type=time],
input[type=datetime-local],
input[type=month] {
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
&.form-control {
min-height: calc(#{$input-padding-y} * 2 + #{$line-height-base} + 2px);

// Reduce huge line-height for BS date-fields
@media screen and (-webkit-min-device-pixel-ratio: 0) {
/* stylelint-disable-next-line media-feature-name-no-unknown */
@media screen and (min-device-pixel-ratio: 0) {
line-height: $line-height-base;
}
}
Expand Down
36 changes: 18 additions & 18 deletions client/src/components/FormAction/FormAction.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,48 +40,48 @@
}

// Button icons
.btn[class*="font-icon-"]::before,
.dropdown-item[class*="font-icon-"]::before {
.btn[class*="font-icon-"]:before,
.dropdown-item[class*="font-icon-"]:before {
position: relative;
margin-right: $btn-icon-spacing;
line-height: $line-height-base * $font-size-root;
vertical-align: middle;
font-size: $font-size-lg;
}

.btn--icon-danger:hover::before {
.btn--icon-danger:hover:before {
color: $brand-danger;
}

// Gives button a larger icon
.btn--icon-sm[class*="font-icon-"]::before {
.btn--icon-sm[class*="font-icon-"]:before {
font-size: 14px;
}

.btn--icon-md[class*="font-icon-"]::before {
.btn--icon-md[class*="font-icon-"]:before {
font-size: 17px;
}

// Please use .btn--icon-lg
.btn--icon-large[class*="font-icon-"]::before,
.btn--icon-lg[class*="font-icon-"]::before {
.btn--icon-large[class*="font-icon-"]:before,
.btn--icon-lg[class*="font-icon-"]:before {
font-size: 20px;
}

.btn--icon-xl[class*="font-icon-"]::before {
.btn--icon-xl[class*="font-icon-"]:before {
font-size: 22px;
}

// For buttons with icon and no text, removes space after icon
.btn--no-text[class*="font-icon-"]::before,
.no-text[class*="font-icon-"]::before {
.btn--no-text[class*="font-icon-"]:before,
.no-text[class*="font-icon-"]:before {
margin-right: 0;
text-indent: 0;
}

// Used buttons with text and icons, but you wan to hide the text only. eg. gridfield pagination
// Could change to BS .text-hide { @include text-hide(); }, although slightly different
.btn--hide-text[class*=font-icon-] {
.btn--hide-text[class*="font-icon-"] {

&:before {
margin-right: 0;
Expand Down Expand Up @@ -124,8 +124,8 @@
.btn--loading {
min-width: 70px;

& > .btn__title,
&::before {
> .btn__title,
&:before {
visibility: hidden;
}
}
Expand Down Expand Up @@ -159,7 +159,7 @@
.btn-outline-primary {
border-color: lighten($btn-primary-border, 10%);

&:not(:disabled):not(.disabled) {
&:not(:disabled, .disabled) {
&:hover,
&:active,
&:focus {
Expand Down Expand Up @@ -197,7 +197,7 @@
}
}

&:not(:disabled):not(.disabled) {
&:not(:disabled, .disabled) {
&:hover,
&:focus,
&.focus,
Expand All @@ -214,7 +214,7 @@
color: $btn-secondary-color;
border-color: $border-color;

&:not(:disabled):not(.disabled) {
&:not(:disabled, .disabled) {
&:hover,
&:focus,
&:active,
Expand Down Expand Up @@ -301,14 +301,14 @@ button.close {
position: static;

// Temp override JQueryUI color
&::before {
&:before {
color: $text-muted;
}
}

// Main Save & Publish actions for edit page
.btn-outline-secondary.font-icon-check-mark {
color: green;
color: #0f0;
}

.actions-warning {
Expand Down
Loading
Loading