vft 0.0.127 → 0.0.129

package/theme-style/src/backtop.scss

@@ -30,4 +30,8 @@ $name: backtop;
   @include e(icon) {
     font-size: 20px;
   }
+
+  .icon-back-top {
+    @include icon-common($icon-back-top)
+  }
 }

package/theme-style/src/button.scss

@@ -308,4 +308,8 @@ $button-icon-span-gap: map.merge(
       }
     }
   }
+
+  .icon-loading {
+    @include icon-common($icon-loading)
+  }
 }

package/theme-style/src/color-picker.scss

@@ -365,6 +365,9 @@ $color-picker-size: map.merge($common-component-size, $color-picker-size);
       border: 1px solid getCssVar('border-color-lighter');
     }
   }
+
+  @include icon-arrow-down;
+  @include icon-circle-close
 }
 
 .#{bem('color-picker')},

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

@@ -0,0 +1,65 @@
+$icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';
+$icon-arrow-left: '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="M609.408 149.376L277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0a30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688a29.12 29.12 0 0 0-41.728 0z"%2F%3E%3C%2Fsvg%3E';
+$icon-d-arrow-left: '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="M529.408 149.376a29.12 29.12 0 0 1 41.728 0a30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264a29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0a30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264a29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"%2F%3E%3C%2Fsvg%3E';
+$icon-arrow-right: '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="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512L340.864 831.872a30.592 30.592 0 0 0 0 42.752a29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"%2F%3E%3C%2Fsvg%3E';
+$icon-d-arrow-right: '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="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0a30.592 30.592 0 0 1 0-42.752L764.736 512L452.864 192a30.592 30.592 0 0 1 0-42.688zm-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0a30.592 30.592 0 0 1 0-42.752L508.736 512L196.864 192a30.592 30.592 0 0 1 0-42.688z"%2F%3E%3C%2Fsvg%3E';
+$icon-arrow-up: '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="m488.832 344.32l-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872l319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0z"%2F%3E%3C%2Fsvg%3E';
+$icon-back: '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="M224 480h640a32 32 0 1 1 0 64H224a32 32 0 0 1 0-64z"%2F%3E%3Cpath fill="currentColor" d="m237.248 512l265.408 265.344a32 32 0 0 1-45.312 45.312l-288-288a32 32 0 0 1 0-45.312l288-288a32 32 0 1 1 45.312 45.312L237.248 512z"%2F%3E%3C%2Fsvg%3E';
+$icon-caret-right: '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="M384 192v640l384-320.064z"%2F%3E%3C%2Fsvg%3E';
+$icon-check: '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="M406.656 706.944L195.84 496.256a32 32 0 1 0-45.248 45.248l256 256l512-512a32 32 0 0 0-45.248-45.248L406.592 706.944z"%2F%3E%3C%2Fsvg%3E';
+$icon-circle-check: '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="M512 896a384 384 0 1 0 0-768a384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896a448 448 0 0 1 0 896z"%2F%3E%3Cpath fill="currentColor" d="M745.344 361.344a32 32 0 0 1 45.312 45.312l-288 288a32 32 0 0 1-45.312 0l-160-160a32 32 0 1 1 45.312-45.312L480 626.752l265.344-265.408z"%2F%3E%3C%2Fsvg%3E';
+$icon-circle-close: '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="m466.752 512l-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248L466.752 512z"%2F%3E%3Cpath fill="currentColor" d="M512 896a384 384 0 1 0 0-768a384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896a448 448 0 0 1 0 896z"%2F%3E%3C%2Fsvg%3E';
+$icon-circle-close-filled: '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="M512 64a448 448 0 1 1 0 896a448 448 0 0 1 0-896zm0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512L353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336L616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512L670.4 407.936a38.4 38.4 0 1 0-54.336-54.336L512 457.664z"%2F%3E%3C%2Fsvg%3E';
+$icon-circle-plus: '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="M352 480h320a32 32 0 1 1 0 64H352a32 32 0 0 1 0-64z"%2F%3E%3Cpath fill="currentColor" d="M480 672V352a32 32 0 1 1 64 0v320a32 32 0 0 1-64 0z"%2F%3E%3Cpath fill="currentColor" d="M512 896a384 384 0 1 0 0-768a384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896a448 448 0 0 1 0 896z"%2F%3E%3C%2Fsvg%3E';
+$icon-close: '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="M764.288 214.592L512 466.88L259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512L214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z"%2F%3E%3C%2Fsvg%3E';
+$icon-full-screen: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="15" height="15" viewBox="0 0 15 15"%3E%3Cpath fill="currentColor" fill-rule="evenodd" d="M2 2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1H3v2.5a.5.5 0 0 1-1 0v-3Zm7 0a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0V3H9.5a.5.5 0 0 1-.5-.5ZM2.5 9a.5.5 0 0 1 .5.5V12h2.5a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5v-3a.5.5 0 0 1 .5-.5Zm10 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1 0-1H12V9.5a.5.5 0 0 1 .5-.5Z" clip-rule="evenodd"%2F%3E%3C%2Fsvg%3E';
+$icon-exit-full-screen: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="15" height="15" viewBox="0 0 15 15"%3E%3Cpath fill="currentColor" fill-rule="evenodd" d="M5.5 2a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1 0-1H5V2.5a.5.5 0 0 1 .5-.5Zm4 0a.5.5 0 0 1 .5.5V5h2.5a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5v-3a.5.5 0 0 1 .5-.5ZM2 9.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0V10H2.5a.5.5 0 0 1-.5-.5Zm7 0a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1H10v2.5a.5.5 0 0 1-1 0v-3Z" clip-rule="evenodd"%2F%3E%3C%2Fsvg%3E';
+$icon-question-filled: '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="M512 64a448 448 0 1 1 0 896a448 448 0 0 1 0-896zm23.744 191.488c-52.096 0-92.928 14.784-123.2 44.352c-30.976 29.568-45.76 70.4-45.76 122.496h80.256c0-29.568 5.632-52.8 17.6-68.992c13.376-19.712 35.2-28.864 66.176-28.864c23.936 0 42.944 6.336 56.32 19.712c12.672 13.376 19.712 31.68 19.712 54.912c0 17.6-6.336 34.496-19.008 49.984l-8.448 9.856c-45.76 40.832-73.216 70.4-82.368 89.408c-9.856 19.008-14.08 42.24-14.08 68.992v9.856h80.96v-9.856c0-16.896 3.52-31.68 10.56-45.76c6.336-12.672 15.488-24.64 28.16-35.2c33.792-29.568 54.208-48.576 60.544-55.616c16.896-22.528 26.048-51.392 26.048-86.592c0-42.944-14.08-76.736-42.24-101.376c-28.16-25.344-65.472-37.312-111.232-37.312zm-12.672 406.208a54.272 54.272 0 0 0-38.72 14.784a49.408 49.408 0 0 0-15.488 38.016c0 15.488 4.928 28.16 15.488 38.016A54.848 54.848 0 0 0 523.072 768c15.488 0 28.16-4.928 38.72-14.784a51.52 51.52 0 0 0 16.192-38.72a51.968 51.968 0 0 0-15.488-38.016a55.936 55.936 0 0 0-39.424-14.784z"%2F%3E%3C%2Fsvg%3E';
+$icon-info-filled: '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="M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296c-44.096 0-108.992 44.736-148.48 101.504c0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04c67.84 0 107.904-43.648 147.456-100.416z"%2F%3E%3C%2Fsvg%3E';
+$icon-loading: '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="M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32zm0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32zm448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32zm-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32zM195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248zm452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248zM828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0zm-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0z"%2F%3E%3C%2Fsvg%3E';
+$icon-plus: '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="M480 480V128a32 32 0 0 1 64 0v352h352a32 32 0 1 1 0 64H544v352a32 32 0 1 1-64 0V544H128a32 32 0 0 1 0-64h352z"%2F%3E%3C%2Fsvg%3E';
+$icon-refresh: '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="M771.776 794.88A384 384 0 0 1 128 512h64a320 320 0 0 0 555.712 216.448H654.72a32 32 0 1 1 0-64h149.056a32 32 0 0 1 32 32v148.928a32 32 0 1 1-64 0v-50.56zM276.288 295.616h92.992a32 32 0 0 1 0 64H220.16a32 32 0 0 1-32-32V178.56a32 32 0 0 1 64 0v50.56A384 384 0 0 1 896.128 512h-64a320 320 0 0 0-555.776-216.384z"%2F%3E%3C%2Fsvg%3E';
+$icon-refresh-left: '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="M289.088 296.704h92.992a32 32 0 0 1 0 64H232.96a32 32 0 0 1-32-32V179.712a32 32 0 0 1 64 0v50.56a384 384 0 0 1 643.84 282.88a384 384 0 0 1-383.936 384a384 384 0 0 1-384-384h64a320 320 0 1 0 640 0a320 320 0 0 0-555.712-216.448z"%2F%3E%3C%2Fsvg%3E';
+$icon-refresh-right: '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="M784.512 230.272v-50.56a32 32 0 1 1 64 0v149.056a32 32 0 0 1-32 32H667.52a32 32 0 1 1 0-64h92.992A320 320 0 1 0 524.8 833.152a320 320 0 0 0 320-320h64a384 384 0 0 1-384 384a384 384 0 0 1-384-384a384 384 0 0 1 643.712-282.88z"%2F%3E%3C%2Fsvg%3E';
+$icon-upload: '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';
+$icon-search: '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="m795.904 750.72l124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704a352 352 0 0 0 0 704z"%2F%3E%3C%2Fsvg%3E';
+$icon-back-top: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M6 4h12v2H6zm.707 11.707L11 11.414V20h2v-8.586l4.293 4.293l1.414-1.414L12 7.586l-6.707 6.707z"%2F%3E%3C%2Fsvg%3E';
+$icon-zoom-in: '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="m795.904 750.72l124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704a352 352 0 0 0 0 704zm-32-384v-96a32 32 0 0 1 64 0v96h96a32 32 0 0 1 0 64h-96v96a32 32 0 0 1-64 0v-96h-96a32 32 0 0 1 0-64h96z"%2F%3E%3C%2Fsvg%3E';
+$icon-zoom-out: '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="m795.904 750.72l124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704a352 352 0 0 0 0 704zM352 448h256a32 32 0 0 1 0 64H352a32 32 0 0 1 0-64z"%2F%3E%3C%2Fsvg%3E';
+$icon-scale-to-original: '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="M813.176 180.706a60.235 60.235 0 0 1 60.236 60.235v481.883a60.235 60.235 0 0 1-60.236 60.235H210.824a60.235 60.235 0 0 1-60.236-60.235V240.94a60.235 60.235 0 0 1 60.236-60.235h602.352zm0-60.235H210.824A120.47 120.47 0 0 0 90.353 240.94v481.883a120.47 120.47 0 0 0 120.47 120.47h602.353a120.47 120.47 0 0 0 120.471-120.47V240.94a120.47 120.47 0 0 0-120.47-120.47zm-120.47 180.705a30.118 30.118 0 0 0-30.118 30.118v301.177a30.118 30.118 0 0 0 60.236 0V331.294a30.118 30.118 0 0 0-30.118-30.118zm-361.412 0a30.118 30.118 0 0 0-30.118 30.118v301.177a30.118 30.118 0 1 0 60.236 0V331.294a30.118 30.118 0 0 0-30.118-30.118zM512 361.412a30.118 30.118 0 0 0-30.118 30.117v30.118a30.118 30.118 0 0 0 60.236 0V391.53A30.118 30.118 0 0 0 512 361.412zM512 512a30.118 30.118 0 0 0-30.118 30.118v30.117a30.118 30.118 0 0 0 60.236 0v-30.117A30.118 30.118 0 0 0 512 512z"%2F%3E%3C%2Fsvg%3E';
+$icon-minus: '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="M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z"%2F%3E%3C%2Fsvg%3E';
+$icon-hide: '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="M876.8 156.8c0-9.6-3.2-16-9.6-22.4c-6.4-6.4-12.8-9.6-22.4-9.6c-9.6 0-16 3.2-22.4 9.6L736 220.8c-64-32-137.6-51.2-224-60.8c-160 16-288 73.6-377.6 176C44.8 438.4 0 496 0 512s48 73.6 134.4 176c22.4 25.6 44.8 48 73.6 67.2l-86.4 89.6c-6.4 6.4-9.6 12.8-9.6 22.4c0 9.6 3.2 16 9.6 22.4c6.4 6.4 12.8 9.6 22.4 9.6c9.6 0 16-3.2 22.4-9.6l704-710.4c3.2-6.4 6.4-12.8 6.4-22.4Zm-646.4 528c-76.8-70.4-128-128-153.6-172.8c28.8-48 80-105.6 153.6-172.8C304 272 400 230.4 512 224c64 3.2 124.8 19.2 176 44.8l-54.4 54.4C598.4 300.8 560 288 512 288c-64 0-115.2 22.4-160 64s-64 96-64 160c0 48 12.8 89.6 35.2 124.8L256 707.2c-9.6-6.4-19.2-16-25.6-22.4Zm140.8-96c-12.8-22.4-19.2-48-19.2-76.8c0-44.8 16-83.2 48-112c32-28.8 67.2-48 112-48c28.8 0 54.4 6.4 73.6 19.2L371.2 588.8ZM889.599 336c-12.8-16-28.8-28.8-41.6-41.6l-48 48c73.6 67.2 124.8 124.8 150.4 169.6c-28.8 48-80 105.6-153.6 172.8c-73.6 67.2-172.8 108.8-284.8 115.2c-51.2-3.2-99.2-12.8-140.8-28.8l-48 48c57.6 22.4 118.4 38.4 188.8 44.8c160-16 288-73.6 377.6-176C979.199 585.6 1024 528 1024 512s-48.001-73.6-134.401-176Z"%2F%3E%3Cpath fill="currentColor" d="M511.998 672c-12.8 0-25.6-3.2-38.4-6.4l-51.2 51.2c28.8 12.8 57.6 19.2 89.6 19.2c64 0 115.2-22.4 160-64c41.6-41.6 64-96 64-160c0-32-6.4-64-19.2-89.6l-51.2 51.2c3.2 12.8 6.4 25.6 6.4 38.4c0 44.8-16 83.2-48 112c-32 28.8-67.2 48-112 48Z"%2F%3E%3C%2Fsvg%3E';
+$icon-view: '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="M512 160c320 0 512 352 512 352S832 864 512 864S0 512 0 512s192-352 512-352zm0 64c-225.28 0-384.128 208.064-436.8 288c52.608 79.872 211.456 288 436.8 288c225.28 0 384.128-208.064 436.8-288c-52.608-79.872-211.456-288-436.8-288zm0 64a224 224 0 1 1 0 448a224 224 0 0 1 0-448zm0 64a160.192 160.192 0 0 0-160 160c0 88.192 71.744 160 160 160s160-71.808 160-160s-71.744-160-160-160z"%2F%3E%3C%2Fsvg%3E';
+$icon-delete: '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 256H96a32 32 0 0 1 0-64h256V95.936a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32V192h256a32 32 0 1 1 0 64h-64v672a32 32 0 0 1-32 32H192a32 32 0 0 1-32-32V256zm448-64v-64H416v64h192zM224 896h576V256H224v640zm192-128a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32zm192 0a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32z"%2F%3E%3C%2Fsvg%3E';
+$icon-menu: '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 448a32 32 0 0 1-32-32V160.064a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32V416a32 32 0 0 1-32 32H160zm448 0a32 32 0 0 1-32-32V160.064a32 32 0 0 1 32-32h255.936a32 32 0 0 1 32 32V416a32 32 0 0 1-32 32H608zM160 896a32 32 0 0 1-32-32V608a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32v256a32 32 0 0 1-32 32H160zm448 0a32 32 0 0 1-32-32V608a32 32 0 0 1 32-32h255.936a32 32 0 0 1 32 32v256a32 32 0 0 1-32 32H608z"%2F%3E%3C%2Fsvg%3E';
+$icon-menu-line: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="none" stroke="currentColor" stroke-dasharray="24" stroke-dashoffset="24" stroke-linecap="round" stroke-width="2"%3E%3Cpath d="M5 5H19"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" dur="0.2s" values="24%3B0"%2F%3E%3C%2Fpath%3E%3Cpath d="M5 12H19"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" begin="0.2s" dur="0.2s" values="24%3B0"%2F%3E%3C%2Fpath%3E%3Cpath d="M5 19H19"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" begin="0.4s" dur="0.2s" values="24%3B0"%2F%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E';
+$icon-document: '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="M832 384H576V128H192v768h640V384zm-26.496-64L640 154.496V320h165.504zM160 64h480l256 256v608a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V96a32 32 0 0 1 32-32zm160 448h384v64H320v-64zm0-192h160v64H320v-64zm0 384h384v64H320v-64z"%2F%3E%3C%2Fsvg%3E';
+$icon-calendar: '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="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64H128zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0v32zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64zm0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64zm192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64zm0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64zm192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64zm0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64z"%2F%3E%3C%2Fsvg%3E';
+$icon-clock: '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="M512 896a384 384 0 1 0 0-768a384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896a448 448 0 0 1 0 896z"%2F%3E%3Cpath fill="currentColor" d="M480 256a32 32 0 0 1 32 32v256a32 32 0 0 1-64 0V288a32 32 0 0 1 32-32z"%2F%3E%3Cpath fill="currentColor" d="M480 512h256q32 0 32 32t-32 32H480q-32 0-32-32t32-32z"%2F%3E%3C%2Fsvg%3E';
+$icon-category: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M10 3H4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4a1 1 0 0 0-1-1zM9 9H5V5h4v4zm11-6h-6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4a1 1 0 0 0-1-1zm-1 6h-4V5h4v4zm-9 4H4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1v-6a1 1 0 0 0-1-1zm-1 6H5v-4h4v4zm8-6c-2.206 0-4 1.794-4 4s1.794 4 4 4s4-1.794 4-4s-1.794-4-4-4zm0 6c-1.103 0-2-.897-2-2s.897-2 2-2s2 .897 2 2s-.897 2-2 2z"%2F%3E%3C%2Fsvg%3E';
+$icon-picture-filled: '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="M96 896a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h832a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H96zm315.52-228.48l-68.928-68.928a32 32 0 0 0-45.248 0L128 768.064h778.688l-242.112-290.56a32 32 0 0 0-49.216 0L458.752 665.408a32 32 0 0 1-47.232 2.112zM256 384a96 96 0 1 0 192.064-.064A96 96 0 0 0 256 384z"%2F%3E%3C%2Fsvg%3E';
+$icon-date: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="20" height="20" viewBox="0 0 20 20"%3E%3Cpath fill="currentColor" d="M5.673 0a.7.7 0 0 1 .7.7v1.309h7.517v-1.3a.7.7 0 0 1 1.4 0v1.3H18a2 2 0 0 1 2 1.999v13.993A2 2 0 0 1 18 20H2a2 2 0 0 1-2-1.999V4.008a2 2 0 0 1 2-1.999h2.973V.699a.7.7 0 0 1 .7-.699ZM1.4 7.742v10.259a.6.6 0 0 0 .6.6h16a.6.6 0 0 0 .6-.6V7.756L1.4 7.742Zm5.267 6.877v1.666H5v-1.666h1.667Zm4.166 0v1.666H9.167v-1.666h1.666Zm4.167 0v1.666h-1.667v-1.666H15Zm-8.333-3.977v1.666H5v-1.666h1.667Zm4.166 0v1.666H9.167v-1.666h1.666Zm4.167 0v1.666h-1.667v-1.666H15ZM4.973 3.408H2a.6.6 0 0 0-.6.6v2.335l17.2.014V4.008a.6.6 0 0 0-.6-.6h-2.71v.929a.7.7 0 0 1-1.4 0v-.929H6.373v.92a.7.7 0 0 1-1.4 0v-.92Z"%2F%3E%3C%2Fsvg%3E';
+$icon-reading: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="48" height="48" viewBox="0 0 48 48"%3E%3Cpath fill="%235C6BC0" d="M40 40c-6.9 0-16 4-16 4V22s9-4 18-4l-2 22z"%2F%3E%3Cpath fill="%237986CB" d="M8 40c6.9 0 16 4 16 4V22s-9-4-18-4l2 22z"%2F%3E%3Cg fill="%23FFB74D"%3E%3Ccircle cx="24" cy="12" r="8"%2F%3E%3Cpath d="M41 32h1c.6 0 1-.4 1-1v-4c0-.6-.4-1-1-1h-1c-1.7 0-3 1.3-3 3s1.3 3 3 3zM7 26H6c-.6 0-1 .4-1 1v4c0 .6.4 1 1 1h1c1.7 0 3-1.3 3-3s-1.3-3-3-3z"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E';
+$icon-jsfiddle: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="32" height="32" viewBox="0 0 32 32"%3E%3Cpath fill="currentColor" d="M28.104 15a6.49 6.49 0 0 0 .027-.557c0-5.177-4.256-9.375-9.511-9.375a9.513 9.513 0 0 0-8.589 5.344a4.388 4.388 0 0 0-2.676-.907c-2.428 0-4.391 1.932-4.391 4.317c0 .453.067.885.197 1.292A6.31 6.31 0 0 0 0 20.573c0 3.468 2.833 6.287 6.344 6.339h19c.12 0 .24.02.359.02c3.48 0 6.303-2.776 6.303-6.219A6.214 6.214 0 0 0 28.126 15zM8.588 22.136c-.64-.579-1.041-1.276-1.197-2.105a4.481 4.481 0 0 1-.084-.869c0-1.183.433-2.151 1.292-2.916c.86-.772 1.948-1.157 3.271-1.157c1.36 0 2.641.511 3.776 1.532c.281.249.557.536.819.853l1.453 1.715c.255.343.52.635.801.891c.751.671 1.563 1.009 2.251 1.009c.583 0 1.067-.181 1.457-.536c.328-.307.537-.719.579-1.167l.011-.197c0-.188-.032-.376-.089-.552a2.034 2.034 0 0 0-1.973-1.339c-.724 0-1.443.244-2.235 1.009l-1.287-1.52l-.14-.172c1.14-1.104 2.26-1.521 3.781-1.521c1.339 0 2.437.38 3.249 1.141l.027.02c.859.761 1.276 1.74 1.276 2.943c0 .281-.021.584-.079.839c-.161.824-.563 1.5-1.183 2.084a4.312 4.312 0 0 1-2.276 1.077a6.538 6.538 0 0 1-.943.057c-1.375 0-2.676-.5-3.776-1.495a8.493 8.493 0 0 1-.859-.921l-1.459-1.699a5.352 5.352 0 0 0-.781-.9c-.74-.677-1.557-1-2.276-1c-.208 0-.416.031-.62.083c-.312.079-.604.24-.839.459a1.828 1.828 0 0 0-.583 1.344c0 .515.183.957.563 1.312l.02.027c.401.359.901.536 1.48.536c.739 0 1.457-.26 2.235-1.021l1.28 1.5l.141.161c-1.161 1.12-2.276 1.537-3.74 1.537c-1.339 0-2.437-.38-3.276-1.141z"%2F%3E%3C%2Fsvg%3E';
+$icon-expand-alt: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M5 12H3v9h9v-2H5zm7-7h7v7h2V3h-9z"%2F%3E%3C%2Fsvg%3E';
+$icon-collapse-alt: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M2 15h7v7h2v-9H2v2zM15 2h-2v9h9V9h-7V2z"%2F%3E%3C%2Fsvg%3E';
+$icon-codepen: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="m8.21 12l-1.33.89v-1.78l1.33.89m3.26-2.18V7.34l-4.16 2.78l1.85 1.24l2.31-1.54m5.23.3l-4.17-2.78v2.48l2.31 1.54l1.86-1.24m-9.39 3.76l4.16 2.78v-2.48l-2.31-1.54l-1.85 1.24m5.22.3v2.48l4.17-2.78l-1.86-1.24l-2.31 1.54M12 10.74L10.12 12L12 13.26L13.88 12L12 10.74M22 12c0 5.5-4.5 10-10 10S2 17.5 2 12S6.5 2 12 2s10 4.5 10 10m-3.82-1.88v-.07l-.01-.05l-.01-.05c-.01-.01-.01-.02-.02-.04l-.01-.02l-.02-.04l-.01-.02l-.02-.03l-.02-.03l-.03-.03l-.03-.02V9.7l-.04-.02l-.01-.01l-5.65-3.76a.528.528 0 0 0-.59 0L6.05 9.67v.01L6 9.7v.02l-.03.02l-.03.03l-.01.03l-.03.03l-.01.02l-.02.04l-.01.02l-.02.04V10h-.01l-.01.05v3.9l.01.05h.01v.05c.01.01.01.02.02.04l.01.02l.02.04l.01.02l.02.03l.02.03l.03.03l.03.02v.02l.04.02l.01.01l5.66 3.77c.08.06.19.08.29.08c.1 0 .21-.03.3-.08l5.65-3.77l.01-.01l.04-.02v-.02l.03-.02l.03-.03l.02-.03l.02-.03l.01-.02l.02-.04l.01-.02l.02-.04V14h.01l.01-.05v-3.83m-1.06 2.77v-1.78l-1.33.89l1.33.89Z"%2F%3E%3C%2Fsvg%3E';
+$icon-new-tab: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="32" height="32" viewBox="0 0 32 32"%3E%3Cdefs%3E%3Cpath id="carbonNewTab0" fill="currentColor" d="M26 26H6V6h10V4H6a2.002 2.002 0 0 0-2 2v20a2.002 2.002 0 0 0 2 2h20a2.002 2.002 0 0 0 2-2V16h-2Z"%2F%3E%3C%2Fdefs%3E%3Cuse href="%23carbonNewTab0"%2F%3E%3Cuse href="%23carbonNewTab0"%2F%3E%3Cpath fill="currentColor" d="M26 6V2h-2v4h-4v2h4v4h2V8h4V6h-4z"%2F%3E%3C%2Fsvg%3E';
+$icon-close-tab: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="20" height="20" viewBox="0 0 20 20"%3E%3Cpath fill="currentColor" d="M10 8.586L2.929 1.515L1.515 2.929L8.586 10l-7.071 7.071l1.414 1.414L10 11.414l7.071 7.071l1.414-1.414L11.414 10l7.071-7.071l-1.414-1.414L10 8.586z"%2F%3E%3C%2Fsvg%3E';
+$icon-arrow-close-left: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"%3E%3Cpath stroke-dasharray="20" stroke-dashoffset="20" d="M3 3V21"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" dur="0.3s" values="20%3B0"%2F%3E%3C%2Fpath%3E%3Cpath stroke-dasharray="15" stroke-dashoffset="15" d="M21 12H7.5"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" begin="0.4s" dur="0.2s" values="15%3B0"%2F%3E%3C%2Fpath%3E%3Cpath stroke-dasharray="12" stroke-dashoffset="12" d="M7 12L14 19M7 12L14 5"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" begin="0.6s" dur="0.2s" values="12%3B0"%2F%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E';
+$icon-arrow-close-right: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg transform="translate(24 0) scale(-1 1)"%3E%3Cg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"%3E%3Cpath stroke-dasharray="20" stroke-dashoffset="20" d="M3 3V21"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" dur="0.3s" values="20%3B0"%2F%3E%3C%2Fpath%3E%3Cpath stroke-dasharray="15" stroke-dashoffset="15" d="M21 12H7.5"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" begin="0.4s" dur="0.2s" values="15%3B0"%2F%3E%3C%2Fpath%3E%3Cpath stroke-dasharray="12" stroke-dashoffset="12" d="M7 12L14 19M7 12L14 5"%3E%3Canimate fill="freeze" attributeName="stroke-dashoffset" begin="0.6s" dur="0.2s" values="12%3B0"%2F%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E';
+$icon-close-box-multiple-outline: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M20 2H8c-1.1 0-2 .9-2 2v12a2 2 0 0 0 2 2h12c1.11 0 2-.89 2-2V4a2 2 0 0 0-2-2m0 14H8V4h12v12M4 6v14h14v2H4a2 2 0 0 1-2-2V6h2m5.77 6.84L12.6 10L9.77 7.15l1.4-1.4L14 8.6l2.84-2.83l1.4 1.4L15.4 10l2.83 2.84l-1.4 1.4L14 11.4l-2.83 2.84l-1.4-1.4Z"%2F%3E%3C%2Fsvg%3E';
+$icon-vector-square-delete: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M13 19c0-.3 0-.7.1-1H8v-2H6V8h2V6h8v2h2v5.1c.3-.1.7-.1 1-.1c.3 0 .7 0 1 .1V8h2V2h-6v2H8V2H2v6h2v8H2v6h6v-2h5.1c-.1-.3-.1-.7-.1-1m5-15h2v2h-2V4M4 4h2v2H4V4m2 16H4v-2h2v2m16.5-3.1L20.4 19l2.1 2.1l-1.4 1.4l-2.1-2.1l-2.1 2.1l-1.4-1.4l2.1-2.1l-2.1-2.1l1.4-1.4l2.1 2.1l2.1-2.1l1.4 1.4Z"%2F%3E%3C%2Fsvg%3E';
+$icon-more-filled: '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="M176 416a112 112 0 1 1 0 224a112 112 0 0 1 0-224zm336 0a112 112 0 1 1 0 224a112 112 0 0 1 0-224zm336 0a112 112 0 1 1 0 224a112 112 0 0 1 0-224z"%2F%3E%3C%2Fsvg%3E';
+$icon-sidebar-collapse: 'data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"%3E%3Cpath d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2Z"%2F%3E%3Cpath d="M7.25 10L5.5 12l1.75 2m2.25 7V3"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E';
+// status
+$icon-warning: '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="M512 64a448 448 0 1 1 0 896a448 448 0 0 1 0-896zm0 832a384 384 0 0 0 0-768a384 384 0 0 0 0 768zm48-176a48 48 0 1 1-96 0a48 48 0 0 1 96 0zm-48-464a32 32 0 0 1 32 32v288a32 32 0 0 1-64 0V288a32 32 0 0 1 32-32z"%2F%3E%3C%2Fsvg%3E';
+$icon-warning-filled: '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="M512 64a448 448 0 1 1 0 896a448 448 0 0 1 0-896zm0 192a58.432 58.432 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.432 58.432 0 0 0 512 256zm0 512a51.2 51.2 0 1 0 0-102.4a51.2 51.2 0 0 0 0 102.4z"%2F%3E%3C%2Fsvg%3E';
+$icon-success-filled: '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="M512 64a448 448 0 1 1 0 896a448 448 0 0 1 0-896zm-55.808 536.384l-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"%2F%3E%3C%2Fsvg%3E';
+//
+// $icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';
+// $icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';
+// $icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';
+// $icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';
+// $icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';
+// $icon-arrow-down: '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="M831.872 340.864L512 652.672L192.128 340.864a30.592 30.592 0 0 0-42.752 0a29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728a30.592 30.592 0 0 0-42.752 0z"%2F%3E%3C%2Fsvg%3E';

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

