Merge branch 'main' into 2483d-embedded-wallets-pass

Author: m4sterbunny

package.json

@@ -17,7 +17,7 @@
     "typecheck-staged": "tsc-files --noEmit",
     "lint": "npm run lint:js && npm run lint:style",
     "lint:js": "eslint . --max-warnings=5",
-    "lint:style": "stylelint 'src/**/*.css' --fix",
+    "lint:style": "stylelint \"src/**/*.css\" --fix",
     "lint:fix": "npm run lint:js -- --fix",
     "format": "prettier --write '{blog,docs,src}/**/*.{md,mdx,ts,js,tsx,jsx,json}'"
   },

src/components/CopyPageButton/CopyPageButton.module.css

@@ -5,9 +5,10 @@
   min-height: 48px; /* Ensure minimum height for button */
 }
 
-@media (min-width: 997px) {
+@media (width >= 997px) {
   .h1Wrapper h1 {
     /* Don't override the default H1 margin-bottom */
+
     /* Add padding-right to prevent text from going under the button */
     padding-right: 180px;
   }
@@ -71,7 +72,7 @@
   backdrop-filter: blur(10px);
 }
 
-@media (max-width: 996px) {
+@media (width <= 996px) {
   .container {
     display: none;
   }

src/components/TutorialsPage/styles.module.css

@@ -686,8 +686,7 @@ html[data-theme='dark'] mark {
 
   .buttonGroup {
     width: 100%;
-    overflow-x: auto;
-    overflow-y: hidden;
+    overflow: auto hidden;
     -webkit-overflow-scrolling: touch;
   }
 

src/pages/quickstart/NavigationOverlay/NavigationOverlay.module.css

@@ -548,10 +548,7 @@ html[data-theme='dark'] .cardDescription {
 @media (width <=768px) {
   .overlayContainer {
     position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
+    inset: 0;
     width: 100vw;
     height: 100vh;
     overflow: hidden;

src/pages/quickstart/styles.module.css

@@ -7,6 +7,7 @@
   text-underline-offset: .4rem;
   transition: color var(--ifm-transition-fast) var(--ifm-transition-timing-default);
 }
+
 .stepBody a:hover,
 .stepBody a:focus {
   color: var(--ifm-link-hover-color);

src/theme/Tiles/styles.module.css

@@ -31,7 +31,7 @@
   text-decoration: none !important;
   border-color: var(--ifm-color-primary);
   transform: translateY(-1px);
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  box-shadow: 0 4px 12px rgb(0 0 0 / 10%);
 }
 
 .tile:focus {