amis-rev-ui 6.13.0

package/scss/helper/border/_border-color.md

@@ -0,0 +1,109 @@
+---
+title: 边框颜色
+---
+
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| border-black | border-color: #000 |
+| border-white | border-color: #fff |
+| border-primary | border-color: #007bff |
+| border-secondary | border-color: #6c757d |
+| border-success | border-color: #28a745 |
+| border-info | border-color: #007bff |
+| border-warning | border-color: #28a745 |
+| border-danger | border-color: #dc3545 |
+| border-light | border-color: #f8f9fa |
+| border-dark | border-color: #343a40 |
+| border-gray-50 | border-color: #f9fafb |
+| border-gray-100 | border-color: #f3f4f6 |
+| border-gray-200 | border-color: #e5e7eb |
+| border-gray-300 | border-color: #d1d5db |
+| border-gray-400 | border-color: #9ca3af |
+| border-gray-500 | border-color: #6b7280 |
+| border-gray-600 | border-color: #4b5563 |
+| border-gray-700 | border-color: #374151 |
+| border-gray-800 | border-color: #1f2937 |
+| border-gray-900 | border-color: #111827 |
+| border-red-50 | border-color: #fef2f2 |
+| border-red-100 | border-color: #fee2e2 |
+| border-red-200 | border-color: #fecaca |
+| border-red-300 | border-color: #fca5a5 |
+| border-red-400 | border-color: #f87171 |
+| border-red-500 | border-color: #ef4444 |
+| border-red-600 | border-color: #dc2626 |
+| border-red-700 | border-color: #b91c1c |
+| border-red-800 | border-color: #991b1b |
+| border-red-900 | border-color: #7f1d1d |
+| border-yellow-50 | border-color: #fffbeb |
+| border-yellow-100 | border-color: #fef3c7 |
+| border-yellow-200 | border-color: #fde68a |
+| border-yellow-300 | border-color: #fcd34d |
+| border-yellow-400 | border-color: #fbbf24 |
+| border-yellow-500 | border-color: #f59e0b |
+| border-yellow-600 | border-color: #d97706 |
+| border-yellow-700 | border-color: #b45309 |
+| border-yellow-800 | border-color: #92400e |
+| border-yellow-900 | border-color: #78350f |
+| border-green-50 | border-color: #ecfdf5 |
+| border-green-100 | border-color: #d1fae5 |
+| border-green-200 | border-color: #a7f3d0 |
+| border-green-300 | border-color: #6ee7b7 |
+| border-green-400 | border-color: #34d399 |
+| border-green-500 | border-color: #10b981 |
+| border-green-600 | border-color: #059669 |
+| border-green-700 | border-color: #047857 |
+| border-green-800 | border-color: #065f46 |
+| border-green-900 | border-color: #064e3b |
+| border-blue-50 | border-color: #eff6ff |
+| border-blue-100 | border-color: #dbeafe |
+| border-blue-200 | border-color: #bfdbfe |
+| border-blue-300 | border-color: #93c5fd |
+| border-blue-400 | border-color: #60a5fa |
+| border-blue-500 | border-color: #3b82f6 |
+| border-blue-600 | border-color: #2563eb |
+| border-blue-700 | border-color: #1d4ed8 |
+| border-blue-800 | border-color: #1e40af |
+| border-blue-900 | border-color: #1e3a8a |
+| border-cyan-50 | border-color: #ecfeff |
+| border-cyan-100 | border-color: #cffafe |
+| border-cyan-200 | border-color: #a5f3fc |
+| border-cyan-300 | border-color: #67e8f9 |
+| border-cyan-400 | border-color: #22d3ee |
+| border-cyan-500 | border-color: #06b6d4 |
+| border-cyan-600 | border-color: #0891b2 |
+| border-cyan-700 | border-color: #0e7490 |
+| border-cyan-800 | border-color: #155e75 |
+| border-cyan-900 | border-color: #164e63 |
+| border-indigo-50 | border-color: #eef2ff |
+| border-indigo-100 | border-color: #e0e7ff |
+| border-indigo-200 | border-color: #c7d2fe |
+| border-indigo-300 | border-color: #a5b4fc |
+| border-indigo-400 | border-color: #818cf8 |
+| border-indigo-500 | border-color: #6366f1 |
+| border-indigo-600 | border-color: #4f46e5 |
+| border-indigo-700 | border-color: #4338ca |
+| border-indigo-800 | border-color: #3730a3 |
+| border-indigo-900 | border-color: #312e81 |
+| border-purple-50 | border-color: #f5f3ff |
+| border-purple-100 | border-color: #ede9fe |
+| border-purple-200 | border-color: #ddd6fe |
+| border-purple-300 | border-color: #c4b5fd |
+| border-purple-400 | border-color: #a78bfa |
+| border-purple-500 | border-color: #8b5cf6 |
+| border-purple-600 | border-color: #7c3aed |
+| border-purple-700 | border-color: #6d28d9 |
+| border-purple-800 | border-color: #5b21b6 |
+| border-purple-900 | border-color: #4c1d95 |
+| border-pink-50 | border-color: #fdf2f8 |
+| border-pink-100 | border-color: #fce7f3 |
+| border-pink-200 | border-color: #fbcfe8 |
+| border-pink-300 | border-color: #f9a8d4 |
+| border-pink-400 | border-color: #f472b6 |
+| border-pink-500 | border-color: #ec4899 |
+| border-pink-600 | border-color: #db2777 |
+| border-pink-700 | border-color: #be185d |
+| border-pink-800 | border-color: #9d174d |
+| border-pink-900 | border-color: #831843 |
+
+
+还有 hover、active、focus、disabled 扩展，比如 `hover:border-black`

