refactor(progress): adjust height

This commit is contained in:
07akioni 2021-01-13 17:38:18 +08:00
parent dd7a09804b
commit 27422bb191
6 changed files with 14 additions and 73 deletions

View File

@ -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>

View File

@ -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>

View File

@ -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);

View File

@ -17,7 +17,7 @@ export default {
fontSize,
fontSizeCircle: '28px',
railColor: progressRailColorOverlay,
railHeight: '10px',
railHeight: '8px',
iconSizeCircle: '36px',
iconSizeLine: '18px',
iconColor: infoColor,

View File

@ -17,7 +17,7 @@ export default {
fontSize,
fontSizeCircle: '28px',
railColor: progressRailColor,
railHeight: '10px',
railHeight: '8px',
iconSizeCircle: '36px',
iconSizeLine: '18px',
iconColor: infoColor,

View File

@ -406,7 +406,6 @@
- [x] form item default type explain
- [x] selection focus style
- [x] refactor site use store!!! singleton
- [ ] vooks without life cycle hooks
## Info