@@ -2,6 +2,7 @@
 @use "sass:map";
 
 @use "../mixins/function.scss" as *;
+@forward "./icon.scss";
 
 // types
 $types: primary, success, warning, danger, error, info;
@@ -43,6 +44,8 @@ $danger-color: getCssVar("danger-color") !default;
 $error-color: getCssVar("error-color") !default;
 $info-color: getCssVar("info-color") !default;
 
+
+
 // 将颜色与黑白混合以生成明暗级别
 @mixin set-color-mix-level(
   $type,
@@ -1575,3 +1578,4 @@ $table: map.merge((
   'row-hover-bg-color': #ebf0fc,
   'border-fixed': 1px solid rgb(232, 236, 244),
 ), $table);
+

package/theme-style/src/date-picker/date-picker.scss

@@ -107,4 +107,18 @@
   .#{$namespace}-time-panel {
     position: absolute;
   }
+
+
+  .icon-d-arrow-left {
+    @include icon-common($icon-d-arrow-left)
+  }
+  .icon-arrow-left {
+    @include icon-common($icon-arrow-left)
+  }
+  .icon-arrow-right {
+    @include icon-common($icon-arrow-right)
+  }
+  .icon-d-arrow-right {
+    @include icon-common($icon-d-arrow-right)
+  }
 }

