Skip to content

Commit

Permalink
Chore: Replaces sass-lint with stylelint (#1413)
Browse files Browse the repository at this point in the history
* Replaces `sass-lint` with `stylelint`

* Introduces standard scss rules from stylelint with only a few
  modifications.
* `yarn lint` now runs `yarn lint:style` instead of `yarn lint:sass`.
* Many of the files were updated with `yarn lint:style --fix`, but some
  of them had to be manually updated with overrides to adhere to the
  newly-introduced rules from the stylelint configuration.
* Includes a couple fixes such as fixing the class selector for
  `osdnSuggestionItem--value .osdSuggestionItem__text`.

Resolves #551
Resolves #1139
Resolves #1151
Resolves #1152
Resolves #1154

Signed-off-by: Tommy Markley <[email protected]>

* fix(Style): Fixes flex style

Signed-off-by: Ashwin Pc <[email protected]>

* fix(lint): Fixes empty comment lint issue

Signed-off-by: Ashwin Pc <[email protected]>

* chore: rebase and updates yarn.lock

Signed-off-by: Ashwin Pc <[email protected]>

Co-authored-by: Tommy Markley <[email protected]>
  • Loading branch information
ashwin-pc and Tommy Markley authored Apr 1, 2022
1 parent 4c3f222 commit 6c13abe
Show file tree
Hide file tree
Showing 240 changed files with 1,400 additions and 1,552 deletions.
2 changes: 2 additions & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
# use stylelint
*.scss
84 changes: 0 additions & 84 deletions .sass-lint.yml

This file was deleted.

2 changes: 2 additions & 0 deletions .stylelintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
build
target
19 changes: 19 additions & 0 deletions .stylelintrc.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
extends:
- stylelint-config-standard-scss
rules:
# while we still use node-sass, only legacy rgb() notation is allowed
color-function-notation: "legacy"
# recommended to turn off descending specificity since we use a lot of nesting:
# https://stylelint.io/user-guide/rules/list/no-descending-specificity/
no-descending-specificity: null
# need to use global function/value names from EUI
function-name-case: null
value-keyword-case: null
scss/no-global-function-names: null
# camelCase names
keyframes-name-pattern: "^[a-z][a-zA-Z0-9_-]+$"
selector-class-pattern: "^[a-z][a-zA-Z0-9_-]+$"
selector-id-pattern: "^[a-z][a-zA-Z0-9_-]+$"
scss/at-mixin-pattern: "^[a-z][a-zA-Z0-9_-]+$"
scss/at-function-pattern: "^[a-z][a-zA-Z0-9_-]+$"
scss/dollar-variable-pattern: "^[a-z][a-zA-Z0-9_-]+$"
1 change: 1 addition & 0 deletions examples/search_examples/public/index.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/* stylelint-disable no-empty-source */
10 changes: 4 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -58,9 +58,9 @@
"start": "node scripts/opensearch_dashboards --dev",
"debug": "node --nolazy --inspect scripts/opensearch_dashboards --dev",
"debug-break": "node --nolazy --inspect-brk scripts/opensearch_dashboards --dev",
"lint": "yarn run lint:es && yarn run lint:sass",
"lint": "yarn run lint:es && yarn run lint:style",
"lint:es": "node scripts/eslint",
"lint:sass": "node scripts/sasslint",
"lint:style": "node scripts/stylelint",
"makelogs": "node scripts/makelogs",
"uiFramework:start": "cd packages/osd-ui-framework && yarn docSiteStart",
"uiFramework:build": "cd packages/osd-ui-framework && yarn docSiteBuild",
Expand All @@ -77,13 +77,10 @@
"resolutions": {
"**/@types/node": "^14.17.32",
"**/ansi-regex": "^5.0.1",
"**/front-matter": "^4.0.2",
"**/glob-parent": "^6.0.0",
"**/hoist-non-react-statics": "^3.3.2",
"**/json-schema": "^0.4.0",
"**/kind-of": ">=6.0.3",
"**/merge": "^2.1.1",
"**/minimist": "^1.2.5",
"**/node-jose": "^2.1.0",
"**/qs": "^6.10.3",
"**/trim": "^0.0.3",
Expand Down Expand Up @@ -428,11 +425,12 @@
"regenerate": "^1.4.0",
"reselect": "^4.0.0",
"resize-observer-polyfill": "^1.5.1",
"sass-lint": "^1.12.1",
"selenium-webdriver": "^4.0.0-alpha.7",
"simple-git": "^3.4.0",
"sinon": "^7.4.2",
"strip-ansi": "^6.0.0",
"stylelint": "^14.5.2",
"stylelint-config-standard-scss": "^3.0.0",
"supertest": "^6.2.2",
"supertest-as-promised": "^4.0.2",
"tape": "^5.0.1",
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
@import "./other_styles.scss";
@import "./other_styles";

body {
width: $globalStyleConstant;
Expand Down
1 change: 1 addition & 0 deletions packages/osd-plugin-generator/template/public/index.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/* stylelint-disable no-empty-source */
36 changes: 18 additions & 18 deletions packages/osd-ui-framework/doc_site/src/components/guide/_guide.scss
Original file line number Diff line number Diff line change
Expand Up @@ -64,25 +64,25 @@ html {
background-color: $euiColorEmptyShade;
}

.guideContentPage__hint {
position: absolute;
top: 0;
left: 0;
width: 100%;
max-width: 260px;
max-height: 500px;
padding: 30px;
margin: 20px;
border-radius: 4px;
background-color: $euiColorLightestShade;
line-height: $guideLineHeight;
}
.guideContentPage__hint {
position: absolute;
top: 0;
left: 0;
width: 100%;
max-width: 260px;
max-height: 500px;
padding: 30px;
margin: 20px;
border-radius: 4px;
background-color: $euiColorLightestShade;
line-height: $guideLineHeight;
}

.guideContentPage__content {
width: 100%;
max-width: 800px;
padding: 30px 60px;
}
.guideContentPage__content {
width: 100%;
max-width: 800px;
padding: 30px 60px;
}

.guideHintArrow {
position: absolute;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
.guideCode {
padding: 2px 4px;
font-family: 'Ubuntu Mono', monospace;
font-family: "Ubuntu Mono", monospace;
background-color: $euiColorLightestShade;
color: $euiColorDarkShade;
}
Original file line number Diff line number Diff line change
Expand Up @@ -22,39 +22,39 @@
}
}

.guideCodeViewer__header {
padding: 0 20px 6px;
line-height: $guideLineHeight;
border-bottom: $euiBorderThin;
font-size: 14px;
font-weight: 700;
margin-bottom: 10px;
}
.guideCodeViewer__header {
padding: 0 20px 6px;
line-height: $guideLineHeight;
border-bottom: $euiBorderThin;
font-size: 14px;
font-weight: 700;
margin-bottom: 10px;
}

.guideCodeViewer__closeButton {
position: absolute;
top: 0;
right: 10px;
cursor: pointer;
padding: 10px;
border-radius: 3px;
color: $guideTextColor;

&:hover {
color: $guideLinkHoverColor;
}
.guideCodeViewer__closeButton {
position: absolute;
top: 0;
right: 10px;
cursor: pointer;
padding: 10px;
border-radius: 3px;
color: $guideTextColor;

&:hover {
color: $guideLinkHoverColor;
}
}

.guideCodeViewer__title {
padding: 0 20px 6px;
border-bottom: $euiBorderThin;
line-height: $guideLineHeight;
font-size: 14px;
}
.guideCodeViewer__title {
padding: 0 20px 6px;
border-bottom: $euiBorderThin;
line-height: $guideLineHeight;
font-size: 14px;
}

.guideCodeViewer__content {
margin: 0 0 16px;
}
.guideCodeViewer__content {
margin: 0 0 16px;
}

// HLJS

Expand All @@ -64,7 +64,7 @@
color: $euiColorDarkShade;
font-size: 14px;
line-height: 1.3;
font-family: 'Ubuntu Mono', monospace;
font-family: "Ubuntu Mono", monospace;
}

.hljs-keyword {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,15 @@
@import "guide/guide";
@import "guide_code/guide_code";
@import "guide_code_viewer/guide_code_viewer";
@import "guide_demo/guide_demo";
@import "guide_link/guide_link";
@import "guide_nav/guide_nav";
@import "guide_page/guide_page";
@import "guide_page_side_nav/guide_page_side_nav";
@import "guide_sandbox/guide_sandbox";
@import "guide_section/guide_section";
@import "guide_text/guide_text";

$guideVerticalRhythm: $euiSize;
$guideLineHeight: $euiSizeL;
$guideNavHeight: 60px;
Expand Down Expand Up @@ -47,16 +59,3 @@ $guideNormalBreakpoint: 1900px;
background-color: transparent;
}
}


@import "guide/guide";
@import "guide_code/guide_code";
@import "guide_code_viewer/guide_code_viewer";
@import "guide_demo/guide_demo";
@import "guide_link/guide_link";
@import "guide_nav/guide_nav";
@import "guide_page/guide_page";
@import "guide_page_side_nav/guide_page_side_nav";
@import "guide_sandbox/guide_sandbox";
@import "guide_section/guide_section";
@import "guide_text/guide_text";
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,14 @@

.guideDemo__highlightGrid {
.kuiFlexItem {
background: transparentize($euiColorPrimary, .9);
background: transparentize($euiColorPrimary, 0.9);
padding: 16px;
}
}

.guideDemo__highlightGridWrap {
.kuiFlexItem div {
background: transparentize($euiColorPrimary, .9);
background: transparentize($euiColorPrimary, 0.9);
padding: 16px;
}
}
Loading

0 comments on commit 6c13abe

Please sign in to comment.