feat: add sleep report page
This commit is contained in:
czz
754
src/pages/report/index.scss
Normal file
754
src/pages/report/index.scss
Normal file
@@ -0,0 +1,754 @@
|
||||
.report-page {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, #161d29 0%, #101620 100%);
|
||||
color: #eef5ff;
|
||||
}
|
||||
|
||||
.report-page__content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
min-height: 100vh;
|
||||
padding: calc(var(--report-top-gap, 0px) + 20rpx) 24rpx 56rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.report-page__glow {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.report-page__glow--one {
|
||||
top: 18rpx;
|
||||
right: -54rpx;
|
||||
width: 320rpx;
|
||||
height: 320rpx;
|
||||
background: radial-gradient(circle, rgba(43, 226, 198, 0.18) 0%, rgba(43, 226, 198, 0) 68%);
|
||||
}
|
||||
|
||||
.report-page__glow--two {
|
||||
top: 260rpx;
|
||||
left: -90rpx;
|
||||
width: 280rpx;
|
||||
height: 280rpx;
|
||||
background: radial-gradient(circle, rgba(36, 174, 255, 0.14) 0%, rgba(36, 174, 255, 0) 70%);
|
||||
}
|
||||
|
||||
.report-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.report-header__action {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 68rpx;
|
||||
height: 52rpx;
|
||||
padding: 0 16rpx;
|
||||
border-radius: 18rpx;
|
||||
background: rgba(32, 42, 58, 0.82);
|
||||
box-shadow: inset 0 0 0 2rpx rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.report-header__action--share {
|
||||
min-width: 96rpx;
|
||||
}
|
||||
|
||||
.report-header__action-text {
|
||||
color: #dce7f8;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.report-header__content {
|
||||
flex: 1;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.report-header__title {
|
||||
display: block;
|
||||
color: #f7fbff;
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.report-header__subtitle {
|
||||
display: block;
|
||||
margin-top: 6rpx;
|
||||
color: #8ea0b6;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.report-toolbar {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.report-filters {
|
||||
margin-top: 16rpx;
|
||||
padding: 22rpx;
|
||||
border-radius: 24rpx;
|
||||
background: rgba(24, 33, 47, 0.92);
|
||||
box-shadow: inset 0 0 0 2rpx rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.report-filter + .report-filter {
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
|
||||
.report-filter__label {
|
||||
display: block;
|
||||
margin-bottom: 10rpx;
|
||||
color: #91a3b8;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.report-chip-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.report-chip-group--compact {
|
||||
gap: 10rpx;
|
||||
}
|
||||
|
||||
.report-chip {
|
||||
min-width: 112rpx;
|
||||
padding: 14rpx 20rpx;
|
||||
border-radius: 18rpx;
|
||||
background: rgba(32, 43, 60, 0.95);
|
||||
box-shadow: inset 0 0 0 2rpx rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.report-chip--active {
|
||||
background: linear-gradient(135deg, rgba(47, 224, 190, 0.24), rgba(36, 174, 255, 0.18));
|
||||
box-shadow:
|
||||
inset 0 0 0 2rpx rgba(52, 222, 194, 0.42),
|
||||
0 10rpx 28rpx rgba(18, 129, 165, 0.24);
|
||||
}
|
||||
|
||||
.report-chip__text {
|
||||
color: #9eb0c5;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.report-chip-group--compact .report-chip {
|
||||
min-width: 0;
|
||||
padding: 10rpx 18rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.report-chip-group--compact .report-chip__text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.report-chip__text--active {
|
||||
color: #ecfffb;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.score-overview,
|
||||
.report-card,
|
||||
.metric-grid {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.score-overview {
|
||||
padding: 24rpx;
|
||||
border-radius: 28rpx;
|
||||
background: rgba(24, 33, 47, 0.94);
|
||||
box-shadow:
|
||||
inset 0 0 0 2rpx rgba(255, 255, 255, 0.04),
|
||||
0 20rpx 40rpx rgba(4, 10, 20, 0.2);
|
||||
}
|
||||
|
||||
.score-overview__top {
|
||||
display: flex;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.score-overview__ring {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 248rpx;
|
||||
height: 248rpx;
|
||||
border-radius: 50%;
|
||||
background:
|
||||
radial-gradient(circle at center, rgba(16, 23, 35, 0.92) 0 59%, transparent 60%),
|
||||
conic-gradient(#2de1c2 0 33%, #23b6ff 33% 61%, #ffbf4d 61% 82%, #ff6b6b 82% 100%);
|
||||
}
|
||||
|
||||
.score-overview__ring-inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.score-overview__caption {
|
||||
color: #8da0b5;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.score-overview__score {
|
||||
margin-top: 8rpx;
|
||||
color: #ff9950;
|
||||
font-size: 72rpx;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.score-overview__summary {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.score-overview__level {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 44rpx;
|
||||
padding: 0 18rpx;
|
||||
border-radius: 999rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.score-overview__level--excellent,
|
||||
.metric-card__status--excellent,
|
||||
.summary-grid__status--excellent,
|
||||
.kv-list__status--excellent,
|
||||
.daytime-card__status--excellent {
|
||||
background: rgba(45, 225, 194, 0.16);
|
||||
color: #4ef0cb;
|
||||
}
|
||||
|
||||
.score-overview__level--good,
|
||||
.metric-card__status--good,
|
||||
.summary-grid__status--good,
|
||||
.kv-list__status--good,
|
||||
.daytime-card__status--good {
|
||||
background: rgba(35, 182, 255, 0.16);
|
||||
color: #67cbff;
|
||||
}
|
||||
|
||||
.score-overview__level--warning,
|
||||
.metric-card__status--warning,
|
||||
.summary-grid__status--warning,
|
||||
.kv-list__status--warning,
|
||||
.daytime-card__status--warning {
|
||||
background: rgba(255, 191, 77, 0.16);
|
||||
color: #ffc766;
|
||||
}
|
||||
|
||||
.score-overview__level--danger,
|
||||
.metric-card__status--danger,
|
||||
.summary-grid__status--danger,
|
||||
.kv-list__status--danger,
|
||||
.daytime-card__status--danger {
|
||||
background: rgba(255, 107, 107, 0.16);
|
||||
color: #ff8787;
|
||||
}
|
||||
|
||||
.score-overview__status {
|
||||
display: block;
|
||||
margin-top: 18rpx;
|
||||
color: #e7eef8;
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.score-overview__meta {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 12rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.score-overview__meta-item {
|
||||
padding: 16rpx;
|
||||
border-radius: 18rpx;
|
||||
background: rgba(18, 26, 39, 0.88);
|
||||
}
|
||||
|
||||
.score-overview__meta-label {
|
||||
display: block;
|
||||
color: #90a1b5;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
.score-overview__meta-value {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
color: #f2f7ff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.score-overview__factors {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, minmax(0, 1fr));
|
||||
gap: 12rpx;
|
||||
margin-top: 22rpx;
|
||||
}
|
||||
|
||||
.score-overview__factor {
|
||||
padding: 14rpx 10rpx;
|
||||
border-radius: 16rpx;
|
||||
background: rgba(18, 26, 39, 0.88);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.score-overview__factor-label {
|
||||
display: block;
|
||||
color: #91a3b8;
|
||||
font-size: 20rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.score-overview__factor-value {
|
||||
display: block;
|
||||
margin-top: 6rpx;
|
||||
color: #f4f8ff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.report-card {
|
||||
padding: 24rpx;
|
||||
border-radius: 28rpx;
|
||||
background: rgba(24, 33, 47, 0.94);
|
||||
box-shadow:
|
||||
inset 0 0 0 2rpx rgba(255, 255, 255, 0.04),
|
||||
0 16rpx 36rpx rgba(4, 10, 20, 0.18);
|
||||
}
|
||||
|
||||
.report-card__header {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 20rpx;
|
||||
margin-bottom: 18rpx;
|
||||
}
|
||||
|
||||
.report-card__title {
|
||||
color: #f4f8ff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.report-card__subtitle {
|
||||
display: block;
|
||||
margin-top: 6rpx;
|
||||
color: #90a3b8;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.report-card__badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 40rpx;
|
||||
padding: 0 14rpx;
|
||||
border-radius: 999rpx;
|
||||
background: rgba(35, 182, 255, 0.16);
|
||||
color: #67cbff;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
.report-chart__tooltip {
|
||||
margin-bottom: 16rpx;
|
||||
padding: 16rpx 18rpx;
|
||||
border-radius: 18rpx;
|
||||
background: rgba(16, 23, 35, 0.86);
|
||||
}
|
||||
|
||||
.report-chart__tooltip-title {
|
||||
display: block;
|
||||
color: #f3f8ff;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.report-chart__tooltip-value {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
color: #41e0c4;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.report-chart__tooltip-meta {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
color: #8ea1b8;
|
||||
font-size: 22rpx;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.report-chart {
|
||||
position: relative;
|
||||
height: 260rpx;
|
||||
padding: 16rpx 18rpx 48rpx;
|
||||
border-radius: 24rpx;
|
||||
background: rgba(16, 23, 35, 0.84);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.report-chart--scatter {
|
||||
height: 220rpx;
|
||||
}
|
||||
|
||||
.report-chart__grid {
|
||||
position: absolute;
|
||||
inset: 16rpx 18rpx 48rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.report-chart__grid-line {
|
||||
border-top: 2rpx dashed rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.report-chart__item {
|
||||
position: absolute;
|
||||
top: 16rpx;
|
||||
bottom: 48rpx;
|
||||
width: 44rpx;
|
||||
margin-left: -22rpx;
|
||||
}
|
||||
|
||||
.report-chart__stem {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
width: 4rpx;
|
||||
margin-left: -2rpx;
|
||||
border-radius: 999rpx;
|
||||
background: linear-gradient(180deg, rgba(35, 182, 255, 0.18), rgba(45, 225, 194, 0.7));
|
||||
}
|
||||
|
||||
.report-chart__point {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
margin-left: -8rpx;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 6rpx rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
|
||||
.report-chart__point.is-active {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-left: -11rpx;
|
||||
box-shadow: 0 0 0 10rpx rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.report-chart__point--excellent {
|
||||
background: #2de1c2;
|
||||
}
|
||||
|
||||
.report-chart__point--good {
|
||||
background: #23b6ff;
|
||||
}
|
||||
|
||||
.report-chart__point--warning {
|
||||
background: #ffbf4d;
|
||||
}
|
||||
|
||||
.report-chart__point--danger {
|
||||
background: #ff6b6b;
|
||||
}
|
||||
|
||||
.report-chart__label {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -6rpx;
|
||||
width: 72rpx;
|
||||
margin-left: -36rpx;
|
||||
color: #8193a9;
|
||||
font-size: 18rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.metric-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.metric-card {
|
||||
padding: 22rpx;
|
||||
border-radius: 24rpx;
|
||||
background: rgba(24, 33, 47, 0.94);
|
||||
box-shadow:
|
||||
inset 0 0 0 2rpx rgba(255, 255, 255, 0.04),
|
||||
0 14rpx 30rpx rgba(4, 10, 20, 0.18);
|
||||
}
|
||||
|
||||
.metric-card__label {
|
||||
display: block;
|
||||
color: #90a2b7;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.metric-card__value {
|
||||
display: block;
|
||||
margin-top: 12rpx;
|
||||
color: #f4f8ff;
|
||||
font-size: 34rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.metric-card__unit {
|
||||
margin-left: 8rpx;
|
||||
color: #8fa3b7;
|
||||
font-size: 20rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.metric-card__status,
|
||||
.summary-grid__status,
|
||||
.kv-list__status,
|
||||
.daytime-card__status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 38rpx;
|
||||
margin-top: 14rpx;
|
||||
padding: 0 14rpx;
|
||||
border-radius: 999rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.insight-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14rpx;
|
||||
}
|
||||
|
||||
.insight-card {
|
||||
display: flex;
|
||||
gap: 14rpx;
|
||||
padding: 18rpx;
|
||||
border-radius: 20rpx;
|
||||
background: rgba(16, 23, 35, 0.84);
|
||||
}
|
||||
|
||||
.insight-card__tone {
|
||||
width: 8rpx;
|
||||
border-radius: 999rpx;
|
||||
}
|
||||
|
||||
.insight-card__tone--excellent {
|
||||
background: #2de1c2;
|
||||
}
|
||||
|
||||
.insight-card__tone--good {
|
||||
background: #23b6ff;
|
||||
}
|
||||
|
||||
.insight-card__tone--warning {
|
||||
background: #ffbf4d;
|
||||
}
|
||||
|
||||
.insight-card__tone--danger {
|
||||
background: #ff6b6b;
|
||||
}
|
||||
|
||||
.insight-card__content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.insight-card__title {
|
||||
display: block;
|
||||
color: #f3f8ff;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.insight-card__body {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
color: #91a3b8;
|
||||
font-size: 22rpx;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.summary-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 14rpx;
|
||||
}
|
||||
|
||||
.summary-grid__item {
|
||||
padding: 18rpx;
|
||||
border-radius: 20rpx;
|
||||
background: rgba(16, 23, 35, 0.84);
|
||||
}
|
||||
|
||||
.summary-grid__label {
|
||||
display: block;
|
||||
color: #8ea1b8;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.summary-grid__value {
|
||||
display: block;
|
||||
margin-top: 12rpx;
|
||||
color: #f3f8ff;
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.summary-grid__unit {
|
||||
margin-left: 6rpx;
|
||||
color: #8fa2b9;
|
||||
font-size: 20rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.kv-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.kv-list__row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16rpx;
|
||||
padding: 16rpx 0;
|
||||
border-bottom: 2rpx solid rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.kv-list__row:last-child {
|
||||
border-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.kv-list__label {
|
||||
color: #8fa1b6;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.kv-list__value-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.kv-list__value {
|
||||
color: #f3f8ff;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.distribution-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.distribution-card__ring {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 188rpx;
|
||||
height: 188rpx;
|
||||
border-radius: 50%;
|
||||
background:
|
||||
radial-gradient(circle at center, rgba(16, 23, 35, 0.92) 0 54%, transparent 55%),
|
||||
conic-gradient(#2de1c2 0 29%, #23b6ff 29% 66%, #ffb84d 66% 88%, #ff6b6b 88% 100%);
|
||||
}
|
||||
|
||||
.distribution-card__ring-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
border-radius: 50%;
|
||||
background: rgba(16, 23, 35, 0.94);
|
||||
}
|
||||
|
||||
.distribution-card__ring-text {
|
||||
color: #d7e3f3;
|
||||
font-size: 20rpx;
|
||||
text-align: center;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.distribution-card__list {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14rpx;
|
||||
}
|
||||
|
||||
.distribution-card__row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.distribution-card__legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.distribution-card__dot {
|
||||
width: 14rpx;
|
||||
height: 14rpx;
|
||||
margin-right: 10rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.distribution-card__label {
|
||||
color: #8fa2b8;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.distribution-card__value {
|
||||
color: #f3f8ff;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.daytime-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14rpx;
|
||||
}
|
||||
|
||||
.daytime-card {
|
||||
padding: 18rpx;
|
||||
border-radius: 20rpx;
|
||||
background: rgba(16, 23, 35, 0.84);
|
||||
}
|
||||
|
||||
.daytime-card__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.daytime-card__label {
|
||||
color: #f3f8ff;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.daytime-card__detail {
|
||||
display: block;
|
||||
margin-top: 10rpx;
|
||||
color: #8ea1b8;
|
||||
font-size: 22rpx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
Reference in New Issue
Block a user