package/theme-style/src/date-picker/time-picker.scss

@@ -87,4 +87,8 @@
       );
     }
   }
+
+  @include icon-arrow-up;
+  @include icon-arrow-down;
+  @include icon-circle-close;
 }

package/theme-style/src/date-picker.scss

@@ -7,3 +7,4 @@
 @forward './date-picker/date-range-picker.scss';
 @forward './date-picker/time-range-picker.scss';
 @forward './date-picker/time-picker.scss';
+

package/theme-style/src/date-time-select.scss

@@ -76,7 +76,6 @@ $name: date-time-select;
 
         @include when(active) {
           color: getCssVar('primary-color');
-
         }
       }
     }
@@ -99,6 +98,14 @@ $name: date-time-select;
   .vft-scrollbar {
     overflow: visible;
   }
+
+  .icon-check {
+    @include icon-common($icon-check);
+  }
+
+  @include icon-arrow-down;
+  @include icon-circle-close;
+
   //.#{$namespace}-popper {
   //  padding-left: 16px;
   //  padding-top: 16px;

package/theme-style/src/dialog.scss

@@ -114,6 +114,8 @@ $name: dialog;
       text-align: inherit;
     }
   }
+
+  @include icon-close;
 }
 
 .#{$namespace}-overlay-dialog {

