naive-ui 2.22.0 → 2.24.0

package/es/date-picker/src/styles/index.cssr.js

@@ -1,93 +1,93 @@
 import { c, cB, cE, cM, cNotM } from '../../../_utils/cssr';
 import fadeInScaleUpTransition from '../../../_styles/transitions/fade-in-scale-up.cssr'; // vars:
-// --bezier
-// --icon-color
-// --icon-color-disabled
-// --panel-border-radius
-// --panel-color
-// --panel-box-shadow
-// --panel-text-color
+// --n-bezier
+// --n-icon-color
+// --n-icon-color-disabled
+// --n-panel-border-radius
+// --n-panel-color
+// --n-panel-box-shadow
+// --n-panel-text-color
 // panel header
-// --panel-header-padding
-// --panel-header-divider-color
+// --n-panel-header-padding
+// --n-panel-header-divider-color
 // panel calendar
-// --calendar-left-padding
-// --calendar-right-padding
-// --calendar-title-height
-// --calendar-title-padding
-// --calendar-title-font-size
-// --calendar-title-text-color
-// --calendar-title-font-weight
-// --calendar-title-grid-template-columns
-// --calendar-days-height
-// --calendar-days-divider-color
-// --calendar-days-font-size
-// --calendar-days-text-color
-// --calendar-divider-color
+// --n-calendar-left-padding
+// --n-calendar-right-padding
+// --n-calendar-title-height
+// --n-calendar-title-padding
+// --n-calendar-title-font-size
+// --n-calendar-title-text-color
+// --n-calendar-title-font-weight
+// --n-calendar-title-grid-template-columns
+// --n-calendar-days-height
+// --n-calendar-days-divider-color
+// --n-calendar-days-font-size
+// --n-calendar-days-text-color
+// --n-calendar-divider-color
 // panel action
-// --panel-action-padding
-// --panel-action-divider-color
+// --n-panel-action-padding
+// --n-panel-action-divider-color
 // panel item
-// --item-border-radius
-// --item-size
-// --item-cell-width
-// --item-cell-height
-// --item-text-color
-// --item-color-included
-// --item-color-disabled
-// --item-color-hover
-// --item-color-active
-// --item-font-size
-// --item-text-color-disabled
-// --item-text-color-active
+// --n-item-border-radius
+// --n-item-size
+// --n-item-cell-width
+// --n-item-cell-height
+// --n-item-text-color
+// --n-item-color-included
+// --n-item-color-disabled
+// --n-item-color-hover
+// --n-item-color-active
+// --n-item-font-size
+// --n-item-text-color-disabled
+// --n-item-text-color-active
 // scroll item
-// --scroll-item-width
-// --scroll-item-height
-// --scroll-item-border-radius
+// --n-scroll-item-width
+// --n-scroll-item-height
+// --n-scroll-item-border-radius
 // panel arrow
