@timus-networks/theme 2.4.106 → 2.4.108

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@timus-networks/theme",
   "configKey": "themeOptions",
-  "version": "2.4.105",
+  "version": "2.4.107",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/module.mjs

@@ -11,7 +11,7 @@ const __filename = __cjs_url__.fileURLToPath(import.meta.url);
 const __dirname = __cjs_path__.dirname(__filename);
 const require = __cjs_mod__.createRequire(import.meta.url);
 const name = "@timus-networks/theme";
-const version = "2.4.105";
+const version = "2.4.107";
 const description = "A comprehensive Nuxt.js module providing a tailored theme experience with integrated TailwindCSS support for applications.";
 const type = "module";
 const exports = {

package/dist/runtime/components/development/example.link.vue

@@ -47,12 +47,15 @@
     <el-card>
       <template #header> Underline </template>
       <div class="flex flex-col gap-3 items-start">
-        <h2>Underline</h2>
-        <p>Underline of link</p>
-        <div class="flex gap-2">
-          Some text, <el-link :underline="false">Without Underline</el-link> no - underline....
-          <el-link>With Underline</el-link>
-        </div>
+        <p>
+          Default underline is <el-text tag="mark">hover</el-text>. Other underline props values is <el-text tag="mark">'always' | 'hover' | 'never'</el-text>. Boolean is
+          deprecated and will be removed in the future. Also gives an console warning.
+        </p>
+        <ul class="list-disc list-inside">
+          <li><el-link underline="never">Never</el-link> "underline='never'": Some text,</li>
+          <li><el-link underline="hover">Hover</el-link> "underline='hover'": Some text,</li>
+          <li><el-link underline="always">Always</el-link> "underline='always'": Some text</li>
+        </ul>
       </div>
       <template #footer> <html-encode :tag="snippets.underline" /> </template>
     </el-card>
@@ -85,7 +88,7 @@
   const snippets = ref({
     basic: `<el-link href="https://element-plus.org" target="_blank" type="secondary">default</el-link>`,
     disabled: `<el-link type="secondary" disabled>default</el-link>`,
-    underline: `<el-link :underline="false">Without Underline</el-link>`,
+    underline: `<el-link underline="hover">With Underline</el-link>`,
     icon: `<el-link class="isax-add icon-right">Check</el-link>`,
   });
 </script>

package/dist/runtime/public/scss/element-plus/index.css

@@ -9942,7 +9942,6 @@ h6,
   gap: 4px;
   flex-direction: row;
   align-items: center;
-  justify-content: center;
   vertical-align: middle;
   position: relative;
   text-decoration: none;
@@ -9960,7 +9959,19 @@ h6,
 .el-link:active {
   color: var(--el-link-active-text-color);
 }
-.el-link.is-underline:hover::after {
+.el-link.is-hover-underline:hover:after {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  height: 0;
+  bottom: 2px;
+  border-bottom-width: 1px;
+  border-color: var(--el-color-primary-light-4);
+  border-style: solid;
+}
+
+.el-link.is-underline:after {
   content: "";
   position: absolute;
   left: 0;
@@ -9983,9 +9994,9 @@ h6,
   border-color: var(--el-color-primary-light-4);
 }
 .el-link__inner {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .el-link.el-link--primary {
@@ -9994,7 +10005,11 @@ h6,
   --el-link-active-text-color: var(--el-color-primary-light-6);
   --el-link-disabled-text-color: var(--el-color-primary-light-2);
 }
-.el-link.el-link--primary.is-underline:hover::after {
+.el-link.el-link--primary.is-hover-underline:hover:after {
+  border-color: var(--el-color-primary-light-4);
+}
+
+.el-link.el-link--primary.is-underline:hover:after {
   border-color: var(--el-color-primary-light-4);
 }
 
@@ -10004,7 +10019,11 @@ h6,
   --el-link-active-text-color: var(--el-color-secondary-light-6);
   --el-link-disabled-text-color: var(--el-color-secondary-light-2);
 }
-.el-link.el-link--secondary.is-underline:hover::after {
+.el-link.el-link--secondary.is-hover-underline:hover:after {
+  border-color: var(--el-color-secondary-light-4);
+}
+
+.el-link.el-link--secondary.is-underline:hover:after {
   border-color: var(--el-color-secondary-light-4);
 }
 
@@ -10014,7 +10033,11 @@ h6,
   --el-link-active-text-color: var(--el-color-neutral-light-6);
   --el-link-disabled-text-color: var(--el-color-neutral-light-2);
 }
-.el-link.el-link--neutral.is-underline:hover::after {
+.el-link.el-link--neutral.is-hover-underline:hover:after {
+  border-color: var(--el-color-neutral-light-4);
+}
+
+.el-link.el-link--neutral.is-underline:hover:after {
   border-color: var(--el-color-neutral-light-4);
 }
 
@@ -10024,7 +10047,11 @@ h6,
   --el-link-active-text-color: var(--el-color-success-light-6);
   --el-link-disabled-text-color: var(--el-color-success-light-2);
 }
-.el-link.el-link--success.is-underline:hover::after {
+.el-link.el-link--success.is-hover-underline:hover:after {
+  border-color: var(--el-color-success-light-4);
+}
+
+.el-link.el-link--success.is-underline:hover:after {
   border-color: var(--el-color-success-light-4);
 }
 
@@ -10034,7 +10061,11 @@ h6,
   --el-link-active-text-color: var(--el-color-warning-light-6);
   --el-link-disabled-text-color: var(--el-color-warning-light-2);
 }
-.el-link.el-link--warning.is-underline:hover::after {
+.el-link.el-link--warning.is-hover-underline:hover:after {
+  border-color: var(--el-color-warning-light-4);
+}
+
+.el-link.el-link--warning.is-underline:hover:after {
   border-color: var(--el-color-warning-light-4);
 }
 
@@ -10044,7 +10075,11 @@ h6,
   --el-link-active-text-color: var(--el-color-danger-light-6);
   --el-link-disabled-text-color: var(--el-color-danger-light-2);
 }
-.el-link.el-link--danger.is-underline:hover::after {
+.el-link.el-link--danger.is-hover-underline:hover:after {
+  border-color: var(--el-color-danger-light-4);
+}
+
+.el-link.el-link--danger.is-underline:hover:after {
   border-color: var(--el-color-danger-light-4);
 }
 
@@ -10054,7 +10089,11 @@ h6,
   --el-link-active-text-color: var(--el-color-error-light-6);
   --el-link-disabled-text-color: var(--el-color-error-light-2);
 }
-.el-link.el-link--error.is-underline:hover::after {
+.el-link.el-link--error.is-hover-underline:hover:after {
+  border-color: var(--el-color-error-light-4);
+}
+
+.el-link.el-link--error.is-underline:hover:after {
   border-color: var(--el-color-error-light-4);
 }
 
@@ -10064,7 +10103,11 @@ h6,
   --el-link-active-text-color: var(--el-color-info-light-6);
   --el-link-disabled-text-color: var(--el-color-info-light-2);
 }
-.el-link.el-link--info.is-underline:hover::after {
+.el-link.el-link--info.is-hover-underline:hover:after {
+  border-color: var(--el-color-info-light-4);
+}
+
+.el-link.el-link--info.is-underline:hover:after {
   border-color: var(--el-color-info-light-4);
 }
 
@@ -12513,7 +12556,7 @@ h6,
 
 .el-select__wrapper.is-disabled {
   cursor: not-allowed;
-  background-color: var(--el-color-neutral-light-2);
+  background-color: var(--el-color-neutral-light-1);
   color: var(--el-text-color-placeholder);
   box-shadow: 0 0 0 1px var(--el-select-disabled-border) inset;
 }

package/dist/runtime/public/scss/element-plus/link.css

@@ -425,7 +425,6 @@ h6,
   gap: 4px;
   flex-direction: row;
   align-items: center;
-  justify-content: center;
   vertical-align: middle;
   position: relative;
   text-decoration: none;
@@ -443,7 +442,19 @@ h6,
 .el-link:active {
   color: var(--el-link-active-text-color);
 }
-.el-link.is-underline:hover::after {
+.el-link.is-hover-underline:hover:after {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  height: 0;
+  bottom: 2px;
+  border-bottom-width: 1px;
+  border-color: var(--el-color-primary-light-4);
+  border-style: solid;
+}
+
+.el-link.is-underline:after {
   content: "";
   position: absolute;
   left: 0;
@@ -466,9 +477,9 @@ h6,
   border-color: var(--el-color-primary-light-4);
 }
 .el-link__inner {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .el-link.el-link--primary {
@@ -477,7 +488,11 @@ h6,
   --el-link-active-text-color: var(--el-color-primary-light-6);
   --el-link-disabled-text-color: var(--el-color-primary-light-2);
 }
-.el-link.el-link--primary.is-underline:hover::after {
+.el-link.el-link--primary.is-hover-underline:hover:after {
+  border-color: var(--el-color-primary-light-4);
+}
+
+.el-link.el-link--primary.is-underline:hover:after {
   border-color: var(--el-color-primary-light-4);
 }
 
@@ -487,7 +502,11 @@ h6,
   --el-link-active-text-color: var(--el-color-secondary-light-6);
   --el-link-disabled-text-color: var(--el-color-secondary-light-2);
 }
-.el-link.el-link--secondary.is-underline:hover::after {
+.el-link.el-link--secondary.is-hover-underline:hover:after {
+  border-color: var(--el-color-secondary-light-4);
+}
+
+.el-link.el-link--secondary.is-underline:hover:after {
   border-color: var(--el-color-secondary-light-4);
 }
 
@@ -497,7 +516,11 @@ h6,
   --el-link-active-text-color: var(--el-color-neutral-light-6);
   --el-link-disabled-text-color: var(--el-color-neutral-light-2);
 }
-.el-link.el-link--neutral.is-underline:hover::after {
+.el-link.el-link--neutral.is-hover-underline:hover:after {
+  border-color: var(--el-color-neutral-light-4);
+}
+
+.el-link.el-link--neutral.is-underline:hover:after {
   border-color: var(--el-color-neutral-light-4);
 }
 
@@ -507,7 +530,11 @@ h6,
   --el-link-active-text-color: var(--el-color-success-light-6);
   --el-link-disabled-text-color: var(--el-color-success-light-2);
 }
-.el-link.el-link--success.is-underline:hover::after {
+.el-link.el-link--success.is-hover-underline:hover:after {
+  border-color: var(--el-color-success-light-4);
+}
+
+.el-link.el-link--success.is-underline:hover:after {
   border-color: var(--el-color-success-light-4);
 }
 
@@ -517,7 +544,11 @@ h6,
   --el-link-active-text-color: var(--el-color-warning-light-6);
   --el-link-disabled-text-color: var(--el-color-warning-light-2);
 }
-.el-link.el-link--warning.is-underline:hover::after {
+.el-link.el-link--warning.is-hover-underline:hover:after {
+  border-color: var(--el-color-warning-light-4);
+}
+
+.el-link.el-link--warning.is-underline:hover:after {
   border-color: var(--el-color-warning-light-4);
 }
 
@@ -527,7 +558,11 @@ h6,
   --el-link-active-text-color: var(--el-color-danger-light-6);
   --el-link-disabled-text-color: var(--el-color-danger-light-2);
 }
-.el-link.el-link--danger.is-underline:hover::after {
+.el-link.el-link--danger.is-hover-underline:hover:after {
+  border-color: var(--el-color-danger-light-4);
+}
+
+.el-link.el-link--danger.is-underline:hover:after {
   border-color: var(--el-color-danger-light-4);
 }
 
@@ -537,7 +572,11 @@ h6,
   --el-link-active-text-color: var(--el-color-error-light-6);
   --el-link-disabled-text-color: var(--el-color-error-light-2);
 }
-.el-link.el-link--error.is-underline:hover::after {
+.el-link.el-link--error.is-hover-underline:hover:after {
+  border-color: var(--el-color-error-light-4);
+}
+
+.el-link.el-link--error.is-underline:hover:after {
   border-color: var(--el-color-error-light-4);
 }
 
@@ -547,7 +586,11 @@ h6,
   --el-link-active-text-color: var(--el-color-info-light-6);
   --el-link-disabled-text-color: var(--el-color-info-light-2);
 }
-.el-link.el-link--info.is-underline:hover::after {
+.el-link.el-link--info.is-hover-underline:hover:after {
+  border-color: var(--el-color-info-light-4);
+}
+
+.el-link.el-link--info.is-underline:hover:after {
   border-color: var(--el-color-info-light-4);
 }
 

package/dist/runtime/public/scss/element-plus/link.scss

@@ -16,7 +16,7 @@
   gap: 4px;
   flex-direction: row;
   align-items: center;
-  justify-content: center;
+  // justify-content: center;
   vertical-align: middle;
   position: relative;
   text-decoration: none;
@@ -38,8 +38,22 @@
     color: getCssVar('link', 'active-text-color');
   }
 
+  @include when(hover-underline) {
+    &:hover:after {
+      content: '';
+      position: absolute;
+      left: 0;
+      right: 0;
+      height: 0;
+      bottom: 2px;
+      border-bottom-width: 1px;
+      border-color: getCssVar('color', 'primary', 'light-4');
+      border-style: solid;
+    }
+  }
+
   @include when(underline) {
-    &:hover::after {
+    &:after {
       content: '';
       position: absolute;
       left: 0;
@@ -69,9 +83,13 @@
   }
 
   @include e(inner) {
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
+    // display: inline-flex;
+    // justify-content: center;
+    // align-items: center;
+
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
 
   @each $type in $types {
@@ -85,8 +103,14 @@
         // border-color: getCssVar('link', 'text-color');
       }
 
+      @include when(hover-underline) {
+        &:hover:after {
+          border-color: getCssVar('color', $type, 'light-4');
+        }
+      }
+
       @include when(underline) {
-        &:hover::after {
+        &:hover:after {
           border-color: getCssVar('color', $type, 'light-4');
         }
       }

package/dist/runtime/public/scss/element-plus/select-v2.css

@@ -488,7 +488,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
 
 .el-select__wrapper.is-disabled {
   cursor: not-allowed;
-  background-color: var(--el-color-neutral-light-2);
+  background-color: var(--el-color-neutral-light-1);
   color: var(--el-text-color-placeholder);
   box-shadow: 0 0 0 1px var(--el-select-disabled-border) inset;
 }

package/dist/runtime/public/scss/element-plus/select.css

@@ -488,7 +488,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
 
 .el-select__wrapper.is-disabled {
   cursor: not-allowed;
-  background-color: var(--el-color-neutral-light-2);
+  background-color: var(--el-color-neutral-light-1);
   color: var(--el-text-color-placeholder);
   box-shadow: 0 0 0 1px var(--el-select-disabled-border) inset;
 }

package/dist/runtime/public/scss/element-plus/select.scss

@@ -68,7 +68,7 @@
     @include when(disabled) {
       cursor: not-allowed;
 
-      background-color: getCssVar('color-neutral-light-2');
+      background-color: getCssVar('color-neutral-light-1');
       color: getCssVar('text-color', 'placeholder');
       @include mixed-input-border(#{getCssVar('select-disabled-border')});
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@timus-networks/theme",
-  "version": "2.4.106",
+  "version": "2.4.108",
   "description": "A comprehensive Nuxt.js module providing a tailored theme experience with integrated TailwindCSS support for applications.",
   "type": "module",
   "exports": {