@everchron/ec-shards 3.1.2 → 3.1.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everchron/ec-shards",
-  "version": "3.1.2",
+  "version": "3.1.4",
   "private": false,
   "description": "Everchron Shards UI Library",
   "repository": "https://github.com/everchron/ec-shards.git",

package/src/components/formatted/formatted.vue

@@ -37,11 +37,13 @@
 
 .ecs-formatted{
   font-size: $type-scale-3-font-size;
-  line-height: 1.4em;
-  min-height: 1.4em;
+  line-height: $type-scale-3-line-height;
+  min-height: $type-scale-3-line-height;
 
   &-sml{
     font-size: $type-scale-2-font-size;
+    line-height: $type-scale-2-line-height;
+    min-height: $type-scale-2-line-height;
   }
 
   p{
@@ -77,19 +79,6 @@
         opacity: 1;
       }
     }
-
-    &[href*="//"]:not([href*="everchron.com"]):after,
-    &[href*="//"]:not([href*="everchron.me"]):after,
-    &[href*="//"]:not([href*="everchron.co.uk"]):after,
-    &[href*="//"]:not([href*="everchron.com.au"]):after,
-    &[href*="//"]:not([href*="everchron.wtf"]):after{
-      content: "";
-      background: svg-uri('<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8"><path fill="#858E9E" d="M7.625,3.5 C7.524,3.5 7.434,3.459 7.366,3.395 C7.364,3.393 7.361,3.393 7.359,3.391 L6.427,2.458 L4.067,4.818 C3.823,5.061 3.427,5.061 3.183,4.818 C2.939,4.574 2.939,4.178 3.183,3.934 L5.542,1.575 L4.609,0.641 C4.607,0.639 4.607,0.636 4.605,0.634 C4.541,0.566 4.5,0.476 4.5,0.375 C4.5,0.168 4.668,0 4.875,0 L7.5,0 C7.776,0 8,0.224 8,0.5 L8,3.125 C8,3.332 7.832,3.5 7.625,3.5 Z M1,2.25 L1,6.75 C1,6.888 1.112,7 1.25,7 L5.75,7 C5.888,7 6,6.888 6,6.75 L6,4 L7,5 L7,7 C7,7.553 6.553,8 6,8 L1,8 C0.448,8 0,7.553 0,7 L0,2 C0,1.448 0.448,1 1,1 L3,1 L4,2 L1.25,2 C1.112,2 1,2.112 1,2.25 Z"/></svg>');
-      width: 8px;
-      display: inline-block;
-      height: 8px;
-      margin-left: 4px;
-    }
   }
 
   ul{

package/src/components/input/input.vue

@@ -130,12 +130,6 @@
           return `ecs-form-control-format-${this.format}`
         return this.format
       }
-    },
-
-    watch:{
-      value(){
-        console.warn('value is nao', this.value)
-      }
     }
   }
 </script>
@@ -169,13 +163,16 @@
     border: 0;
   }
 
-  &:disabled,
-  &[readonly] {
+  &:disabled{
     background-color: rgba($color-gray-6, .15);
     color: $color-gray-8;
     cursor: default;
   }
 
+  &[readonly] {
+    cursor: default;
+  }
+
   &-subtle{
     background-color: rgba($color-gray-8, .15);
     border: 1px solid rgba($color-gray-8, .2);
@@ -186,8 +183,7 @@
       box-shadow: none;
     }
 
-    &:disabled,
-    &[readonly] {
+    &:disabled{
       background-color: rgba($color-gray-8, .1);
       border: 1px solid rgba($color-gray-8, .1);
       opacity: .8;

package/src/stories/Changelog.stories.mdx

@@ -6,6 +6,13 @@ import { Meta } from '@storybook/addon-docs/blocks';
   Changelog
 </h1>
 
+## Version 3.1.2 (15 December 2022)
+
+### Fixes
+
+- Fixed readonly state styles of EcsInput
+- Fixed line height scales of EcsFormatted
+
 ## Version 3.1.1 (29 November 2022)
 
 ### Fixes

package/src/stories/input/input.stories.js

@@ -9,8 +9,8 @@ export const input = () => ({
   components: { EcsInput },
   template: `<div>
               <ecs-input placeholder="Enter your name" class="mb-2" />
-              <ecs-input readonly placeholder="Enter your name" class="mb-2" />
-              <ecs-input disabled placeholder="Enter your name" />
+              <ecs-input readonly value="Readonly" class="mb-2" />
+              <ecs-input disabled value="Disabled" />
             </div>`,
 });
 
@@ -33,8 +33,9 @@ export const inputSizes = () => ({
 export const inputSubtle = () => ({
   components: { EcsInput },
   template: `<div>
-              <ecs-input placeholder="Enter your name" class="mb-2" />
-              <ecs-input subtle placeholder="Enter your name" />
+              <ecs-input subtle placeholder="Enter your name" class="mb-2" />
+              <ecs-input subtle readonly value="Readonly" class="mb-2" />
+              <ecs-input subtle disabled value="Disabled" />
             </div>`,
 });