JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite: update charts styling

Browse Source 
This change updates the styling of the satellite UI dashboard charts
to prepare for V2.

Change-Id: Ic329963a6b825e3e4aaecab0696080a152a41c5f
This commit is contained in:
Tome Boshevski 2023-11-09 13:30:27 -06:00 committed by Jeremy Wharton
parent c246d36adf
commit 07e2a9af06
2 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
web/satellite/src/components/project/dashboard/BandwidthChart.vue
View File

@ -50,10 +50,10 @@ const chartData = computed((): ChartData => {
datasets: [{
data,
fill: true,
backgroundColor: '#929fb110',
borderColor: '#929fb1',
backgroundColor: '#c3c3c310',
borderColor: '#c3c3c3',
pointHoverBackgroundColor: '#FFFFFF',
pointBorderColor: '#929fb1',
pointBorderColor: '#c3c3c3',
pointHoverBorderWidth: 3,
hoverRadius: 8,
hitRadius: 3,
@ -108,13 +108,14 @@ watch(() => props.width, () => {
display: flex;
flex-direction: column;
align-items: center;
background-color: #929fb1;
background-color: #e4e4e4;
box-shadow: rgb(0 0 0 / 3%) 0 1px 10px 10px !important;
&__value {
font-size: 14px;
line-height: 26px;
text-align: center;
color: var(--c-white);
color: #444;
white-space: nowrap;
&__bold {
@ -128,7 +129,7 @@ watch(() => props.width, () => {
border-radius: 8px 0 0;
transform: scale(1, 0.85) translate(0, 20%) rotate(45deg);
margin-bottom: -4px;
background-color: #929fb1;
background-color: #e4e4e4;
}
}
</style>

13
web/satellite/src/components/project/dashboard/StorageChart.vue
View File

@ -50,10 +50,10 @@ const chartData = computed((): ChartData => {
datasets: [{
data,
fill: true,
backgroundColor: '#929fb110',
borderColor: '#929fb1',
backgroundColor: '#c3c3c310',
borderColor: '#c3c3c3',
pointHoverBackgroundColor: '#FFFFFF',
pointBorderColor: '#929fb1',
pointBorderColor: '#c3c3c3',
pointHoverBorderWidth: 3,
hoverRadius: 8,
hitRadius: 3,
@ -107,13 +107,14 @@ watch(() => props.width, () => {
display: flex;
flex-direction: column;
align-items: center;
background-color: #929fb1;
background-color: #e4e4e4;
box-shadow: rgb(0 0 0 / 3%) 0 1px 10px 10px !important;
&__value {
font-size: 14px;
line-height: 26px;
text-align: center;
color: var(--c-white);
color: #444;
white-space: nowrap;
&__bold {
@ -127,7 +128,7 @@ watch(() => props.width, () => {
border-radius: 8px 0 0;
transform: scale(1, 0.85) translate(0, 20%) rotate(45deg);
margin-bottom: -4px;
background-color: #929fb1;
background-color: #e4e4e4;
}
}
</style>