Merge pull request #35484 from nextcloud/fix/34653/fix-popover-menu

fix the popovermenu

apps/files_external/css/settings.css

@@ -13,6 +13,10 @@
   width: 100%;
 }
 
+#externalStorage .popovermenu li > .menuitem {
+  width: fit-content !important;
+}
+
 #externalStorage td.status {
   /* overwrite conflicting core styles */
   display: table-cell;

apps/files_external/css/settings.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["settings.scss"],"names":[],"mappings":"AAAA;EACC;;;AAGD;EACC;;AAEA;EACC;;;AAKD;EACC;;;AAIF;AACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGA;EACC;EACA;;;AAGF;EAA0B;EAAiB;;;AAC3C;EAAgC;EAAiB;EAAgB;;;AACjE;EAAoB;;;AACpB;EAA+B;;;AAC/B;EAA2B;;;AAE3B;EACC;;AACA;EAGC;EACA;EACA;;AACA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;AAAA;AAAA;AAAA;EACC;;;AAMJ;EACC;EACA;;;AAGD;AAAA;EAEC;;;AAED;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;;;AAID;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;AACA;EACC;EACA;EACA;EACA;;;AAIF;EACC;;;AAGD;EACC","file":"settings.css"}
+{"version":3,"sourceRoot":"","sources":["settings.scss"],"names":[],"mappings":"AAAA;EACC;;;AAGD;EACC;;AAEA;EACC;;;AAKD;EACC;;;AAIF;EACI;;;AAGJ;AACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGA;EACC;EACA;;;AAGF;EAA0B;EAAiB;;;AAC3C;EAAgC;EAAiB;EAAgB;;;AACjE;EAAoB;;;AACpB;EAA+B;;;AAC/B;EAA2B;;;AAE3B;EACC;;AACA;EAGC;EACA;EACA;;AACA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;AAAA;AAAA;AAAA;EACC;;;AAMJ;EACC;EACA;;;AAGD;AAAA;EAEC;;;AAED;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;;;AAID;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAED;EACC;EACA;;;AAED;EACC;;;AAED;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;AACA;EACC;EACA;EACA;EACA;;;AAIF;EACC;;;AAGD;EACC","file":"settings.css"}

apps/files_external/css/settings.scss

@@ -16,6 +16,10 @@
 	}
 }
 
+#externalStorage .popovermenu li > .menuitem {
+    width: fit-content !important;
+}
+
 #externalStorage td.status {
 	/* overwrite conflicting core styles */
 	display: table-cell;

core/css/apps.css

@@ -1465,34 +1465,6 @@ kbd {
   opacity: 1;
 }
 
-/* "app-*" descendants use border-box sizing, so the height of the icon must be
- * set to the height of the item (as well as its width to make it squared). */
-#content[class*=app-] .bubble li > button,
-#content[class*=app-] .bubble li > a,
-#content[class*=app-] .bubble li > .menuitem,
-#content[class*=app-] .app-navigation-entry-menu li > button,
-#content[class*=app-] .app-navigation-entry-menu li > a,
-#content[class*=app-] .app-navigation-entry-menu li > .menuitem,
-#content[class*=app-] .popovermenu li > button,
-#content[class*=app-] .popovermenu li > a,
-#content[class*=app-] .popovermenu li > .menuitem {
-  width: fit-content;
-  /* DEPRECATED! old img in popover fallback
-  * TODO: to remove */
-}
-#content[class*=app-] .bubble li > button > img,
-#content[class*=app-] .bubble li > a > img,
-#content[class*=app-] .bubble li > .menuitem > img,
-#content[class*=app-] .app-navigation-entry-menu li > button > img,
-#content[class*=app-] .app-navigation-entry-menu li > a > img,
-#content[class*=app-] .app-navigation-entry-menu li > .menuitem > img,
-#content[class*=app-] .popovermenu li > button > img,
-#content[class*=app-] .popovermenu li > a > img,
-#content[class*=app-] .popovermenu li > .menuitem > img {
-  width: 44px;
-  height: 44px;
-}
-
 /* CONTENT LIST ------------------------------------------------------------ */
 .app-content-list {
   position: -webkit-sticky;

core/css/apps.scss

@@ -1208,28 +1208,6 @@ $outter-margin: math.div($popoveritem-height - $popovericon-size, 2);
 	}
 }
 
-/* "app-*" descendants use border-box sizing, so the height of the icon must be
- * set to the height of the item (as well as its width to make it squared). */
-#content[class*='app-'] {
-	.bubble,
-	.app-navigation-entry-menu,
-	.popovermenu {
-		li {
-			> button,
-			> a,
-			> .menuitem {
-				width: fit-content;
-				/* DEPRECATED! old img in popover fallback
-				* TODO: to remove */
-				> img {
-					width: $popoveritem-height;
-					height: $popoveritem-height;
-				}
-			}
-		}
-	}
-}
-
 /* CONTENT LIST ------------------------------------------------------------ */
 .app-content-list {
 	position: -webkit-sticky;

core/css/server.css

@@ -4047,34 +4047,6 @@ kbd {
   opacity: 1;
 }
 
-/* "app-*" descendants use border-box sizing, so the height of the icon must be
- * set to the height of the item (as well as its width to make it squared). */
-#content[class*=app-] .bubble li > button,
-#content[class*=app-] .bubble li > a,
-#content[class*=app-] .bubble li > .menuitem,
-#content[class*=app-] .app-navigation-entry-menu li > button,
-#content[class*=app-] .app-navigation-entry-menu li > a,
-#content[class*=app-] .app-navigation-entry-menu li > .menuitem,
-#content[class*=app-] .popovermenu li > button,
-#content[class*=app-] .popovermenu li > a,
-#content[class*=app-] .popovermenu li > .menuitem {
-  width: fit-content;
-  /* DEPRECATED! old img in popover fallback
-  * TODO: to remove */
-}
-#content[class*=app-] .bubble li > button > img,
-#content[class*=app-] .bubble li > a > img,
-#content[class*=app-] .bubble li > .menuitem > img,
-#content[class*=app-] .app-navigation-entry-menu li > button > img,
-#content[class*=app-] .app-navigation-entry-menu li > a > img,
-#content[class*=app-] .app-navigation-entry-menu li > .menuitem > img,
-#content[class*=app-] .popovermenu li > button > img,
-#content[class*=app-] .popovermenu li > a > img,
-#content[class*=app-] .popovermenu li > .menuitem > img {
-  width: 44px;
-  height: 44px;
-}
-
 /* CONTENT LIST ------------------------------------------------------------ */
 .app-content-list {
   position: -webkit-sticky;