package/theme-style/src/drawer.scss

@@ -103,6 +103,8 @@ $directions: rtl, ltr, ttb, btt;
   &.btt {
     bottom: 0;
   }
+
+  @include icon-close;
 }
 
 .#{$namespace}-drawer-fade {

package/theme-style/src/dropdown.scss

@@ -132,6 +132,8 @@ $dropdown-divider-width: 1px !default;
       }
     }
   }
+
+  @include icon-arrow-down;
 }
 
 $dropdown-menu-padding-vertical: () !default;

package/theme-style/src/full-screen.scss

@@ -22,6 +22,13 @@ $name: full-screen;
 
   &:hover {
     color: getCompCssVar('hover-color');
-   
+  }
+
+  .icon-full-screen {
+    @include icon-common($icon-full-screen)
+  }
+
+  .icon-exit-full-screen {
+    @include icon-common($icon-exit-full-screen)
   }
 }

package/theme-style/src/icon-text.scss

@@ -26,4 +26,8 @@ $name: icon-text;
       color: getCssVarWithDefault(icon-hover-color, getCompCssVar(color))
     }
   }
+
+  @include when(col) {
+    flex-direction: column;
+  }
 }

package/theme-style/src/image-viewer.scss

@@ -113,7 +113,25 @@
     background: #000;
   }
 
