From 6998d07c6b498c6eec7a8390c3a486ef80fcd21a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tom=20Tr=C3=B6ger?= Date: Mon, 26 Jan 2026 21:46:32 +0100 Subject: [PATCH] fix: css bug after container browser update --- Backend/src/main.css | 278 +++++++++++++------------- Backend/templates/reportPage.templ | 6 +- Backend/templates/reportPage_templ.go | 4 +- Docker/docker-compose.yml | 10 +- Jenkinsfile | 66 ------ 5 files changed, 149 insertions(+), 215 deletions(-) delete mode 100644 Jenkinsfile diff --git a/Backend/src/main.css b/Backend/src/main.css index 2e260d6..7b06187 100644 --- a/Backend/src/main.css +++ b/Backend/src/main.css @@ -1,163 +1,157 @@ @import "tailwindcss"; @source "../templates/*.templ"; @plugin "@iconify/tailwind4" { - scale: 1.25; + scale: 1.25; } @theme { - --color-accent-50: #e7fdea; - --color-accent-100: #cbfbd1; - --color-accent-200: #9cf7a8; - --color-accent-300: #68f37a; - --color-accent-400: #33ef4d; - --color-accent-500: #11db2d; - --color-accent-600: #0eaf23; - --color-accent-700: #0a851b; - --color-accent-800: #075a12; - --color-accent-900: #032b09; - --color-accent-950: #021805; - --color-accent: #0eaf23; - --color-text-50: #f7f8f7; - --color-text-100: #f2f3f2; - --color-text-200: #e2e4e2; - --color-text-300: #d2d6d2; - --color-text-400: #c2c7c2; - --color-text-500: #afb6af; - --color-text-600: #97a097; - --color-text-700: #7d877d; - --color-text-800: #5a625a; - --color-text-900: #161816; - --color-text-950: #000000; + --color-accent-50: #e7fdea; + --color-accent-100: #cbfbd1; + --color-accent-200: #9cf7a8; + --color-accent-300: #68f37a; + --color-accent-400: #33ef4d; + --color-accent-500: #11db2d; + --color-accent-600: #0eaf23; + --color-accent-700: #0a851b; + --color-accent-800: #075a12; + --color-accent-900: #032b09; + --color-accent-950: #021805; + --color-accent: #0eaf23; + --color-text-50: #f7f8f7; + --color-text-100: #f2f3f2; + --color-text-200: #e2e4e2; + --color-text-300: #d2d6d2; + --color-text-400: #c2c7c2; + --color-text-500: #afb6af; + --color-text-600: #97a097; + --color-text-700: #7d877d; + --color-text-800: #5a625a; + --color-text-900: #161816; + --color-text-950: #000000; } @layer base { - body { - -webkit-print-color-adjust: exact !important; - print-color-adjust: exact !important; - background-color: white; - } + body { + -webkit-print-color-adjust: exact !important; + print-color-adjust: exact !important; + background-color: white; + } } @layer components { - .grid-main { - display: grid; - grid-template-columns: 4fr 3fr 3fr 1fr; - align-items: stretch; - } - - .grid-sub { - display: grid; - grid-template-columns: subgrid; - grid-column: 1 / -1; - border-color: var(--color-neutral-400); - transition: background-color 0.2s ease-in-out; - } - - .grid-sub.responsive { - display: flex; - flex-direction: column; - } - - .grid-sub:hover { - background-color: var(--color-neutral-200); - } - - .grid-cell { - padding: calc(var(--spacing) * 2); - border-color: var(--color-neutral-400); - } - - .btn { - width: 100%; - cursor: pointer; - border-radius: var(--radius-md); - color: var(--color-neutral-800); - font-size: var(--text-sm); - text-align: center; - padding: calc(var(--spacing) * 2); - border-style: var(--tw-border-style); - border-width: 1px; - border-color: var(--color-neutral-800); - transition-property: - color, background-color, border-color, outline-color, - text-decoration-color, fill, stroke, --tw-gradient-from, - --tw-gradient-via, --tw-gradient-to; - transition-timing-function: var( - --tw-ease, - var(--default-transition-timing-function) - ); - transition-duration: var(--tw-duration, var(--default-transition-duration)); - } - - input.btn, - select.btn { - transition-duration: 300ms; - } - - .btn:hover { - color: var(--color-white); - background-color: var(--color-neutral-700); - } - - .btn:disabled { - opacity: 50%; - pointer-events: none; - } - - input.btn, - select.btn { - text-align: left; - } - - input.btn:hover, - select.btn:hover { - border-color: var(--color-neutral-300); - background-color: var(--color-neutral-100); - color: var(--color-neutral-800); - } - - .edit-box { - border-radius: var(--radius-md); - overflow: hidden; - border-color: var(--color-neutral-500); - transition-property: background-color, border-color; - transition-timing-function: var(--default-transition-timing-function) * 2; - transition-duration: var(--default-transition-duration); - outline: none; - - &:is(:where(.group):is(.edit) *) { - border-width: 1px; - } - } - - .edit-box:hover { - &:is(:where(.group):is(.edit) *) { - background-color: var(--color-white); - border-color: var(--color-neutral-300); - } - } - - .edit-box input:focus { - outline: none; - } - - div.edit { - border-width: 1px; - background-color: var(--color-neutral-300); - } - - @media (width >=48rem) { .grid-main { - grid-template-columns: repeat(5, 1fr); - margin: 0 10%; + display: grid; + grid-template-columns: 4fr 3fr 3fr 1fr; + align-items: stretch; + } + + .grid-sub { + display: grid; + grid-template-columns: subgrid; + grid-column: 1 / -1; + border-color: var(--color-neutral-400); + transition: background-color 0.2s ease-in-out; } .grid-sub.responsive { - display: grid; + display: flex; + flex-direction: column; + } + + .grid-sub:hover { + background-color: var(--color-neutral-200); + } + + .grid-cell { + padding: calc(var(--spacing) * 2); + border-color: var(--color-neutral-400); } .btn { - padding-inline: calc(var(--spacing) * 4); + width: 100%; + cursor: pointer; + border-radius: var(--radius-md); + color: var(--color-neutral-800); + font-size: var(--text-sm); + text-align: center; + padding: calc(var(--spacing) * 2); + border-style: var(--tw-border-style); + border-width: 1px; + border-color: var(--color-neutral-800); + transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + + input.btn, + select.btn { + transition-duration: 300ms; + } + + .btn:hover { + color: var(--color-white); + background-color: var(--color-neutral-700); + } + + .btn:disabled { + opacity: 50%; + pointer-events: none; + } + + input.btn, + select.btn { + text-align: left; + } + + input.btn:hover, + select.btn:hover { + border-color: var(--color-neutral-300); + background-color: var(--color-neutral-100); + color: var(--color-neutral-800); + } + + .edit-box { + border-radius: var(--radius-md); + overflow: hidden; + border-color: var(--color-neutral-500); + transition-property: background-color, border-color; + transition-timing-function: var(--default-transition-timing-function) * 2; + transition-duration: var(--default-transition-duration); + outline: none; + + &:is(:where(.group):is(.edit) *) { + border-width: 1px; + } + } + + .edit-box:hover { + &:is(:where(.group):is(.edit) *) { + background-color: var(--color-white); + border-color: var(--color-neutral-300); + } + } + + .edit-box input:focus { + outline: none; + } + + div.edit { + border-width: 1px; + background-color: var(--color-neutral-300); + } + + @media (width >=48rem) { + .grid-main { + grid-template-columns: repeat(5, 1fr); + margin: 0 10%; + } + + .grid-sub.responsive { + display: grid; + } + + .btn { + padding-inline: calc(var(--spacing) * 4); + } } - } } diff --git a/Backend/templates/reportPage.templ b/Backend/templates/reportPage.templ index bc74e34..b832935 100644 --- a/Backend/templates/reportPage.templ +++ b/Backend/templates/reportPage.templ @@ -11,8 +11,8 @@ import ( templ TeamPage(weeks []models.WorkWeek, userWeek models.WorkWeek) { @Base() @headerComponent() -
-
+
+

Eigene Abrechnung

@@ -34,7 +34,7 @@ templ workWeekComponent(week models.WorkWeek, onlyAccept bool) { year, kw := week.WeekStart.ISOWeek() progress := (float32(week.WorktimeVirtual.Hours()) / week.User.ArbeitszeitPerWoche) * 100 }} -
+
if !onlyAccept {
diff --git a/Backend/templates/reportPage_templ.go b/Backend/templates/reportPage_templ.go index 96ed8f5..2d78c73 100644 --- a/Backend/templates/reportPage_templ.go +++ b/Backend/templates/reportPage_templ.go @@ -45,7 +45,7 @@ func TeamPage(weeks []models.WorkWeek, userWeek models.WorkWeek) templ.Component if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "

Eigene Abrechnung

") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "

Eigene Abrechnung

") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } @@ -96,7 +96,7 @@ func workWeekComponent(week models.WorkWeek, onlyAccept bool) templ.Component { ctx = templ.ClearChildren(ctx) year, kw := week.WeekStart.ISOWeek() progress := (float32(week.WorktimeVirtual.Hours()) / week.User.ArbeitszeitPerWoche) * 100 - templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "
") + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "
") if templ_7745c5c3_Err != nil { return templ_7745c5c3_Err } diff --git a/Docker/docker-compose.yml b/Docker/docker-compose.yml index cec5dd3..f7c3c11 100644 --- a/Docker/docker-compose.yml +++ b/Docker/docker-compose.yml @@ -13,9 +13,14 @@ services: - ${POSTGRES_PATH}/initdb:/docker-entrypoint-initdb.d ports: - ${POSTGRES_PORT}:5432 + healthcheck: + test: ["CMD", "pg_isready", "-U", "${POSTGRES_USER}", "--dbname", "${POSTGRES_DB}"] + interval: 10s + timeout: 5s + retries: 5 backend: - image: git.letsstein.de/tom/arbeitszeitmessung-webserver + image: git.letsstein.de/tom/arbeitszeitmessung-webserver:dev env_file: - .env environment: @@ -24,7 +29,8 @@ services: ports: - ${WEB_PORT}:8080 depends_on: - - db + db: + condition: service_healthy volumes: - ${LOG_PATH}:/app/logs restart: unless-stopped diff --git a/Jenkinsfile b/Jenkinsfile deleted file mode 100644 index a5d5f5c..0000000 --- a/Jenkinsfile +++ /dev/null @@ -1,66 +0,0 @@ -pipeline { - environment { - DOCKER_USERNAME = 'jenkins' - DOCKER_PASSWORD = credentials('gitea_jenkins') - SONAR_TOKEN = credentials('sonarcube_token') - POSTGRES_USER = 'postgres' - POSTGRES_PASSWORD = 'password' - POSTGRES_DB = 'arbeitszeitmessung' - } - - agent any - - stages { - stage('Test') { - agent { - docker { - image '' - args '' - args '' - } - } - steps { - script { - sh ''' - docker run -d --rm \ - --name test-db \ - -e POSTGRES_USER={$POSTGRES_USER} \ - -e POSTGRES_PASSWORD={$POSTGRES_PASSWORD} \ - -e POSTGRES_DB={$POSTGRES_DB} \ - -v ./DB/initdb:/docker-entrypoint-initdb.d\ - -p "5432:5432" \ - postgres:16 - ''' - // docker.image('golang:1.24.5').withRun( - // '-u root:root --network=host' - // ) { go -> - // // wait for DB to start - // sh ''' - // cd Backend \ - // go mod download && go mod tidy \ - // go test ./... -v - - // ''' - // } - } - } - } - stage('SonarCube Analysis') { - steps { - sh 'make scan' - } - } - stage('Building image arbeitszeit-backend') { - when { - anyOf { - changeset 'Jenkinsfile' - changeset 'Makefile' - changeset 'Backend/**' - } - } - steps { - sh 'make backend' - } - } - } -}