generated from VLADIMIR/template_frontend
add css linter
This commit is contained in:
Generated
+1497
File diff suppressed because it is too large
Load Diff
@@ -10,6 +10,7 @@
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --build",
|
||||
"lint": "eslint . --fix",
|
||||
"lint:css": "stylelint \"src/**/*.{css,scss,vue}\" --fix",
|
||||
"format": "prettier --write src/",
|
||||
"proto:gen": "protoc --typescript-http_out=src/api/generated --proto_path=proto proto/main.proto"
|
||||
},
|
||||
@@ -42,7 +43,10 @@
|
||||
"jiti": "^2.7.0",
|
||||
"naive-ui": "^2.44.1",
|
||||
"npm-run-all2": "^9.0.2",
|
||||
"postcss-html": "^1.8.1",
|
||||
"prettier": "3.9.4",
|
||||
"stylelint": "^17.14.1",
|
||||
"stylelint-config-standard-scss": "^17.0.0",
|
||||
"ts-proto": "^2.12.0",
|
||||
"typescript": "~6.0.3",
|
||||
"vfonts": "^0.0.3",
|
||||
|
||||
+9
-18
@@ -1,24 +1,20 @@
|
||||
/* color palette from <https://github.com/vuejs/theme> */
|
||||
:root {
|
||||
--vt-c-white: #ffffff;
|
||||
--vt-c-white: #fff;
|
||||
--vt-c-white-soft: #f8f8f8;
|
||||
--vt-c-white-mute: #f2f2f2;
|
||||
|
||||
--vt-c-black: #181818;
|
||||
--vt-c-black-soft: #222222;
|
||||
--vt-c-black-soft: #222;
|
||||
--vt-c-black-mute: #282828;
|
||||
|
||||
--vt-c-indigo: #2c3e50;
|
||||
|
||||
--vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
|
||||
--vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
|
||||
--vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
|
||||
--vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
|
||||
|
||||
--vt-c-divider-light-1: rgb(60 60 60 / 29%);
|
||||
--vt-c-divider-light-2: rgb(60 60 60 / 12%);
|
||||
--vt-c-divider-dark-1: rgb(84 84 84 / 65%);
|
||||
--vt-c-divider-dark-2: rgb(84 84 84 / 48%);
|
||||
--vt-c-text-light-1: var(--vt-c-indigo);
|
||||
--vt-c-text-light-2: rgba(60, 60, 60, 0.66);
|
||||
--vt-c-text-light-2: rgb(60 60 60 / 66%);
|
||||
--vt-c-text-dark-1: var(--vt-c-white);
|
||||
--vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
|
||||
--vt-c-text-dark-2: rgb(235 235 235 / 64%);
|
||||
}
|
||||
|
||||
/* semantic color variables for this project */
|
||||
@@ -26,13 +22,10 @@
|
||||
--color-background: var(--vt-c-white);
|
||||
--color-background-soft: var(--vt-c-white-soft);
|
||||
--color-background-mute: var(--vt-c-white-mute);
|
||||
|
||||
--color-border: var(--vt-c-divider-light-2);
|
||||
--color-border-hover: var(--vt-c-divider-light-1);
|
||||
|
||||
--color-heading: var(--vt-c-text-light-1);
|
||||
--color-text: var(--vt-c-text-light-1);
|
||||
|
||||
--section-gap: 160px;
|
||||
}
|
||||
|
||||
@@ -41,10 +34,8 @@
|
||||
--color-background: var(--vt-c-black);
|
||||
--color-background-soft: var(--vt-c-black-soft);
|
||||
--color-background-mute: var(--vt-c-black-mute);
|
||||
|
||||
--color-border: var(--vt-c-divider-dark-2);
|
||||
--color-border-hover: var(--vt-c-divider-dark-1);
|
||||
|
||||
--color-heading: var(--vt-c-text-dark-1);
|
||||
--color-text: var(--vt-c-text-dark-2);
|
||||
}
|
||||
@@ -80,7 +71,7 @@ body {
|
||||
'Helvetica Neue',
|
||||
sans-serif;
|
||||
font-size: 15px;
|
||||
text-rendering: optimizeLegibility;
|
||||
text-rendering: optimizelegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
+10
-6
@@ -2,30 +2,34 @@
|
||||
|
||||
body {
|
||||
overflow: hidden;
|
||||
color: #eeeeee;
|
||||
background-color: #111111;
|
||||
color: #eee;
|
||||
background-color: #111;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: font_old_typer;
|
||||
font-family: "font_old_typer";
|
||||
src: url('@/assets/fonts/a_OldTyper.ttf');
|
||||
}
|
||||
|
||||
.center-message {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/* горизонтальное центрирование */
|
||||
align-items: center;
|
||||
|
||||
/* вертикальное центрирование */
|
||||
height: calc(100dvh - 100px);
|
||||
text-align: center;
|
||||
|
||||
/* центрирование текста */
|
||||
}
|
||||
|
||||
.content-block {
|
||||
margin-top: 70px;
|
||||
padding: 0;
|
||||
|
||||
/* background-color: #553333; */
|
||||
}
|
||||
|
||||
@@ -33,15 +37,15 @@ body {
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
@media (width >= 1024px) {
|
||||
.center-block-custom {
|
||||
width: 700px;
|
||||
margin: 70px auto 0 auto;
|
||||
margin: 70px auto 0;
|
||||
}
|
||||
|
||||
.center-block-custom-big {
|
||||
width: 1200px;
|
||||
margin: 70px auto 0 auto;
|
||||
margin: 70px auto 0;
|
||||
}
|
||||
|
||||
.center-middle-block-custom {
|
||||
|
||||
@@ -116,10 +116,10 @@ const goToLogout = () => {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
|
||||
/* background-color: brown; */
|
||||
|
||||
padding: 20px;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@@ -129,7 +129,7 @@ const goToLogout = () => {
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
padding: 5px 5px;
|
||||
padding: 5px;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
|
||||
@@ -117,7 +117,7 @@ async function signup() {
|
||||
|
||||
<style scoped>
|
||||
.sign-card {
|
||||
background-color: rgb(29, 29, 29);
|
||||
background-color: rgb(29 29 29);
|
||||
}
|
||||
|
||||
.form-label {
|
||||
@@ -137,7 +137,7 @@ async function signup() {
|
||||
color: #63e2b7;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
@media (width >= 1024px) {
|
||||
.sign-card {
|
||||
width: 380px;
|
||||
}
|
||||
|
||||
@@ -129,7 +129,7 @@ function onCreateKey(): Key {
|
||||
margin: 20px;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #444444;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
|
||||
.place-block:hover {
|
||||
@@ -139,7 +139,7 @@ function onCreateKey(): Key {
|
||||
.place-block-plus {
|
||||
margin: 20px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #444444;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
|
||||
.place-block-plus:hover {
|
||||
|
||||
@@ -258,6 +258,7 @@ async function deletePlace(place: Place) {
|
||||
<style scoped>
|
||||
.settings-block {
|
||||
height: 40px;
|
||||
|
||||
/* background-color: brown; */
|
||||
}
|
||||
|
||||
@@ -272,7 +273,7 @@ async function deletePlace(place: Place) {
|
||||
.name-text {
|
||||
padding: 3px;
|
||||
border-radius: 3px;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
background-color: rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.settings-header {
|
||||
@@ -285,15 +286,15 @@ async function deletePlace(place: Place) {
|
||||
|
||||
.places-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: nowrap;
|
||||
flex-flow: column nowrap;
|
||||
overflow-y: auto;
|
||||
padding: 20px 0;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
@media (width >= 1024px) {
|
||||
.places-container {
|
||||
padding: 20px 250px;
|
||||
height: calc(100vh - 70px);
|
||||
|
||||
@@ -87,12 +87,12 @@ getScenarios()
|
||||
<style scoped>
|
||||
.scenarios-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
flex-flow: row wrap;
|
||||
justify-content: center;
|
||||
overflow-y: auto;
|
||||
padding: 40px 0;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
|
||||
@@ -100,6 +100,7 @@ getScenarios()
|
||||
margin: 10px;
|
||||
width: 150px;
|
||||
cursor: pointer;
|
||||
|
||||
/* background-color: #553333; */
|
||||
}
|
||||
|
||||
@@ -122,7 +123,7 @@ getScenarios()
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #333333;
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
.scenario-image {
|
||||
@@ -134,7 +135,7 @@ getScenarios()
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
@media (width >= 1024px) {
|
||||
.scenarios-container {
|
||||
height: calc(100vh - 70px);
|
||||
}
|
||||
|
||||
@@ -36,13 +36,13 @@ const keyColorClass = computed(() => {
|
||||
|
||||
<style lang="css">
|
||||
.font-text {
|
||||
font-family: font_old_typer;
|
||||
font-family: "font_old_typer";
|
||||
}
|
||||
|
||||
.content-text {
|
||||
position: relative;
|
||||
top: 100px;
|
||||
right: 0px;
|
||||
right: 0;
|
||||
float: right;
|
||||
}
|
||||
|
||||
@@ -56,7 +56,7 @@ const keyColorClass = computed(() => {
|
||||
color: gold;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
@media (width >= 1024px) {
|
||||
.font-text {
|
||||
position: relative;
|
||||
left: -50px;
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
export default {
|
||||
extends: [
|
||||
'stylelint-config-standard-scss', // Базовые правила для SCSS и CSS
|
||||
],
|
||||
// Добавляем поддержку Vue файлов
|
||||
overrides: [
|
||||
{
|
||||
files: ['**/*.vue'],
|
||||
customSyntax: 'postcss-html',
|
||||
},
|
||||
],
|
||||
rules: {
|
||||
// Здесь можно переопределить правила
|
||||
'order/properties-alphabetical-order': true, // Сортировка свойств
|
||||
// 'selector-class-pattern': '^[a-z][a-zA-Z0-9]+$', // Названия классов в camelCase
|
||||
},
|
||||
};
|
||||
Reference in New Issue
Block a user