-
+  @include icon-close;
+  .icon-arrow-left {
+    @include icon-common($icon-arrow-left)
+  }
+  .icon-zoom-out {
+    @include icon-common($icon-zoom-out)
+  }
+  .icon-zoom-in {
+    @include icon-common($icon-zoom-in)
+  }
+  .icon-scale-to-original {
+    @include icon-common($icon-scale-to-original)
+  }
+  .icon-refresh-left {
+    @include icon-common($icon-refresh-left)
+  }
+  .icon-refresh-right {
+    @include icon-common($icon-refresh-right)
+  }
 }
 
 .viewer-fade-enter-active {

package/theme-style/src/input-number.scss

@@ -172,4 +172,13 @@
       }
     }
   }
+
+  .icon-minus {
+    @include icon-common($icon-minus)
+  }
+  .icon-plus {
+    @include icon-common($icon-plus)
+  }
+  @include icon-arrow-down;
+  @include icon-arrow-up;
 }

package/theme-style/src/input.scss

@@ -230,6 +230,26 @@ $name: input;
       }
     }
   }
+
+  .icon-search {
+    @include icon-common($icon-search)
+  }
+  .icon-hide {
+    @include icon-common($icon-hide)
+  }
+  .icon-view {
+    @include icon-common($icon-view)
+  }
+  .icon-loading {
+    @include icon-common($icon-loading)
+  }
+  .icon-circle-check {
+    @include icon-common($icon-circle-check)
+  }
+  .icon-circle-close {
+    @include icon-common($icon-circle-close)
+  }
+  @include icon-close;
 }
 
 @include b(input-group) {
@@ -382,6 +402,7 @@ $name: input;
       }
     }
   }
