plain-design 0.0.87 → 0.0.91
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/plain-design.commonjs.min.js +3 -3
- package/dist/plain-design.min.css +18 -18
- package/dist/plain-design.min.js +3 -3
- package/dist/report.html +2 -2
- package/package.json +3 -4
- package/src/packages/PlCascadePanel/cascade-panel.scss +90 -89
- package/src/packages/PlDialog/dialog.scss +4 -4
- package/src/packages/PlDropdown/dropdown.scss +1 -1
- package/src/packages/PlInput/input.scss +1 -0
- package/src/packages/PlSlider/slider.scss +2 -1
- package/src/packages/PlTable/table.scss +4 -0
- package/src/packages/createUseTableOption/use/use.buttons.tsx +4 -0
- package/src/packages/createUseTableOption/use/use.methods.tsx +31 -2
- package/src/packages/useContextmenu/contextmenu-service.scss +1 -1
- package/src/styles/data/scan.scss.json +14 -14
- package/src/styles/public/transition.scss +1 -1
- package/src/styles/theme/default.scss +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"globalImport": "/*red*/\r\n$red_1: #fff1f0;\r\n$red_2: #ffccc7;\r\n$red_3: #ffa39e;\r\n$red_4: #ff4d4f;\r\n$red_5: #ff4d4f;\r\n$red_6: #f5222d;\r\n$red_7: #cf1322;\r\n$red_8: #a8071a;\r\n$red_9: #820014;\r\n$red_10: #5c0011;\r\n\r\n/*volcano*/\r\n$volcano_1: #fff2e8;\r\n$volcano_2: #ffd8bf;\r\n$volcano_3: #ffbb96;\r\n$volcano_4: #ff9c6e;\r\n$volcano_5: #ff7a45;\r\n$volcano_6: #fa541c;\r\n$volcano_7: #d4380d;\r\n$volcano_8: #ad2102;\r\n$volcano_9: #871400;\r\n$volcano_10: #610b00;\r\n\r\n/*orange*/\r\n$orange_1: #fff7e6;\r\n$orange_2: #ffe7ba;\r\n$orange_3: #ffd591;\r\n$orange_4: #ffc069;\r\n$orange_5: #ffa940;\r\n$orange_6: #fa8c16;\r\n$orange_7: #d46b08;\r\n$orange_8: #ad4e00;\r\n$orange_9: #873800;\r\n$orange_10: #612500;\r\n\r\n/*gold*/\r\n$gold_1: #fffbe6;\r\n$gold_2: #fff1b8;\r\n$gold_3: #ffe58f;\r\n$gold_4: #ffd666;\r\n$gold_5: #ffc53d;\r\n$gold_6: #faad14;\r\n$gold_7: #d48806;\r\n$gold_8: #ad6800;\r\n$gold_9: #874d00;\r\n$gold_10: #613400;\r\n\r\n/*yellow*/\r\n$yellow_1: #feffe6;\r\n$yellow_2: #ffffb8;\r\n$yellow_3: #fffb8f;\r\n$yellow_4: #fff566;\r\n$yellow_5: #ffec3d;\r\n$yellow_6: #fadb14;\r\n$yellow_7: #d4b106;\r\n$yellow_8: #ad8b00;\r\n$yellow_9: #876800;\r\n$yellow_10: #614700;\r\n\r\n/*lime*/\r\n$lime_1: #fcffe6;\r\n$lime_2: #f4ffb8;\r\n$lime_3: #eaff8f;\r\n$lime_4: #d3f261;\r\n$lime_5: #bae637;\r\n$lime_6: #a0d911;\r\n$lime_7: #7cb305;\r\n$lime_8: #5b8c00;\r\n$lime_9: #3f6600;\r\n$lime_10: #254000;\r\n\r\n/*green*/\r\n$green_1: #f6ffed;\r\n$green_2: #d9f7be;\r\n$green_3: #b7eb8f;\r\n$green_4: #95de64;\r\n$green_5: #73d13d;\r\n$green_6: #52c41a;\r\n$green_7: #389e0d;\r\n$green_8: #237804;\r\n$green_9: #135200;\r\n$green_10: #092b00;\r\n\r\n/*cyan*/\r\n$cyan_1: #e6fffb;\r\n$cyan_2: #b5f5ec;\r\n$cyan_3: #87e8de;\r\n$cyan_4: #5cdbd3;\r\n$cyan_5: #36cfc9;\r\n$cyan_6: #13c2c2;\r\n$cyan_7: #08979c;\r\n$cyan_8: #006d75;\r\n$cyan_9: #00474f;\r\n$cyan_10: #002329;\r\n\r\n/*blue*/\r\n$blue_1: #e6f7ff;\r\n$blue_2: #bae7ff;\r\n$blue_3: #91d5ff;\r\n$blue_4: #69c0ff;\r\n$blue_5: #40a9ff;\r\n$blue_6: #1890ff;\r\n$blue_7: #096dd9;\r\n$blue_8: #0050b3;\r\n$blue_9: #003a8c;\r\n$blue_10: #002766;\r\n\r\n/*geek*/\r\n$geek_1: #f0f5ff;\r\n$geek_2: #d6e4ff;\r\n$geek_3: #adc6ff;\r\n$geek_4: #85a5ff;\r\n$geek_5: #597ef7;\r\n$geek_6: #2f54eb;\r\n$geek_7: #1d39c4;\r\n$geek_8: #10239e;\r\n$geek_9: #061178;\r\n$geek_10: #030852;\r\n\r\n/*purple*/\r\n$purple_1: #f9f0ff;\r\n$purple_2: #efdbff;\r\n$purple_3: #d3adf7;\r\n$purple_4: #b37feb;\r\n$purple_5: #9254de;\r\n$purple_6: #722ed1;\r\n$purple_7: #531dab;\r\n$purple_8: #391085;\r\n$purple_9: #22075e;\r\n$purple_10: #120338;\r\n\r\n/*magenta*/\r\n$magenta_1: #fff0f6;\r\n$magenta_2: #ffd6e7;\r\n$magenta_3: #ffadd2;\r\n$magenta_4: #ff85c0;\r\n$magenta_5: #f759ab;\r\n$magenta_6: #eb2f96;\r\n$magenta_7: #c41d7f;\r\n$magenta_8: #9e1068;\r\n$magenta_9: #780650;\r\n$magenta_10: #520339;\r\n\r\n/*gray*/\r\n$gray_1: #ffffff;\r\n$gray_2: #fafafa;\r\n$gray_3: #f5f5f5;\r\n$gray_4: #f0f0f0;\r\n$gray_5: #d9d9d9;\r\n$gray_6: #bfbfbf;\r\n$gray_7: #8c8c8c;\r\n$gray_8: #595959;\r\n$gray_9: #434343;\r\n$gray_10: #262626;\r\n$gray_11: #1f1f1f;\r\n$gray_12: #141414;\r\n$gray_13: #000000;\r\n\r\n//$boxshadow: 0 1px 1px 0 rgba(60, 64, 67, 0.08), 0 1px 3px 1px rgba(60, 64, 67, 0.16);\r\n$boxshadowColor: #f0f1f2;\r\n$boxshadow: 0 2px 8px $boxshadowColor;\r\n\r\n/*@formatter:off*/\r\n$theme-default: (\r\n '':(\r\n colorPrimary: $geek_7, /*基础*/\r\n colorSuccess: $cyan_7, /*成功*/\r\n colorWarn: $yellow_7, /*警告*/\r\n colorError: $red_7, /*错误*/\r\n colorInfo:$gray_7, /*帮助*/\r\n\r\n disabled:#f5f7fa, /*禁用*/\r\n disabledLight:#fcfcfc, /*禁用(轻)*/\r\n disabledDeep:#c6c6c6, /*禁用(深)*/\r\n disabledText:#c0c4cc, /*禁用字体*/\r\n\r\n sizeLarge:40px, /*尺寸(大)*/\r\n sizeNormal:32px, /*尺寸(中)*/\r\n sizeMini:28px, /*尺寸(小)*/\r\n\r\n shapeFillet:2px, /*小圆角*/\r\n shapeRound:100px, /*大圆角*/\r\n shapeNone:0, /*无圆角*/\r\n\r\n font:'-apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,noto sans,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol,noto color emoji',/**/\r\n\r\n ibc:#dcdfe6, /*边框色*/\r\n ibl:#ebeef5, /*边框色(轻)*/\r\n itc:#314659, /*文本色*/\r\n itl:#697b8c, /*文本色(轻)*/\r\n ihc:#000000, /*标题色*/\r\n ipc:rgba(0, 0, 0, 0.25), /*占位符颜色*/\r\n icc:rgba(0, 0, 0, 0.45), /*图标色*/\r\n\r\n transitionFlexible:cubic-bezier(.24, .22, .015, 1.2), /*flexible过度动画*/\r\n transition:
|
|
2
|
+
"globalImport": "/*red*/\r\n$red_1: #fff1f0;\r\n$red_2: #ffccc7;\r\n$red_3: #ffa39e;\r\n$red_4: #ff4d4f;\r\n$red_5: #ff4d4f;\r\n$red_6: #f5222d;\r\n$red_7: #cf1322;\r\n$red_8: #a8071a;\r\n$red_9: #820014;\r\n$red_10: #5c0011;\r\n\r\n/*volcano*/\r\n$volcano_1: #fff2e8;\r\n$volcano_2: #ffd8bf;\r\n$volcano_3: #ffbb96;\r\n$volcano_4: #ff9c6e;\r\n$volcano_5: #ff7a45;\r\n$volcano_6: #fa541c;\r\n$volcano_7: #d4380d;\r\n$volcano_8: #ad2102;\r\n$volcano_9: #871400;\r\n$volcano_10: #610b00;\r\n\r\n/*orange*/\r\n$orange_1: #fff7e6;\r\n$orange_2: #ffe7ba;\r\n$orange_3: #ffd591;\r\n$orange_4: #ffc069;\r\n$orange_5: #ffa940;\r\n$orange_6: #fa8c16;\r\n$orange_7: #d46b08;\r\n$orange_8: #ad4e00;\r\n$orange_9: #873800;\r\n$orange_10: #612500;\r\n\r\n/*gold*/\r\n$gold_1: #fffbe6;\r\n$gold_2: #fff1b8;\r\n$gold_3: #ffe58f;\r\n$gold_4: #ffd666;\r\n$gold_5: #ffc53d;\r\n$gold_6: #faad14;\r\n$gold_7: #d48806;\r\n$gold_8: #ad6800;\r\n$gold_9: #874d00;\r\n$gold_10: #613400;\r\n\r\n/*yellow*/\r\n$yellow_1: #feffe6;\r\n$yellow_2: #ffffb8;\r\n$yellow_3: #fffb8f;\r\n$yellow_4: #fff566;\r\n$yellow_5: #ffec3d;\r\n$yellow_6: #fadb14;\r\n$yellow_7: #d4b106;\r\n$yellow_8: #ad8b00;\r\n$yellow_9: #876800;\r\n$yellow_10: #614700;\r\n\r\n/*lime*/\r\n$lime_1: #fcffe6;\r\n$lime_2: #f4ffb8;\r\n$lime_3: #eaff8f;\r\n$lime_4: #d3f261;\r\n$lime_5: #bae637;\r\n$lime_6: #a0d911;\r\n$lime_7: #7cb305;\r\n$lime_8: #5b8c00;\r\n$lime_9: #3f6600;\r\n$lime_10: #254000;\r\n\r\n/*green*/\r\n$green_1: #f6ffed;\r\n$green_2: #d9f7be;\r\n$green_3: #b7eb8f;\r\n$green_4: #95de64;\r\n$green_5: #73d13d;\r\n$green_6: #52c41a;\r\n$green_7: #389e0d;\r\n$green_8: #237804;\r\n$green_9: #135200;\r\n$green_10: #092b00;\r\n\r\n/*cyan*/\r\n$cyan_1: #e6fffb;\r\n$cyan_2: #b5f5ec;\r\n$cyan_3: #87e8de;\r\n$cyan_4: #5cdbd3;\r\n$cyan_5: #36cfc9;\r\n$cyan_6: #13c2c2;\r\n$cyan_7: #08979c;\r\n$cyan_8: #006d75;\r\n$cyan_9: #00474f;\r\n$cyan_10: #002329;\r\n\r\n/*blue*/\r\n$blue_1: #e6f7ff;\r\n$blue_2: #bae7ff;\r\n$blue_3: #91d5ff;\r\n$blue_4: #69c0ff;\r\n$blue_5: #40a9ff;\r\n$blue_6: #1890ff;\r\n$blue_7: #096dd9;\r\n$blue_8: #0050b3;\r\n$blue_9: #003a8c;\r\n$blue_10: #002766;\r\n\r\n/*geek*/\r\n$geek_1: #f0f5ff;\r\n$geek_2: #d6e4ff;\r\n$geek_3: #adc6ff;\r\n$geek_4: #85a5ff;\r\n$geek_5: #597ef7;\r\n$geek_6: #2f54eb;\r\n$geek_7: #1d39c4;\r\n$geek_8: #10239e;\r\n$geek_9: #061178;\r\n$geek_10: #030852;\r\n\r\n/*purple*/\r\n$purple_1: #f9f0ff;\r\n$purple_2: #efdbff;\r\n$purple_3: #d3adf7;\r\n$purple_4: #b37feb;\r\n$purple_5: #9254de;\r\n$purple_6: #722ed1;\r\n$purple_7: #531dab;\r\n$purple_8: #391085;\r\n$purple_9: #22075e;\r\n$purple_10: #120338;\r\n\r\n/*magenta*/\r\n$magenta_1: #fff0f6;\r\n$magenta_2: #ffd6e7;\r\n$magenta_3: #ffadd2;\r\n$magenta_4: #ff85c0;\r\n$magenta_5: #f759ab;\r\n$magenta_6: #eb2f96;\r\n$magenta_7: #c41d7f;\r\n$magenta_8: #9e1068;\r\n$magenta_9: #780650;\r\n$magenta_10: #520339;\r\n\r\n/*gray*/\r\n$gray_1: #ffffff;\r\n$gray_2: #fafafa;\r\n$gray_3: #f5f5f5;\r\n$gray_4: #f0f0f0;\r\n$gray_5: #d9d9d9;\r\n$gray_6: #bfbfbf;\r\n$gray_7: #8c8c8c;\r\n$gray_8: #595959;\r\n$gray_9: #434343;\r\n$gray_10: #262626;\r\n$gray_11: #1f1f1f;\r\n$gray_12: #141414;\r\n$gray_13: #000000;\r\n\r\n//$boxshadow: 0 1px 1px 0 rgba(60, 64, 67, 0.08), 0 1px 3px 1px rgba(60, 64, 67, 0.16);\r\n$boxshadowColor: #f0f1f2;\r\n$boxshadow: 0 2px 8px $boxshadowColor;\r\n\r\n/*@formatter:off*/\r\n$theme-default: (\r\n '':(\r\n colorPrimary: $geek_7, /*基础*/\r\n colorSuccess: $cyan_7, /*成功*/\r\n colorWarn: $yellow_7, /*警告*/\r\n colorError: $red_7, /*错误*/\r\n colorInfo:$gray_7, /*帮助*/\r\n\r\n disabled:#f5f7fa, /*禁用*/\r\n disabledLight:#fcfcfc, /*禁用(轻)*/\r\n disabledDeep:#c6c6c6, /*禁用(深)*/\r\n disabledText:#c0c4cc, /*禁用字体*/\r\n\r\n sizeLarge:40px, /*尺寸(大)*/\r\n sizeNormal:32px, /*尺寸(中)*/\r\n sizeMini:28px, /*尺寸(小)*/\r\n\r\n shapeFillet:2px, /*小圆角*/\r\n shapeRound:100px, /*大圆角*/\r\n shapeNone:0, /*无圆角*/\r\n\r\n font:'-apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,noto sans,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol,noto color emoji',/**/\r\n\r\n ibc:#dcdfe6, /*边框色*/\r\n ibl:#ebeef5, /*边框色(轻)*/\r\n itc:#314659, /*文本色*/\r\n itl:#697b8c, /*文本色(轻)*/\r\n ihc:#000000, /*标题色*/\r\n ipc:rgba(0, 0, 0, 0.25), /*占位符颜色*/\r\n icc:rgba(0, 0, 0, 0.45), /*图标色*/\r\n\r\n transitionFlexible:cubic-bezier(.24, .22, .015, 1.2), /*flexible过度动画*/\r\n transition:ease, /*默认过渡动画*/\r\n transition2:ease, /*过渡动画(轻)*/\r\n\r\n boxshadow:$boxshadow, /*阴影*/\r\n boxshadowColor:$boxshadowColor, /*阴影*/\r\n popperRadius:2px, /*阴影*/\r\n )\r\n);\r\n/*@formatter:on*/\r\n\r\n\r\n$dt: map_get($theme-default, '');\r\n$generate_default: true;\r\n\r\n@function plv($key) {\r\n @if (map_has_key($globalTheme, $key)) {\r\n @return map-get($globalTheme, $key);\r\n } @else {\r\n @return map-get($dt, $key);\r\n }\r\n}\r\n\r\n@mixin generateThemeContent($name,$theme) {\r\n $globalTheme: $theme !global;\r\n $globalThemeName: $name !global;\r\n\r\n $colorPrimary: plv(colorPrimary) !global;\r\n $colorPrimaryLight: mix(white, $colorPrimary, 85%) !global;\r\n $colorSuccess: plv(colorSuccess) !global;\r\n $colorWarn: plv(colorWarn) !global;\r\n $colorError: plv(colorError) !global;\r\n $colorInfo: plv(colorInfo) !global;\r\n $disabled: plv(disabled) !global;\r\n $disabledLight: plv(disabledLight) !global;\r\n $disabledDeep: plv(disabledDeep) !global;\r\n $disabledText: plv(disabledText) !global;\r\n $font: plv(font) !global;\r\n $ibc: plv(ibc) !global;\r\n $ibl: plv(ibl) !global;\r\n $itc: plv(itc) !global;\r\n $itl: plv(itl) !global;\r\n $ihc: plv(ihc) !global;\r\n $ipc: plv(ipc) !global;\r\n $icc: plv(icc) !global;\r\n $transitionFlexible: plv(transitionFlexible) !global;\r\n $transition: plv(transition) !global;\r\n $transition2: plv(transition2) !global;\r\n $shapeFillet: plv(shapeFillet) !global;\r\n $shapeRound: plv(shapeRound) !global;\r\n $shapeNone: plv(shapeNone) !global;\r\n $popperRadius: plv(popperRadius) !global;\r\n $boxshadow: plv(boxshadow) !global;\r\n $boxshadowColor: plv(boxshadowColor) !global;\r\n\r\n @if (str_length($name)>0) {\r\n .theme-#{$name} {\r\n @content;\r\n }\r\n } @else {\r\n html {\r\n @if ($generate_default) {\r\n @content;\r\n }\r\n }\r\n }\r\n}\r\n\r\n@mixin statusMixin($component) {\r\n @each $key in (Primary, Success, Warn, Error, Info) {\r\n\r\n $value: plv(color#{$key}) !global;\r\n\r\n $name: to-lower-case($key) !global;\r\n &.pl-#{$component}-status-#{$name} {\r\n @content;\r\n }\r\n }\r\n}\r\n\r\n@mixin shapeMixin($component) {\r\n @each $key in (Fillet, Round, Square) {\r\n\r\n $value: plv(shape#{$key}) !global;\r\n $name: to-lower-case($key) !global;\r\n\r\n &.pl-#{$component}-shape-#{$name} {\r\n @content;\r\n }\r\n }\r\n}\r\n\r\n@mixin sizeMixin($component) {\r\n @each $key in (Large, Normal, Mini) {\r\n\r\n $value: plv(size#{$key}) !global;\r\n $name: to-lower-case($key) !global;\r\n\r\n &.pl-#{$component}-size-#{$name} {\r\n @content;\r\n }\r\n }\r\n}\r\n\r\n@mixin public-style {\r\n box-sizing: border-box;\r\n font-weight: 400;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n@mixin transition {\r\n transition: all $transition 300ms;\r\n}\r\n\r\n$theme-blue: (\r\n /*'blue':(\r\n colorPrimary: #409EFF,\r\n colorSuccess: #67C23A,\r\n colorWarn: #E6A23C,\r\n colorError: #F56C6C,\r\n colorInfo:#909399,\r\n\r\n shapeFillet:4px,\r\n ),\r\n 'violet':(\r\n colorPrimary: #8A2BE2,\r\n colorSuccess: #4caf50,\r\n colorWarn: #ff9800,\r\n colorError: #e91e63,\r\n colorInfo:#000042,\r\n\r\n shapeFillet:8px,\r\n )*/\r\n);\r\n\r\n$themes: map_merge($theme-default, $theme-blue);\r\n\r\n@mixin theme {\r\n @each $curThemeName, $curTheme in $themes {\r\n @include generateThemeContent($curThemeName, $curTheme) {\r\n @content;\r\n }\r\n }\r\n}",
|
|
3
3
|
"packagesScss": [
|
|
4
4
|
{
|
|
5
5
|
"name": "PlAlert",
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
{
|
|
61
61
|
"name": "PlCascadePanel",
|
|
62
62
|
"codes": [
|
|
63
|
-
"@include theme {\r\n
|
|
63
|
+
"@include theme {\r\n .pl-cascade-panel {\r\n display: inline-block;\r\n height: 200px;\r\n border: solid 1px $ibc;\r\n border-radius: $popperRadius;\r\n color: $itc;\r\n\r\n & > .pl-list {\r\n height: 100%;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n }\r\n\r\n .pl-cascade-list {\r\n width: 180px;\r\n height: 100%;\r\n padding: 6px 0;\r\n font-size: 14px;\r\n display: inline-block;\r\n vertical-align: top;\r\n overflow: hidden;\r\n box-sizing: border-box;\r\n\r\n &:not(:last-child) {\r\n border-right: solid 1px $ibc;\r\n }\r\n\r\n .pl-list {\r\n overflow: hidden;\r\n }\r\n\r\n .pl-cascade-item {\r\n padding: 5px 0 5px 12px;\r\n line-height: 22px;\r\n font-weight: 400;\r\n font-size: 13px;\r\n color: $itc;\r\n background-color: white;\r\n transition: all 300ms $transition;\r\n cursor: pointer;\r\n\r\n .pl-cascade-content {\r\n padding-right: 30px;\r\n position: relative;\r\n\r\n .pl-cascade-arrow {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n right: 0;\r\n width: 30px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: $icc;\r\n }\r\n }\r\n\r\n &.pl-cascade-item-expand, &:hover {\r\n color: $ihc;\r\n background-color: $disabled;\r\n }\r\n\r\n &.pl-cascade-item-active {\r\n color: $colorPrimary;\r\n background-color: rgba($colorPrimary, 0.1);\r\n }\r\n\r\n &.pl-cascade-empty {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n padding-left: 0;\r\n font-size: 12px;\r\n color: $disabledText;\r\n background-color: transparent;\r\n cursor: auto;\r\n\r\n .pl-icon {\r\n margin-bottom: 8px;\r\n font-size: 20px;\r\n }\r\n }\r\n\r\n &.pl-cascade-item-disabled {\r\n background-color: transparent;\r\n color: $disabledText;\r\n cursor: not-allowed;\r\n }\r\n }\r\n\r\n &.pl-cascade-filter-list {\r\n width: 360px;\r\n }\r\n }\r\n\r\n .pl-loading-mask {\r\n top: 1px;\r\n bottom: 1px;\r\n left: 1px;\r\n right: 1px;\r\n }\r\n }\r\n}\r\n",
|
|
64
64
|
"@include theme {\r\n [service-name=pl-popper-service-cascade] {\r\n .pl-popper-content-inner {\r\n padding: 0 !important;\r\n }\r\n\r\n .pl-cascade-panel {\r\n border: none !important;\r\n }\r\n }\r\n}"
|
|
65
65
|
],
|
|
66
66
|
"seq": 18
|
|
@@ -96,10 +96,10 @@
|
|
|
96
96
|
{
|
|
97
97
|
"name": "PlColorPicker",
|
|
98
98
|
"codes": [
|
|
99
|
-
"@include theme {\r\n\r\n .pl-color-button {\r\n border-radius: 2px;\r\n height: 24px;\r\n width: 24px;\r\n border: solid 1px $ibc;\r\n padding: 2px;\r\n box-sizing: border-box;\r\n display: inline-block;\r\n cursor: pointer;\r\n\r\n .pl-color-button-background {\r\n background-size: 7px 7px;\r\n border-radius: 2px;\r\n box-sizing: border-box;\r\n height: 100%;\r\n width: 100%;\r\n\r\n .pl-color-button-color {\r\n height: 100%;\r\n width: 100%;\r\n }\r\n }\r\n }\r\n\r\n .pl-color-picker {\r\n @include sizeMixin(input) {\r\n .pl-color-button {\r\n height: $value/2;\r\n width: $value/2;\r\n }\r\n }\r\n }\r\n}",
|
|
100
99
|
"@include theme {\r\n .pl-color-panel {\r\n display: inline-block;\r\n font-size: 0;\r\n padding: 8px 12px;\r\n\r\n & > div:first-child {\r\n white-space: nowrap;\r\n }\r\n\r\n .pl-color-hue-slider {\r\n margin-top: 8px;\r\n display: block;\r\n }\r\n\r\n .pl-color-alpha-slider {\r\n margin-left: 8px;\r\n }\r\n\r\n .pl-color-panel-input-group {\r\n margin-top: 8px;\r\n\r\n .pl-input {\r\n\r\n .pl-input-inner {\r\n text-align: center;\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n border-right: none;\r\n }\r\n }\r\n\r\n .pl-button-group {\r\n & > .pl-button:first-child {\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n border-left: none;\r\n }\r\n }\r\n }\r\n }\r\n}",
|
|
101
|
-
"@include theme {\r\n .pl-color-
|
|
100
|
+
"@include theme {\r\n\r\n .pl-color-button {\r\n border-radius: 2px;\r\n height: 24px;\r\n width: 24px;\r\n border: solid 1px $ibc;\r\n padding: 2px;\r\n box-sizing: border-box;\r\n display: inline-block;\r\n cursor: pointer;\r\n\r\n .pl-color-button-background {\r\n background-size: 7px 7px;\r\n border-radius: 2px;\r\n box-sizing: border-box;\r\n height: 100%;\r\n width: 100%;\r\n\r\n .pl-color-button-color {\r\n height: 100%;\r\n width: 100%;\r\n }\r\n }\r\n }\r\n\r\n .pl-color-picker {\r\n @include sizeMixin(input) {\r\n .pl-color-button {\r\n height: $value/2;\r\n width: $value/2;\r\n }\r\n }\r\n }\r\n}",
|
|
102
101
|
"@include theme {\r\n .pl-color-hue-slider {\r\n background: linear-gradient(90deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red);\r\n display: inline-block;\r\n height: 10px;\r\n position: relative;\r\n cursor: pointer;\r\n border-radius: 10px;\r\n\r\n .pl-color-hue-slider-thumb {\r\n display: inline-block;\r\n height: 100%;\r\n background-color: white;\r\n position: absolute;\r\n top: 0;\r\n border: solid 1px $colorInfo;\r\n box-sizing: border-box;\r\n border-radius: 100px;\r\n }\r\n }\r\n}",
|
|
102
|
+
"@include theme {\r\n .pl-color-alpha-slider {\r\n width: 10px;\r\n background-size: 10px 10px;\r\n position: relative;\r\n cursor: pointer;\r\n border-radius: 10px;\r\n display: inline-block;\r\n\r\n .pl-color-alpha-shadow, .pl-color-alpha-thumb {\r\n pointer-events: none;\r\n }\r\n\r\n .pl-color-alpha-shadow {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n border-radius: 10px;\r\n }\r\n\r\n .pl-color-alpha-thumb {\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 10px;\r\n border: solid 1px $colorInfo;\r\n display: inline-block;\r\n background-color: white;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n box-sizing: border-box;\r\n }\r\n }\r\n}",
|
|
103
103
|
"@include theme {\r\n .pl-color-sv-panel {\r\n position: relative;\r\n box-shadow: 0 0px 4px 0 rgba(0, 0, 0, 0.4);\r\n cursor: pointer;\r\n display: inline-block;\r\n\r\n &:before, &:after, & span {\r\n pointer-events: none;\r\n }\r\n\r\n &, &:before, &:after {\r\n border-radius: 2px;\r\n }\r\n\r\n &:before, &:after {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n content: '';\r\n }\r\n\r\n &:before {\r\n background: linear-gradient(to right, white, rgba(255, 255, 255, 0));\r\n }\r\n\r\n &:after {\r\n background: linear-gradient(to top, black, rgba(255, 255, 255, 0));\r\n }\r\n\r\n .pl-color-sv-thumb {\r\n display: inline-block;\r\n position: absolute;\r\n width: 1px;\r\n height: 1px;\r\n left: 0;\r\n top: 0;\r\n z-index: 1;\r\n\r\n &:after {\r\n display: inline-block;\r\n width: 10px;\r\n height: 10px;\r\n border: solid 1px #999;\r\n border-radius: 10px;\r\n position: absolute;\r\n top: -5px;\r\n left: -5px;\r\n content: '';\r\n box-sizing: border-box;\r\n background-color: white;\r\n }\r\n }\r\n }\r\n}"
|
|
104
104
|
],
|
|
105
105
|
"seq": 27
|
|
@@ -114,14 +114,14 @@
|
|
|
114
114
|
{
|
|
115
115
|
"name": "PlDialog",
|
|
116
116
|
"codes": [
|
|
117
|
-
".pl-dialog {\r\n z-index: 1500;\r\n\r\n position: fixed;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: auto;\r\n transition: all linear 300ms;\r\n\r\n &:before {\r\n content: '';\r\n background-color: rgba(0, 0, 0, 0.2);\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n user-select: none;\r\n transition: all linear 300ms;\r\n }\r\n\r\n .pl-dialog-body {\r\n background-color: white;\r\n position: relative;\r\n z-index: 1;\r\n transition: all cubic-bezier(0.410, 1.110, 0.615, 0.995) 300ms;\r\n box-shadow: 0 0 20px 8px rgba(100, 100, 100, 0.1);\r\n overflow: hidden;\r\n pointer-events: auto;\r\n box-sizing: border-box;\r\n\r\n .pl-dialog-head {\r\n padding: 12px 24px;\r\n background-color: white;\r\n position: relative;\r\n font-size: 14px;\r\n font-weight: 500;\r\n\r\n .pl-dialog-head-close {\r\n font-size: 18px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n right: 10px;\r\n display: flex;\r\n align-items: center;\r\n cursor: pointer;\r\n padding: 0 8px;\r\n opacity: 0.75;\r\n color: inherit;\r\n }\r\n }\r\n\r\n .pl-dialog-content {\r\n overflow: auto;\r\n padding: 16px 24px;\r\n font-size: 14px;\r\n box-sizing: border-box;\r\n }\r\n\r\n .pl-dialog-foot {\r\n padding: 8px 24px;\r\n display: flex;\r\n justify-content: flex-end;\r\n align-items: center;\r\n\r\n & > * + * {\r\n margin-left: 8px;\r\n }\r\n }\r\n }\r\n\r\n &.pl-dialog-fullscreen {\r\n padding: 0 !important;\r\n\r\n .pl-dialog-body {\r\n position: fixed;\r\n height: 100% !important;\r\n width: 100% !important;\r\n }\r\n }\r\n\r\n &.pl-dialog-no-mask {\r\n pointer-events: none;\r\n\r\n &:before {\r\n display: none;\r\n }\r\n }\r\n\r\n &.pl-dialog-vertical-center {\r\n padding: 0;\r\n align-items: center;\r\n }\r\n\r\n &.pl-dialog-no-content-padding {\r\n .pl-dialog-content {\r\n padding: 0;\r\n }\r\n }\r\n}\r\n\r\n.pl-transition-dialog {\r\n /*@formatter:off*/\r\n &.pl-transition-dialog-enter {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {transform: translateY(-5vh) scale(0.85);opacity: 0;}\r\n }\r\n &.pl-transition-dialog-enter-active {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {transform: translateY(0) scale(1);opacity: 1;}\r\n }\r\n &.pl-transition-dialog-exit {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {transform: translateY(0) scale(1);opacity: 1;}\r\n }\r\n &.pl-transition-dialog-exit-active {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {transform: translateY(-5vh) scale(0.85);opacity: 0;}\r\n }\r\n &.pl-transition-dialog-enter-active, &.pl-transition-dialog-exit-active {\r\n transition: opacity 300ms linear, transform 300ms $transition;\r\n }\r\n /*@formatter:on*/\r\n}\r\n\r\n@include theme {\r\n .pl-dialog {\r\n .pl-dialog-body {\r\n color: $itc;\r\n\r\n .pl-dialog-head {\r\n color: $ihc;\r\n border-bottom: solid 1px $ibl;\r\n background: #fafafa;\r\n\r\n .pl-dialog-head-close .pl-button.pl-button-mode-text.pl-button-status-primary {\r\n color: $icc;\r\n\r\n &:hover {\r\n color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n .pl-dialog-foot {\r\n border-top: solid 1px $ibl;\r\n //background: #fafafa;\r\n }\r\n\r\n @include shapeMixin(dialog-body) {\r\n border-radius: $value;\r\n }\r\n }\r\n }\r\n\r\n $dialogTransition: (\r\n left:translate3d(-100%, 0, 0),\r\n right:translate3d(100%, 0, 0),\r\n top:translate3d(0, -100%, 0),\r\n bottom:translate3d(0, 100%, 0),\r\n );\r\n\r\n @each $key, $value in $dialogTransition {\r\n .pl-transition-dialog-#{$key} {\r\n /*@formatter:off*/\r\n &.pl-transition-dialog-#{$key}-enter {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {transform: $value;}\r\n }\r\n &.pl-transition-dialog-#{$key}-enter-active {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {transform: translate3d(0, 0, 0);}\r\n }\r\n &.pl-transition-dialog-#{$key}-exit {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {transform: translate3d(0, 0, 0);}\r\n }\r\n &.pl-transition-dialog-#{$key}-exit-active {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {transform: $value;}\r\n }\r\n &.pl-transition-dialog-#{$key}-enter-active, &.pl-transition-dialog-#{$key}-exit-active {\r\n .pl-dialog-body {\r\n transition: all $transition2 300ms;\r\n }\r\n }\r\n /*@formatter:on*/\r\n }\r\n }\r\n}"
|
|
117
|
+
".pl-dialog {\r\n z-index: 1500;\r\n\r\n position: fixed;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: auto;\r\n transition: all linear 300ms;\r\n\r\n &:before {\r\n content: '';\r\n background-color: rgba(0, 0, 0, 0.2);\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n user-select: none;\r\n transition: all linear 300ms;\r\n }\r\n\r\n .pl-dialog-body {\r\n background-color: white;\r\n position: relative;\r\n z-index: 1;\r\n transition: all cubic-bezier(0.410, 1.110, 0.615, 0.995) 300ms;\r\n box-shadow: 0 0 20px 8px rgba(100, 100, 100, 0.1);\r\n overflow: hidden;\r\n pointer-events: auto;\r\n box-sizing: border-box;\r\n\r\n .pl-dialog-head {\r\n padding: 12px 24px;\r\n background-color: white;\r\n position: relative;\r\n font-size: 14px;\r\n font-weight: 500;\r\n\r\n .pl-dialog-head-close {\r\n font-size: 18px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n right: 10px;\r\n display: flex;\r\n align-items: center;\r\n cursor: pointer;\r\n padding: 0 8px;\r\n opacity: 0.75;\r\n color: inherit;\r\n }\r\n }\r\n\r\n .pl-dialog-content {\r\n overflow: auto;\r\n padding: 16px 24px;\r\n font-size: 14px;\r\n box-sizing: border-box;\r\n }\r\n\r\n .pl-dialog-foot {\r\n padding: 8px 24px;\r\n display: flex;\r\n justify-content: flex-end;\r\n align-items: center;\r\n\r\n & > * + * {\r\n margin-left: 8px;\r\n }\r\n }\r\n }\r\n\r\n &.pl-dialog-fullscreen {\r\n padding: 0 !important;\r\n\r\n .pl-dialog-body {\r\n position: fixed;\r\n height: 100% !important;\r\n width: 100% !important;\r\n }\r\n }\r\n\r\n &.pl-dialog-no-mask {\r\n pointer-events: none;\r\n\r\n &:before {\r\n display: none;\r\n }\r\n }\r\n\r\n &.pl-dialog-vertical-center {\r\n padding: 0;\r\n align-items: center;\r\n }\r\n\r\n &.pl-dialog-no-content-padding {\r\n .pl-dialog-content {\r\n padding: 0;\r\n }\r\n }\r\n}\r\n\r\n.pl-transition-dialog {\r\n /*@formatter:off*/\r\n &.pl-transition-dialog-enter {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {transform: translateY(-5vh) scale(0.85);opacity: 0;}\r\n }\r\n &.pl-transition-dialog-enter-active {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {transform: translateY(0) scale(1);opacity: 1;}\r\n }\r\n &.pl-transition-dialog-exit {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {transform: translateY(0) scale(1);opacity: 1;}\r\n }\r\n &.pl-transition-dialog-exit-active {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {transform: translateY(-5vh) scale(0.85);opacity: 0;}\r\n }\r\n &.pl-transition-dialog-enter-active, &.pl-transition-dialog-exit-active {\r\n transition: opacity 300ms linear, transform 300ms $transition;\r\n }\r\n /*@formatter:on*/\r\n}\r\n\r\n@include theme {\r\n .pl-dialog {\r\n .pl-dialog-body {\r\n color: $itc;\r\n\r\n .pl-dialog-head {\r\n color: $ihc;\r\n border-bottom: solid 1px $ibl;\r\n background: #fafafa;\r\n\r\n .pl-dialog-head-close .pl-button.pl-button-mode-text.pl-button-status-primary {\r\n color: $icc;\r\n\r\n &:hover {\r\n color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n .pl-dialog-foot {\r\n border-top: solid 1px $ibl;\r\n //background: #fafafa;\r\n }\r\n\r\n @include shapeMixin(dialog-body) {\r\n border-radius: $value;\r\n }\r\n }\r\n }\r\n\r\n $dialogTransition: (\r\n left:translate3d(-100%, 0, 0),\r\n right:translate3d(100%, 0, 0),\r\n top:translate3d(0, -100%, 0),\r\n bottom:translate3d(0, 100%, 0),\r\n );\r\n\r\n @each $key, $value in $dialogTransition {\r\n .pl-transition-dialog-#{$key} {\r\n /*@formatter:off*/\r\n &.pl-transition-dialog-#{$key}-enter {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {opacity: 0;transform: $value;}\r\n }\r\n &.pl-transition-dialog-#{$key}-enter-active {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {opacity: 1;transform: translate3d(0, 0, 0);}\r\n }\r\n &.pl-transition-dialog-#{$key}-exit {\r\n &:before {opacity: 1;}\r\n .pl-dialog-body {opacity: 1;transform: translate3d(0, 0, 0);}\r\n }\r\n &.pl-transition-dialog-#{$key}-exit-active {\r\n &:before {opacity: 0;}\r\n .pl-dialog-body {opacity: 0;transform: $value;}\r\n }\r\n &.pl-transition-dialog-#{$key}-enter-active, &.pl-transition-dialog-#{$key}-exit-active {\r\n .pl-dialog-body {\r\n transition: all $transition2 300ms;\r\n }\r\n }\r\n /*@formatter:on*/\r\n }\r\n }\r\n}"
|
|
118
118
|
],
|
|
119
119
|
"seq": 30
|
|
120
120
|
},
|
|
121
121
|
{
|
|
122
122
|
"name": "PlDropdown",
|
|
123
123
|
"codes": [
|
|
124
|
-
"@include theme {\r\n .pl-dropdown-option {\r\n padding: 5px 12px;\r\n font-weight: 400;\r\n font-size: 14px;\r\n line-height: 22px;\r\n color: $itc;\r\n background-color: white;\r\n transition: background-color linear 200ms;\r\n\r\n .pl-dropdown-option-icon {\r\n margin-right: 6px;\r\n opacity: 0.5;\r\n }\r\n\r\n &:not(.pl-dropdown-option-disabled):hover {\r\n background-color: #f2f2f2;\r\n cursor: pointer;\r\n }\r\n\r\n &.pl-dropdown-option-disabled {\r\n color: $disabledText;\r\n cursor: not-allowed;\r\n }\r\n\r\n &.pl-dropdown-option-align-left {\r\n text-align: left\r\n }\r\n\r\n &.pl-dropdown-option-align-center {\r\n text-align: center\r\n }\r\n\r\n &.pl-dropdown-option-align-right {\r\n text-align: right\r\n }\r\n\r\n &.pl-dropdown-option-no-wrap {\r\n white-space: nowrap;\r\n }\r\n }\r\n\r\n .pl-dropdown-group {\r\n\r\n .pl-dropdown-group-title {\r\n font-size: 12px;\r\n color: $ipc;\r\n padding: 8px 12px;\r\n margin-top: 4px;\r\n border-bottom: solid 1px $ibl;\r\n\r\n & > .pl-icon {\r\n margin-right: 6px;\r\n }\r\n }\r\n\r\n .pl-dropdown-group-content {\r\n padding: 4px
|
|
124
|
+
"@include theme {\r\n .pl-dropdown-option {\r\n padding: 5px 12px;\r\n font-weight: 400;\r\n font-size: 14px;\r\n line-height: 22px;\r\n color: $itc;\r\n background-color: white;\r\n transition: background-color linear 200ms;\r\n\r\n .pl-dropdown-option-icon {\r\n margin-right: 6px;\r\n opacity: 0.5;\r\n }\r\n\r\n &:not(.pl-dropdown-option-disabled):hover {\r\n background-color: #f2f2f2;\r\n cursor: pointer;\r\n }\r\n\r\n &.pl-dropdown-option-disabled {\r\n color: $disabledText;\r\n cursor: not-allowed;\r\n }\r\n\r\n &.pl-dropdown-option-align-left {\r\n text-align: left\r\n }\r\n\r\n &.pl-dropdown-option-align-center {\r\n text-align: center\r\n }\r\n\r\n &.pl-dropdown-option-align-right {\r\n text-align: right\r\n }\r\n\r\n &.pl-dropdown-option-no-wrap {\r\n white-space: nowrap;\r\n }\r\n }\r\n\r\n .pl-dropdown-group {\r\n\r\n .pl-dropdown-group-title {\r\n font-size: 12px;\r\n color: $ipc;\r\n padding: 8px 12px;\r\n margin-top: 4px;\r\n border-bottom: solid 1px $ibl;\r\n\r\n & > .pl-icon {\r\n margin-right: 6px;\r\n }\r\n }\r\n\r\n .pl-dropdown-group-content {\r\n padding: 4px 0;\r\n }\r\n\r\n &.pl-dropdown-no-title:not(:last-child) {\r\n border-bottom: solid 1px $ibc;\r\n }\r\n\r\n }\r\n}\r\n"
|
|
125
125
|
],
|
|
126
126
|
"seq": 31
|
|
127
127
|
},
|
|
@@ -149,7 +149,7 @@
|
|
|
149
149
|
{
|
|
150
150
|
"name": "PlInput",
|
|
151
151
|
"codes": [
|
|
152
|
-
"@include theme {\r\n .pl-input, .pl-textarea {\r\n display: inline-block;\r\n color: $itc;\r\n font-family: $font;\r\n background-color: white;\r\n vertical-align: baseline;\r\n\r\n /*---------------------------------------public-------------------------------------------*/\r\n .pl-input-inner, .pl-textarea-inner {\r\n width: 180px;\r\n padding: 0;\r\n display: inline-block;\r\n outline: none;\r\n border: solid 1px $ibc;\r\n box-sizing: border-box;\r\n box-shadow: 0 0 0 0 transparent;\r\n transition: all 150ms linear;\r\n color: inherit;\r\n font-family: inherit;\r\n\r\n input, textarea, button {\r\n color: inherit;\r\n font-family: inherit;\r\n }\r\n\r\n input {\r\n padding: 0;\r\n }\r\n }\r\n\r\n .pl-input-custom-placeholder {\r\n color: $ipc;\r\n }\r\n\r\n input, textarea {\r\n &::placeholder {\r\n color: $ipc;\r\n }\r\n\r\n &::-ms-clear {\r\n display: none;\r\n }\r\n\r\n &::-webkit-outer-spin-button,\r\n &::-webkit-inner-spin-button {\r\n -webkit-appearance: none !important;\r\n margin: 0;\r\n }\r\n\r\n &:-webkit-autofill {\r\n background-color: white !important;\r\n -webkit-transition: background-color 10000s cubic-bezier(1, -100, 1, -100) 0s !important;\r\n }\r\n }\r\n\r\n &:not(.pl-input-disabled) {\r\n\r\n &.pl-input-focus {\r\n .pl-input-inner, .pl-textarea-inner {\r\n border-color: $colorPrimary;\r\n box-shadow: 0 0 0 2px rgba(18, 180, 165, 0.2);\r\n }\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n &:focus {\r\n border-color: $colorPrimary;\r\n box-shadow: 0 0 0 2px rgba(18, 180, 165, 0.2);\r\n }\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n &:hover {\r\n border-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n @include shapeMixin(input) {\r\n .pl-input-inner, .pl-textarea-inner {\r\n border-radius: $value;\r\n }\r\n }\r\n\r\n @include sizeMixin(input) {\r\n &.pl-input-size-large {\r\n\r\n .pl-input-inner, .pl-textarea-inner, input {\r\n font-size: 16px;\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 12px;\r\n padding-right: 12px;\r\n }\r\n\r\n &.pl-input-shape-round {\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 24px;\r\n padding-right: 24px;\r\n }\r\n }\r\n }\r\n &.pl-input-size-normal {\r\n\r\n .pl-input-inner, .pl-textarea-inner, input {\r\n font-size: 14px;\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 10px;\r\n padding-right: 10px;\r\n }\r\n\r\n &.pl-input-shape-round {\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 20px;\r\n padding-right: 20px;\r\n }\r\n }\r\n }\r\n &.pl-input-size-mini {\r\n\r\n .pl-input-inner, .pl-textarea-inner, input {\r\n font-size: 12px;\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 8px;\r\n padding-right: 8px;\r\n }\r\n\r\n &.pl-input-shape-round {\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n @include statusMixin(input) {\r\n &:not(.pl-input-disabled) {\r\n\r\n &.pl-input-focus {\r\n .pl-input-inner, .pl-textarea-inner {\r\n box-shadow: 0 0 0 2px mix($value, white, 20%);\r\n }\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n border-color: $value;\r\n color: $value;\r\n background-color: mix($value, white, 5%);\r\n\r\n &:focus {\r\n box-shadow: 0 0 0 2px mix($value, white, 20%);\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-input-disabled {\r\n .pl-input-inner, .pl-textarea-inner {\r\n background-color: $disabled;\r\n cursor: not-allowed;\r\n color: $disabledText;\r\n }\r\n }\r\n\r\n &.pl-input-block {\r\n width: 100%;\r\n display: block;\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n width: 100%;\r\n }\r\n\r\n }\r\n\r\n &.pl-input-fill-group {\r\n flex: 1;\r\n\r\n & > .pl-input-inner {\r\n width: 100% !important;\r\n }\r\n\r\n &.pl-input-custom {\r\n .pl-input-inner, .pl-input-custom-inner, input {\r\n width: 100% !important;\r\n }\r\n }\r\n }\r\n\r\n\r\n /*align*/\r\n &.pl-input-align-left {\r\n .pl-input-inner, input {\r\n text-align: left\r\n }\r\n }\r\n\r\n &.pl-input-align-center {\r\n .pl-input-inner, input {\r\n text-align: center;\r\n }\r\n }\r\n\r\n &.pl-input-align-right {\r\n .pl-input-inner, input {\r\n text-align: right;\r\n }\r\n }\r\n\r\n /*---------------------------------------specific size-------------------------------------------*/\r\n\r\n &.pl-input {\r\n @include sizeMixin(input) {\r\n .pl-input-inner {\r\n height: $value;\r\n }\r\n div.pl-input-inner {\r\n line-height: $value - 2;\r\n }\r\n }\r\n }\r\n\r\n &.pl-textarea {\r\n position: relative;\r\n display: inline-block;\r\n\r\n .pl-textarea-inner {\r\n float: left;\r\n }\r\n\r\n @include sizeMixin(input) {\r\n &.pl-input-size-large {\r\n .pl-textarea-inner {\r\n padding-top: 12px;\r\n padding-bottom: 12px;\r\n }\r\n }\r\n &.pl-input-size-normal {\r\n .pl-textarea-inner {\r\n padding-top: 8px;\r\n padding-bottom: 8px;\r\n }\r\n }\r\n &.pl-input-size-mini {\r\n .pl-textarea-inner {\r\n padding-top: 4px;\r\n padding-bottom: 4px;\r\n }\r\n }\r\n }\r\n\r\n .pl-textarea-hidden {\r\n position: absolute;\r\n pointer-events: none;\r\n opacity: 0;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n }\r\n }\r\n }\r\n\r\n /*---------------------------------------input suffix prefix-------------------------------------------*/\r\n .pl-input {\r\n position: relative;\r\n\r\n .pl-input-suffix-icon, .pl-input-prefix-icon {\r\n user-select: none;\r\n cursor: pointer;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n box-sizing: border-box;\r\n text-align: center;\r\n color: $icc;\r\n font-size: 12px;\r\n transition: all 300ms linear;\r\n z-index: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n right: 2px;\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n left: 2px;\r\n }\r\n\r\n @include sizeMixin(input) {\r\n\r\n &.pl-input-suffix-padding {\r\n &.pl-input-size-large {\r\n .pl-input-inner {\r\n padding-right: #{12px*3};\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n width: #{12px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-normal {\r\n .pl-input-inner {\r\n padding-right: #{10px*3};\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n width: #{10px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-mini {\r\n .pl-input-inner {\r\n padding-right: #{8px*3};\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n width: #{8px*3};\r\n }\r\n }\r\n }\r\n &.pl-input-prefix-padding {\r\n &.pl-input-size-large {\r\n .pl-input-inner {\r\n padding-left: #{12px*3};\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n width: #{12px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-normal {\r\n .pl-input-inner {\r\n padding-left: #{10px*3};\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n width: #{10px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-mini {\r\n .pl-input-inner {\r\n padding-left: #{8px*3};\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n width: #{8px*3};\r\n }\r\n }\r\n }\r\n }\r\n\r\n\r\n &.pl-input-clear {\r\n &:not(.pl-input-suffix) {\r\n &.pl-input-empty {\r\n .pl-input-clear-icon {\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n }\r\n }\r\n\r\n &.pl-input-suffix {\r\n .pl-input-clear-icon {\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n\r\n &:not(.pl-input-empty) {\r\n &:hover:not(.pl-input-not-editable) {\r\n .pl-input-clear-icon {\r\n opacity: 1;\r\n pointer-events: auto;\r\n }\r\n\r\n .pl-input-suffix-icon:not(.pl-input-clear-icon) {\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-loading {\r\n cursor: not-allowed;\r\n\r\n &:before {\r\n position: absolute;\r\n top: 2px;\r\n bottom: 2px;\r\n left: 2px;\r\n right: 2px;\r\n background-color: white;\r\n content: '';\r\n }\r\n }\r\n\r\n .pl-input-inner-hidden {\r\n position: fixed;\r\n float: left;\r\n z-index: -999;\r\n pointer-events: none;\r\n opacity: 0;\r\n display: none;\r\n }\r\n }\r\n\r\n .pl-input-container {\r\n width: 100%;\r\n display: table;\r\n\r\n .pl-input-prepend, .pl-input-append {\r\n background-color: #f5f7fa;\r\n color: $itc;\r\n vertical-align: baseline;\r\n display: table-cell;\r\n position: relative;\r\n border: 1px solid #dcdfe6;\r\n border-radius: 2px;\r\n padding: 0 12px;\r\n overflow: hidden;\r\n\r\n width: 1px;\r\n white-space: nowrap;\r\n\r\n &.pl-input-prepend {\r\n border-right: none;\r\n }\r\n\r\n &.pl-input-append {\r\n border-left: none;\r\n }\r\n\r\n & > .pl-input, & > .pl-button {\r\n display: inline-block;\r\n margin: -1px -13px -1px -12px;\r\n }\r\n\r\n & > .pl-input {\r\n .pl-input-inner {\r\n border: none !important;\r\n }\r\n }\r\n }\r\n\r\n .pl-input {\r\n display: table-cell;\r\n position: relative;\r\n z-index: 1;\r\n\r\n .pl-input-inner {\r\n width: 100%;\r\n }\r\n }\r\n\r\n & > *:not(:last-child):not(:first-child) {\r\n border-radius: 0;\r\n\r\n &.pl-input {\r\n .pl-input-inner {\r\n border-radius: 0;\r\n }\r\n }\r\n }\r\n\r\n & > *:first-child {\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n\r\n &.pl-input {\r\n .pl-input-inner {\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n }\r\n }\r\n }\r\n\r\n & > *:last-child {\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n\r\n &.pl-input {\r\n .pl-input-inner {\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-input-custom {\r\n .pl-input-inner {\r\n width: auto !important;\r\n }\r\n\r\n .pl-input-custom-inner {\r\n display: flex;\r\n align-content: stretch;\r\n height: 100%;\r\n\r\n & > span {\r\n color: $icc;\r\n }\r\n\r\n .pl-input-custom-inner-input {\r\n border: none;\r\n outline: none;\r\n width: 90px;\r\n height: 100%;\r\n background: transparent;\r\n }\r\n\r\n &[range=true] {\r\n .pl-input-custom-inner-input {\r\n text-align: center;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-form-item-content {\r\n .pl-input-custom {\r\n .pl-input-custom-inner {\r\n display: flex;\r\n align-items: center;\r\n\r\n .pl-input-custom-inner-input {\r\n flex: 1;\r\n font-size: inherit;\r\n color: inherit;\r\n }\r\n }\r\n\r\n &.pl-input-disabled {\r\n .pl-input-custom-inner-input {\r\n cursor: not-allowed;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-input {\r\n &.pl-input-tags {\r\n user-select: none;\r\n vertical-align: top;\r\n\r\n .pl-input-inner {\r\n padding-left: 3px !important;\r\n height: auto !important;\r\n line-height: normal !important;\r\n cursor: pointer;\r\n }\r\n\r\n .pl-input-inner-tags {\r\n .pl-input-inner-tag-item {\r\n display: inline-block;\r\n font-size: 12px;\r\n border: solid 1px $ibl;\r\n background-color: #fafafa;\r\n padding: 0 6px;\r\n border-radius: 2px;\r\n margin: 3px;\r\n color: inherit;\r\n\r\n span + .pl-icon {\r\n margin-left: 3px;\r\n color: $icc;\r\n }\r\n\r\n &.pl-input-inner-tag-item-takeover {\r\n display: inline-block;\r\n padding: 0 0;\r\n margin-left: 0;\r\n margin-right: 0;\r\n width: 4px;\r\n opacity: 0;\r\n }\r\n }\r\n }\r\n\r\n @include sizeMixin(input) {\r\n .pl-input-inner {\r\n min-height: $value;\r\n\r\n .pl-input-inner-tags {\r\n .pl-input-inner-tag-item {\r\n line-height: $value - 9;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-input-disabled {\r\n .pl-input-inner-tag-item {\r\n cursor: not-allowed;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"
|
|
152
|
+
"@include theme {\r\n .pl-input, .pl-textarea {\r\n display: inline-block;\r\n color: $itc;\r\n font-family: $font;\r\n background-color: white;\r\n vertical-align: baseline;\r\n\r\n /*---------------------------------------public-------------------------------------------*/\r\n .pl-input-inner, .pl-textarea-inner {\r\n width: 180px;\r\n padding: 0;\r\n display: inline-block;\r\n outline: none;\r\n border: solid 1px $ibc;\r\n box-sizing: border-box;\r\n box-shadow: 0 0 0 0 transparent;\r\n transition: all 150ms linear;\r\n color: inherit;\r\n font-family: inherit;\r\n\r\n input, textarea, button {\r\n color: inherit;\r\n font-family: inherit;\r\n }\r\n\r\n input {\r\n padding: 0;\r\n }\r\n }\r\n\r\n .pl-input-custom-placeholder {\r\n color: $ipc;\r\n margin-left: 6px;\r\n }\r\n\r\n input, textarea {\r\n &::placeholder {\r\n color: $ipc;\r\n }\r\n\r\n &::-ms-clear {\r\n display: none;\r\n }\r\n\r\n &::-webkit-outer-spin-button,\r\n &::-webkit-inner-spin-button {\r\n -webkit-appearance: none !important;\r\n margin: 0;\r\n }\r\n\r\n &:-webkit-autofill {\r\n background-color: white !important;\r\n -webkit-transition: background-color 10000s cubic-bezier(1, -100, 1, -100) 0s !important;\r\n }\r\n }\r\n\r\n &:not(.pl-input-disabled) {\r\n\r\n &.pl-input-focus {\r\n .pl-input-inner, .pl-textarea-inner {\r\n border-color: $colorPrimary;\r\n box-shadow: 0 0 0 2px rgba(18, 180, 165, 0.2);\r\n }\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n &:focus {\r\n border-color: $colorPrimary;\r\n box-shadow: 0 0 0 2px rgba(18, 180, 165, 0.2);\r\n }\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n &:hover {\r\n border-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n @include shapeMixin(input) {\r\n .pl-input-inner, .pl-textarea-inner {\r\n border-radius: $value;\r\n }\r\n }\r\n\r\n @include sizeMixin(input) {\r\n &.pl-input-size-large {\r\n\r\n .pl-input-inner, .pl-textarea-inner, input {\r\n font-size: 16px;\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 12px;\r\n padding-right: 12px;\r\n }\r\n\r\n &.pl-input-shape-round {\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 24px;\r\n padding-right: 24px;\r\n }\r\n }\r\n }\r\n &.pl-input-size-normal {\r\n\r\n .pl-input-inner, .pl-textarea-inner, input {\r\n font-size: 14px;\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 10px;\r\n padding-right: 10px;\r\n }\r\n\r\n &.pl-input-shape-round {\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 20px;\r\n padding-right: 20px;\r\n }\r\n }\r\n }\r\n &.pl-input-size-mini {\r\n\r\n .pl-input-inner, .pl-textarea-inner, input {\r\n font-size: 12px;\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 8px;\r\n padding-right: 8px;\r\n }\r\n\r\n &.pl-input-shape-round {\r\n .pl-input-inner, .pl-textarea-inner {\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n @include statusMixin(input) {\r\n &:not(.pl-input-disabled) {\r\n\r\n &.pl-input-focus {\r\n .pl-input-inner, .pl-textarea-inner {\r\n box-shadow: 0 0 0 2px mix($value, white, 20%);\r\n }\r\n }\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n border-color: $value;\r\n color: $value;\r\n background-color: mix($value, white, 5%);\r\n\r\n &:focus {\r\n box-shadow: 0 0 0 2px mix($value, white, 20%);\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-input-disabled {\r\n .pl-input-inner, .pl-textarea-inner {\r\n background-color: $disabled;\r\n cursor: not-allowed;\r\n color: $disabledText;\r\n }\r\n }\r\n\r\n &.pl-input-block {\r\n width: 100%;\r\n display: block;\r\n\r\n .pl-input-inner, .pl-textarea-inner {\r\n width: 100%;\r\n }\r\n\r\n }\r\n\r\n &.pl-input-fill-group {\r\n flex: 1;\r\n\r\n & > .pl-input-inner {\r\n width: 100% !important;\r\n }\r\n\r\n &.pl-input-custom {\r\n .pl-input-inner, .pl-input-custom-inner, input {\r\n width: 100% !important;\r\n }\r\n }\r\n }\r\n\r\n\r\n /*align*/\r\n &.pl-input-align-left {\r\n .pl-input-inner, input {\r\n text-align: left\r\n }\r\n }\r\n\r\n &.pl-input-align-center {\r\n .pl-input-inner, input {\r\n text-align: center;\r\n }\r\n }\r\n\r\n &.pl-input-align-right {\r\n .pl-input-inner, input {\r\n text-align: right;\r\n }\r\n }\r\n\r\n /*---------------------------------------specific size-------------------------------------------*/\r\n\r\n &.pl-input {\r\n @include sizeMixin(input) {\r\n .pl-input-inner {\r\n height: $value;\r\n }\r\n div.pl-input-inner {\r\n line-height: $value - 2;\r\n }\r\n }\r\n }\r\n\r\n &.pl-textarea {\r\n position: relative;\r\n display: inline-block;\r\n\r\n .pl-textarea-inner {\r\n float: left;\r\n }\r\n\r\n @include sizeMixin(input) {\r\n &.pl-input-size-large {\r\n .pl-textarea-inner {\r\n padding-top: 12px;\r\n padding-bottom: 12px;\r\n }\r\n }\r\n &.pl-input-size-normal {\r\n .pl-textarea-inner {\r\n padding-top: 8px;\r\n padding-bottom: 8px;\r\n }\r\n }\r\n &.pl-input-size-mini {\r\n .pl-textarea-inner {\r\n padding-top: 4px;\r\n padding-bottom: 4px;\r\n }\r\n }\r\n }\r\n\r\n .pl-textarea-hidden {\r\n position: absolute;\r\n pointer-events: none;\r\n opacity: 0;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n }\r\n }\r\n }\r\n\r\n /*---------------------------------------input suffix prefix-------------------------------------------*/\r\n .pl-input {\r\n position: relative;\r\n\r\n .pl-input-suffix-icon, .pl-input-prefix-icon {\r\n user-select: none;\r\n cursor: pointer;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n box-sizing: border-box;\r\n text-align: center;\r\n color: $icc;\r\n font-size: 12px;\r\n transition: all 300ms linear;\r\n z-index: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n right: 2px;\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n left: 2px;\r\n }\r\n\r\n @include sizeMixin(input) {\r\n\r\n &.pl-input-suffix-padding {\r\n &.pl-input-size-large {\r\n .pl-input-inner {\r\n padding-right: #{12px*3};\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n width: #{12px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-normal {\r\n .pl-input-inner {\r\n padding-right: #{10px*3};\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n width: #{10px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-mini {\r\n .pl-input-inner {\r\n padding-right: #{8px*3};\r\n }\r\n\r\n .pl-input-suffix-icon {\r\n width: #{8px*3};\r\n }\r\n }\r\n }\r\n &.pl-input-prefix-padding {\r\n &.pl-input-size-large {\r\n .pl-input-inner {\r\n padding-left: #{12px*3};\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n width: #{12px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-normal {\r\n .pl-input-inner {\r\n padding-left: #{10px*3};\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n width: #{10px*3};\r\n }\r\n }\r\n\r\n &.pl-input-size-mini {\r\n .pl-input-inner {\r\n padding-left: #{8px*3};\r\n }\r\n\r\n .pl-input-prefix-icon {\r\n width: #{8px*3};\r\n }\r\n }\r\n }\r\n }\r\n\r\n\r\n &.pl-input-clear {\r\n &:not(.pl-input-suffix) {\r\n &.pl-input-empty {\r\n .pl-input-clear-icon {\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n }\r\n }\r\n\r\n &.pl-input-suffix {\r\n .pl-input-clear-icon {\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n\r\n &:not(.pl-input-empty) {\r\n &:hover:not(.pl-input-not-editable) {\r\n .pl-input-clear-icon {\r\n opacity: 1;\r\n pointer-events: auto;\r\n }\r\n\r\n .pl-input-suffix-icon:not(.pl-input-clear-icon) {\r\n opacity: 0;\r\n pointer-events: none;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-loading {\r\n cursor: not-allowed;\r\n\r\n &:before {\r\n position: absolute;\r\n top: 2px;\r\n bottom: 2px;\r\n left: 2px;\r\n right: 2px;\r\n background-color: white;\r\n content: '';\r\n }\r\n }\r\n\r\n .pl-input-inner-hidden {\r\n position: fixed;\r\n float: left;\r\n z-index: -999;\r\n pointer-events: none;\r\n opacity: 0;\r\n display: none;\r\n }\r\n }\r\n\r\n .pl-input-container {\r\n width: 100%;\r\n display: table;\r\n\r\n .pl-input-prepend, .pl-input-append {\r\n background-color: #f5f7fa;\r\n color: $itc;\r\n vertical-align: baseline;\r\n display: table-cell;\r\n position: relative;\r\n border: 1px solid #dcdfe6;\r\n border-radius: 2px;\r\n padding: 0 12px;\r\n overflow: hidden;\r\n\r\n width: 1px;\r\n white-space: nowrap;\r\n\r\n &.pl-input-prepend {\r\n border-right: none;\r\n }\r\n\r\n &.pl-input-append {\r\n border-left: none;\r\n }\r\n\r\n & > .pl-input, & > .pl-button {\r\n display: inline-block;\r\n margin: -1px -13px -1px -12px;\r\n }\r\n\r\n & > .pl-input {\r\n .pl-input-inner {\r\n border: none !important;\r\n }\r\n }\r\n }\r\n\r\n .pl-input {\r\n display: table-cell;\r\n position: relative;\r\n z-index: 1;\r\n\r\n .pl-input-inner {\r\n width: 100%;\r\n }\r\n }\r\n\r\n & > *:not(:last-child):not(:first-child) {\r\n border-radius: 0;\r\n\r\n &.pl-input {\r\n .pl-input-inner {\r\n border-radius: 0;\r\n }\r\n }\r\n }\r\n\r\n & > *:first-child {\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n\r\n &.pl-input {\r\n .pl-input-inner {\r\n border-top-right-radius: 0;\r\n border-bottom-right-radius: 0;\r\n }\r\n }\r\n }\r\n\r\n & > *:last-child {\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n\r\n &.pl-input {\r\n .pl-input-inner {\r\n border-top-left-radius: 0;\r\n border-bottom-left-radius: 0;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-input-custom {\r\n .pl-input-inner {\r\n width: auto !important;\r\n }\r\n\r\n .pl-input-custom-inner {\r\n display: flex;\r\n align-content: stretch;\r\n height: 100%;\r\n\r\n & > span {\r\n color: $icc;\r\n }\r\n\r\n .pl-input-custom-inner-input {\r\n border: none;\r\n outline: none;\r\n width: 90px;\r\n height: 100%;\r\n background: transparent;\r\n }\r\n\r\n &[range=true] {\r\n .pl-input-custom-inner-input {\r\n text-align: center;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-form-item-content {\r\n .pl-input-custom {\r\n .pl-input-custom-inner {\r\n display: flex;\r\n align-items: center;\r\n\r\n .pl-input-custom-inner-input {\r\n flex: 1;\r\n font-size: inherit;\r\n color: inherit;\r\n }\r\n }\r\n\r\n &.pl-input-disabled {\r\n .pl-input-custom-inner-input {\r\n cursor: not-allowed;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-input {\r\n &.pl-input-tags {\r\n user-select: none;\r\n vertical-align: top;\r\n\r\n .pl-input-inner {\r\n padding-left: 3px !important;\r\n height: auto !important;\r\n line-height: normal !important;\r\n cursor: pointer;\r\n }\r\n\r\n .pl-input-inner-tags {\r\n .pl-input-inner-tag-item {\r\n display: inline-block;\r\n font-size: 12px;\r\n border: solid 1px $ibl;\r\n background-color: #fafafa;\r\n padding: 0 6px;\r\n border-radius: 2px;\r\n margin: 3px;\r\n color: inherit;\r\n\r\n span + .pl-icon {\r\n margin-left: 3px;\r\n color: $icc;\r\n }\r\n\r\n &.pl-input-inner-tag-item-takeover {\r\n display: inline-block;\r\n padding: 0 0;\r\n margin-left: 0;\r\n margin-right: 0;\r\n width: 4px;\r\n opacity: 0;\r\n }\r\n }\r\n }\r\n\r\n @include sizeMixin(input) {\r\n .pl-input-inner {\r\n min-height: $value;\r\n\r\n .pl-input-inner-tags {\r\n .pl-input-inner-tag-item {\r\n line-height: $value - 9;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-input-disabled {\r\n .pl-input-inner-tag-item {\r\n cursor: not-allowed;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"
|
|
153
153
|
],
|
|
154
154
|
"seq": 40
|
|
155
155
|
},
|
|
@@ -240,7 +240,7 @@
|
|
|
240
240
|
{
|
|
241
241
|
"name": "PlRoot",
|
|
242
242
|
"codes": [
|
|
243
|
-
"html{line-height:1.4;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.515;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}\r\n$transition:
|
|
243
|
+
"html{line-height:1.4;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.515;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}\r\n$transition: ease;\r\n\r\n/*---------------------------------------scale-------------------------------------------*/\r\n\r\n.pl-transition-scale-enter {\r\n opacity: 0;\r\n transform: scale(0.75);\r\n}\r\n\r\n.pl-transition-scale-enter-active {\r\n opacity: 1;\r\n transform: scale(1);\r\n}\r\n\r\n.pl-transition-scale-exit {\r\n opacity: 1;\r\n transform: scale(1);\r\n}\r\n\r\n.pl-transition-scale-exit-active {\r\n opacity: 0;\r\n transform: scale(0.75);\r\n}\r\n\r\n.pl-transition-scale-enter-active, .pl-transition-scale-exit-active {\r\n transition: opacity 300ms linear, transform 300ms $transition;\r\n}\r\n\r\n/*---------------------------------------scale-y-------------------------------------------*/\r\n\r\n.pl-transition-scale-y-enter {\r\n transform: scaleY(0);\r\n opacity: 0;\r\n}\r\n\r\n.pl-transition-scale-y-enter-active {\r\n transform: scaleY(1);\r\n opacity: 1;\r\n}\r\n\r\n.pl-transition-scale-y-exit {\r\n transform: scaleY(1);\r\n opacity: 1;\r\n}\r\n\r\n.pl-transition-scale-y-exit-active {\r\n transform: scaleY(0);\r\n opacity: 0;\r\n}\r\n\r\n.pl-transition-scale-y-enter-active, .pl-transition-scale-y-exit-active {\r\n transform-origin: top;\r\n transition: opacity 300ms linear, transform 300ms $transition;\r\n}\r\n\r\n/*---------------------------------------fade-------------------------------------------*/\r\n\r\n.pl-transition-fade-enter {\r\n opacity: 0;\r\n}\r\n\r\n.pl-transition-fade-enter-active {\r\n opacity: 1;\r\n}\r\n\r\n.pl-transition-fade-exit {\r\n opacity: 1;\r\n}\r\n\r\n.pl-transition-fade-exit-active {\r\n opacity: 0;\r\n}\r\n\r\n.pl-transition-fade-enter-active, .pl-transition-fade-exit-active {\r\n transition: opacity 300ms linear;\r\n}\r\n\r\n/*---------------------------------------slider-------------------------------------------*/\r\n\r\n[direction=horizontal] {\r\n\r\n /*horizontal next*/\r\n &.pl-transition-slide-next-enter {\r\n transform: translate3d(100%, 0, 0);\r\n }\r\n\r\n &.pl-transition-slide-next-enter-active {\r\n transform: translate3d(0, 0, 0);\r\n transition: transform 150ms linear;\r\n }\r\n\r\n /*horizontal prev*/\r\n &.pl-transition-slide-prev-enter {\r\n transform: translate3d(-100%, 0, 0);\r\n }\r\n\r\n &.pl-transition-slide-prev-enter-active {\r\n transform: translate3d(0, 0, 0);\r\n transition: transform 150ms linear;\r\n }\r\n}\r\n\r\n[direction=vertical] {\r\n\r\n /*vertical next*/\r\n &.pl-transition-slide-next-enter {\r\n transform: translate3d(0, 100%, 0);\r\n }\r\n\r\n &.pl-transition-slide-next-enter-active {\r\n transform: translate3d(0, 0, 0);\r\n }\r\n\r\n /*horizontal prev*/\r\n &.pl-transition-slide-prev-enter {\r\n transform: translate3d(0, -100%, 0);\r\n }\r\n\r\n &.pl-transition-slide-prev-enter-active {\r\n transform: translate3d(0, 0, 0);\r\n transition: transform 150ms linear;\r\n }\r\n}\r\n\r\n.pl-collapse-transition {\r\n transition: 0.3s height linear, 0.3s padding-top linear, 0.3s padding-bottom linear;\r\n}\r\n\r\n@include theme {\r\n font-family: $font;\r\n\r\n .pl-text-primary {color: $colorPrimary;}\r\n .pl-text-success {color: $colorSuccess;}\r\n .pl-text-warn {color: $colorWarn;}\r\n .pl-text-error {color: $colorError;}\r\n .pl-text-info {color: $colorInfo;}\r\n\r\n .pl-background-primary {background-color: $colorPrimary;}\r\n .pl-background-success {background-color: $colorSuccess;}\r\n .pl-background-warn {background-color: $colorWarn;}\r\n .pl-background-error {background-color: $colorError;}\r\n .pl-background-info {background-color: $colorInfo;}\r\n\r\n .pl-background-disabled{background-color: $disabled;}\r\n .pl-background-disabled-light {background-color: $disabledLight;}\r\n .pl-background-disabled-deep {background-color: $disabledDeep;}\r\n .pl-background-disabled-text {color: $disabledText;}\r\n\r\n .pl-border-radius-fillet{border-radius: $shapeFillet;}\r\n .pl-border-radius-round{border-radius: $shapeRound;}\r\n .pl-border-radius-none{border-radius: $shapeNone;}\r\n\r\n .pl-border-color{border-color: $ibc}\r\n .pl-border-color-light{border-color: $ibl}\r\n\r\n .pl-text-color{color: $itc}\r\n .pl-text-color-light{color: $itl}\r\n .pl-title-color{color: $ihc}\r\n .pl-placeholder-color{color: $ipc}\r\n .pl-icon-color{color: $icc}\r\n\r\n .pl-boxshadow{box-shadow: $boxshadow}\r\n}\r\n\r\n.pl-root-service-container {\r\n position: fixed;\r\n width: 100vw;\r\n height: 100vh;\r\n overflow: hidden;\r\n //background-color: rgba(black, 0.1);\r\n top: 0;\r\n left: 0;\r\n pointer-events: none;\r\n z-index: 1500;\r\n\r\n & > * {\r\n pointer-events: auto;\r\n }\r\n}"
|
|
244
244
|
],
|
|
245
245
|
"seq": 54
|
|
246
246
|
},
|
|
@@ -268,7 +268,7 @@
|
|
|
268
268
|
{
|
|
269
269
|
"name": "PlSlider",
|
|
270
270
|
"codes": [
|
|
271
|
-
"@include theme {\r\n .pl-slider {\r\n @include public-style;\r\n cursor: pointer;\r\n display: inline-block;\r\n position: relative;\r\n background-color: rgba(black, 0.15);\r\n border-radius: 100px;\r\n\r\n .pl-slider-progress {\r\n border-radius: 100px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n\r\n .pl-slider-dot-wrapper {\r\n width: 0;\r\n height: 0;\r\n overflow: visible;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n user-select: none;\r\n\r\n .pl-slider-dot {\r\n height: 16px;\r\n width: 16px;\r\n background-color: white;\r\n box-shadow: 0 0 6px #aaa;\r\n border-radius: 100px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n transition: all 0.15s cubic-bezier(0, 1.55, 1, 1.52);\r\n transform-origin: center center;\r\n\r\n .pl-slider-dot-inner {\r\n width: 6px;\r\n height: 6px;\r\n border-radius: 100px;\r\n position: relative;\r\n\r\n .pl-slider-dot-tooltip {\r\n transition: all 300ms $transition;\r\n opacity: 0;\r\n background-color: rgba(black, 0.8);\r\n color: white;\r\n padding: 3px 6px;\r\n position: absolute;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n bottom: calc(100% + 9px);\r\n border-radius: 4px;\r\n font-size: 12px;\r\n pointer-events: none;\r\n &:hover {\r\n opacity: 0.5;\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n .pl-slider-dot-tooltip {\r\n opacity: 1;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-slider-step {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-evenly;\r\n\r\n .pl-slider-step-item-wrapper {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 0;\r\n height: 0;\r\n overflow: visible;\r\n\r\n .pl-slider-step-item {\r\n background-color: rgba(black, 0.3);\r\n border-radius: 100px;\r\n flex-shrink: 0;\r\n }\r\n }\r\n }\r\n\r\n &.pl-slider-touching {\r\n .pl-slider-dot {\r\n transform: scale(1.4);\r\n\r\n .pl-slider-dot-tooltip {\r\n opacity: 1 !important;\r\n }\r\n }\r\n }\r\n\r\n .pl-slider-dot:hover {\r\n transform: scale(1.4);\r\n transform-origin: center center;\r\n transition: all 0.15s cubic-bezier(0, 1.55, 1, 1.52);\r\n }\r\n\r\n @include statusMixin(slider) {\r\n .pl-slider-progress {\r\n &, & .pl-slider-dot-inner {\r\n background-color: $value;\r\n }\r\n }\r\n }\r\n\r\n &.pl-slider-vertical {\r\n .pl-slider-progress, .pl-slider-step {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n }\r\n\r\n &.pl-slider-horizontal {\r\n .pl-slider-progress, .pl-slider-step {\r\n display: flex;\r\n flex-direction: row;\r\n }\r\n }\r\n\r\n &.pl-slider-align-start {\r\n .pl-slider-dot-wrapper-start {\r\n opacity: 0;\r\n z-index: 0;\r\n }\r\n\r\n .pl-slider-dot-wrapper-end {\r\n z-index: 1;\r\n }\r\n }\r\n\r\n &.pl-slider-align-end {\r\n .pl-slider-dot-wrapper-end {\r\n opacity: 0;\r\n z-index: 0;\r\n }\r\n\r\n .pl-slider-dot-wrapper-start {\r\n z-index: 1;\r\n }\r\n }\r\n\r\n &.pl-slider-range {\r\n .pl-slider-dot-wrapper {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n &.pl-slider-place-end {\r\n .pl-slider-dot-wrapper-start {\r\n z-index: 2;\r\n }\r\n }\r\n }\r\n}"
|
|
271
|
+
"@include theme {\r\n .pl-slider {\r\n @include public-style;\r\n cursor: pointer;\r\n display: inline-block;\r\n position: relative;\r\n background-color: rgba(black, 0.15);\r\n border-radius: 100px;\r\n\r\n .pl-slider-progress {\r\n border-radius: 100px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n\r\n .pl-slider-dot-wrapper {\r\n width: 0;\r\n height: 0;\r\n overflow: visible;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n user-select: none;\r\n\r\n .pl-slider-dot {\r\n height: 16px;\r\n width: 16px;\r\n background-color: white;\r\n box-shadow: 0 0 6px #aaa;\r\n border-radius: 100px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n transition: all 0.15s cubic-bezier(0, 1.55, 1, 1.52);\r\n transform-origin: center center;\r\n\r\n .pl-slider-dot-inner {\r\n width: 6px;\r\n height: 6px;\r\n border-radius: 100px;\r\n position: relative;\r\n\r\n .pl-slider-dot-tooltip {\r\n transition: all 300ms $transition;\r\n opacity: 0;\r\n background-color: rgba(black, 0.8);\r\n color: white;\r\n padding: 3px 6px;\r\n line-height: initial;\r\n position: absolute;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n bottom: calc(100% + 9px);\r\n border-radius: 4px;\r\n font-size: 12px;\r\n pointer-events: none;\r\n &:hover {\r\n opacity: 0.5;\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n .pl-slider-dot-tooltip {\r\n opacity: 1;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .pl-slider-step {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n right: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-evenly;\r\n\r\n .pl-slider-step-item-wrapper {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 0;\r\n height: 0;\r\n overflow: visible;\r\n\r\n .pl-slider-step-item {\r\n background-color: rgba(black, 0.3);\r\n border-radius: 100px;\r\n flex-shrink: 0;\r\n }\r\n }\r\n }\r\n\r\n &.pl-slider-touching {\r\n .pl-slider-dot {\r\n transform: scale(1.4);\r\n\r\n .pl-slider-dot-tooltip {\r\n opacity: 1 !important;\r\n }\r\n }\r\n }\r\n\r\n .pl-slider-dot:hover {\r\n transform: scale(1.4);\r\n transform-origin: center center;\r\n transition: all 0.15s cubic-bezier(0, 1.55, 1, 1.52);\r\n }\r\n\r\n @include statusMixin(slider) {\r\n .pl-slider-progress {\r\n &, & .pl-slider-dot-inner {\r\n background-color: $value;\r\n }\r\n }\r\n }\r\n\r\n &.pl-slider-vertical {\r\n .pl-slider-progress, .pl-slider-step {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n }\r\n\r\n &.pl-slider-horizontal {\r\n .pl-slider-progress, .pl-slider-step {\r\n display: flex;\r\n flex-direction: row;\r\n }\r\n }\r\n\r\n &.pl-slider-align-start {\r\n .pl-slider-dot-wrapper-start {\r\n opacity: 0;\r\n z-index: 0;\r\n }\r\n\r\n .pl-slider-dot-wrapper-end {\r\n z-index: 1;\r\n }\r\n }\r\n\r\n &.pl-slider-align-end {\r\n .pl-slider-dot-wrapper-end {\r\n opacity: 0;\r\n z-index: 0;\r\n }\r\n\r\n .pl-slider-dot-wrapper-start {\r\n z-index: 1;\r\n }\r\n }\r\n\r\n &.pl-slider-range {\r\n .pl-slider-dot-wrapper {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n &.pl-slider-place-end {\r\n .pl-slider-dot-wrapper-start {\r\n z-index: 2;\r\n }\r\n }\r\n }\r\n}\r\n"
|
|
272
272
|
],
|
|
273
273
|
"seq": 60
|
|
274
274
|
},
|
|
@@ -282,7 +282,7 @@
|
|
|
282
282
|
{
|
|
283
283
|
"name": "PlTable",
|
|
284
284
|
"codes": [
|
|
285
|
-
"@include theme {\r\n $tableHeadColor: rgba(0, 0, 0, .85);\r\n $tableHeadBackground: #f9f9f9;\r\n $tableHeadHoverBackground: #e4e7ef;\r\n $tableHeadBorderColor: #f0f0f0;\r\n\r\n $tableBodyColor: rgba(0, 0, 0, 0.85);\r\n\r\n $tableRowHoverBackground: #f5f7fa;\r\n $tableRowCurrentBackground: mix($colorPrimary, white, 7.5%);\r\n\r\n $scrollbarSize: 12px;\r\n /*---------------------------------------scroll-------------------------------------------*/\r\n .pl-table, .pl-virtual-table {\r\n position: relative;\r\n\r\n .pl-scroll {\r\n .pl-scroll-content {\r\n min-width: 100%;\r\n }\r\n\r\n .pl-vertical-scrollbar-wrapper, .pl-horizontal-scrollbar-wrapper {\r\n z-index: 10;\r\n }\r\n }\r\n\r\n &:hover {\r\n .pl-scroll {\r\n & > .pl-horizontal-scrollbar-wrapper, & > .pl-vertical-scrollbar-wrapper {\r\n .pl-vertical-scrollbar, .pl-horizontal-scrollbar {\r\n opacity: 1;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------虚拟表格-------------------------------------------*/\r\n .pl-virtual-table {\r\n height: 100%;\r\n width: 100%;\r\n overflow: hidden;\r\n\r\n .pl-virtual-table-summary-table-wrapper {\r\n pointer-events: none;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n overflow: hidden;\r\n z-index: 5;\r\n\r\n & > table {\r\n &:after {\r\n content: '';\r\n display: block;\r\n height: $scrollbarSize;\r\n width: 1px;\r\n }\r\n }\r\n\r\n &:after {\r\n position: absolute;\r\n bottom: 0;\r\n height: $scrollbarSize;\r\n left: 0;\r\n content: \"\";\r\n background-color: #f5f7fa;\r\n z-index: 3;\r\n width: 5000px;\r\n }\r\n\r\n .pl-virtual-table-summary-table {\r\n pointer-events: auto;\r\n position: absolute;\r\n left: 0;\r\n\r\n td {\r\n background-color: $tableHeadBackground;\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------basic-------------------------------------------*/\r\n table {\r\n border-collapse: collapse;\r\n border-spacing: 0;\r\n box-sizing: border-box;\r\n table-layout: fixed;\r\n /**\r\n * table一直都是有个最小宽度100%。\r\n * 当总列宽小于表格宽度时，table没有具体width宽度，fit列不设置库宽度，使其自适应宽度；\r\n * 当总列宽大于表格宽度时，table设置具体的width宽度，fit值无效，以列具体宽度为准；\r\n */\r\n //min-width: 100%; // 不能设置min-width，当文字过长的时候，会自动撑开列宽，导致表头与表体错位\r\n width: 100%;\r\n\r\n tr {\r\n td {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n box-sizing: border-box;\r\n position: relative;\r\n padding: 1px 11px;\r\n }\r\n }\r\n }\r\n /*---------------------------------------collector-------------------------------------------*/\r\n .plc-collector {\r\n display: none;\r\n }\r\n /*---------------------------------------no data-------------------------------------------*/\r\n .pl-table-no-data {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: none;\r\n }\r\n /*---------------------------------------head-------------------------------------------*/\r\n .plt-head {\r\n td {\r\n background-color: $tableHeadBackground;\r\n color: $tableHeadColor;\r\n\r\n &:hover {\r\n background-color: $tableHeadHoverBackground;\r\n }\r\n\r\n .plt-head-cell-indicator {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n height: inherit;\r\n width: 6px;\r\n right: 0;\r\n content: '';\r\n background-color: rgba(black, 0.1);\r\n cursor: ew-resize;\r\n opacity: 0;\r\n transition: opacity 500ms $transition;\r\n z-index: 1;\r\n }\r\n\r\n .plt-head-cell-sorter {\r\n position: absolute;\r\n right: 4px;\r\n top: 0;\r\n bottom: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n .plt-head-cell-sorter-inner {\r\n display: flex;\r\n flex-direction: column;\r\n color: rgba(black, 0.4);\r\n\r\n .pl-icon:first-child {\r\n position: relative;\r\n top: 3px;\r\n }\r\n\r\n .pl-icon:last-child {\r\n position: relative;\r\n bottom: 3px;\r\n }\r\n }\r\n\r\n &.plt-head-cell-sorter-asc {\r\n .plt-head-cell-sorter-inner {\r\n .pl-icon:first-child {\r\n color: rgba(black, 0.8);\r\n }\r\n }\r\n }\r\n\r\n &.plt-head-cell-sorter-desc {\r\n .plt-head-cell-sorter-inner {\r\n .pl-icon:last-child {\r\n color: rgba(black, 0.8);\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------body-------------------------------------------*/\r\n .plt-body {\r\n tr {\r\n td {\r\n transition: background-color 150ms linear;\r\n background-color: white;\r\n color: $tableBodyColor;\r\n }\r\n }\r\n }\r\n /*---------------------------------------row-------------------------------------------*/\r\n .plt-row {\r\n border-bottom: solid 1px $tableHeadBorderColor;\r\n\r\n &:hover {\r\n td {\r\n background-color: $tableRowHoverBackground;\r\n }\r\n }\r\n\r\n &.plt-row-current {\r\n &, &:hover {\r\n td {\r\n background-color: $tableRowCurrentBackground;\r\n }\r\n }\r\n }\r\n }\r\n .plt-head {\r\n tr {\r\n border-bottom: solid 1px $tableHeadBorderColor;\r\n border-top: solid 1px $tableHeadBorderColor;\r\n }\r\n }\r\n .plt-body {\r\n .pl-virtual-table-summary-table-wrapper {\r\n & > table {\r\n border-top: solid 1px $tableHeadBorderColor;\r\n }\r\n }\r\n }\r\n /*---------------------------------------cell-------------------------------------------*/\r\n .plt-cell {\r\n text-align: left;\r\n\r\n &.plt-cell-align-center {\r\n text-align: center;\r\n }\r\n\r\n &.plt-cell-align-right {\r\n text-align: right;\r\n }\r\n\r\n &.plt-cell-no-padding {\r\n padding: 0;\r\n }\r\n\r\n &.plt-cell-editing {\r\n &:not(.plt-cell-add-edit-padding) {\r\n padding-left: 0;\r\n }\r\n }\r\n\r\n &.plt-cell-link {\r\n color: $colorPrimary;\r\n cursor: pointer;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n }\r\n }\r\n }\r\n /*---------------------------------------border-------------------------------------------*/\r\n .pl-table {\r\n\r\n &.pl-table-border {\r\n tr {\r\n td {\r\n border-right: solid 1px $tableHeadBorderColor;\r\n border-left: solid 1px $tableHeadBorderColor;\r\n }\r\n }\r\n\r\n &:after {\r\n position: absolute;\r\n right: 0;\r\n bottom: 0;\r\n top: 0;\r\n left: 0;\r\n background-color: transparent;\r\n border: solid 0.5px $tableHeadBorderColor;\r\n content: '';\r\n z-index: 5;\r\n pointer-events: none;\r\n }\r\n }\r\n\r\n &.pl-table-stripe {\r\n .plt-body {\r\n .pl-virtual-list-content {\r\n table {\r\n tr:nth-child(odd):not(:hover):not(.plt-row-current) {\r\n td {\r\n background-color: #f2f5ff;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------size-------------------------------------------*/\r\n .pl-table {\r\n &.pl-table-size-large {\r\n .plt-cell {\r\n font-size: 16px;\r\n }\r\n }\r\n\r\n &.pl-table-size-normal {\r\n .plt-cell {\r\n font-size: 14px;\r\n }\r\n }\r\n\r\n &.pl-table-size-mini {\r\n .plt-cell {\r\n font-size: 12px;\r\n }\r\n }\r\n }\r\n /*---------------------------------------shadow-------------------------------------------*/\r\n .pl-table {\r\n &, &.pl-table-border {\r\n\r\n .plt-cell-last-fixed-left, .plt-cell-first-fixed-right {\r\n\r\n &:before {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n width: 3px;\r\n pointer-events: none;\r\n content: '';\r\n z-index: 4;\r\n background-color: transparent;\r\n\r\n left: initial;\r\n right: initial;\r\n transform: none;\r\n }\r\n\r\n &.plt-cell-last-fixed-left {\r\n &:before {\r\n right: 0;\r\n box-shadow: inset 10px 0 10px -10px mix(black, $boxshadowColor, 10%);\r\n }\r\n }\r\n\r\n &.plt-cell-first-fixed-right {\r\n &:before {\r\n left: 0;\r\n box-shadow: inset -10px 0 10px -10px mix(black, $boxshadowColor, 10%);\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.plt-table-hide-fixed-left .plt-cell-last-fixed-left, &.plt-table-hide-fixed-right .plt-cell-first-fixed-right {\r\n &:before {\r\n display: none;\r\n }\r\n }\r\n }\r\n /*---------------------------------------standard-------------------------------------------*/\r\n /*plc-index*/\r\n .plc-index-summary-text {\r\n font-size: 12px;\r\n }\r\n /*!*icon*!\r\n .plt-cell {\r\n & > .pl-icon {\r\n vertical-align: -0.3em;\r\n\r\n & + * {\r\n margin-left: 4px;\r\n }\r\n }\r\n }*/\r\n /*input*/\r\n .plt-cell {\r\n & > * {\r\n vertical-align: middle;\r\n\r\n &.pl-icon {\r\n vertical-align: middle;\r\n }\r\n }\r\n\r\n & > .pl-input {\r\n width: 100%;\r\n\r\n & > .pl-input-inner {\r\n width: inherit !important;\r\n\r\n & > .pl-input-custom-inner {\r\n & > input {\r\n width: 100% !important;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*plc-expand*/\r\n .plt-row {\r\n &.plt-expand-row {\r\n td {\r\n background-color: white;\r\n z-index: 5;\r\n white-space: normal;\r\n padding: 0;\r\n overflow: unset;\r\n }\r\n\r\n .plt-expand-body {\r\n box-sizing: border-box;\r\n position: sticky;\r\n left: 0;\r\n\r\n &[data-padding=true] {\r\n padding: 16px;\r\n }\r\n\r\n & > .pl-form {\r\n padding: 0;\r\n }\r\n }\r\n }\r\n\r\n .plc-expand-icon {\r\n .pl-icon {\r\n @include transition;\r\n transition-property: transform;\r\n }\r\n\r\n &.plc-expand-icon-active {\r\n .pl-icon {\r\n transform: rotate(-180deg);\r\n }\r\n }\r\n }\r\n }\r\n /*plc-draggier*/\r\n .pl-button.plc-draggier-handler {\r\n cursor: move;\r\n }\r\n /*col draggier*/\r\n .plt-col-draggier-indicator {\r\n &[droppable=\"true\"] {\r\n background-color: $colorPrimary;\r\n }\r\n\r\n &[droppable=\"false\"] {\r\n background-color: $colorError;\r\n }\r\n }\r\n /*plc-tree*/\r\n .plc-tree-node {\r\n white-space: nowrap;\r\n\r\n & > * {\r\n display: inline-block;\r\n height: 100%;\r\n }\r\n\r\n .plc-tree-node-expander, .plc-tree-node-check {\r\n width: 30px;\r\n text-align: center;\r\n }\r\n }\r\n .plc-tree-node-content {\r\n display: inline-block;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n padding-left: 8px;\r\n box-sizing: border-box;\r\n }\r\n}\r\n"
|
|
285
|
+
"@include theme {\r\n $tableHeadColor: rgba(0, 0, 0, .85);\r\n $tableHeadBackground: #f9f9f9;\r\n $tableHeadHoverBackground: #e4e7ef;\r\n $tableHeadBorderColor: #f0f0f0;\r\n\r\n $tableBodyColor: rgba(0, 0, 0, 0.85);\r\n\r\n $tableRowHoverBackground: #f5f7fa;\r\n $tableRowCurrentBackground: mix($colorPrimary, white, 7.5%);\r\n\r\n $scrollbarSize: 12px;\r\n /*---------------------------------------scroll-------------------------------------------*/\r\n .pl-table, .pl-virtual-table {\r\n position: relative;\r\n\r\n .pl-scroll {\r\n .pl-scroll-content {\r\n min-width: 100%;\r\n }\r\n\r\n .pl-scroll-wrapper {\r\n height: calc(100% + 20px);\r\n }\r\n\r\n .pl-vertical-scrollbar-wrapper, .pl-horizontal-scrollbar-wrapper {\r\n z-index: 10;\r\n }\r\n }\r\n\r\n &:hover {\r\n .pl-scroll {\r\n & > .pl-horizontal-scrollbar-wrapper, & > .pl-vertical-scrollbar-wrapper {\r\n .pl-vertical-scrollbar, .pl-horizontal-scrollbar {\r\n opacity: 1;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------虚拟表格-------------------------------------------*/\r\n .pl-virtual-table {\r\n height: 100%;\r\n width: 100%;\r\n overflow: hidden;\r\n\r\n .pl-virtual-table-summary-table-wrapper {\r\n pointer-events: none;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n overflow: hidden;\r\n z-index: 5;\r\n\r\n & > table {\r\n &:after {\r\n content: '';\r\n display: block;\r\n height: $scrollbarSize;\r\n width: 1px;\r\n }\r\n }\r\n\r\n &:after {\r\n position: absolute;\r\n bottom: 0;\r\n height: $scrollbarSize;\r\n left: 0;\r\n content: \"\";\r\n background-color: #f5f7fa;\r\n z-index: 3;\r\n width: 5000px;\r\n }\r\n\r\n .pl-virtual-table-summary-table {\r\n pointer-events: auto;\r\n position: absolute;\r\n left: 0;\r\n\r\n td {\r\n background-color: $tableHeadBackground;\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------basic-------------------------------------------*/\r\n table {\r\n border-collapse: collapse;\r\n border-spacing: 0;\r\n box-sizing: border-box;\r\n table-layout: fixed;\r\n /**\r\n * table一直都是有个最小宽度100%。\r\n * 当总列宽小于表格宽度时，table没有具体width宽度，fit列不设置库宽度，使其自适应宽度；\r\n * 当总列宽大于表格宽度时，table设置具体的width宽度，fit值无效，以列具体宽度为准；\r\n */\r\n //min-width: 100%; // 不能设置min-width，当文字过长的时候，会自动撑开列宽，导致表头与表体错位\r\n width: 100%;\r\n\r\n tr {\r\n td {\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n box-sizing: border-box;\r\n position: relative;\r\n padding: 1px 11px;\r\n }\r\n }\r\n }\r\n /*---------------------------------------collector-------------------------------------------*/\r\n .plc-collector {\r\n display: none;\r\n }\r\n /*---------------------------------------no data-------------------------------------------*/\r\n .pl-table-no-data {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n pointer-events: none;\r\n }\r\n /*---------------------------------------head-------------------------------------------*/\r\n .plt-head {\r\n td {\r\n background-color: $tableHeadBackground;\r\n color: $tableHeadColor;\r\n\r\n &:hover {\r\n background-color: $tableHeadHoverBackground;\r\n }\r\n\r\n .plt-head-cell-indicator {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n height: inherit;\r\n width: 6px;\r\n right: 0;\r\n content: '';\r\n background-color: rgba(black, 0.1);\r\n cursor: ew-resize;\r\n opacity: 0;\r\n transition: opacity 500ms $transition;\r\n z-index: 1;\r\n }\r\n\r\n .plt-head-cell-sorter {\r\n position: absolute;\r\n right: 4px;\r\n top: 0;\r\n bottom: 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n .plt-head-cell-sorter-inner {\r\n display: flex;\r\n flex-direction: column;\r\n color: rgba(black, 0.4);\r\n\r\n .pl-icon:first-child {\r\n position: relative;\r\n top: 3px;\r\n }\r\n\r\n .pl-icon:last-child {\r\n position: relative;\r\n bottom: 3px;\r\n }\r\n }\r\n\r\n &.plt-head-cell-sorter-asc {\r\n .plt-head-cell-sorter-inner {\r\n .pl-icon:first-child {\r\n color: rgba(black, 0.8);\r\n }\r\n }\r\n }\r\n\r\n &.plt-head-cell-sorter-desc {\r\n .plt-head-cell-sorter-inner {\r\n .pl-icon:last-child {\r\n color: rgba(black, 0.8);\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------body-------------------------------------------*/\r\n .plt-body {\r\n tr {\r\n td {\r\n transition: background-color 150ms linear;\r\n background-color: white;\r\n color: $tableBodyColor;\r\n }\r\n }\r\n }\r\n /*---------------------------------------row-------------------------------------------*/\r\n .plt-row {\r\n border-bottom: solid 1px $tableHeadBorderColor;\r\n\r\n &:hover {\r\n td {\r\n background-color: $tableRowHoverBackground;\r\n }\r\n }\r\n\r\n &.plt-row-current {\r\n &, &:hover {\r\n td {\r\n background-color: $tableRowCurrentBackground;\r\n }\r\n }\r\n }\r\n }\r\n .plt-head {\r\n tr {\r\n border-bottom: solid 1px $tableHeadBorderColor;\r\n border-top: solid 1px $tableHeadBorderColor;\r\n }\r\n }\r\n .plt-body {\r\n .pl-virtual-table-summary-table-wrapper {\r\n & > table {\r\n border-top: solid 1px $tableHeadBorderColor;\r\n }\r\n }\r\n }\r\n /*---------------------------------------cell-------------------------------------------*/\r\n .plt-cell {\r\n text-align: left;\r\n\r\n &.plt-cell-align-center {\r\n text-align: center;\r\n }\r\n\r\n &.plt-cell-align-right {\r\n text-align: right;\r\n }\r\n\r\n &.plt-cell-no-padding {\r\n padding: 0;\r\n }\r\n\r\n &.plt-cell-editing {\r\n &:not(.plt-cell-add-edit-padding) {\r\n padding-left: 0;\r\n }\r\n }\r\n\r\n &.plt-cell-link {\r\n color: $colorPrimary;\r\n cursor: pointer;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n }\r\n }\r\n }\r\n /*---------------------------------------border-------------------------------------------*/\r\n .pl-table {\r\n\r\n &.pl-table-border {\r\n tr {\r\n td {\r\n border-right: solid 1px $tableHeadBorderColor;\r\n border-left: solid 1px $tableHeadBorderColor;\r\n }\r\n }\r\n\r\n &:after {\r\n position: absolute;\r\n right: 0;\r\n bottom: 0;\r\n top: 0;\r\n left: 0;\r\n background-color: transparent;\r\n border: solid 0.5px $tableHeadBorderColor;\r\n content: '';\r\n z-index: 5;\r\n pointer-events: none;\r\n }\r\n }\r\n\r\n &.pl-table-stripe {\r\n .plt-body {\r\n .pl-virtual-list-content {\r\n table {\r\n tr:nth-child(odd):not(:hover):not(.plt-row-current) {\r\n td {\r\n background-color: #f2f5ff;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*---------------------------------------size-------------------------------------------*/\r\n .pl-table {\r\n &.pl-table-size-large {\r\n .plt-cell {\r\n font-size: 16px;\r\n }\r\n }\r\n\r\n &.pl-table-size-normal {\r\n .plt-cell {\r\n font-size: 14px;\r\n }\r\n }\r\n\r\n &.pl-table-size-mini {\r\n .plt-cell {\r\n font-size: 12px;\r\n }\r\n }\r\n }\r\n /*---------------------------------------shadow-------------------------------------------*/\r\n .pl-table {\r\n &, &.pl-table-border {\r\n\r\n .plt-cell-last-fixed-left, .plt-cell-first-fixed-right {\r\n\r\n &:before {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n width: 3px;\r\n pointer-events: none;\r\n content: '';\r\n z-index: 4;\r\n background-color: transparent;\r\n\r\n left: initial;\r\n right: initial;\r\n transform: none;\r\n }\r\n\r\n &.plt-cell-last-fixed-left {\r\n &:before {\r\n right: 0;\r\n box-shadow: inset 10px 0 10px -10px mix(black, $boxshadowColor, 10%);\r\n }\r\n }\r\n\r\n &.plt-cell-first-fixed-right {\r\n &:before {\r\n left: 0;\r\n box-shadow: inset -10px 0 10px -10px mix(black, $boxshadowColor, 10%);\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.plt-table-hide-fixed-left .plt-cell-last-fixed-left, &.plt-table-hide-fixed-right .plt-cell-first-fixed-right {\r\n &:before {\r\n display: none;\r\n }\r\n }\r\n }\r\n /*---------------------------------------standard-------------------------------------------*/\r\n /*plc-index*/\r\n .plc-index-summary-text {\r\n font-size: 12px;\r\n }\r\n /*!*icon*!\r\n .plt-cell {\r\n & > .pl-icon {\r\n vertical-align: -0.3em;\r\n\r\n & + * {\r\n margin-left: 4px;\r\n }\r\n }\r\n }*/\r\n /*input*/\r\n .plt-cell {\r\n & > * {\r\n vertical-align: middle;\r\n\r\n &.pl-icon {\r\n vertical-align: middle;\r\n }\r\n }\r\n\r\n & > .pl-input {\r\n width: 100%;\r\n\r\n & > .pl-input-inner {\r\n width: inherit !important;\r\n\r\n & > .pl-input-custom-inner {\r\n & > input {\r\n width: 100% !important;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n /*plc-expand*/\r\n .plt-row {\r\n &.plt-expand-row {\r\n td {\r\n background-color: white;\r\n z-index: 5;\r\n white-space: normal;\r\n padding: 0;\r\n overflow: unset;\r\n }\r\n\r\n .plt-expand-body {\r\n box-sizing: border-box;\r\n position: sticky;\r\n left: 0;\r\n\r\n &[data-padding=true] {\r\n padding: 16px;\r\n }\r\n\r\n & > .pl-form {\r\n padding: 0;\r\n }\r\n }\r\n }\r\n\r\n .plc-expand-icon {\r\n .pl-icon {\r\n @include transition;\r\n transition-property: transform;\r\n }\r\n\r\n &.plc-expand-icon-active {\r\n .pl-icon {\r\n transform: rotate(-180deg);\r\n }\r\n }\r\n }\r\n }\r\n /*plc-draggier*/\r\n .pl-button.plc-draggier-handler {\r\n cursor: move;\r\n }\r\n /*col draggier*/\r\n .plt-col-draggier-indicator {\r\n &[droppable=\"true\"] {\r\n background-color: $colorPrimary;\r\n }\r\n\r\n &[droppable=\"false\"] {\r\n background-color: $colorError;\r\n }\r\n }\r\n /*plc-tree*/\r\n .plc-tree-node {\r\n white-space: nowrap;\r\n\r\n & > * {\r\n display: inline-block;\r\n height: 100%;\r\n }\r\n\r\n .plc-tree-node-expander, .plc-tree-node-check {\r\n width: 30px;\r\n text-align: center;\r\n }\r\n }\r\n .plc-tree-node-content {\r\n display: inline-block;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n padding-left: 8px;\r\n box-sizing: border-box;\r\n }\r\n}\r\n"
|
|
286
286
|
],
|
|
287
287
|
"seq": 63
|
|
288
288
|
},
|
|
@@ -372,8 +372,8 @@
|
|
|
372
372
|
"@include theme {\r\n .pl-tabs {\r\n .pl-tabs-collector {\r\n height: 0;\r\n width: 0;\r\n overflow: hidden;\r\n display: block;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n cursor: pointer;\r\n user-select: none;\r\n\r\n .pl-icon {\r\n margin-left: 8px;\r\n }\r\n\r\n &:not(.pl-tabs-header-item-active) {\r\n .pl-icon {\r\n color: $icc;\r\n }\r\n }\r\n }\r\n\r\n .pl-tabs-header-item-operator {\r\n flex-grow: 1;\r\n flex-shrink: 0;\r\n position: sticky;\r\n right: 4px;\r\n height: 45px;\r\n line-height: 45px;\r\n padding-left: 16px;\r\n justify-self: flex-end;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: flex-end;\r\n background-color: white;\r\n\r\n & > * + * {\r\n margin-left: 4px;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
373
373
|
"@include theme {\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-card {\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n padding: 0 20px;\r\n border-left: solid 1px $ibc;\r\n\r\n &:last-child {\r\n border-right: solid 1px $ibc;\r\n }\r\n\r\n &:hover, &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-list {\r\n border-bottom: solid 1px $ibc;\r\n\r\n .pl-tabs-header-item {\r\n border-top: solid 1px $ibc;\r\n\r\n &:first-child {\r\n border-top-left-radius: $shapeFillet;\r\n }\r\n\r\n &:last-child {\r\n border-top-right-radius: $shapeFillet;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n position: relative;\r\n\r\n &:before {\r\n position: absolute;\r\n background-color: white;\r\n left: 0;\r\n right: 0;\r\n top: 100%;\r\n height: 1px;\r\n content: '';\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-list {\r\n border-top: solid 1px $ibc;\r\n\r\n .pl-tabs-header-item {\r\n border-bottom: solid 1px $ibc;\r\n\r\n &:first-child {\r\n border-bottom-left-radius: $shapeFillet;\r\n }\r\n\r\n &:last-child {\r\n border-bottom-right-radius: $shapeFillet;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n position: relative;\r\n\r\n &:before {\r\n position: absolute;\r\n background-color: white;\r\n left: 0;\r\n right: 0;\r\n bottom: 100%;\r\n height: 1px;\r\n content: '';\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}",
|
|
374
374
|
"@include theme {\r\n .pl-tabs-header-horizontal {\r\n overflow: hidden;\r\n position: relative;\r\n\r\n .pl-tabs-header-list {\r\n display: inline-flex;\r\n align-items: center;\r\n white-space: nowrap;\r\n min-width: 100%;\r\n position: relative;\r\n transition: 300ms $transitionFlexible left;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n display: inline-block;\r\n font-size: 14px;\r\n }\r\n\r\n &.pl-tabs-header-show-more {\r\n padding-right: 80px;\r\n\r\n .pl-tabs-header-more-button {\r\n z-index: 1;\r\n position: absolute;\r\n background-color: rgba(white, 0.9);\r\n right: 0;\r\n top: 0;\r\n bottom: 0;\r\n width: 80px;\r\n box-shadow: 0 2px 8px #ccc;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: $ihc;\r\n }\r\n }\r\n }\r\n\r\n .pl-tabs-head-position-top, .pl-tabs-head-position-bottom {\r\n &.pl-tabs-fit-height {\r\n display: flex;\r\n flex-direction: column;\r\n height: 100%;\r\n flex: 1;\r\n\r\n & > .pl-tabs-body {\r\n flex: 1;\r\n overflow: hidden;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n & > .pl-inner-tab {\r\n flex: 1;\r\n overflow: auto;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
375
|
-
"@include theme {\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-text {\r\n\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n\r\n & + .pl-tabs-header-item {\r\n margin-left: 32px;\r\n }\r\n\r\n &.pl-tabs-header-item-active, &:hover {\r\n color: $colorPrimary;\r\n }\r\n }\r\n\r\n .pl-tabs-header-list {\r\n position: relative;\r\n\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n background-color: $disabled;\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n height: 2px;\r\n\r\n .pl-tabs-header-horizontal-text-indicator {\r\n position: absolute;\r\n width: 0;\r\n left: 0;\r\n height: 100%;\r\n background-color: $colorPrimary;\r\n display: block;\r\n transition: $transition 150ms all;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n bottom: 0;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n top: 0;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
376
375
|
"@include theme {\r\n .pl-tabs.pl-tabs-head-type-shadow {\r\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04);\r\n border: solid 1px $ibl;\r\n box-sizing: border-box;\r\n\r\n & + * {\r\n margin-top: 16px;\r\n }\r\n\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-shadow {\r\n background-color: $disabled;\r\n\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n padding: 0 20px;\r\n color: $itl;\r\n box-sizing: border-box;\r\n transition: all linear 300ms;\r\n border-left: solid 1px transparent;\r\n border-right: solid 1px transparent;\r\n\r\n &:first-child {\r\n border-left: none;\r\n }\r\n\r\n &:hover, &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n }\r\n\r\n &:before {\r\n position: absolute;\r\n background-color: transparent;\r\n left: 0;\r\n right: 0;\r\n height: 1px;\r\n content: '';\r\n transition: all linear 300ms;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n position: relative;\r\n background-color: white;\r\n border-color: $ibl;\r\n\r\n &:before {\r\n background-color: white;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-list {\r\n border-bottom: solid 1px $ibl;\r\n\r\n .pl-tabs-header-item-active:before {\r\n top: 100%\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-list {\r\n border-top: solid 1px $ibl;\r\n\r\n .pl-tabs-header-item-active:before {\r\n bottom: 100%\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
376
|
+
"@include theme {\r\n .pl-tabs-header.pl-tabs-header-horizontal.pl-tabs-header-type-text {\r\n\r\n .pl-tabs-header-item {\r\n line-height: 45px;\r\n\r\n & + .pl-tabs-header-item {\r\n margin-left: 32px;\r\n }\r\n\r\n &.pl-tabs-header-item-active, &:hover {\r\n color: $colorPrimary;\r\n }\r\n }\r\n\r\n .pl-tabs-header-list {\r\n position: relative;\r\n\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n background-color: $disabled;\r\n position: absolute;\r\n left: 0;\r\n right: 0;\r\n height: 2px;\r\n\r\n .pl-tabs-header-horizontal-text-indicator {\r\n position: absolute;\r\n width: 0;\r\n left: 0;\r\n height: 100%;\r\n background-color: $colorPrimary;\r\n display: block;\r\n transition: $transition 150ms all;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-top {\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n bottom: 0;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-bottom {\r\n .pl-tabs-header-horizontal-text-indicator-container {\r\n top: 0;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
377
377
|
"@include theme {\r\n .pl-tabs {\r\n &.pl-tabs-head-position-left, &.pl-tabs-head-position-right {\r\n display: flex;\r\n\r\n .pl-tabs-body {\r\n flex: 1;\r\n box-sizing: border-box;\r\n }\r\n\r\n .pl-tabs-header {\r\n position: relative;\r\n\r\n .pl-tabs-header-item {\r\n line-height: 36px;\r\n padding: 0 16px;\r\n position: relative;\r\n z-index: 1;\r\n transition: all linear 150ms;\r\n white-space: nowrap;\r\n\r\n &:hover {\r\n color: $colorPrimary;\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n color: $colorPrimary;\r\n background-color: $colorPrimaryLight;\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-left {\r\n\r\n &:before {\r\n position: absolute;\r\n content: '';\r\n right: 0;\r\n width: 2px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: $ibl;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n text-align: right;\r\n border-right: solid 2px transparent;\r\n\r\n &:hover {\r\n border-right-color: rgba($colorPrimary, 0.5);\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n border-right-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-header-pos-right {\r\n &:before {\r\n position: absolute;\r\n content: '';\r\n left: 0;\r\n width: 2px;\r\n top: 0;\r\n bottom: 0;\r\n background-color: $ibl;\r\n }\r\n\r\n .pl-tabs-header-item {\r\n text-align: left;\r\n border-left: solid 2px transparent;\r\n\r\n &:hover {\r\n border-left-color: rgba($colorPrimary, 0.5);\r\n }\r\n\r\n &.pl-tabs-header-item-active {\r\n border-left-color: $colorPrimary;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-fit-height {\r\n height: 100%;\r\n flex: 1;\r\n align-items: stretch;\r\n\r\n & > .pl-tabs-header {\r\n overflow: auto;\r\n }\r\n\r\n & > .pl-tabs-body {\r\n overflow: hidden;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n & > .pl-inner-tab {\r\n flex: 1;\r\n overflow: auto;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.pl-tabs-head-position-left {\r\n .pl-tabs-body {\r\n padding-left: 16px;\r\n }\r\n }\r\n\r\n &.pl-tabs-head-position-right {\r\n .pl-tabs-body {\r\n padding-right: 16px;\r\n }\r\n }\r\n }\r\n}\r\n"
|
|
378
378
|
],
|
|
379
379
|
"seq": 80
|
|
@@ -388,7 +388,7 @@
|
|
|
388
388
|
{
|
|
389
389
|
"name": "useContextmenu",
|
|
390
390
|
"codes": [
|
|
391
|
-
"@include theme {\r\n .pl-contextmenu-service {\r\n position: fixed;\r\n\r\n .pl-contextmenu-service-body {\r\n transition: all $transition
|
|
391
|
+
"@include theme {\r\n .pl-contextmenu-service {\r\n position: fixed;\r\n\r\n .pl-contextmenu-service-body {\r\n transition: all $transition 150ms;\r\n transform-origin: top left;\r\n box-sizing: border-box;\r\n box-shadow: $boxshadow;\r\n padding: 4px 0;\r\n border: solid 1px $ibc;\r\n\r\n .pl-dropdown-option {\r\n font-size: 12px;\r\n color: $itc;\r\n }\r\n }\r\n }\r\n}\r\n"
|
|
392
392
|
],
|
|
393
393
|
"seq": 85
|
|
394
394
|
},
|
|
@@ -423,11 +423,11 @@
|
|
|
423
423
|
{
|
|
424
424
|
"name": "createUseTableOption",
|
|
425
425
|
"codes": [
|
|
426
|
-
"@include theme {\r\n .pro-column-filter-container {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n width: 360px;\r\n padding: 0 12px;\r\n\r\n & > div {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 4px 0;\r\n\r\n & > .pl-filter {\r\n width: 100%;\r\n display: flex;\r\n }\r\n\r\n .pl-button-group {\r\n width: 100%;\r\n display: flex;\r\n\r\n .pl-button:not(.pl-button-icon-only) {\r\n flex: 1;\r\n }\r\n }\r\n\r\n & > .pl-button {\r\n flex: 1;\r\n\r\n &:first-child {\r\n margin-right: 2px;\r\n }\r\n\r\n &:last-child {\r\n margin-left: 2px;\r\n }\r\n }\r\n }\r\n\r\n .pro-column-filter-sort-container {\r\n background-color: $ibl;\r\n height: plv(sizeNormal);\r\n border-radius: 100px;\r\n width: 100%;\r\n display: flex;\r\n align-items: stretch;\r\n box-sizing: border-box;\r\n padding: 2px;\r\n\r\n & > div {\r\n flex: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n background-color: $ibl;\r\n transition: background-color 300ms linear;\r\n\r\n &:hover {\r\n background-color: #fcfcfc;\r\n }\r\n\r\n &.pro-column-filter-sort-item-active {\r\n background-color: white;\r\n box-shadow: 0 2px 8px #ddd;\r\n color: $colorPrimary;\r\n }\r\n\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
427
426
|
"@include theme {\r\n .pl-table-pro-distinct-filter-item {\r\n display: flex;\r\n align-items: stretch;\r\n line-height: 28px;\r\n\r\n padding: 8px 0;\r\n\r\n background-color: white;\r\n transition: background-color 300ms linear;\r\n\r\n &:not(:last-child) {\r\n border-bottom: solid 1px $ibl;\r\n }\r\n\r\n &:hover {\r\n background-color: #f6f6f6;\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-title {\r\n color: $colorPrimary;\r\n margin: 0 8px;\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-tags {\r\n\r\n cursor: pointer;\r\n\r\n & > div {\r\n display: inline-block;\r\n font-size: 12px;\r\n background-color: $colorPrimaryLight;\r\n padding: 0 12px;\r\n margin: 1px 2px;\r\n border-radius: 4px;\r\n }\r\n }\r\n\r\n .pl-table-pro-distinct-filter-item-button {\r\n\r\n }\r\n }\r\n}\r\n",
|
|
427
|
+
"@include theme {\r\n .pro-column-filter-container {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n width: 360px;\r\n padding: 0 12px;\r\n\r\n & > div {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 4px 0;\r\n\r\n & > .pl-filter {\r\n width: 100%;\r\n display: flex;\r\n }\r\n\r\n .pl-button-group {\r\n width: 100%;\r\n display: flex;\r\n\r\n .pl-button:not(.pl-button-icon-only) {\r\n flex: 1;\r\n }\r\n }\r\n\r\n & > .pl-button {\r\n flex: 1;\r\n\r\n &:first-child {\r\n margin-right: 2px;\r\n }\r\n\r\n &:last-child {\r\n margin-left: 2px;\r\n }\r\n }\r\n }\r\n\r\n .pro-column-filter-sort-container {\r\n background-color: $ibl;\r\n height: plv(sizeNormal);\r\n border-radius: 100px;\r\n width: 100%;\r\n display: flex;\r\n align-items: stretch;\r\n box-sizing: border-box;\r\n padding: 2px;\r\n\r\n & > div {\r\n flex: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n background-color: $ibl;\r\n transition: background-color 300ms linear;\r\n\r\n &:hover {\r\n background-color: #fcfcfc;\r\n }\r\n\r\n &.pro-column-filter-sort-item-active {\r\n background-color: white;\r\n box-shadow: 0 2px 8px #ddd;\r\n color: $colorPrimary;\r\n }\r\n\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
428
428
|
".pl-table-pro-setting-config {\r\n .pl-table-pro-setting-config-button {\r\n margin-bottom: 16px;\r\n\r\n & > * {\r\n margin-right: 8px;\r\n }\r\n }\r\n}\r\n",
|
|
429
|
-
"@include theme {\r\n .pl-table-pro-setting-all-filter {\r\n\r\n background-color: #fafafa;\r\n min-height: 100%;\r\n width: 100%;\r\n display: inline-block;\r\n box-sizing: border-box;\r\n padding: 16px;\r\n\r\n & > * {\r\n margin-bottom: 16px;\r\n\r\n &:first-child {\r\n text-align: right;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-all-filter-item {\r\n background-color: white;\r\n box-sizing: border-box;\r\n border-radius: 2px;\r\n box-shadow: 1px 1px 8px 1px #e2e3e4;\r\n\r\n .pl-table-pro-setting-all-filter-item-head {\r\n font-size: 16px;\r\n font-weight: 600;\r\n border-bottom: solid 1px $ibl;\r\n padding: 16px;\r\n display: flex;\r\n justify-content: space-between;\r\n }\r\n\r\n .pl-table-pro-setting-all-filter-item-body {\r\n padding: 16px;\r\n }\r\n }\r\n }\r\n\r\n}\r\n",
|
|
430
429
|
"@include theme {\r\n .pl-table-pro-setting-export {\r\n .pl-table-pro-setting-export-option {\r\n padding: 12px 12px 12px 50px;\r\n transition: background-color linear 300ms;\r\n position: relative;\r\n\r\n &:hover {\r\n background-color: $colorPrimaryLight;\r\n cursor: pointer;\r\n }\r\n\r\n &:not(:first-child) {\r\n border-top: solid 1px $ibl;\r\n }\r\n\r\n .pl-table-pro-setting-export-option-radio {\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n width: 50px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .pl-table-pro-setting-export-option-title {\r\n font-size: 16px;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .pl-table-pro-setting-export-option-desc {\r\n font-size: 12px;\r\n color: $icc;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-export-foot {\r\n text-align: center;\r\n margin-top: 20px;\r\n\r\n .pl-button + .pl-button {\r\n margin-left: 8px;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-export-loading {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n\r\n .pl-loading, .pl-icon {\r\n font-size: 32px;\r\n }\r\n\r\n & > span {\r\n color: $icc;\r\n }\r\n\r\n & > * {\r\n margin-bottom: 24px;\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
430
|
+
"@include theme {\r\n .pl-table-pro-setting-all-filter {\r\n\r\n background-color: #fafafa;\r\n min-height: 100%;\r\n width: 100%;\r\n display: inline-block;\r\n box-sizing: border-box;\r\n padding: 16px;\r\n\r\n & > * {\r\n margin-bottom: 16px;\r\n\r\n &:first-child {\r\n text-align: right;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-all-filter-item {\r\n background-color: white;\r\n box-sizing: border-box;\r\n border-radius: 2px;\r\n box-shadow: 1px 1px 8px 1px #e2e3e4;\r\n\r\n .pl-table-pro-setting-all-filter-item-head {\r\n font-size: 16px;\r\n font-weight: 600;\r\n border-bottom: solid 1px $ibl;\r\n padding: 16px;\r\n display: flex;\r\n justify-content: space-between;\r\n }\r\n\r\n .pl-table-pro-setting-all-filter-item-body {\r\n padding: 16px;\r\n }\r\n }\r\n }\r\n\r\n}\r\n",
|
|
431
431
|
"@include theme {\r\n .pl-table-pro-setting {\r\n height: 100%;\r\n display: flex;\r\n align-items: stretch;\r\n\r\n $nav-bg: #fcfcfc;\r\n\r\n .pl-table-pro-setting-nav {\r\n background-color: $nav-bg;\r\n display: flex;\r\n flex-direction: column;\r\n\r\n .pl-table-pro-setting-nav-item:last-child {\r\n flex: 1;\r\n }\r\n\r\n .pl-table-pro-setting-nav-item {\r\n padding: 12px 24px;\r\n cursor: pointer;\r\n background-color: white;\r\n position: relative;\r\n\r\n .pl-table-pro-setting-nav-item-inner {\r\n position: relative;\r\n z-index: 1;\r\n }\r\n\r\n &:hover, &.pl-table-pro-setting-nav-item-active {\r\n color: $colorPrimary;\r\n }\r\n\r\n &.pl-table-pro-setting-nav-item-active {\r\n &:after {\r\n position: absolute;\r\n content: '';\r\n top: 0;\r\n bottom: 0;\r\n left: 0;\r\n width: 2px;\r\n background-color: $colorPrimary;\r\n }\r\n }\r\n\r\n &.pl-table-pro-setting-nav-item-prev {\r\n &:before {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n border-bottom-right-radius: 4px;\r\n background-color: $nav-bg;\r\n content: '';\r\n border-bottom: solid 1px $ibl;\r\n border-right: solid 1px $ibl;\r\n }\r\n }\r\n\r\n &.pl-table-pro-setting-nav-item-next {\r\n &:before {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n border-top-right-radius: 4px;\r\n background-color: $nav-bg;\r\n content: '';\r\n border-top: solid 1px $ibl;\r\n border-right: solid 1px $ibl;\r\n }\r\n }\r\n\r\n &:not(.pl-table-pro-setting-nav-item-prev):not(.pl-table-pro-setting-nav-item-next):not(.pl-table-pro-setting-nav-item-active) {\r\n background-color: $nav-bg;\r\n border-right: solid 1px $ibl;\r\n }\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-content {\r\n flex: 1;\r\n overflow-y: scroll;\r\n overflow-x: hidden;\r\n width: 650px;\r\n box-sizing: border-box;\r\n\r\n &.pl-table-pro-setting-content-pending {\r\n padding: 16px;\r\n }\r\n\r\n &::-webkit-scrollbar {\r\n background: white;\r\n width: 6px;\r\n height: 6px;\r\n }\r\n\r\n &::-webkit-scrollbar-thumb {\r\n background: rgba(black, 0.25);\r\n border-radius: 6px;\r\n }\r\n\r\n .pl-table-pro-setting-content-header {\r\n text-align: right;\r\n\r\n & > .pl-button + .pl-button {\r\n margin-left: 8px;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n",
|
|
432
432
|
".pl-table-pro-setting-senior-filter {\r\n .pl-table-pro-setting-senior-filter-button {\r\n display: flex;\r\n justify-content: space-between;\r\n\r\n .pl-button + * {\r\n margin-left: 8px;\r\n }\r\n }\r\n\r\n .pl-table-pro-setting-senior-filter-item {\r\n margin-bottom: 16px;\r\n\r\n .pl-table-pro-setting-senior-filter-item-id {\r\n width: 80px;\r\n display: inline-block;\r\n text-align: center;\r\n }\r\n\r\n .pl-table-pro-setting-senior-filter-item-content {\r\n width: calc(100% - 80px);\r\n display: inline-block;\r\n }\r\n }\r\n}\r\n"
|
|
433
433
|
],
|
|
@@ -36,8 +36,8 @@ $theme-default: (
|
|
|
36
36
|
icc:rgba(0, 0, 0, 0.45), /*图标色*/
|
|
37
37
|
|
|
38
38
|
transitionFlexible:cubic-bezier(.24, .22, .015, 1.2), /*flexible过度动画*/
|
|
39
|
-
transition:
|
|
40
|
-
transition2:
|
|
39
|
+
transition:ease, /*默认过渡动画*/
|
|
40
|
+
transition2:ease, /*过渡动画(轻)*/
|
|
41
41
|
|
|
42
42
|
boxshadow:$boxshadow, /*阴影*/
|
|
43
43
|
boxshadowColor:$boxshadowColor, /*阴影*/
|