vft 0.0.316 → 0.0.319

package/theme-style/src/avatar-stack.scss

@@ -0,0 +1,38 @@
+@use 'common/var' as *;
+@use 'mixins/mixins' as *;
+@use 'sass:map';
+
+$name: avatar-stack;
+
+@include set-root-css-vars($name, $avatar-stack);
+
+@include b($name) {
+  display: flex;
+  align-items: center;
+
+  @include e(item) {
+    position: relative;
+    margin-right: calc(-1 * getCssVar('avatar-stack', 'overlap'));
+
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+
+  @include e(stacked-avatar) {
+    border: 2px solid getCssVar('avatar-stack', 'border-color');
+    box-shadow: getCssVar('avatar-stack', 'shadow');
+  }
+
+  @include e(remaining-avatar) {
+    @include flex-center;
+
+    padding-left: 10px;
+    border: 2px solid getCssVar('avatar-stack', 'border-color');
+    background: getCssVar('avatar-stack', 'remaining-bg-color');
+    box-shadow: getCssVar('avatar-stack', 'shadow');
+    color: getCssVar('avatar-stack', 'remaining-text-color');
+    font-size: getCssVar('avatar-stack', 'font-size');
+    font-weight: getCssVar('avatar-stack', 'remaining-font-weight');
+  }
+}

package/theme-style/src/common/var.scss

@@ -724,7 +724,7 @@ $full-screen: map.merge(
   (
     'color': getCssVar('text-primary-color'),
     'hover-color': getCssVar('primary-color'),
-    'font-size': getCssVar('font-size-extra-small')
+    'font-size': getCssVar('font-size-extra-small'),
   ),
   $full-screen
 );
@@ -761,7 +761,7 @@ $select-group: map.merge(
   (
     'text-color': getCssVar('info-color'),
     'height': 30px,
-    'font-size': getCssVar('font-size-extra-small')
+    'font-size': getCssVar('font-size-extra-small'),
   ),
   $select-group
 );
@@ -1039,6 +1039,20 @@ $avatar: map.merge(
   ),
   $avatar
 );
+
+$avatar-stack: () !default;
+$avatar-stack: map.merge(
+  (
+    'max-count': 5,
+    'size': 40px,
+    'shadow': 0 2px 4px rgba(0, 0, 0, 0.1),
+    'remaining-bg-color': #e0e0e0,
+    'remaining-text-color': #666,
+    'remaining-font-weight': 500,
+  ),
+  $avatar-stack
+);
+
 $avatar-size: () !default;
 $avatar-size: map.merge(
   (

package/theme-style/src/index.scss

@@ -2,6 +2,7 @@
 // component styles
 @use './divider';
 @use './avatar';
+@use './avatar-stack';
 @use './backtop';
 @use './empty';
 @use './result';

package/theme-style/src/super-form.scss

@@ -46,7 +46,12 @@ $name: super-form;
     color: var(--vft-danger-color);
   }
 
-  .vft-date-editor.vft-input__wrapper {
+  .vft-date-editor.vft-input__wrapper,
+  .vft-upload-wrapper {
     width: 100%;
   }
+
+  .icon-arrow-upload {
+    @include icon-common($icon-upload);
+  }
 }

package/theme-style/vft-avatar-stack.css

@@ -0,0 +1 @@
+:root{--vft-avatar-stack-max-count:5;--vft-avatar-stack-size:40px;--vft-avatar-stack-shadow:0 2px 4px rgba(0, 0, 0, 0.1);--vft-avatar-stack-remaining-bg-color:#e0e0e0;--vft-avatar-stack-remaining-text-color:#666;--vft-avatar-stack-remaining-font-weight:500}.vft-avatar-stack{display:flex;align-items:center}.vft-avatar-stack__item{position:relative;margin-right:calc(-1 * var(--vft-avatar-stack-overlap))}.vft-avatar-stack__item:last-child{margin-right:0}.vft-avatar-stack__stacked-avatar{border:2px solid var(--vft-avatar-stack-border-color);box-shadow:var(--vft-avatar-stack-shadow)}.vft-avatar-stack__remaining-avatar{display:flex;align-items:center;justify-content:center;padding-left:10px;border:2px solid var(--vft-avatar-stack-border-color);background:var(--vft-avatar-stack-remaining-bg-color);box-shadow:var(--vft-avatar-stack-shadow);color:var(--vft-avatar-stack-remaining-text-color);font-size:var(--vft-avatar-stack-font-size);font-weight:var(--vft-avatar-stack-remaining-font-weight)}

package/theme-style/vft-super-form.css

@@ -1 +1 @@
-.vft-super-form__container{display:flex;width:100%}.vft-super-form__content{display:flex;flex:1;line-height:1}.vft-super-form__item .sub-label{color:var(--vft-text-placeholder-color);font-size:12px}.vft-super-form.is-suffix--suffix{display:inline-flex;align-items:center;padding-left:6px;line-height:1}.vft-super-form .is-comp-full-width .vft-select{width:100%}.vft-super-form .submit-block{width:100%}.vft-super-form .label-required{margin-right:4px;color:var(--vft-danger-color)}.vft-super-form .vft-date-editor.vft-input__wrapper{width:100%}
+.vft-super-form__container{display:flex;width:100%}.vft-super-form__content{display:flex;flex:1;line-height:1}.vft-super-form__item .sub-label{color:var(--vft-text-placeholder-color);font-size:12px}.vft-super-form.is-suffix--suffix{display:inline-flex;align-items:center;padding-left:6px;line-height:1}.vft-super-form .is-comp-full-width .vft-select{width:100%}.vft-super-form .submit-block{width:100%}.vft-super-form .label-required{margin-right:4px;color:var(--vft-danger-color)}.vft-super-form .vft-date-editor.vft-input__wrapper,.vft-super-form .vft-upload-wrapper{width:100%}.vft-super-form .icon-arrow-upload{width:1em;height:1em;background-color:currentcolor;-webkit-mask:url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="1024" height="1024" viewBox="0 0 1024 1024"%3E%3Cpath fill="currentColor" d="M160 832h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64zm384-578.304V704h-64V247.296L237.248 490.048L192 444.8L508.8 128l316.8 316.8l-45.312 45.248L544 253.696z"%2F%3E%3C%2Fsvg%3E') no-repeat;mask:url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="1024" height="1024" viewBox="0 0 1024 1024"%3E%3Cpath fill="currentColor" d="M160 832h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64zm384-578.304V704h-64V247.296L237.248 490.048L192 444.8L508.8 128l316.8 316.8l-45.312 45.248L544 253.696z"%2F%3E%3C%2Fsvg%3E') no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}

package/web-types.json

@@ -1 +1 @@
-{"$schema":"http://json.schemastore.org/web-types","framework":"vue","name":"vft","version":"0.0.316","js-types-syntax":"typescript","description-markup":"markdown","contributions":{"html":{}}}
+{"$schema":"http://json.schemastore.org/web-types","framework":"vue","name":"vft","version":"0.0.319","js-types-syntax":"typescript","description-markup":"markdown","contributions":{"html":{}}}