+
 }
 
 @include b(textarea) {
@@ -466,4 +487,5 @@ $name: input;
       color: getCssVar('danger-color');
     }
   }
+
 }

package/theme-style/src/list-cell.scss

@@ -52,4 +52,6 @@ $name: list-cell;
     }
   }
 
+  @include icon-arrow-right;
+
 }

package/theme-style/src/md-container.scss

@@ -169,4 +169,32 @@ $name: md-container;
     max-width: getCompCssVar('content-max-width');
     min-width: 300px;
   }
+
+  .icon-reading {
+    @include icon-common($icon-reading)
+  }
+  .icon-category {
+    @include icon-common($icon-category)
+  }
+  .icon-date {
+    @include icon-common($icon-date)
+  }
+  .icon-jsfiddle {
+    @include icon-common($icon-jsfiddle)
+  }
+  .icon-codepen {
+    @include icon-common($icon-codepen)
+  }
+  .icon-expand-alt {
+    @include icon-common($icon-expand-alt)
+  }
+  .icon-collapse-alt {
+    @include icon-common($icon-collapse-alt)
+  }
+  .icon-clock {
+    @include icon-common($icon-clock)
+  }
+  .icon-calendar {
+    @include icon-common($icon-calendar)
+  }
 }

package/theme-style/src/menu.scss

