Alexander/FitTrackee
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #470 from SamR1/dark-theme-update

Browse Source 
Dark theme update
This commit is contained in:
Sam 2023-12-20 13:44:05 +01:00 committed by GitHub
commit e46d7f4960
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 34 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
fittrackee/dist/index.html vendored
View File

@ -7,11 +7,11 @@
<link rel="stylesheet" href="/static/css/fork-awesome.min.css"/> <link rel="stylesheet" href="/static/css/fork-awesome.min.css"/>
<link rel="stylesheet" href="/static/css/leaflet.css"/> <link rel="stylesheet" href="/static/css/leaflet.css"/>
<title>FitTrackee</title> <title>FitTrackee</title>
<script type="module" crossorigin src="/static/index-SJb1QCEI.js"></script> <script type="module" crossorigin src="/static/index-uYw8Gs-g.js"></script>
<link rel="modulepreload" crossorigin href="/static/charts-_RwsDDkL.js"> <link rel="modulepreload" crossorigin href="/static/charts-_RwsDDkL.js">
<link rel="modulepreload" crossorigin href="/static/maps-ZyuCPqes.js"> <link rel="modulepreload" crossorigin href="/static/maps-ZyuCPqes.js">
<link rel="stylesheet" crossorigin href="/static/css/maps-B7qTrBCW.css"> <link rel="stylesheet" crossorigin href="/static/css/maps-B7qTrBCW.css">
<link rel="stylesheet" crossorigin href="/static/css/index-86bdJKFy.css"> <link rel="stylesheet" crossorigin href="/static/css/index-RG-OKDmw.css">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

1
fittrackee/dist/static/css/index-86bdJKFy.css vendored
View File

File diff suppressed because one or more lines are too long

1
fittrackee/dist/static/css/index-RG-OKDmw.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

4
fittrackee/dist/static/index-SJb1QCEI.js → fittrackee/dist/static/index-uYw8Gs-g.js vendored
View File

File diff suppressed because one or more lines are too long

16
fittrackee_client/src/components/Common/StatsChart/Chart.vue
View File