package/scss/helper/border/_border-color.scss

@@ -0,0 +1,178 @@
+/*!markdown
+
+---
+title: 边框颜色
+---
+
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| border-black | border-color: #000 |
+| border-white | border-color: #fff |
+| border-primary | border-color: #007bff |
+| border-secondary | border-color: #6c757d |
+| border-success | border-color: #28a745 |
+| border-info | border-color: #007bff |
+| border-warning | border-color: #28a745 |
+| border-danger | border-color: #dc3545 |
+| border-light | border-color: #f8f9fa |
+| border-dark | border-color: #343a40 |
+| border-gray-50 | border-color: #f9fafb |
+| border-gray-100 | border-color: #f3f4f6 |
+| border-gray-200 | border-color: #e5e7eb |
+| border-gray-300 | border-color: #d1d5db |
+| border-gray-400 | border-color: #9ca3af |
+| border-gray-500 | border-color: #6b7280 |
+| border-gray-600 | border-color: #4b5563 |
+| border-gray-700 | border-color: #374151 |
+| border-gray-800 | border-color: #1f2937 |
+| border-gray-900 | border-color: #111827 |
+| border-red-50 | border-color: #fef2f2 |
+| border-red-100 | border-color: #fee2e2 |
+| border-red-200 | border-color: #fecaca |
+| border-red-300 | border-color: #fca5a5 |
+| border-red-400 | border-color: #f87171 |
+| border-red-500 | border-color: #ef4444 |
+| border-red-600 | border-color: #dc2626 |
+| border-red-700 | border-color: #b91c1c |
+| border-red-800 | border-color: #991b1b |
+| border-red-900 | border-color: #7f1d1d |
+| border-yellow-50 | border-color: #fffbeb |
+| border-yellow-100 | border-color: #fef3c7 |
+| border-yellow-200 | border-color: #fde68a |
+| border-yellow-300 | border-color: #fcd34d |
+| border-yellow-400 | border-color: #fbbf24 |
+| border-yellow-500 | border-color: #f59e0b |
+| border-yellow-600 | border-color: #d97706 |
+| border-yellow-700 | border-color: #b45309 |
+| border-yellow-800 | border-color: #92400e |
+| border-yellow-900 | border-color: #78350f |
+| border-green-50 | border-color: #ecfdf5 |
+| border-green-100 | border-color: #d1fae5 |
+| border-green-200 | border-color: #a7f3d0 |
+| border-green-300 | border-color: #6ee7b7 |
+| border-green-400 | border-color: #34d399 |
+| border-green-500 | border-color: #10b981 |
+| border-green-600 | border-color: #059669 |
+| border-green-700 | border-color: #047857 |
+| border-green-800 | border-color: #065f46 |
+| border-green-900 | border-color: #064e3b |
+| border-blue-50 | border-color: #eff6ff |
+| border-blue-100 | border-color: #dbeafe |
+| border-blue-200 | border-color: #bfdbfe |
+| border-blue-300 | border-color: #93c5fd |
+| border-blue-400 | border-color: #60a5fa |
+| border-blue-500 | border-color: #3b82f6 |
+| border-blue-600 | border-color: #2563eb |
+| border-blue-700 | border-color: #1d4ed8 |
+| border-blue-800 | border-color: #1e40af |
+| border-blue-900 | border-color: #1e3a8a |
+| border-cyan-50 | border-color: #ecfeff |
+| border-cyan-100 | border-color: #cffafe |
+| border-cyan-200 | border-color: #a5f3fc |
+| border-cyan-300 | border-color: #67e8f9 |
+| border-cyan-400 | border-color: #22d3ee |
+| border-cyan-500 | border-color: #06b6d4 |
+| border-cyan-600 | border-color: #0891b2 |
+| border-cyan-700 | border-color: #0e7490 |
+| border-cyan-800 | border-color: #155e75 |
+| border-cyan-900 | border-color: #164e63 |
+| border-indigo-50 | border-color: #eef2ff |
+| border-indigo-100 | border-color: #e0e7ff |
+| border-indigo-200 | border-color: #c7d2fe |
+| border-indigo-300 | border-color: #a5b4fc |
+| border-indigo-400 | border-color: #818cf8 |
+| border-indigo-500 | border-color: #6366f1 |
+| border-indigo-600 | border-color: #4f46e5 |
+| border-indigo-700 | border-color: #4338ca |
+| border-indigo-800 | border-color: #3730a3 |
+| border-indigo-900 | border-color: #312e81 |
+| border-purple-50 | border-color: #f5f3ff |
+| border-purple-100 | border-color: #ede9fe |
+| border-purple-200 | border-color: #ddd6fe |
+| border-purple-300 | border-color: #c4b5fd |
+| border-purple-400 | border-color: #a78bfa |
+| border-purple-500 | border-color: #8b5cf6 |
+| border-purple-600 | border-color: #7c3aed |
+| border-purple-700 | border-color: #6d28d9 |
+| border-purple-800 | border-color: #5b21b6 |
+| border-purple-900 | border-color: #4c1d95 |
+| border-pink-50 | border-color: #fdf2f8 |
+| border-pink-100 | border-color: #fce7f3 |
+| border-pink-200 | border-color: #fbcfe8 |
+| border-pink-300 | border-color: #f9a8d4 |
+| border-pink-400 | border-color: #f472b6 |
+| border-pink-500 | border-color: #ec4899 |
+| border-pink-600 | border-color: #db2777 |
+| border-pink-700 | border-color: #be185d |
+| border-pink-800 | border-color: #9d174d |
+| border-pink-900 | border-color: #831843 |
+
+
+还有 hover、active、focus、disabled 扩展，比如 `hover:border-black`
+
+*/
+
+@mixin border-colors-map(
+  $colors: $colors,
+  $namePrefix: '',
+  $prefix: '.',
+  $suffix: ''
+) {
+  @each $name, $color in $colors {
+    @if (is-map($color)) {
+      @include border-colors-map($color, #{'-' + $name}, $prefix, $suffix);
+    } @else if $suffix == '.is-active' {
+      #{$prefix}border#{$namePrefix}-#{'' + $name}.is-active,
+      #{$prefix}border#{$namePrefix}-#{'' + $name}:active {
+        border-color: $color;
+      }
+    } @else if $suffix == '.is-disabled' {
+      #{$prefix}border#{$namePrefix}-#{'' + $name}.is-disabled,
+      #{$prefix}border#{$namePrefix}-#{'' + $name}:disabled {
+        border-color: $color;
+      }
+    } @else {
+      #{$prefix}border#{$namePrefix}-#{'' + $name}#{$suffix} {
+        border-color: $color;
+      }
+    }
+  }
+}
+
+@mixin border-colors($prefix: '.', $suffix: '') {
+  @include border-colors-map($colors, '', $prefix, $suffix);
+}
+
+@include border-colors();
+@include border-colors('.' + selector-escape('hover:'), ':hover');
+@include border-colors('.' + selector-escape('active:'), '.is-active');
+@include border-colors('.' + selector-escape('focus:'), ':focus');
+@include border-colors('.' + selector-escape('disabled:'), '.is-disabled');
+@include border-colors('.group:hover .' + selector-escape('group-hover:'));
+
+@each $deivce in map-keys($devices) {
+  @include media-device($deivce) {
+    @include border-colors('.' + selector-escape($deivce + ':'));
+
+    @include border-colors(
+      '.' + selector-escape($deivce + ':') + selector-escape('hover:'),
+      ':hover'
+    );
+    @include border-colors(
+      '.' + selector-escape($deivce + ':') + selector-escape('active:'),
+      '.is-active'
+    );
+    @include border-colors(
+      '.' + selector-escape($deivce + ':') + selector-escape('focus:'),
+      ':focus'
+    );
+    @include border-colors(
+      '.' + selector-escape($deivce + ':') + selector-escape('disabled:'),
+      '.is-disabled'
+    );
+    @include border-colors(
+      '.group:hover .' + selector-escape($deivce + ':') +
+        selector-escape('group-hover:')
+    );
+  }
+}