-// --arrow-size
-// --arrow-color
+// --n-arrow-size
+// --n-arrow-color
 
 export default c([cB('date-picker', `
  position: relative;
  z-index: auto;
  `, [cB('date-picker-icon', `
- color: var(--icon-color);
- transition: color .3s var(--bezier);
+ color: var(--n-icon-color);
+ transition: color .3s var(--n-bezier);
  `), cM('disabled', [cB('date-picker-icon', `
- color: var(--icon-color-disabled);
+ color: var(--n-icon-color-disabled);
  `)])]), cB('date-panel', `
  outline: none;
  margin: 4px 0;
  display: grid;
  grid-template-columns: 0fr;
- border-radius: var(--panel-border-radius);
- background-color: var(--panel-color);
- box-shadow: var(--panel-box-shadow);
- color: var(--panel-text-color);
+ border-radius: var(--n-panel-border-radius);
+ background-color: var(--n-panel-color);
+ box-shadow: var(--n-panel-box-shadow);
+ color: var(--n-panel-text-color);
  `, [fadeInScaleUpTransition(), cB('date-panel-calendar', {
-  padding: 'var(--calendar-left-padding)',
+  padding: 'var(--n-calendar-left-padding)',
   display: 'grid',
   gridTemplateColumns: '1fr',
   gridArea: 'left-calendar'
 }, [cM('end', {
-  padding: 'var(--calendar-right-padding)',
+  padding: 'var(--n-calendar-right-padding)',
   gridArea: 'right-calendar'
 })]), cB('date-panel-month-calendar', {
   display: 'flex',
   gridArea: 'left-calendar'
 }, [cE('picker-col', `
- min-width: var(--scroll-item-width);
- height: calc(var(--scroll-item-height) * 6);
+ min-width: var(--n-scroll-item-width);
+ height: calc(var(--n-scroll-item-height) * 6);
  user-select: none;
  `, [c('&:first-child', `
- min-width: calc(var(--scroll-item-width) + 4px);
+ min-width: calc(var(--n-scroll-item-width) + 4px);
  `, [cE('picker-col-item', [c('&::before', 'left: 4px;')])]), cE('padding', `
- height: calc(var(--scroll-item-height) * 5)
+ height: calc(var(--n-scroll-item-height) * 5)
  `)]), cE('picker-col-item', `
  z-index: 0;
  cursor: pointer;
- height: var(--scroll-item-height);
+ height: var(--n-scroll-item-height);
  box-sizing: border-box;
  padding-top: 4px;
  display: flex;
@@ -95,10 +95,10 @@ export default c([cB('date-picker', `
  justify-content: center;
  position: relative;
  transition: 
- color .3s var(--bezier),
- background-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
  background: #0000;
- color: var(--item-text-color);
+ color: var(--n-item-text-color);
  `, [c('&::before', `
  z-index: -1;
  content: "";
@@ -107,15 +107,15 @@ export default c([cB('date-picker', `
  right: 4px;
  top: 4px;
  bottom: 0;
- border-radius: var(--scroll-item-border-radius);
+ border-radius: var(--n-scroll-item-border-radius);
  transition: 
- background-color .3s var(--bezier);
+ background-color .3s var(--n-bezier);
  `), cNotM('disabled', [c('&:hover::before', `
- background-color: var(--item-color-hover);
+ background-color: var(--n-item-color-hover);
  `), cM('selected', `
- color: var(--item-color-active);
- `, [c('&::before', 'background-color: var(--item-color-hover);')])]), cM('disabled', `
- background-color: var(--item-color-disabled);
+ color: var(--n-item-color-active);
+ `, [c('&::before', 'background-color: var(--n-item-color-hover);')])]), cM('disabled', `
+ background-color: var(--n-item-color-disabled);
  cursor: not-allowed;
  `)])]), cM('date', {
   gridTemplateAreas: `
@@ -159,10 +159,10 @@ export default c([cB('date-picker', `
  box-sizing: border-box;
  width: 100%;
  align-items: center;
- padding: var(--panel-header-padding);
+ padding: var(--n-panel-header-padding);
  display: flex;
  justify-content: space-between;
- border-bottom: 1px solid var(--panel-header-divider-color);
+ border-bottom: 1px solid var(--n-panel-header-divider-color);
  `, [c('>', [c('*:not(:last-child)', {
   marginRight: '10px'
 }), c('*', {
@@ -173,62 +173,62 @@ export default c([cB('date-picker', `
 })])]), cB('date-panel-month', `
  box-sizing: border-box;
  display: grid;
- grid-template-columns: var(--calendar-title-grid-template-columns);
+ grid-template-columns: var(--n-calendar-title-grid-template-columns);
  align-items: center;
  justify-items: center;
- padding: var(--calendar-title-padding);
- height: var(--calendar-title-height);
+ padding: var(--n-calendar-title-padding);
+ height: var(--n-calendar-title-height);
  `, [cE('prev, next, fast-prev, fast-next', `
  line-height: 0;
  cursor: pointer;
- width: var(--arrow-size);
- height: var(--arrow-size);
- color: var(--arrow-color);
+ width: var(--n-arrow-size);
+ height: var(--n-arrow-size);
+ color: var(--n-arrow-color);
  `), cE('month-year', `
- font-size: var(--calendar-title-font-size);
- font-weight: var(--calendar-title-font-weight);
+ font-size: var(--n-calendar-title-font-size);
+ font-weight: var(--n-calendar-title-font-weight);
  line-height: 17px;
  flex-grow: 1;
  text-align: center;
- color: var(--calendar-title-text-color);
+ color: var(--n-calendar-title-text-color);
  `)]), cB('date-panel-weekdays', `
  display: grid;
  margin: auto;
- grid-template-columns: repeat(7, var(--item-cell-width));
- grid-template-rows: repeat(1, var(--item-cell-height));
+ grid-template-columns: repeat(7, var(--n-item-cell-width));
+ grid-template-rows: repeat(1, var(--n-item-cell-height));
  align-items: center;
  justify-items: center;
  margin-bottom: 4px;
- border-bottom: 1px solid var(--calendar-days-divider-color);
+ border-bottom: 1px solid var(--n-calendar-days-divider-color);
  `, [cE('day', `
  line-height: 15px;
- width: var(--item-size);
+ width: var(--n-item-size);
  text-align: center;
- font-size: var(--calendar-days-font-size);
- color: var(--item-text-color);
+ font-size: var(--n-calendar-days-font-size);
+ color: var(--n-item-text-color);
  `)]), cB('date-panel-dates', `
  margin: auto;
  display: grid;
- grid-template-columns: repeat(7, var(--item-cell-width));
- grid-template-rows: repeat(6, var(--item-cell-height));
+ grid-template-columns: repeat(7, var(--n-item-cell-width));
+ grid-template-rows: repeat(6, var(--n-item-cell-height));
  align-items: center;
  justify-items: center;
  flex-wrap: wrap;
  `, [cB('date-panel-date', `
  position: relative;
- width: var(--item-size);
- height: var(--item-size);
- line-height: var(--item-size);
+ width: var(--n-item-size);
+ height: var(--n-item-size);
+ line-height: var(--n-item-size);
  text-align: center;
- font-size: var(--item-font-size);
- border-radius: var(--item-border-radius);
+ font-size: var(--n-item-font-size);
+ border-radius: var(--n-item-border-radius);
  z-index: 0;
  cursor: pointer;
  transition:
- background-color .2s var(--bezier),
- color .2s var(--bezier);
+ background-color .2s var(--n-bezier),
+ color .2s var(--n-bezier);
  `, [cNotM('disabled', [cNotM('selected', [c('&:hover', {
-  backgroundColor: 'var(--item-color-hover)'
+  backgroundColor: 'var(--n-item-color-hover)'
 })])]), cM('current', [cE('sup', `
  position: absolute;
  top: 2px;
@@ -237,9 +237,9 @@ export default c([cB('date-picker', `
  height: 4px;
  width: 4px;
  border-radius: 2px;
- background-color: var(--item-color-active);
+ background-color: var(--n-item-color-active);
  transition:
- background-color .2s var(--bezier);
+ background-color .2s var(--n-bezier);
  `)]), c('&::after', `
  content: "";
  z-index: -1;
@@ -249,60 +249,60 @@ export default c([cB('date-picker', `
  top: 0;
  bottom: 0;
  border-radius: inherit;
- transition: background-color .3s var(--bezier);
+ transition: background-color .3s var(--n-bezier);
  `), cM('covered, start, end', [cNotM('excluded', [c('&::before', `
  content: "";
  z-index: -2;
  position: absolute;
- left: calc((var(--item-size) - var(--item-cell-width)) / 2);
- right: calc((var(--item-size) - var(--item-cell-width)) / 2);
+ left: calc((var(--n-item-size) - var(--n-item-cell-width)) / 2);
+ right: calc((var(--n-item-size) - var(--n-item-cell-width)) / 2);
  top: 0;
  bottom: 0;
- background-color: var(--item-color-included);
+ background-color: var(--n-item-color-included);
  `), c('&:nth-child(7n + 1)::before', {
-  borderTopLeftRadius: 'var(--item-border-radius)',
-  borderBottomLeftRadius: 'var(--item-border-radius)'
+  borderTopLeftRadius: 'var(--n-item-border-radius)',
+  borderBottomLeftRadius: 'var(--n-item-border-radius)'
 }), c('&:nth-child(7n + 7)::before', {
-  borderTopRightRadius: 'var(--item-border-radius)',
-  borderBottomRightRadius: 'var(--item-border-radius)'
+  borderTopRightRadius: 'var(--n-item-border-radius)',
+  borderBottomRightRadius: 'var(--n-item-border-radius)'
 })])]), cM('selected', {
-  color: 'var(--item-text-color-active)'
+  color: 'var(--n-item-text-color-active)'
 }, [c('&::after', {
-  backgroundColor: 'var(--item-color-active)'
+  backgroundColor: 'var(--n-item-color-active)'
 }), cM('start', [c('&::before', {
   left: '50%'
 })]), cM('end', [c('&::before', {
   right: '50%'
 })]), cE('sup', {
-  backgroundColor: 'var(--panel-color)'
+  backgroundColor: 'var(--n-panel-color)'
 })]), cM('excluded', {
-  color: 'var(--item-text-color-disabled)'
+  color: 'var(--n-item-text-color-disabled)'
 }, [cM('selected', [c('&::after', {
-  backgroundColor: 'var(--item-color-disabled)'
+  backgroundColor: 'var(--n-item-color-disabled)'
 })])]), cM('disabled', {
   cursor: 'not-allowed',
-  color: 'var(--item-text-color-disabled)'
+  color: 'var(--n-item-text-color-disabled)'
 }, [cM('covered', [c('&::before', {
-  backgroundColor: 'var(--item-color-disabled)'
+  backgroundColor: 'var(--n-item-color-disabled)'
 })]), cM('selected', [c('&::before', {
-  backgroundColor: 'var(--item-color-disabled)'
+  backgroundColor: 'var(--n-item-color-disabled)'
 }), c('&::after', {
-  backgroundColor: 'var(--item-color-disabled)'
+  backgroundColor: 'var(--n-item-color-disabled)'
 })])])])]), cE('vertical-divider', `
  grid-area: divider;
  height: 100%;
  width: 1px;
- background-color: var(--calendar-divider-color);
+ background-color: var(--n-calendar-divider-color);
  `), cB('date-panel-footer', {
-  borderTop: '1px solid var(--panel-action-divider-color)',
-  padding: 'var(--panel-extra-footer-padding)'
+  borderTop: '1px solid var(--n-panel-action-divider-color)',
+  padding: 'var(--n-panel-extra-footer-padding)'
 }), cB('date-panel-actions', `
  flex: 1;
- padding: var(--panel-action-padding);
+ padding: var(--n-panel-action-padding);
  display: flex;
  align-items: center;
  justify-content: space-between;
- border-top: 1px solid var(--panel-action-divider-color);
+ border-top: 1px solid var(--n-panel-action-divider-color);
  `, [cE('prefix, suffix', `
  display: flex;
  margin-bottom: -8px;

package/es/descriptions/src/Descriptions.d.ts

@@ -243,24 +243,24 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
-        '--th-padding': string;
-        '--td-padding': string;
-        '--font-size': string;
-        '--bezier': string;
-        '--th-font-weight': string;
-        '--line-height': string;
-        '--th-text-color': string;
-        '--td-text-color': string;
-        '--th-color': string;
-        '--th-color-modal': string;
-        '--th-color-popover': string;
-        '--td-color': string;
-        '--td-color-modal': string;
-        '--td-color-popover': string;
-        '--border-radius': string;
-        '--border-color': string;
-        '--border-color-modal': string;
-        '--border-color-popover': string;
+        '--n-th-padding': string;
+        '--n-td-padding': string;
+        '--n-font-size': string;
+        '--n-bezier': string;
+        '--n-th-font-weight': string;
+        '--n-line-height': string;
+        '--n-th-text-color': string;
+        '--n-td-text-color': string;
+        '--n-th-color': string;
+        '--n-th-color-modal': string;
+        '--n-th-color-popover': string;
+        '--n-td-color': string;
+        '--n-td-color-modal': string;
+        '--n-td-color-popover': string;
+        '--n-border-radius': string;
+        '--n-border-color': string;
+        '--n-border-color-modal': string;
+        '--n-border-color-popover': string;
     }>;
     compitableColumn: import("vue").ComputedRef<number>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{

package/es/descriptions/src/Descriptions.js

@@ -33,24 +33,24 @@ export default defineComponent({
                 const { size, bordered } = props;
                 const { common: { cubicBezierEaseInOut }, self: { thColor, thColorModal, thColorPopover, thTextColor, thFontWeight, tdTextColor, tdColor, tdColorModal, tdColorPopover, borderColor, borderColorModal, borderColorPopover, borderRadius, lineHeight, [createKey('fontSize', size)]: fontSize, [createKey(bordered ? 'thPaddingBordered' : 'thPadding', size)]: thPadding, [createKey(bordered ? 'tdPaddingBordered' : 'tdPadding', size)]: tdPadding } } = themeRef.value;
                 return {
-                    '--th-padding': thPadding,
-                    '--td-padding': tdPadding,
-                    '--font-size': fontSize,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--th-font-weight': thFontWeight,
-                    '--line-height': lineHeight,
-                    '--th-text-color': thTextColor,
-                    '--td-text-color': tdTextColor,
-                    '--th-color': thColor,
-                    '--th-color-modal': thColorModal,
-                    '--th-color-popover': thColorPopover,
-                    '--td-color': tdColor,
-                    '--td-color-modal': tdColorModal,
-                    '--td-color-popover': tdColorPopover,
-                    '--border-radius': borderRadius,
-                    '--border-color': borderColor,
-                    '--border-color-modal': borderColorModal,
-                    '--border-color-popover': borderColorPopover
+                    '--n-th-padding': thPadding,
+                    '--n-td-padding': tdPadding,
+                    '--n-font-size': fontSize,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-th-font-weight': thFontWeight,
+                    '--n-line-height': lineHeight,
+                    '--n-th-text-color': thTextColor,
+                    '--n-td-text-color': tdTextColor,
+                    '--n-th-color': thColor,
+                    '--n-th-color-modal': thColorModal,
+                    '--n-th-color-popover': thColorPopover,
+                    '--n-td-color': tdColor,
+                    '--n-td-color-modal': tdColorModal,
+                    '--n-td-color-popover': tdColorPopover,
+                    '--n-border-radius': borderRadius,
+                    '--n-border-color': borderColor,
+                    '--n-border-color-modal': borderColorModal,
+                    '--n-border-color-popover': borderColorPopover
                 };
             }),
             compitableColumn: useCompitable(props, ['columns', 'column'])
@@ -95,8 +95,7 @@ export default defineComponent({
                             : itemSpan * 2 },
                         h("span", { class: `${mergedClsPrefix}-descriptions-table-content__label`, style: labelStyle }, [
                             ...itemLabel,
-                            separator &&
-                                h("span", { class: `${mergedClsPrefix}-descriptions-separator` }, separator)
+                            separator && (h("span", { class: `${mergedClsPrefix}-descriptions-separator` }, separator))
                         ]),
                         h("span", { class: `${mergedClsPrefix}-descriptions-table-content__content`, style: contentStyle }, itemChildren)));
                 }

package/es/descriptions/src/styles/index.cssr.js

@@ -1,32 +1,32 @@
 import { c, cB, cE, cM, cNotM, insideModal, insidePopover } from '../../../_utils/cssr'; // vars:
-// --th-padding
-// --td-padding
-// --font-size
-// --bezier
-// --th-font-weight
-// --line-height
-// --th-text-color
-// --td-text-color
-// --th-color
-// --th-color-modal
-// --th-color-popover
-// --td-color
-// --td-color-modal
-// --td-color-popover
-// --border-radius
-// --border-color
-// --border-color-modal
-// --border-color-popover
+// --n-th-padding
+// --n-td-padding
+// --n-font-size
+// --n-bezier
+// --n-th-font-weight
+// --n-line-height
+// --n-th-text-color
+// --n-td-text-color
+// --n-th-color
+// --n-th-color-modal
+// --n-th-color-popover
+// --n-td-color
+// --n-td-color-modal
+// --n-td-color-popover
+// --n-border-radius
+// --n-border-color
+// --n-border-color-modal
+// --n-border-color-popover
 
 export default c([cB('descriptions', {
-  fontSize: 'var(--font-size)'
+  fontSize: 'var(--n-font-size)'
 }, [cB('descriptions-separator', `
  display: inline-block;
  margin: 0 8px 0 2px;
  `), cB('descriptions-table-wrapper', [cB('descriptions-table', [cB('descriptions-table-row', [cB('descriptions-table-header', {
-  padding: 'var(--th-padding)'
+  padding: 'var(--n-th-padding)'
 }), cB('descriptions-table-content', {
-  padding: 'var(--td-padding)'
+  padding: 'var(--n-td-padding)'
 })])])]), cNotM('bordered', [cB('descriptions-table-wrapper', [cB('descriptions-table', [cB('descriptions-table-row', [c('&:last-child', [cB('descriptions-table-content', {
   paddingBottom: 0
 })])])])])]), cM('left-label-placement', [cB('descriptions-table-content', [c('> *', {
@@ -38,33 +38,33 @@ export default c([cB('descriptions', {
 })]), cM('right-label-align', [c('th', {
   textAlign: 'right'
 })]), cM('bordered', [cB('descriptions-table-wrapper', `
- border-radius: var(--border-radius);
+ border-radius: var(--n-border-radius);
  overflow: hidden;
- background: var(--merged-td-color);
- border: 1px solid var(--merged-border-color);
+ background: var(--n-merged-td-color);
+ border: 1px solid var(--n-merged-border-color);
  `, [cB('descriptions-table', [cB('descriptions-table-row', [c('&:not(:last-child)', [cB('descriptions-table-content', {
-  borderBottom: '1px solid var(--merged-border-color)'
+  borderBottom: '1px solid var(--n-merged-border-color)'
 }), cB('descriptions-table-header', {
-  borderBottom: '1px solid var(--merged-border-color)'
+  borderBottom: '1px solid var(--n-merged-border-color)'
 })]), cB('descriptions-table-header', `
  font-weight: 400;
  background-clip: padding-box;
- background-color: var(--merged-th-color);
+ background-color: var(--n-merged-th-color);
  `, [c('&:not(:last-child)', {
-  borderRight: '1px solid var(--merged-border-color)'
+  borderRight: '1px solid var(--n-merged-border-color)'
 })]), cB('descriptions-table-content', [c('&:not(:last-child)', {
-  borderRight: '1px solid var(--merged-border-color)'
+  borderRight: '1px solid var(--n-merged-border-color)'
 })])])])])]), cB('descriptions-header', `
- font-weight: var(--th-font-weight);
+ font-weight: var(--n-th-font-weight);
  font-size: 18px;
- transition: color .3s var(--bezier);
- line-height: var(--line-height);
+ transition: color .3s var(--n-bezier);
+ line-height: var(--n-line-height);
  margin-bottom: 16px;
- color: var(--th-text-color);
+ color: var(--n-th-text-color);
  `), cB('descriptions-table-wrapper', `
  transition:
- background-color .3s var(--bezier),
- border-color .3s var(--bezier);
+ background-color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
  `, [cB('descriptions-table', `
  width: 100%;
  border-collapse: separate;
@@ -72,47 +72,47 @@ export default c([cB('descriptions', {
  box-sizing: border-box;
  `, [cB('descriptions-table-row', `
  box-sizing: border-box;
- transition: border-color .3s var(--bezier);
+ transition: border-color .3s var(--n-bezier);
  `, [cB('descriptions-table-header', `
- font-weight: var(--th-font-weight);
- line-height: var(--line-height);
+ font-weight: var(--n-th-font-weight);
+ line-height: var(--n-line-height);
  display: table-cell;
  box-sizing: border-box;
- color: var(--th-text-color);
+ color: var(--n-th-text-color);
  transition:
- color .3s var(--bezier),
- background-color .3s var(--bezier),
- border-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
  `), cB('descriptions-table-content', `
  vertical-align: top;
- line-height: var(--line-height);
+ line-height: var(--n-line-height);
  display: table-cell;
  box-sizing: border-box;
- color: var(--td-text-color);
+ color: var(--n-td-text-color);
  transition:
- color .3s var(--bezier),
- background-color .3s var(--bezier),
- border-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
  `, [cE('content', `
- transition: color .3s var(--bezier);
+ transition: color .3s var(--n-bezier);
  display: inline-block;
- color: var(--td-text-color);
+ color: var(--n-td-text-color);
  `)]), cE('label', `
- font-weight: var(--th-font-weight);
- transition: color .3s var(--bezier);
+ font-weight: var(--n-th-font-weight);
+ transition: color .3s var(--n-bezier);
  display: inline-block;
  margin-right: 14px;
- color: var(--th-text-color);
+ color: var(--n-th-text-color);
  `)])])])]), cB('descriptions-table-wrapper', `
- --merged-th-color: var(--th-color);
- --merged-td-color: var(--td-color);
- --merged-border-color: var(--border-color);
+ --n-merged-th-color: var(--n-th-color);
+ --n-merged-td-color: var(--n-td-color);
+ --n-merged-border-color: var(--n-border-color);
  `), insideModal(cB('descriptions-table-wrapper', `
- --merged-th-color: var(--th-color-modal);
- --merged-td-color: var(--td-color-modal);
- --merged-border-color: var(--border-color-modal);
+ --n-merged-th-color: var(--n-th-color-modal);
+ --n-merged-td-color: var(--n-td-color-modal);
+ --n-merged-border-color: var(--n-border-color-modal);
  `)), insidePopover(cB('descriptions-table-wrapper', `
- --merged-th-color: var(--th-color-popover);
- --merged-td-color: var(--td-color-popover);
- --merged-border-color: var(--border-color-popover);
+ --n-merged-th-color: var(--n-th-color-popover);
+ --n-merged-td-color: var(--n-td-color-popover);
+ --n-merged-border-color: var(--n-border-color-popover);
  `))]);