@ -42,14 +42,16 @@
() => store.getters[ROOT_STORE.GETTERS.DARK_MODE] () => store.getters[ROOT_STORE.GETTERS.DARK_MODE]
) )
const lineColors = computed(() => ({ const lineColors = computed(() => ({
color: darkMode.value color:
? chartsColors.darkMode.line darkMode.value !== false
: chartsColors.ligthMode.line, ? chartsColors.darkMode.line
: chartsColors.ligthMode.line,
})) }))
const textColors = computed(() => ({ const textColors = computed(() => ({
color: darkMode.value color:
? chartsColors.darkMode.text darkMode.value !== false
: chartsColors.ligthMode.text, ? chartsColors.darkMode.text
: chartsColors.ligthMode.text,
})) }))
const chartData = computed(() => ({ const chartData = computed(() => ({
@ -117,7 +119,7 @@
? // eslint-disable-next-line @typescript-eslint/ban-ts-comment ? // eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore // @ts-ignore
context.dataset.backgroundColor[0] context.dataset.backgroundColor[0]
: '#666666' : textColors.value.color
}, },
rotation: function (context) { rotation: function (context) {
return fullStats.value && context.chart.chartArea.width < 580 return fullStats.value && context.chart.chartArea.width < 580

7
fittrackee_client/src/components/PrivacyPolicyToAccept.vue
View File

@ -2,7 +2,7 @@
<div class="privacy-policy-message"> <div class="privacy-policy-message">
<span> <span>
<i18n-t keypath="user.LAST_PRIVACY_POLICY_TO_VALIDATE"> <i18n-t keypath="user.LAST_PRIVACY_POLICY_TO_VALIDATE">
<router-link to="/profile/edit/privacy-policy"> <router-link to="/profile/edit/privacy-policy" class="policy-link">
{{ $t('user.REVIEW') }} {{ $t('user.REVIEW') }}
</router-link> </router-link>
</i18n-t> </i18n-t>
@ -18,5 +18,10 @@
color: var(--alert-color); color: var(--alert-color);
border-radius: $border-radius; border-radius: $border-radius;
padding: $default-padding $default-padding * 2; padding: $default-padding $default-padding * 2;
.policy-link {
color: var(--policy-link-color);
text-decoration: underline;
}
} }
</style> </style>

2
fittrackee_client/src/components/Workout/WorkoutCard.vue
View File

@ -234,7 +234,7 @@
} }
.workout-map { .workout-map {
background-color: var(--workout-no-map-bg-color); background-color: var(--workout-static-map-bg-color);
height: 150px; height: 150px;
.no-map { .no-map {
line-height: 150px; line-height: 150px;

14
fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
View File

@ -118,14 +118,16 @@
() => datasets.value.coordinates () => datasets.value.coordinates
) )
const lineColors = computed(() => ({ const lineColors = computed(() => ({
color: darkMode.value color:
? chartsColors.darkMode.line darkMode.value !== false
: chartsColors.ligthMode.line, ? chartsColors.darkMode.line
: chartsColors.ligthMode.line,
})) }))
const textColors = computed(() => ({ const textColors = computed(() => ({
color: darkMode.value color:
? chartsColors.darkMode.text darkMode.value !== false
: chartsColors.ligthMode.text, ? chartsColors.darkMode.text
: chartsColors.ligthMode.text,
})) }))
const options = computed<ChartOptions<'line'>>(() => ({ const options = computed<ChartOptions<'line'>>(() => ({

4
fittrackee_client/src/scss/colors-dark.scss
View File

@ -30,6 +30,7 @@
--dropdown-background-color: var(--dark-blue); --dropdown-background-color: var(--dark-blue);
--dropdown-border-color: var(--input-border-color); --dropdown-border-color: var(--input-border-color);
--policy-border-color: #ccc; --policy-border-color: #ccc;
--policy-link-color: var(--alert-color);
--box-shadow-color: lightgrey; --box-shadow-color: lightgrey;
--admin-disabled-input-color: var(--dark-blue); --admin-disabled-input-color: var(--dark-blue);
@ -87,13 +88,14 @@
--map-attribution-text: #e8e8e8; --map-attribution-text: #e8e8e8;
--map-display-hover-attribution-text: #444444; --map-display-hover-attribution-text: #444444;
--map-attribution-bg-color: none; --map-attribution-bg-color: none;
--map-filter: invert(1) hue-rotate(180deg) brightness(0.8) contrast(0.8); --map-filter: invert(1) hue-rotate(180deg) brightness(0.85) contrast(0.85);
--map-display-hover-filter: invert(1) hue-rotate(180deg) brightness(1.5) --map-display-hover-filter: invert(1) hue-rotate(180deg) brightness(1.5)
contrast(0.6); contrast(0.6);
--map-layers-overlays: var(--app-color); --map-layers-overlays: var(--app-color);
--map-control-bar: var(--app-color); --map-control-bar: var(--app-color);
--no-map-filter: invert(1) brightness(1.5) contrast(0.9); --no-map-filter: invert(1) brightness(1.5) contrast(0.9);
--workout-static-map-shadow-color: #d2d2d2; --workout-static-map-shadow-color: #d2d2d2;
--workout-static-map-bg-color: #818181;
--mountains-filter: invert(90%) sepia(19%) saturate(0%) hue-rotate(39deg) --mountains-filter: invert(90%) sepia(19%) saturate(0%) hue-rotate(39deg)
brightness(86%) contrast(102%); brightness(86%) contrast(102%);

2
fittrackee_client/src/scss/colors.scss
View File

@ -27,6 +27,7 @@
--dropdown-background-color: #ffffff; --dropdown-background-color: #ffffff;
--dropdown-border-color: lightgrey; --dropdown-border-color: lightgrey;
--policy-border-color: #ccc; --policy-border-color: #ccc;
--policy-link-color: var(--app-a-color);
--box-shadow-color: lightgrey; --box-shadow-color: lightgrey;
--admin-disabled-input-color: #ffffff; --admin-disabled-input-color: #ffffff;
@ -90,6 +91,7 @@
--map-control-bar: #bfc0ab; --map-control-bar: #bfc0ab;
--no-map-filter: initial; --no-map-filter: initial;
--workout-static-map-shadow-color: var(--app-shadow-color); --workout-static-map-shadow-color: var(--app-shadow-color);
--workout-static-map-bg-color: var(--workout-no-map-bg-color);
--mountains-filter: invert(19%) sepia(9%) saturate(2921%) hue-rotate(169deg) --mountains-filter: invert(19%) sepia(9%) saturate(2921%) hue-rotate(169deg)
brightness(85%) contrast(80%); brightness(85%) contrast(80%);