package/scss/helper/border/_border-radius.md

@@ -0,0 +1,86 @@
+---
+title: 边框圆角
+---
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| rounded-none | border-radius: 0px |
+| rounded-sm | border-radius: 0.125rem |
+| rounded | border-radius: 0.25rem |
+| rounded-md | border-radius: 0.375rem |
+| rounded-lg | border-radius: 0.5rem |
+| rounded-xl | border-radius: 0.75rem |
+| rounded-2xl | border-radius: 1rem |
+| rounded-3xl | border-radius: 1.5rem |
+| rounded-full | border-radius: 9999px |
+| rounded-t-none | border-top-left-radius: 0px; border-top-right-radius: 0px |
+| rounded-t-sm | border-top-left-radius: 0.125rem; border-top-right-radius: 0.125rem |
+| rounded-t | border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem |
+| rounded-t-md | border-top-left-radius: 0.375rem; border-top-right-radius: 0.375rem |
+| rounded-t-lg | border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem |
+| rounded-t-xl | border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem |
+| rounded-t-2xl | border-top-left-radius: 1rem; border-top-right-radius: 1rem |
+| rounded-t-3xl | border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem |
+| rounded-t-full | border-top-left-radius: 9999px; border-top-right-radius: 9999px |
+| rounded-r-none | border-top-right-radius: 0px; border-bottom-right-radius: 0px |
+| rounded-r-sm | border-top-right-radius: 0.125rem; border-bottom-right-radius: 0.125rem |
+| rounded-r | border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem |
+| rounded-r-md | border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem |
+| rounded-r-lg | border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem |
+| rounded-r-xl | border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem |
+| rounded-r-2xl | border-top-right-radius: 1rem; border-bottom-right-radius: 1rem |
+| rounded-r-3xl | border-top-right-radius: 1.5rem; border-bottom-right-radius: 1.5rem |
+| rounded-r-full | border-top-right-radius: 9999px; border-bottom-right-radius: 9999px |
+| rounded-b-none | border-bottom-right-radius: 0px; border-bottom-left-radius: 0px |
+| rounded-b-sm | border-bottom-right-radius: 0.125rem; border-bottom-left-radius: 0.125rem |
+| rounded-b | border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem |
+| rounded-b-md | border-bottom-right-radius: 0.375rem; border-bottom-left-radius: 0.375rem |
+| rounded-b-lg | border-bottom-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem |
+| rounded-b-xl | border-bottom-right-radius: 0.75rem; border-bottom-left-radius: 0.75rem |
+| rounded-b-2xl | border-bottom-right-radius: 1rem; border-bottom-left-radius: 1rem |
+| rounded-b-3xl | border-bottom-right-radius: 1.5rem; border-bottom-left-radius: 1.5rem |
+| rounded-b-full | border-bottom-right-radius: 9999px; border-bottom-left-radius: 9999px |
+| rounded-l-none | border-top-left-radius: 0px; border-bottom-left-radius: 0px |
+| rounded-l-sm | border-top-left-radius: 0.125rem; border-bottom-left-radius: 0.125rem |
+| rounded-l | border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem |
+| rounded-l-md | border-top-left-radius: 0.375rem; border-bottom-left-radius: 0.375rem |
+| rounded-l-lg | border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem |
+| rounded-l-xl | border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem |
+| rounded-l-2xl | border-top-left-radius: 1rem; border-bottom-left-radius: 1rem |
+| rounded-l-3xl | border-top-left-radius: 1.5rem; border-bottom-left-radius: 1.5rem |
+| rounded-l-full | border-top-left-radius: 9999px; border-bottom-left-radius: 9999px |
+| rounded-tl-none | border-top-left-radius: 0px |
+| rounded-tr-none | border-top-right-radius: 0px |
+| rounded-br-none | border-bottom-right-radius: 0px |
+| rounded-bl-none | border-bottom-left-radius: 0px |
+| rounded-tl-sm | border-top-left-radius: 0.125rem |
+| rounded-tr-sm | border-top-right-radius: 0.125rem |
+| rounded-br-sm | border-bottom-right-radius: 0.125rem |
+| rounded-bl-sm | border-bottom-left-radius: 0.125rem |
+| rounded-tl | border-top-left-radius: 0.25rem |
+| rounded-tr | border-top-right-radius: 0.25rem |
+| rounded-br | border-bottom-right-radius: 0.25rem |
+| rounded-bl | border-bottom-left-radius: 0.25rem |
+| rounded-tl-md | border-top-left-radius: 0.375rem |
+| rounded-tr-md | border-top-right-radius: 0.375rem |
+| rounded-br-md | border-bottom-right-radius: 0.375rem |
+| rounded-bl-md | border-bottom-left-radius: 0.375rem |
+| rounded-tl-lg | border-top-left-radius: 0.5rem |
+| rounded-tr-lg | border-top-right-radius: 0.5rem |
+| rounded-br-lg | border-bottom-right-radius: 0.5rem |
+| rounded-bl-lg | border-bottom-left-radius: 0.5rem |
+| rounded-tl-xl | border-top-left-radius: 0.75rem |
+| rounded-tr-xl | border-top-right-radius: 0.75rem |
+| rounded-br-xl | border-bottom-right-radius: 0.75rem |
+| rounded-bl-xl | border-bottom-left-radius: 0.75rem |
+| rounded-tl-2xl | border-top-left-radius: 1rem |
+| rounded-tr-2xl | border-top-right-radius: 1rem |
+| rounded-br-2xl | border-bottom-right-radius: 1rem |
+| rounded-bl-2xl | border-bottom-left-radius: 1rem |
+| rounded-tl-3xl | border-top-left-radius: 1.5rem |
+| rounded-tr-3xl | border-top-right-radius: 1.5rem |
+| rounded-br-3xl | border-bottom-right-radius: 1.5rem |
+| rounded-bl-3xl | border-bottom-left-radius: 1.5rem |
+| rounded-tl-full | border-top-left-radius: 9999px |
+| rounded-tr-full | border-top-right-radius: 9999px |
+| rounded-br-full | border-bottom-right-radius: 9999px |
+| rounded-bl-full | border-bottom-left-radius: 9999px |

