Add stylelint (#139)

This commit is contained in:
Will Scullin 2022-06-25 17:40:47 -07:00 committed by GitHub
parent fe955fba41
commit c5faad2f9f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 1659 additions and 136 deletions

2
.stylelintignore Normal file
View File

@ -0,0 +1,2 @@
css/apple2.css
coverage

10
.stylelintrc.json Normal file
View File

@ -0,0 +1,10 @@
{
"extends": [
"stylelint-config-standard",
"stylelint-config-css-modules"
],
"rules": {
"indentation": 4,
"selector-class-pattern": "^[a-z][a-zA-Z0-9_-]+$"
}
}

View File

@ -9,13 +9,17 @@ body {
background: black;
}
a[role="button"] {
text-decoration: none;
}
button,
a[role="button"],
input[type="file"]::file-selector-button {
background: #44372C;
background: #44372c;
color: #fff;
padding: 2px 8px;
border: 1px outset #66594E;
border: 1px outset #66594e;
border-radius: 3px;
font-size: 15px;
min-width: 75px;
@ -24,15 +28,15 @@ input[type="file"]::file-selector-button {
button:hover,
a[role="button"]:hover,
input[type="file"]::file-selector-button {
background-color: #55473D;
border: 1px outset #66594E;
background-color: #55473d;
border: 1px outset #66594e;
}
button:active,
a[role="button"]:active,
input[type="file"]::file-selector-button {
background-color: #22150A;
border: 1px outset #44372C;
background-color: #22150a;
border: 1px outset #44372c;
}
button:focus,
@ -41,10 +45,6 @@ input[type="file"]::file-selector-button {
outline: none;
}
a[role="button"] {
text-decoration: none;
}
.container {
display: flex;
flex-direction: column;

View File

@ -2,6 +2,7 @@
display: flex;
margin: auto;
}
.outer {
width: 620px;
display: none;

View File

@ -6,7 +6,7 @@
.diskLight {
margin: 5px;
background-image: url(../../../css/green-off-16.png);
background-image: url("../../../css/green-off-16.png");
background-size: 16px 16px;
flex-shrink: 0;
width: 16px;
@ -14,7 +14,7 @@
}
.diskLight.on {
background-image: url(../../../css/green-on-16.png);
background-image: url("../../../css/green-on-16.png");
}
.diskLabel {
@ -30,9 +30,10 @@
@media only screen and (min-resolution: 1.25dppx) {
.diskLight {
background-image: url(../../../css/green-off-32.png);
background-image: url("../../../css/green-off-32.png");
}
.diskLight.on {
background-image: url(../../../css/green-on-32.png);
background-image: url("../../../css/green-on-32.png");
}
}

View File

@ -2,7 +2,7 @@
margin-right: 4px;
overflow: hidden;
padding: 4px;
font-family: Courier;
font-family: Courier, monospace;
font-size: 12px;
width: 60px;
height: 15px;

View File

@ -1,13 +1,14 @@
.reset {
background: #44372C;
border-left: 3px solid #65594D;
border-top: 3px solid #65594D;
border-right: 3px solid #110E0D;
border-bottom: 3px solid #110E0D;
background: #44372c;
border-left: 3px solid #65594d;
border-top: 3px solid #65594d;
border-right: 3px solid #110e0d;
border-bottom: 3px solid #110e0d;
/* border: 5px outset #66594E; */
border-radius: 3px;
color: white;
font: 9px Helvetica;
font: 9px Helvetica, sans-serif;
height: 36px;
padding: 0;
margin-left: 10px;
@ -18,16 +19,16 @@
}
.reset:hover {
background: #44372C;
border: 3px outset #66594E;
background: #44372c;
border: 3px outset #66594e;
}
.reset:active {
background-color: #22150A;
border-left: 3px solid #44372C;
border-top: 3px solid #44372C;
border-right: 3px solid #000000;
border-bottom: 3px solid #000000;
background-color: #22150a;
border-left: 3px solid #44372c;
border-top: 3px solid #44372c;
border-right: 3px solid #000;
border-bottom: 3px solid #000;
}
:global(.full-page) .reset {

View File

@ -6,7 +6,7 @@
.diskLight {
margin: 5px;
background-image: url(../../../css/red-off-16.png);
background-image: url("../../../css/red-off-16.png");
background-size: 16px 16px;
flex-shrink: 0;
width: 16px;
@ -14,7 +14,7 @@
}
.diskLight.on {
background-image: url(../../../css/red-on-16.png);
background-image: url("../../../css/red-on-16.png");
}
.diskLabel {
@ -30,9 +30,10 @@
@media only screen and (min-resolution: 1.25dppx) {
.diskLight {
background-image: url(../../../css/red-off-32.png);
background-image: url("../../../css/red-off-32.png");
}
.diskLight.on {
background-image: url(../../../css/red-on-32.png);
background-image: url("../../../css/red-on-32.png");
}
}

View File

@ -25,12 +25,7 @@
margin: 0;
padding: 3px 0 0 10;
color: black;
font-family: "Adobe Garamond Pro",Garamond,Times;
font-family: "Adobe Garamond Pro", Garamond, Times, serif;
font-size: 13px;
font-weight: normal;
}
.motter {
font-family: "Motter Tektura";
font-size: 12px;
}

View File

@ -12,7 +12,7 @@
margin: 0;
padding: 0;
height: 42px;
font-family: Helvetica;
font-family: Helvetica, sans-serif;
width: 570px;
}
@ -58,25 +58,27 @@
padding: 0;
width: 32px;
height: 32px;
background-color: #44372C;
background-color: #44372c;
color: white;
text-align: center;
position: relative;
border-left: 5px solid #65594D;
border-top: 5px solid #65594D;
border-right: 5px solid #110E0D;
border-bottom: 5px solid #110E0D;
border-left: 5px solid #65594d;
border-top: 5px solid #65594d;
border-right: 5px solid #110e0d;
border-bottom: 5px solid #110e0d;
/* border: 5px outset #66594E; */
border-radius: 5px;
cursor: pointer;
}
.pressed {
background-color: #22150A;
border-left: 5px solid #44372C;
border-top: 5px solid #44372C;
border-right: 5px solid #000000;
border-bottom: 5px solid #000000;
background-color: #22150a;
border-left: 5px solid #44372c;
border-top: 5px solid #44372c;
border-right: 5px solid #000;
border-bottom: 5px solid #000;
/* border: 5px outset #44372C; */
}
@ -179,7 +181,15 @@
}
.key-OPEN_APPLE div {
background-image: url(../../../img/open-apple24.png);
background-image: url("../../../img/open-apple24.png");
width: 24px;
height: 24px;
bottom: 1px;
left: 4px;
}
.key-CLOSED_APPLE div {
background-image: url("../../../img/closed-apple24.png");
width: 24px;
height: 24px;
bottom: 1px;
@ -190,22 +200,14 @@
display: none;
}
.key-OPEN_APPLE.active div {
background-image: url(../../../img/open-apple24-green.png);
}
.key-CLOSED_APPLE div {
background-image: url(../../../img/closed-apple24.png);
width: 24px;
height: 24px;
bottom: 1px;
left: 4px;
}
.key-CLOSED_APPLE.active div {
background-image: url(../../../img/closed-apple24-green.png);
}
.key-CLOSED_APPLE span {
display: none;
}
.key-OPEN_APPLE.active div {
background-image: url("../../../img/open-apple24-green.png");
}
.key-CLOSED_APPLE.active div {
background-image: url("../../../img/closed-apple24-green.png");
}

View File

@ -7,7 +7,7 @@
display: flex;
align-items: center;
justify-content: center;
background: rgba(0,0,0,0.6);
background: rgb(0 0 0 / 60%);
z-index: 1;
}
@ -30,10 +30,10 @@
font-size: 14px;
justify-content: space-between;
align-items: center;
background: #44372C;
background: #44372c;
color: #fff;
padding: 5px 11px;
border: 1px outset #66594E;
border: 1px outset #66594e;
border-radius: 3px;
user-select: none;
}
@ -64,7 +64,8 @@
user-select: none;
}
.modalFooter a[role="button"], .modalFooter button {
.modalFooter a[role="button"],
.modalFooter button {
margin: 0 0 0 5px;
min-width: 75px;
}

View File

@ -1,6 +1,6 @@
.printer {
background: white;
font: fixed;
font: monospace;
width: 60em;
padding: 5em;
height: 60vh;

View File

@ -1,7 +1,7 @@
.progressContainer {
width: 320px;
height: 20px;
background: #000
background: #000;
}
.progressBar {

View File

@ -1,10 +1,9 @@
:global(.mono) {
filter: url('#green');
filter: url("#green");
}
.display {
margin: 5px auto 10px auto;
margin: 5px auto 10px;
}
:global(.full-page) .display {
@ -15,7 +14,7 @@
padding: 0;
border: 0;
position: fixed;
top:0;
top: 0;
bottom: 0;
left: 0;
right: 0;
@ -24,19 +23,6 @@
margin: auto !important;
}
:global(.full-page) .overscan {
margin: initial;
padding: 0;
width: initial;
height: 384px;
border: 0;
border-radius: 0;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.overscan {
margin: auto;
position: relative;
@ -51,7 +37,6 @@
margin: initial;
padding: 0;
width: initial;
height: 384px;
border: 0;
border-radius: 0;
height: 100%;
@ -60,11 +45,18 @@
align-items: center;
}
:global(.scanlines):after {
:global(.scanlines)::after {
display: block;
pointer-events: none;
background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 1px, rgba(0,0,0,0.5) 1px, rgba(0,0,0,0.5) 2px);
content: '';
background-image:
repeating-linear-gradient(
to bottom,
transparent 0,
transparent 1px,
rgb(0 0 0 / 50%) 1px,
rgb(0 0 0 / 50%) 2px
);
content: "";
position: absolute;
top: 0;
left: 0;
@ -72,15 +64,20 @@
right: 0;
}
:global(.full-page) :global(.scanlines):after {
background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 0.25vh, rgba(0,0,0,0.5) 0.25vh, rgba(0,0,0,0.5) 0.5vh);
:global(.full-page) :global(.scanlines)::after {
background-image:
repeating-linear-gradient(
to bottom,
transparent 0,
transparent 0.25vh,
rgb(0 0 0 / 50%) 0.25vh,
rgb(0 0 0 / 50%) 0.5vh
);
}
.screen {
cursor: crosshair;
-moz-image-rendering: -moz-crisp-edges;
-webkit-image-rendering: -webkit-optimize-contrast;
image-rendering: optimizeSpeed;
image-rendering: crisp-edges;
width: 592px;
height: 416px;
touch-action: manipulation;
@ -91,14 +88,6 @@
cursor: none;
}
.screen:-webkit-full-screen {
background-color: black;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
}
:global(.full-page) .screen {
width: 100%;
height: 100%;

1575
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -6,7 +6,7 @@
"build": "rimraf dist/* && webpack --mode=production",
"dev": "webpack serve --mode=development",
"index": "bin/index > json/disks/index.js",
"lint": "eslint '**/*.js' '**/*.ts' '**/*.tsx'",
"lint": "eslint '**/*.js' '**/*.ts' '**/*.tsx' && stylelint '**/*.css'",
"start": "webpack serve --mode=development --progress",
"test": "jest"
},
@ -54,6 +54,9 @@
"raw-loader": "^4.0.0",
"rimraf": "^3.0.2",
"style-loader": "^3.3.1",
"stylelint": "^14.9.1",
"stylelint-config-css-modules": "^4.1.0",
"stylelint-config-standard": "^26.0.0",
"ts-jest": "^27.0.5",
"ts-loader": "^9.3.0",
"typescript": "^4.7.3",