From 731e42f1941548ba5d7d4cac43663f48887dcaf7 Mon Sep 17 00:00:00 2001
From: Kai Henseler <kai.henseler@strato.de>
Date: Mon, 12 Aug 2024 14:47:52 +0200
Subject: [PATCH 1/3] fix(sessions): correct typo in css class name

Signed-off-by: Kai Henseler <kai.henseler@strato.de>
---
 src/components/security/AuthTokenList.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/security/AuthTokenList.vue b/src/components/security/AuthTokenList.vue
index d4532a5..ed402da 100644
--- a/src/components/security/AuthTokenList.vue
+++ b/src/components/security/AuthTokenList.vue
@@ -27,7 +27,7 @@
 				<th class="token-list__header-device">
 					{{ t('simplesettings', 'Device') }}
 				</th>
-				<th class="toke-list__header-activity">
+				<th class="token-list__header-activity">
 					{{ t('simplesettings', 'Last activity') }}
 				</th>
 				<th>

From 32d582b8d5740113177ec5bd0e382d165545fe12 Mon Sep 17 00:00:00 2001
From: Kai Henseler <kai.henseler@strato.de>
Date: Mon, 12 Aug 2024 14:51:50 +0200
Subject: [PATCH 2/3] style(sessions): align with styleguide

Signed-off-by: Kai Henseler <kai.henseler@strato.de>
---
 src/components/security/AuthTokenList.vue | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components/security/AuthTokenList.vue b/src/components/security/AuthTokenList.vue
index ed402da..5cfd282 100644
--- a/src/components/security/AuthTokenList.vue
+++ b/src/components/security/AuthTokenList.vue
@@ -74,21 +74,25 @@ export default defineComponent({
 
 <style lang="scss" scoped>
 .token-list {
-	width: 100%;
+	width: 66.6%;
 	min-height: 50px;
 	padding-top: 5px;
-	max-width: fit-content;
 
 	th {
 		padding-block: 10px;
 		padding-inline-start: 10px;
+		font-size: 16px;
+		font-style: normal;
+		font-weight: 600;
+		line-height: 24px;
 	}
 
 	#{&}__header-device {
-		padding-inline-start: 50px; // 44px icon + 6px padding
+		padding-inline-start: 0;
 	}
+
 	&__header-activity {
-		text-align: end;
+		text-align: start;
 	}
 }
 </style>

From e58f559b67fd6c69295fb8a35387792bbe77dec7 Mon Sep 17 00:00:00 2001
From: Kai Henseler <kai.henseler@strato.de>
Date: Mon, 12 Aug 2024 15:03:55 +0200
Subject: [PATCH 3/3] fix(sessions): remove mobile table overflow

Signed-off-by: Kai Henseler <kai.henseler@strato.de>
---
 src/components/security/AuthToken.vue     | 13 +++++++++++++
 src/components/security/AuthTokenList.vue | 10 ++++++++++
 2 files changed, 23 insertions(+)

diff --git a/src/components/security/AuthToken.vue b/src/components/security/AuthToken.vue
index 9b9d764..d477c87 100644
--- a/src/components/security/AuthToken.vue
+++ b/src/components/security/AuthToken.vue
@@ -399,4 +399,17 @@ export default defineComponent({
 		color: var(--color-text-maxcontrast);
 	}
 }
+
+@media (max-width: 660px) {
+	.auth-token__name {
+		min-width: auto;
+	}
+
+	td:has(.auth-token__last-activity) {
+		display: block;
+		margin-top: -25px;
+		padding-inline-start: 40px;
+		color: var(--color-text-lighter);
+	}
+}
 </style>
diff --git a/src/components/security/AuthTokenList.vue b/src/components/security/AuthTokenList.vue
index 5cfd282..3d235df 100644
--- a/src/components/security/AuthTokenList.vue
+++ b/src/components/security/AuthTokenList.vue
@@ -95,4 +95,14 @@ export default defineComponent({
 		text-align: start;
 	}
 }
+
+@media screen and (max-width: 660px) {
+	.token-list {
+		width: 100%;
+	}
+
+	.token-list__header-activity {
+		display: none;
+	}
+}
 </style>