add css linter

src/components/HeaderMenu.vue

@@ -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;
 }
 

src/components/LoginPage.vue

@@ -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;
   }

src/components/PlaceBlock.vue

@@ -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 {

src/components/ScenariosEditorPage.vue

@@ -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);

src/components/ScenariosPage.vue

@@ -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);
     }