package/scss/helper/border/_border-radius.scss

@@ -0,0 +1,152 @@
+/*!markdown
+
+---
+title: 边框圆角
+---
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| rounded-none | border-radius: 0px |
+| rounded-sm | border-radius: 0.125rem |
+| rounded | border-radius: 0.25rem |
+| rounded-md | border-radius: 0.375rem |
+| rounded-lg | border-radius: 0.5rem |
+| rounded-xl | border-radius: 0.75rem |
+| rounded-2xl | border-radius: 1rem |
+| rounded-3xl | border-radius: 1.5rem |
+| rounded-full | border-radius: 9999px |
+| rounded-t-none | border-top-left-radius: 0px; border-top-right-radius: 0px |
+| rounded-t-sm | border-top-left-radius: 0.125rem; border-top-right-radius: 0.125rem |
+| rounded-t | border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem |
+| rounded-t-md | border-top-left-radius: 0.375rem; border-top-right-radius: 0.375rem |
+| rounded-t-lg | border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem |
+| rounded-t-xl | border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem |
+| rounded-t-2xl | border-top-left-radius: 1rem; border-top-right-radius: 1rem |
+| rounded-t-3xl | border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem |
+| rounded-t-full | border-top-left-radius: 9999px; border-top-right-radius: 9999px |
+| rounded-r-none | border-top-right-radius: 0px; border-bottom-right-radius: 0px |
+| rounded-r-sm | border-top-right-radius: 0.125rem; border-bottom-right-radius: 0.125rem |
+| rounded-r | border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem |
+| rounded-r-md | border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem |
+| rounded-r-lg | border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem |
+| rounded-r-xl | border-top-right-radius: 0.75rem; border-bottom-right-radius: 0.75rem |
+| rounded-r-2xl | border-top-right-radius: 1rem; border-bottom-right-radius: 1rem |
+| rounded-r-3xl | border-top-right-radius: 1.5rem; border-bottom-right-radius: 1.5rem |
+| rounded-r-full | border-top-right-radius: 9999px; border-bottom-right-radius: 9999px |
+| rounded-b-none | border-bottom-right-radius: 0px; border-bottom-left-radius: 0px |
+| rounded-b-sm | border-bottom-right-radius: 0.125rem; border-bottom-left-radius: 0.125rem |
+| rounded-b | border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem |
+| rounded-b-md | border-bottom-right-radius: 0.375rem; border-bottom-left-radius: 0.375rem |
+| rounded-b-lg | border-bottom-right-radius: 0.5rem; border-bottom-left-radius: 0.5rem |
+| rounded-b-xl | border-bottom-right-radius: 0.75rem; border-bottom-left-radius: 0.75rem |
+| rounded-b-2xl | border-bottom-right-radius: 1rem; border-bottom-left-radius: 1rem |
+| rounded-b-3xl | border-bottom-right-radius: 1.5rem; border-bottom-left-radius: 1.5rem |
+| rounded-b-full | border-bottom-right-radius: 9999px; border-bottom-left-radius: 9999px |
+| rounded-l-none | border-top-left-radius: 0px; border-bottom-left-radius: 0px |
+| rounded-l-sm | border-top-left-radius: 0.125rem; border-bottom-left-radius: 0.125rem |
+| rounded-l | border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem |
+| rounded-l-md | border-top-left-radius: 0.375rem; border-bottom-left-radius: 0.375rem |
+| rounded-l-lg | border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem |
+| rounded-l-xl | border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem |
+| rounded-l-2xl | border-top-left-radius: 1rem; border-bottom-left-radius: 1rem |
+| rounded-l-3xl | border-top-left-radius: 1.5rem; border-bottom-left-radius: 1.5rem |
+| rounded-l-full | border-top-left-radius: 9999px; border-bottom-left-radius: 9999px |
+| rounded-tl-none | border-top-left-radius: 0px |
+| rounded-tr-none | border-top-right-radius: 0px |
+| rounded-br-none | border-bottom-right-radius: 0px |
+| rounded-bl-none | border-bottom-left-radius: 0px |
+| rounded-tl-sm | border-top-left-radius: 0.125rem |
+| rounded-tr-sm | border-top-right-radius: 0.125rem |
+| rounded-br-sm | border-bottom-right-radius: 0.125rem |
+| rounded-bl-sm | border-bottom-left-radius: 0.125rem |
+| rounded-tl | border-top-left-radius: 0.25rem |
+| rounded-tr | border-top-right-radius: 0.25rem |
+| rounded-br | border-bottom-right-radius: 0.25rem |
+| rounded-bl | border-bottom-left-radius: 0.25rem |
+| rounded-tl-md | border-top-left-radius: 0.375rem |
+| rounded-tr-md | border-top-right-radius: 0.375rem |
+| rounded-br-md | border-bottom-right-radius: 0.375rem |
+| rounded-bl-md | border-bottom-left-radius: 0.375rem |
+| rounded-tl-lg | border-top-left-radius: 0.5rem |
+| rounded-tr-lg | border-top-right-radius: 0.5rem |
+| rounded-br-lg | border-bottom-right-radius: 0.5rem |
+| rounded-bl-lg | border-bottom-left-radius: 0.5rem |
+| rounded-tl-xl | border-top-left-radius: 0.75rem |
+| rounded-tr-xl | border-top-right-radius: 0.75rem |
+| rounded-br-xl | border-bottom-right-radius: 0.75rem |
+| rounded-bl-xl | border-bottom-left-radius: 0.75rem |
+| rounded-tl-2xl | border-top-left-radius: 1rem |
+| rounded-tr-2xl | border-top-right-radius: 1rem |
+| rounded-br-2xl | border-bottom-right-radius: 1rem |
+| rounded-bl-2xl | border-bottom-left-radius: 1rem |
+| rounded-tl-3xl | border-top-left-radius: 1.5rem |
+| rounded-tr-3xl | border-top-right-radius: 1.5rem |
+| rounded-br-3xl | border-bottom-right-radius: 1.5rem |
+| rounded-bl-3xl | border-bottom-left-radius: 1.5rem |
+| rounded-tl-full | border-top-left-radius: 9999px |
+| rounded-tr-full | border-top-right-radius: 9999px |
+| rounded-br-full | border-bottom-right-radius: 9999px |
+| rounded-bl-full | border-bottom-left-radius: 9999px |
+
+
+*/
+
+@mixin border-radius($prefix: '.', $suffix: '') {
+  @each $name, $value in $borderRadiuses {
+    #{$prefix}rounded#{suffixName($name)}#{$suffix} {
+      border-radius: $value;
+    }
+  }
+  @each $name, $value in $borderRadiuses {
+    #{$prefix}rounded-t#{suffixName($name)}#{$suffix} {
+      border-top-left-radius: $value;
+      border-top-right-radius: $value;
+    }
+  }
+
+  @each $name, $value in $borderRadiuses {
+    #{$prefix}rounded-r#{suffixName($name)}#{$suffix} {
+      border-top-right-radius: $value;
+      border-bottom-right-radius: $value;
+    }
+  }
+  @each $name, $value in $borderRadiuses {
+    #{$prefix}rounded-b#{suffixName($name)}#{$suffix} {
+      border-bottom-right-radius: $value;
+      border-bottom-left-radius: $value;
+    }
+  }
+  @each $name, $value in $borderRadiuses {
+    #{$prefix}rounded-l#{suffixName($name)}#{$suffix} {
+      border-top-left-radius: $value;
+      border-bottom-left-radius: $value;
+    }
+  }
+
+  @each $name, $value in $borderRadiuses {
+    #{$prefix}rounded-tl#{suffixName($name)}#{$suffix} {
+      border-top-left-radius: $value;
+    }
+    #{$prefix}rounded-tr#{suffixName($name)}#{$suffix} {
+      border-top-right-radius: $value;
+    }
+    #{$prefix}rounded-br#{suffixName($name)}#{$suffix} {
+      border-bottom-right-radius: $value;
+    }
+    #{$prefix}rounded-bl#{suffixName($name)}#{$suffix} {
+      border-bottom-left-radius: $value;
+    }
+  }
+}
+
+@include border-radius();
+@each $deivce in map-keys($devices) {
+  @include media-device($deivce) {
+    @include border-radius('.' + selector-escape($deivce + ':'));
+  }
+}
+
+// @include border-radius('.' + selector-escape('hover:'), ':hover');
+// @include border-radius('.' + selector-escape('active:'), '.is-active');
+// @include border-radius('.' + selector-escape('focus:'), ':focus');
+// @include border-radius('.' + selector-escape('disabled:'), '.is-disabled');
+// @include border-radius('.group:hover .' + selector-escape('group-hover:'));

