Merge pull request #1538 from GrabarzUndPartner/renovate/stylelint-co…

…nfig-recess-order-6.x

chore(deps): update devdependency stylelint-config-recess-order to v6

package.json

@@ -50,7 +50,7 @@
     "stylelint": "16.13.2",
     "stylelint-config-css-modules": "4.4.0",
     "stylelint-config-lost": "0.0.3",
-    "stylelint-config-recess-order": "5.1.1",
+    "stylelint-config-recess-order": "6.0.0",
     "stylelint-config-standard": "37.0.0"
   },
   "dependencies": {

src/components/base/layout/Modal.vue

@@ -140,8 +140,8 @@ function onRouterAfterEach() {
     position: absolute;
     top: calc(30 / 375 * 100vw);
     right: calc(15 / 375 * 100vw);
-    display: block;
     float: left;
+    display: block;
     padding: 0;
     appearance: none;
     cursor: pointer;
@@ -174,9 +174,9 @@ function onRouterAfterEach() {
 .modal-toggle-enter,
 .modal-toggle-leave-to {
   opacity: 0;
+  transform: scale(0.6);
   transition:
     transform 0.15s ease-in,
     opacity 0.15s linear;
-  transform: scale(0.6);
 }
 </style>

src/components/fragment/LanguageSwitch.vue

@@ -59,8 +59,8 @@ const languages = computed(() => {
 
   & a {
     color: var(--color-black);
-    text-decoration: none;
     text-transform: uppercase;
+    text-decoration: none;
     opacity: 0.6;
 
     &.router-link-exact-active {

src/components/page/Header.vue

@@ -72,8 +72,8 @@ const styleClasses = computed(() => {
     font-weight: bold;
     text-align: center;
     background: rgb(255 255 255 / 50%);
-    backdrop-filter: blur(4px);
     box-shadow: 0 0 10px rgb(0 0 0 / 30%);
+    backdrop-filter: blur(4px);
 
     & a {
       color: var(--color-black);

src/components/page/MenuButton.vue

@@ -54,12 +54,12 @@ function onClickMenu() {
   appearance: none;
   cursor: pointer;
   user-select: none;
+  outline: none;
   background: rgb(255 255 255 / 60%);
-  backdrop-filter: blur(2px);
   border: none;
   border-radius: 50%;
-  outline: none;
   box-shadow: 0 0 10px rgb(0 0 0 / 30%);
+  backdrop-filter: blur(2px);
   -webkit-tap-highlight-color: transparent;
 
   @media (--xs) {
@@ -93,17 +93,17 @@ function onClickMenu() {
   }
 
   & svg g {
+    transform-origin: center center;
     transition:
       transform 0.3s linear,
       opacity 0.3s linear;
-    transform-origin: center center;
 
     &:last-child {
       opacity: 0;
+      transform: scale(0.4);
       transition:
         transform 0.15s linear,
         opacity 0.15s linear;
-      transform: scale(0.4);
     }
   }
 
@@ -116,10 +116,10 @@ function onClickMenu() {
       & g {
         &:first-child {
           opacity: 0;
+          transform: scale(0.4);
           transition:
             transform 0.15s linear,
             opacity 0.15s linear;
-          transform: scale(0.4);
         }
 
         &:last-child {
@@ -141,9 +141,9 @@ function onClickMenu() {
 .button-toggle-enter,
 .button-toggle-leave-to {
   opacity: 0;
+  transform: scale(0.4);
   transition:
     transform 0.15s linear,
     opacity 0.15s linear;
-  transform: scale(0.4);
 }
 </style>