HTWK/htwkalender
1
1
Fork 0
mirror of https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender.git synced 2025-07-24 21:39:14 +02:00
Code Issues Packages Projects Releases Wiki Activity

dark theme color scheme

Browse Source
This commit is contained in:
survellow
2024-01-18 21:55:22 +01:00
parent 45685d99be
commit 5dd8ecd5a1
8 changed files with 921 additions and 830 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/package-lock.json generated
View File

@@ -18,6 +18,7 @@
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",
"primevue": "^3.46.0",
"source-sans-pro": "^3.6.0",
"vue": "^3.4.11",
"vue-i18n": "^9.9.0",
"vue-router": "^4.2.5"
@@ -4033,6 +4034,12 @@
"source-map": "^0.6.0"
}
},
"node_modules/source-sans-pro": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/source-sans-pro/-/source-sans-pro-3.6.0.tgz",
"integrity": "sha512-C1RFUGu+YASuqpgDRInTM7Y6OwqeWNOuKn7v0P/4Kh66epTI4PYWwPWP5kdA4l/VqzBAWiqoz5dk0trof73R7w==",
"deprecated": "WARNING: This project has been renamed to source-sans. Install using source-sans instead."
},
"node_modules/stackback": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",

1
frontend/package.json
View File

@@ -23,6 +23,7 @@
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",
"primevue": "^3.46.0",
"source-sans-pro": "^3.6.0",
"vue": "^3.4.11",
"vue-i18n": "^9.9.0",
"vue-router": "^4.2.5"

1640
frontend/public/themes/lara-dark-blue/theme.css
View File

File diff suppressed because it is too large Load Diff

64
frontend/public/themes/lara-light-blue/theme.css
View File

