Merge pull request #6232 from nextcloud/fix/nextcloud-30-design-issues

fix: 30 design issues

src/App.vue

@@ -190,9 +190,8 @@ export default {
 	.modal__card {
 		width: 100%;
 		min-width: 100%;
-		height: 100vh;
-		max-height: calc(100vh - 120px);
-		overflow: auto;
+		height: calc(100% - 20px);
+		overflow: hidden;
 	}
 
 </style>

src/CardMoveDialog.vue

@@ -92,7 +92,6 @@ export default {
 
 <style lang="scss" scoped>
 .modal__content {
-	width: 25vw;
 	min-width: 250px;
 	min-height: 120px;
 	margin: 20px 20px 100px 20px;

src/components/card/CardSidebar.vue

@@ -209,6 +209,10 @@ section.app-sidebar__tab--active {
 	height: 100%;
 }
 
+.modal-container {
+	overflow: hidden;
+}
+
 // FIXME: Obivously we should at some point not randomly reuse the sidebar component
 // since this is not oficially supported
 .modal__card .app-sidebar {
@@ -222,10 +226,23 @@ section.app-sidebar__tab--active {
 	max-width: calc(100% - #{$modal-padding * 2});
 	padding: 0 14px;
 	height: 97%;
-	overflow: initial;
+	overflow: hidden !important;
 	user-select: text;
 	-webkit-user-select: text;
 
+	.app-sidebar-header__mainname-container {
+		padding-top: calc(var(--default-grid-baseline, 4px) * 2);
+	}
+
+	.app-sidebar-tabs {
+		max-height: 90%;
+	}
+
+	.app-sidebar__tab {
+		min-height: calc(100% - 20px);
+		max-height: calc(100% - 20px);
+	}
+
 	// FIXME: test
 	&:deep {
 		.app-sidebar-header {

src/components/navigation/AppNavigationBoard.vue

@@ -350,4 +350,10 @@ export default {
 	.forced-active {
 		box-shadow: inset 4px 0 var(--color-primary-element);
 	}
+
+	:deep(.active) {
+		.material-design-icon svg {
+			fill: var(--color-primary-element-text);
+		}
+	}
 </style>