LogalDeveloper/owncast
LogalDeveloper/owncast
0
Fork 0
Code

Add local CSS lint checks (#4068)

Browse Source 
* update package scripts to include prettifying scss files and stylelint-ing; fix related issues found from stylelinter

* revert old prettier autofix

* lint

---------

Co-authored-by: Gabe Kangas <gabek@real-ity.com>
This commit is contained in:
gingervitis 2025-01-04 12:59:45 -08:00 committed by GitHub
parent c03637fd9b
commit a6dc9645e6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 19 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/components/chat/ChatModeratorNotification/ChatModeratorNotification.module.scss
View File

@ -4,9 +4,9 @@
background-color: var(--theme-background-primary); background-color: var(--theme-background-primary);
color: var(--theme-color-components-chat-text); color: var(--theme-color-components-chat-text);
padding: 10px; padding: 10px;
font-size: var(--chat-message-text-size); font-size: var(--chat-message-text-size);
@include flexCenter; @include flex-center;
.icon { .icon {
margin-right: 10px; margin-right: 10px;

13
web/package.json
View File

@ -9,12 +9,13 @@
"dev": "next dev", "dev": "next dev",
"build": "next build", "build": "next build",
"start": "next start", "start": "next start",
"lint": "eslint --fix --ext .js,.ts,.tsx types/ pages/ components/ stories/", "lint": "eslint --fix --ext .js,.ts,.tsx types/ pages/ components/ stories/ && npm run stylelint",
"storybook": "storybook dev -p 6006", "stylelint": "stylelint **/*.scss",
"build-storybook": "storybook build", "storybook": "storybook dev -p 6006",
"build-styles": "cd ./style-definitions && style-dictionary build && ./build.sh && cd -", "build-storybook": "storybook build",
"test": "jest", "build-styles": "cd ./style-definitions && style-dictionary build && ./build.sh && cd -",
"format": "prettier --write **/*.{js,ts,jsx,tsx,css,md}" "test": "jest",
"format": "prettier --write **/*.{js,ts,jsx,tsx,css,md,scss}"
}, },
"dependencies": { "dependencies": {
"@ant-design/icons": "4.8.3", "@ant-design/icons": "4.8.3",

11
web/styles/ant-overrides.scss
View File

@ -46,17 +46,6 @@ BUTTONS
border-radius: var(--theme-rounded-corners); border-radius: var(--theme-rounded-corners);
border-color: var(--theme-color-components-primary-button-border); border-color: var(--theme-color-components-primary-button-border);
&:hover,
&:focus {
border-color: var(--theme-color-action-hover);
color: var(--theme-color-action-hover);
background-color: var(--theme-color-components-secondary-button-background);
}
&:focus {
border-color: var(--theme-color-components-secondary-button-text);
}
&[ant-click-animating-without-extra-node]::after { &[ant-click-animating-without-extra-node]::after {
animation: 0s !important; animation: 0s !important;
} }

14
web/styles/globals.scss
View File

@ -18,18 +18,18 @@
--chat-notification-icon-padding: 6px; --chat-notification-icon-padding: 6px;
--chat-message-padding: 10px; --chat-message-padding: 10px;
--chat-text-highlight-border-radius: 3px; --chat-text-highlight-border-radius: 3px;
--player-container-height: 75vh; --player-container-height: 75vh;
--status-bar-height: 2rem; --status-bar-height: 2rem;
--footer-padding-x: 1rem; --footer-padding-x: 1rem;
@include screen(tablet) { @include screen(tablet) {
--header-height: 3.85rem; --header-height: 3.85rem;
--player-container-height: 400px; --player-container-height: 400px;
} }
@include screen(mobile) { @include screen(mobile) {
--player-container-height: 250px; --player-container-height: 250px;
} }
} }
::selection { ::selection {

6
web/styles/mixins.scss
View File

@ -1,11 +1,11 @@
@mixin flexCenter { @mixin flex-center {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
@mixin screen($breakpoint) { @mixin screen($breakpoint) {
@if $breakpoint == desktop { @if $breakpoint == desktop {
@media only screen and (width >= 768px) { @media only screen and (width >= 768px) {
@content; @content;
} }