package/scss/helper/border/_border-style.md

@@ -0,0 +1,11 @@
+---
+title: 边框样式
+---
+
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| border-solid | border-style: solid |
+| border-dashed | border-style: dashed |
+| border-dotted | border-style: dotted |
+| border-double | border-style: double |
+| border-none | border-style: none |

package/scss/helper/border/_border-style.scss

@@ -0,0 +1,40 @@
+/*!markdown
+
+---
+title: 边框样式
+---
+
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| border-solid | border-style: solid |
+| border-dashed | border-style: dashed |
+| border-dotted | border-style: dotted |
+| border-double | border-style: double |
+| border-none | border-style: none |
+
+
+*/
+
+@mixin make-border-style($prefix: '.') {
+  @each $name,
+    $value
+      in (
+        'solid': solid,
+        'dashed': dashed,
+        'dotted': dotted,
+        'double': double,
+        'none': none
+      )
+  {
+    #{$prefix}border-#{$name} {
+      border-style: $value;
+    }
+  }
+}
+
+@include make-border-style();
+@each $deivce in map-keys($devices) {
+  @include media-device($deivce) {
+    @include make-border-style('.' + selector-escape($deivce + ':'));
+  }
+}

package/scss/helper/border/_border-width.md

@@ -0,0 +1,31 @@
+---
+title: 边框宽度
+---
+
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| border | border-width: 1px |
+| border-0 | border-width: 0px |
+| border-2 | border-width: 2px |
+| border-4 | border-width: 4px |
+| border-8 | border-width: 8px |
+| border-t | border-top-width: 1px |
+| border-r | border-right-width: 1px |
+| border-b | border-bottom-width: 1px |
+| border-l | border-left-width: 1px |
+| border-t-0 | border-top-width: 0px |
+| border-r-0 | border-right-width: 0px |
+| border-b-0 | border-bottom-width: 0px |
+| border-l-0 | border-left-width: 0px |
+| border-t-2 | border-top-width: 2px |
+| border-r-2 | border-right-width: 2px |
+| border-b-2 | border-bottom-width: 2px |
+| border-l-2 | border-left-width: 2px |
+| border-t-4 | border-top-width: 4px |
+| border-r-4 | border-right-width: 4px |
+| border-b-4 | border-bottom-width: 4px |
+| border-l-4 | border-left-width: 4px |
+| border-t-8 | border-top-width: 8px |
+| border-r-8 | border-right-width: 8px |
+| border-b-8 | border-bottom-width: 8px |
+| border-l-8 | border-left-width: 8px |