@@ -134,7 +134,7 @@ $name: menu;
       }
 
       &.is-active {
-        >.#{$namespace}-sub-menu__title {
+        > .#{$namespace}-sub-menu__title {
           border-bottom: getCompCssVar('item-active-border-bottom');;
           color: getCompCssVar('active-color');
 
@@ -167,7 +167,7 @@ $name: menu;
       }
 
       & .#{$namespace}-menu-item.is-active,
-      & .#{$namespace}-sub-menu.is-active >.#{$namespace}-sub-menu__title {
+      & .#{$namespace}-sub-menu.is-active > .#{$namespace}-sub-menu__title {
         color: getCompCssVar('active-color');
       }
     }
@@ -260,6 +260,13 @@ $name: menu;
   .#{$namespace}-icon {
     flex-shrink: 0;
   }
+
+  @include icon-arrow-left;
+  @include icon-arrow-right;
+
+  .icon-menu-line {
+    @include icon-common($icon-menu-line)
+  }
 }
 
 @include b(sub-menu) {
@@ -275,7 +282,7 @@ $name: menu;
       background-color: getCompCssVar('hover-bg-color');
 
       .vft-icon {
-        color: getCompCssVar('hover-text-color')!important;
+        color: getCompCssVar('hover-text-color') !important;
       }
     }
 
