Gava/agenciapsilmno
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Change button location, fixed charts on mobile

Browse Source
This commit is contained in:
Cagatay Civici
2024-07-31 10:40:41 +03:00
parent 2e3cfcc0d5
commit fa5009486a
4 changed files with 10 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/assets/layout/_responsive.scss
View File

@@ -22,6 +22,7 @@
height: 100vh;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-right: 1px solid var(--surface-border);
box-shadow:
0px 3px 5px rgba(0, 0, 0, 0.02),
0px 0px 2px rgba(0, 0, 0, 0.05),

11
src/assets/layout/_topbar.scss
View File

@@ -71,7 +71,7 @@
}
.layout-menu-button {
margin-left: 2rem;
margin-right: 0.5rem;
}
.layout-topbar-menu-button {
@@ -97,24 +97,19 @@
@media (max-width: 991px) {
.layout-topbar {
padding: 0 2rem;
.layout-topbar-logo-container {
width: auto;
order: 2;
}
.layout-menu-button {
margin-left: 0;
margin-right: 1rem;
order: 1;
}
.layout-topbar-menu-button {
display: inline-flex;
order: 4;
}
.layout-topbar-actions {
order: 3;
}
.layout-topbar-menu {

7
src/layout/AppTopbar.vue
View File

@@ -8,6 +8,9 @@ const { onMenuToggle, toggleDarkMode, isDarkTheme } = useLayout();
<template>
<div class="layout-topbar">
<div class="layout-topbar-logo-container">
<button class="layout-menu-button layout-topbar-action" @click="onMenuToggle">
<i class="pi pi-bars"></i>
</button>
<router-link to="/" class="layout-topbar-logo">
<svg viewBox="0 0 54 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
@@ -31,10 +34,6 @@ const { onMenuToggle, toggleDarkMode, isDarkTheme } = useLayout();
</router-link>
</div>
<button class="layout-menu-button layout-topbar-action" @click="onMenuToggle">
<i class="pi pi-bars"></i>
</button>
<div class="layout-topbar-actions">
<div class="layout-config-menu">
<button type="button" class="layout-topbar-action" @click="toggleDarkMode">

6
src/views/Dashboard.vue
View File

@@ -29,21 +29,21 @@ function setChartData() {
{
type: 'bar',
label: 'Subscriptions',
backgroundColor: 'color-mix(in srgb, ' + documentStyle.getPropertyValue('--p-primary-400') + ' 100%, #fff)',
backgroundColor: documentStyle.getPropertyValue('--p-primary-400'),
data: [4000, 10000, 15000, 4000],
barThickness: 32
},
{
type: 'bar',
label: 'Advertising',
backgroundColor: 'color-mix(in srgb, ' + documentStyle.getPropertyValue('--p-primary-300') + ' 100%, transparent)',
backgroundColor: documentStyle.getPropertyValue('--p-primary-300'),
data: [2100, 8400, 2400, 7500],
barThickness: 32
},
{
type: 'bar',
label: 'Affiliate',
backgroundColor: 'color-mix(in srgb, ' + documentStyle.getPropertyValue('--p-primary-200') + ' 100%, transparent)',
backgroundColor: documentStyle.getPropertyValue('--p-primary-200'),
data: [4100, 5200, 3400, 7400],
borderRadius: {
topLeft: 8,