Merge pull request #3458 from nextcloud/fix/styling

refactoring of polls list with leaner flexbox
nextcloud · Apr 27, 2024 · 8a68952 · 8a68952
2 parents a30acc4 + 23f6537
commit 8a68952
Show file tree

Hide file tree

Showing 7 changed files with 319 additions and 289 deletions.
diff --git a/src/js/assets/scss/transitions.scss b/src/js/assets/scss/transitions.scss
@@ -1,7 +1,7 @@
 .transitions-active {
 	.list-enter-active,
 	.list-leave-active {
-		transition: all 2.5s ease;
+		transition: all 0.5s ease;
 	}
 
 	.list-enter,

diff --git a/src/js/components/Base/modules/BadgeDiv.vue b/src/js/components/Base/modules/BadgeDiv.vue
@@ -22,9 +22,7 @@
 
 <template>
 	<Component :is="tag" class="badge">
-		<div>
-			<slot name="icon" />
-		</div>
+		<slot name="icon" />
 		<span>
 			<slot />
 		</span>
@@ -44,18 +42,23 @@ export default {
 </script>
 
 <style lang="scss">
+
 	.badge {
 		display: flex;
 		align-items: center;
 		gap: 5px;
 		border-radius: var(--border-radius);
 		padding: 5px;
-		margin: 8px 4px;
 		text-align: center;
 		line-height: 1.1em;
-		overflow: hidden;
-		text-overflow: ellipsis;
 		font-size: 0.9em;
+		overflow: hidden;
+
+		span {
+			overflow: hidden;
+			text-overflow: ellipsis;
+			white-space: nowrap;
+		}
 
 		h2 & {
 			font-size: 0.6em;

diff --git a/src/js/components/Poll/PollInformation.vue b/src/js/components/Poll/PollInformation.vue
@@ -270,11 +270,8 @@ export default {
 
 <style lang="scss">
 .poll-information {
-	padding: 8px;
-	> div {
-		opacity: 0.7;
-		margin: 8px 0 4px 0;
-		padding-left: 24px;
-	}
+	display: flex;
+	flex-direction: column;
+	row-gap: 8px;
 }
 </style>