package/scss/helper/border/_border-width.scss

@@ -0,0 +1,72 @@
+/*!markdown
+
+---
+title: 边框宽度
+---
+
+| Class       | Properties               |
+| ----------- | ------------------------ |
+| border | border-width: 1px |
+| border-0 | border-width: 0px |
+| border-2 | border-width: 2px |
+| border-4 | border-width: 4px |
+| border-8 | border-width: 8px |
+| border-t | border-top-width: 1px |
+| border-r | border-right-width: 1px |
+| border-b | border-bottom-width: 1px |
+| border-l | border-left-width: 1px |
+| border-t-0 | border-top-width: 0px |
+| border-r-0 | border-right-width: 0px |
+| border-b-0 | border-bottom-width: 0px |
+| border-l-0 | border-left-width: 0px |
+| border-t-2 | border-top-width: 2px |
+| border-r-2 | border-right-width: 2px |
+| border-b-2 | border-bottom-width: 2px |
+| border-l-2 | border-left-width: 2px |
+| border-t-4 | border-top-width: 4px |
+| border-r-4 | border-right-width: 4px |
+| border-b-4 | border-bottom-width: 4px |
+| border-l-4 | border-left-width: 4px |
+| border-t-8 | border-top-width: 8px |
+| border-r-8 | border-right-width: 8px |
+| border-b-8 | border-bottom-width: 8px |
+| border-l-8 | border-left-width: 8px |
+
+
+*/
+
+@mixin border-widths($prefix: '.', $suffix: '') {
+  @each $name, $value in $borderWidths {
+    #{$prefix}border#{suffixName($name)}#{$suffix} {
+      border-width: $value;
+    }
+  }
+
+  @each $name, $value in $borderWidths {
+    #{$prefix}border-t#{suffixName($name)}#{$suffix} {
+      border-top-width: $value;
+    }
+    #{$prefix}border-r#{suffixName($name)}#{$suffix} {
+      border-right-width: $value;
+    }
+    #{$prefix}border-b#{suffixName($name)}#{$suffix} {
+      border-bottom-width: $value;
+    }
+    #{$prefix}border-l#{suffixName($name)}#{$suffix} {
+      border-left-width: $value;
+    }
+  }
+}
+
+@include border-widths();
+@each $deivce in map-keys($devices) {
+  @include media-device($deivce) {
+    @include border-widths('.' + selector-escape($deivce + ':'));
+  }
+}
+
+// @include border-radius('.' + selector-escape('hover:'), ':hover');
+// @include border-radius('.' + selector-escape('active:'), '.is-active');
+// @include border-radius('.' + selector-escape('focus:'), ':focus');
+// @include border-radius('.' + selector-escape('disabled:'), '.is-disabled');
+// @include border-radius('.group:hover .' + selector-escape('group-hover:'));