@inf-monkeys-tech/monkeys-design 0.4.38 → 0.4.40

package/dist/styles/login-page.scss

@@ -124,6 +124,18 @@
   transform-origin: left center;
 }
 
+.login-page__logo-image--dark {
+  display: none;
+}
+
+.dark .login-page__logo-image--light {
+  display: none;
+}
+
+.dark .login-page__logo-image--dark {
+  display: block;
+}
+
 .login-page__form {
   position: relative;
   z-index: 1;
@@ -186,30 +198,48 @@
 }
 
 .login-page__tabs {
-  display: grid;
-  grid-auto-columns: 1fr;
-  grid-auto-flow: column;
+  display: flex;
   gap: 0;
   margin-bottom: 28px;
-  overflow: hidden;
+  overflow-x: auto;
+  overflow-y: hidden;
   border: 1px solid var(--login-page-control-border);
   border-radius: var(--login-page-radius);
   background: color-mix(in srgb, var(--login-page-control-bg) 76%, transparent);
+  scrollbar-width: none;
+}
+
+.login-page__tabs::-webkit-scrollbar {
+  display: none;
 }
 
 .login-page__tab {
   display: inline-flex;
-  min-width: 0;
+  flex: 1 0 auto;
+  min-width: max-content;
   align-items: center;
   justify-content: center;
-  gap: 8px;
+  gap: 6px;
   min-height: 44px;
-  padding: 0 16px;
+  padding: 0 10px;
   color: var(--login-page-muted-color);
   background: transparent;
   border: 0;
   cursor: pointer;
   font: inherit;
+  font-size: 14px;
+  line-height: 1.2;
+  white-space: nowrap;
+}
+
+.login-page .login-page__tab > *,
+.login-page .login-page__tab svg {
+  color: inherit;
+}
+
+.login-page__tab-label {
+  display: inline-block;
+  white-space: nowrap;
 }
 
 .login-page__tab--active {
@@ -367,8 +397,8 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  gap: 10px;
-  margin-top: 22px;
+  gap: 8px;
+  margin-top: 20px;
 }
 
 .login-page__oauth-label {
@@ -381,14 +411,25 @@
   width: 100%;
   flex-wrap: wrap;
   justify-content: center;
-  gap: 10px;
+  gap: 6px;
 }
 
 .login-page__oauth-button {
-  min-width: min(180px, 100%);
+  min-width: min(96px, 100%);
+  min-height: 38px;
+  gap: 6px;
+  padding: 0 10px;
   color: var(--login-page-text-color);
   background: color-mix(in srgb, var(--login-page-control-bg) 78%, transparent);
   border: 1px solid var(--login-page-control-border);
+  font-size: 13px;
+  line-height: 1.2;
+  white-space: nowrap;
+}
+
+.login-page__oauth-button .login-page__oauth-icon {
+  width: 16px;
+  height: 16px;
 }
 
 @media (max-width: 768px) {
@@ -416,8 +457,4 @@
     top: 20px;
     right: 20px;
   }
-
-  .login-page__tabs {
-    grid-auto-flow: row;
-  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inf-monkeys-tech/monkeys-design",
-  "version": "0.4.38",
+  "version": "0.4.40",
   "description": "Monkeys Design Components Library",
   "main": "dist/index.js",
   "module": "dist/index.mjs",