@@ -323,7 +330,7 @@ $name: menu;
     margin-right: getCompCssVar('icon-mr');
     text-align: center;
 
-    &.#{$namespace}-sub-menu__icon-more,&.#{$namespace}-sub-menu__icon-arrow {
+    &.#{$namespace}-sub-menu__icon-more, &.#{$namespace}-sub-menu__icon-arrow {
       margin-right: 0 !important;
     }
   }

package/theme-style/src/message.scss

@@ -100,6 +100,16 @@ $name: message;
       color: getCssVar('message', 'close-hover-color');
     }
   }
+
+  .icon-success-filled {
+    @include icon-common($icon-success-filled)
+  }
+
+  .icon-warning-filled {
+    @include icon-common($icon-warning-filled)
+  }
+  @include icon-circle-close-filled;
+  @include icon-circle-close;
 }
 
 .#{$namespace}-message-fade-enter-from,

package/theme-style/src/mixins/icon.scss

@@ -0,0 +1,52 @@
+@use '../common/icon' as *;
+
+@mixin icon-common($dataUrl) {
+  mask: url($dataUrl) no-repeat;
+  mask-size: 100% 100%;
+  background-color: currentColor;
+  color: var(--vft-icon-color);
+  width: 1em;
+  height: 1em;
+}
+
+@mixin icon-close {
+  .icon-close {
+    @include icon-common($icon-close)
+  }
+}
+
+@mixin icon-circle-close {
+  .icon-circle-close {
+    @include icon-common($icon-circle-close)
+  }
+}
+
+@mixin icon-circle-close-filled {
+  .icon-circle-close-filled {
+    @include icon-common($icon-circle-close-filled)
+  }
+}
+
+@mixin icon-arrow-down {
+  .icon-arrow-down {
+    @include icon-common($icon-arrow-down)
+  }
+}
+
+@mixin icon-arrow-left {
+  .icon-arrow-left {
+    @include icon-common($icon-arrow-left)
+  }
+}
+
+@mixin icon-arrow-right {
+  .icon-arrow-right {
+    @include icon-common($icon-arrow-right)
+  }
+}
+
+@mixin icon-arrow-up {
+  .icon-arrow-up {
+    @include icon-common($icon-arrow-up)
+  }
+}

package/theme-style/src/mixins/mixins.scss

@@ -4,6 +4,7 @@
 @forward 'config';
 @forward 'function';
 @forward 'var';
+@forward 'icon';
 @use 'config' as *;
 
 // Scrollbar

package/theme-style/src/multiple-tabs.scss

@@ -16,4 +16,26 @@ $name: multiple-tabs;
   @include e(title) {
     overflow: hidden;
   }
+
+  .icon-refresh-right {
+    @include icon-common($icon-refresh-right)
+  }
+  .icon-new-tab {
+    @include icon-common($icon-new-tab)
+  }
+  .icon-close-tab {
+    @include icon-common($icon-close-tab)
+  }
+  .icon-arrow-close-left {
+    @include icon-common($icon-arrow-close-left)
+  }
+  .icon-arrow-close-right {
+    @include icon-common($icon-arrow-close-right)
+  }
+  .icon-close-box-multiple-outline {
+    @include icon-common($icon-close-box-multiple-outline)
+  }
+  .icon-vector-square-delete {
+    @include icon-common($icon-vector-square-delete)
+  }
 }

package/theme-style/src/pagination.scss

@@ -101,6 +101,9 @@
 
   .btn-prev {
     margin-left: getCssVar('pagination-item-gap');
+    .ico-ep\:arrow-left {
+      @include icon-common($icon-arrow-left)
+    }
   }
 
   @include e(sizes) {
@@ -228,4 +231,16 @@
   li {
     @include pagination-button;
   }
+
+  .icon-d-arrow-left {
+    @include icon-common($icon-d-arrow-left)
+  }
+  .icon-d-arrow-right {
+    @include icon-common($icon-d-arrow-right)
+  }
+  .icon-more-filled {
+    @include icon-common($icon-more-filled)
+  }
+  @include icon-arrow-down;
+  @include icon-arrow-up;
 }

package/theme-style/src/popconfirm.scss

@@ -13,4 +13,8 @@
     text-align: right;
     margin-top: 8px;
   }
+
+  .icon-question-filled {
+    @include icon-common($icon-question-filled)
+  }
 }

package/theme-style/src/progress.scss

@@ -87,6 +87,22 @@
       color: getCssVar('danger-color');
     }
   }
+
+  .icon-warning-filled {
+    @include icon-common($icon-warning-filled)
+  }
+  .icon-circle-check {
+    @include icon-common($icon-circle-check)
+  }
+  .icon-circle-close {
+    @include icon-common($icon-circle-close)
+  }
+  .icon-check {
+    @include icon-common($icon-check)
+  }
+  .icon-close {
+    @include icon-common($icon-close)
+  }
 }
 
 @include b(progress-bar) {

package/theme-style/src/select.scss

@@ -340,4 +340,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
       height: 18px;
     }
   }
+
+  @include icon-arrow-up;
+  @include icon-circle-close;
 }