@@ -53,7 +53,7 @@
}
.p-component {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
font-weight: normal;
@@ -88,7 +88,7 @@
.p-link {
font-size: 1rem;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
border-radius: 6px;
}
@@ -272,7 +272,7 @@
.p-autocomplete-multiple-container
.p-autocomplete-input-token
input {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
color: #495057;
@@ -795,7 +795,7 @@
padding: 0.375rem 0;
}
.p-chips .p-chips-multiple-container .p-chips-input-token input {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
color: #495057;
@@ -1217,7 +1217,7 @@
}
.p-inputtext {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
color: #495057;
@@ -6486,12 +6486,12 @@
}
.p-inline-message.p-inline-message-success {
background: #e4f8f0;
border: solid #1ea97c;
border: solid var(--success-primary);
border-width: 0px;
color: #1ea97c;
color: var(--success-primary);
}
.p-inline-message.p-inline-message-success .p-inline-message-icon {
color: #1ea97c;
color: var(--success-primary);
}
.p-inline-message.p-inline-message-warn {
background: #fff2e2;
@@ -6503,13 +6503,13 @@
color: #cc8925;
}
.p-inline-message.p-inline-message-error {
background: #ffe7e6;
border: solid #ff5757;
background: var(--error-tertiary);
border: solid var(--error-primary);
border-width: 0px;
color: #ff5757;
color: var(--error-primary);
}
.p-inline-message.p-inline-message-error .p-inline-message-icon {
color: #ff5757;
color: var(--error-primary);
}
.p-inline-message .p-inline-message-icon {
font-size: 1rem;
@@ -6561,15 +6561,15 @@
}
.p-message.p-message-success {
background: #e4f8f0;
border: solid #1ea97c;
border: solid var(--success-primary);
border-width: 0 0 0 6px;
color: #1ea97c;
color: var(--success-primary);
}
.p-message.p-message-success .p-message-icon {
color: #1ea97c;
color: var(--success-primary);
}
.p-message.p-message-success .p-message-close {
color: #1ea97c;
color: var(--success-primary);
}
.p-message.p-message-warn {
background: #fff2e2;
@@ -6584,16 +6584,16 @@
color: #cc8925;
}
.p-message.p-message-error {
background: #ffe7e6;
border: solid #ff5757;
background: var(--error-tertiary);
border: solid var(--error-primary);
border-width: 0 0 0 6px;
color: #ff5757;
color: var(--error-primary);
}
.p-message.p-message-error .p-message-icon {
color: #ff5757;
color: var(--error-primary);
}
.p-message.p-message-error .p-message-close {
color: #ff5757;
color: var(--error-primary);
}
.p-message .p-message-text {
font-size: 1rem;
@@ -6669,13 +6669,13 @@
}
.p-toast .p-toast-message.p-toast-message-success {
background: #e4f8f0;
border: solid #1ea97c;
border: solid var(--success-primary);
border-width: 0 0 0 6px;
color: #1ea97c;
color: var(--success-primary);
}
.p-toast .p-toast-message.p-toast-message-success .p-toast-message-icon,
.p-toast .p-toast-message.p-toast-message-success .p-toast-icon-close {
color: #1ea97c;
color: var(--success-primary);
}
.p-toast .p-toast-message.p-toast-message-warn {
background: #fff2e2;
@@ -6688,14 +6688,14 @@
color: #cc8925;
}
.p-toast .p-toast-message.p-toast-message-error {
background: #ffe7e6;
border: solid #ff5757;
background: var(--error-tertiary);
border: solid var(--error-primary);
border-width: 0 0 0 6px;
color: #ff5757;
color: var(--error-primary);
}
.p-toast .p-toast-message.p-toast-message-error .p-toast-message-icon,
.p-toast .p-toast-message.p-toast-message-error .p-toast-icon-close {
color: #ff5757;
color: var(--error-primary);
}
.p-galleria .p-galleria-close {
@@ -7029,7 +7029,7 @@
.p-progress-spinner-circle {
stroke-dasharray: 89, 200;
stroke-dashoffset: 0;
stroke: #ff5757;
stroke: var(--error-primary);
animation:
p-progress-spinner-dash 1.5s ease-in-out infinite,
p-progress-spinner-color 6s ease-in-out infinite;
@@ -7058,13 +7058,13 @@
@keyframes p-progress-spinner-color {
100%,
0% {
stroke: #ff5757;
stroke: var(--error-primary);
}
40% {
stroke: #696cff;
}
66% {
stroke: #1ea97c;
stroke: var(--success-primary);
}
80%,
90% {
@@ -7150,7 +7150,7 @@
}
.p-terminal .p-terminal-input {
font-size: 1rem;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

22
frontend/src/components/MenuBar.vue
View File

@@ -19,22 +19,22 @@ const items = computed(() => [
{
label: t("roomFinder"),
icon: "pi pi-fw pi-calendar",
route: `rooms`,
route: "/rooms",
},
{
label: t("faq"),
icon: "pi pi-fw pi-book",
route: `faq`,
route: "/faq",
},
{
label: t("imprint"),
icon: "pi pi-fw pi-id-card",
route: `imprint`,
route: "/imprint",
},
{
label: t("privacy"),
icon: "pi pi-fw pi-exclamation-triangle",
route: `privacy-policy`,
route: "/privacy-policy",
},
]);
</script>
@@ -62,6 +62,7 @@ const items = computed(() => [
text
severity="secondary"
@click="navigate"
:class="item.route === $route.path ? 'active' : ''"
/>
</router-link>
</template>
@@ -79,4 +80,17 @@ const items = computed(() => [
background-color: transparent;
border: none;
}
:deep(.p-button .p-button-label::after) {
content: "";
display: block;
width: 0;
height: 2px;
background: var(--primary-color);
transition: width 0.3s;
}
:deep(.p-button.active .p-button-label::after) {
width: 100%;
}
</style>

13
frontend/src/components/ModuleSelection.vue
View File

@@ -103,14 +103,13 @@ function toggleModule(module: Module) {
class="flex flex-column sm:flex-row justify-content-between align-items-center flex-1 column-gap-4 mx-2 md:mx-4"
>
<p class="text-lg flex-1 align-self-stretch">{{ item.name }}</p>
<ToggleButton
<Button
class="w-9rem align-self-end my-2"
off-icon="pi pi-times"
:off-label="$t('moduleSelection.unselected')"
on-icon="pi pi-check"
:on-label="$t('moduleSelection.selected')"
:model-value="store.hasModule(item)"
@update:model-value="toggleModule(item)"
:icon="store.hasModule(item) ? 'pi pi-times' : 'pi pi-plus'"
:label="store.hasModule(item) ? $t('moduleSelection.selected') : $t('moduleSelection.unselected')"
@click="toggleModule(item)"
outlined
:severity="store.hasModule(item) ? '' : 'secondary'"
/>
</div>
</div>

2
frontend/src/main.ts
View File

@@ -1,3 +1,5 @@
import "source-sans-pro/source-sans-pro.css";
import { createApp } from "vue";
import "./style.css";
import App from "./App.vue";

2
frontend/src/view/DynamicPage.vue
View File

@@ -27,7 +27,7 @@ const hasContent = computed(() => {
<div
class="flex flex-column align-items-center mt-0"
>
<div class="flex align-items-center justify-content-center gap-2 mx-2 transition-rolldown"
<div class="flex align-items-center justify-content-center gap-3 mx-2 mb-4 transition-rolldown"
:class="{'md:mt-8': hideContent}"
>
<h3 class="text-4xl">