mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-02-23 13:31:06 +08:00
refactor(progress): adjust height
This commit is contained in:
parent
dd7a09804b
commit
27422bb191
@ -11,11 +11,6 @@ In fact, progress of line type don't need four different styles. However, since
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="info"
|
||||
@ -29,12 +24,6 @@ In fact, progress of line type don't need four different styles. However, since
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="info"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="success"
|
||||
@ -48,12 +37,6 @@ In fact, progress of line type don't need four different styles. However, since
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="success"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="warning"
|
||||
@ -67,12 +50,6 @@ In fact, progress of line type don't need four different styles. However, since
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="warning"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="error"
|
||||
@ -86,12 +63,6 @@ In fact, progress of line type don't need four different styles. However, since
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="error"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-space>
|
||||
<n-button @click="minus"> Minus 10% </n-button>
|
||||
<n-button @click="add"> Add 10% </n-button>
|
||||
|
@ -11,11 +11,6 @@
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="info"
|
||||
@ -29,12 +24,6 @@
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="info"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="success"
|
||||
@ -48,12 +37,6 @@
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="success"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="warning"
|
||||
@ -67,12 +50,6 @@
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="warning"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="error"
|
||||
@ -86,12 +63,6 @@
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside'"
|
||||
/>
|
||||
<n-progress
|
||||
type="line"
|
||||
status="error"
|
||||
:percentage="percentage"
|
||||
:indicator-placement="'inside-label'"
|
||||
/>
|
||||
<n-space>
|
||||
<n-button @click="minus"> 减 10% </n-button>
|
||||
<n-button @click="add"> 加 10% </n-button>
|
||||
|
@ -143,12 +143,12 @@ export default c([
|
||||
cB('progress-graph-line', [
|
||||
cM('indicator-inside', [
|
||||
cB('progress-graph-line-rail', {
|
||||
height: '21px',
|
||||
borderRadius: '10.5px'
|
||||
height: '16px',
|
||||
borderRadius: '10px'
|
||||
}, [
|
||||
cB('progress-graph-line-fill', {
|
||||
height: '21px',
|
||||
borderRadius: '10.5px'
|
||||
height: 'inherit',
|
||||
borderRadius: '10px'
|
||||
}),
|
||||
cB('progress-graph-line-indicator', `
|
||||
background: transparent;
|
||||
@ -156,16 +156,16 @@ export default c([
|
||||
text-align: right;
|
||||
margin-left: 14px;
|
||||
margin-right: 14px;
|
||||
height: 21px;
|
||||
font-size: var(--font-size);
|
||||
line-height: 21px;
|
||||
height: inherit;
|
||||
line-height: inherit;
|
||||
font-size: 12px;
|
||||
color: var(--text-color-line-inner);
|
||||
transition: color .3s var(--bezier);
|
||||
`)
|
||||
])
|
||||
]),
|
||||
cM('indicator-inside-label', `
|
||||
height: 21px;
|
||||
height: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
`, [
|
||||
@ -175,14 +175,14 @@ export default c([
|
||||
}),
|
||||
cB('progress-graph-line-indicator', `
|
||||
background: var(--fill-color);
|
||||
font-size: var(--font-size);
|
||||
font-size: 12px;
|
||||
transform: translateZ(0);
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
height: 21px;
|
||||
line-height: 21px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
padding: 0 10px;
|
||||
border-radius: 10.5px;
|
||||
border-radius: 10px;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
color: var(--text-color-line-inner);
|
||||
|
@ -17,7 +17,7 @@ export default {
|
||||
fontSize,
|
||||
fontSizeCircle: '28px',
|
||||
railColor: progressRailColorOverlay,
|
||||
railHeight: '10px',
|
||||
railHeight: '8px',
|
||||
iconSizeCircle: '36px',
|
||||
iconSizeLine: '18px',
|
||||
iconColor: infoColor,
|
||||
|
@ -17,7 +17,7 @@ export default {
|
||||
fontSize,
|
||||
fontSizeCircle: '28px',
|
||||
railColor: progressRailColor,
|
||||
railHeight: '10px',
|
||||
railHeight: '8px',
|
||||
iconSizeCircle: '36px',
|
||||
iconSizeLine: '18px',
|
||||
iconColor: infoColor,
|
||||
|
Loading…
Reference in New Issue
Block a user