Fix style and flex width

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

2 files changed, 12 insertions, 24 deletions

diff --git a/core/css/mobile.scss b/core/css/mobile.scss
index aad3070e79a..19518479987 100644
--- a/core/css/mobile.scss
+++ b/core/css/mobile.scss
@@ -81,16 +81,11 @@
 	opacity: 1;
 }
 
-
-/* controls bar for mobile */
-#controls {
-	min-width: initial !important;
-	left: 0 !important;
-	padding-left: 0;
-}
 /* position controls for apps with app-navigation */
 #app-navigation+#app-content #controls {
+	left: 0 !important;
 	padding-left: 44px;
+	width: 100%;
 }
 
 /* .viewer-mode is when text editor, PDF viewer, etc is open */
diff --git a/core/css/styles.scss b/core/css/styles.scss
index ba3437a4e47..e35f496f8f9 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -228,7 +228,7 @@ body {
 	right: 0;
 	left: 0;
 	height: 44px;
-	width: 100%;
+	width: calc(100% - 250px);
 	padding: 0;
 	margin: 0;
 	background-color: rgba($color-main-background, 0.95);
@@ -1391,7 +1391,6 @@ span.ui-icon {
 /* ---- BREADCRUMB ---- */
 div.breadcrumb {
 	display: inline-flex;
-	overflow: hidden;
 }
 div.crumb {
 	display: inline-flex;
@@ -1400,33 +1399,27 @@ div.crumb {
 	background-position: right center;
 	height: 44px;
 	background-size: auto 24px;
-	flex: 1 2 50px;
-	max-width: 200px;
+	flex: 0 0 auto;
 	&.hidden {
 		display: none;
 	}
-	a, > span {
+	a,
+	> span {
 		position: relative;
-		padding: 14px 24px 14px 17px;
+		padding: 12px 24px 12px 17px;
 		color: nc-lighten($color-main-text, 33%);
 		text-overflow: ellipsis;
 		white-space: nowrap;
 		overflow: hidden;
 	}
-	&.last a {
-		padding-right: 0;
+	&:not(:first-child) a {
 	}
-	&.last {
+	&:last-child {
 		font-weight: 600;
 		margin-right: 10px;
-	}
-	&.ellipsized {
-		padding: 0 10px 0 5px;
-	}
-	a.ellipsislink {
-		padding: 0 !important;
-		position: relative;
-		top: 8px !important;
+		a {
+			padding-right: 0;
+		}
 	}
 	&:hover, &:focus, a:focus, &:active {
 		opacity: .7;