style: remove unnecessary appearance properties in CSS

- Cleaned up CSS by removing redundant appearance properties from various selectors.
- Added a new SVG icon for loop functionality.

Author: amnweb

chrome/global/general.css

@@ -99,7 +99,7 @@ window#places {
 	color: #000 !important;
 	border-inline-start: 1px solid #bfbfbf !important;
 	box-shadow: inset 0 -1px #bfbfbf !important;
-	appearance: none !important;
+ 
 }
 
 #placeContentColumns :is(treecol, treecolpicker):where(:hover) {
@@ -145,7 +145,7 @@ window#places {
 #sidebar-box:not([lwt-sidebar]) {
 	--sidebar-background-color: light-dark(#f7f7f7, #3b3b3b) !important;
 	--sidebar-text-color: light-dark(#000, #fff) !important;
-	appearance: none !important;
+ 
 }
 
 #browser:not([style*="--sidebar-border-color"]) {
@@ -166,7 +166,7 @@ window#places {
 
 .sidebar-panel:not([lwt-sidebar]) #sidebar-search-container > #search-box,
 .sidebar-panel:not([lwt-sidebar]) #viewButton {
-	appearance: none !important;
+ 
 	background-color: light-dark(#fff, #2b2b2b) !important;
 	color: inherit !important;
 	border: 1px solid light-dark(#bfbfbf, #686868) !important;
@@ -216,7 +216,7 @@ window#places {
   --panel-separator-color: light-dark(rgb(0, 0, 0,0.1),rgba(255, 255, 255,0.1)) !important;
   --in-content-page-background: var(--fp-contextmenu-bgcolor) !important;
 }
-
+ 
 /* App Menu */
 .addon-banner-item,
 .panel-banner-item {
@@ -560,14 +560,7 @@ menuitem[checked="true"]>.menu-iconic-left,
   margin: 0 !important;
 }
 
-/* Context Menu */
-menupopup:not(.PanelUI-subView),
-menupopup:not(.PanelUI-subView) menuitem,
-menupopup:not(.PanelUI-subView) menu,
-menupopup:not(.PanelUI-subView) menuseparator,
-panel:not(#PopupSearchAutoComplete) {
-  appearance: none !important;
-}
+ 
 
 menupopup:not(.PanelUI-subView),
 panel[type="autocomplete-richlistbox"],
@@ -589,13 +582,7 @@ panelview,
 
 }
 
-/* make room for menu shadow */
-menupopup:not(.PanelUI-subView) {
-  padding: 4px 12px 20px !important;
-  margin: -6px -12px -16px !important;
-
-}
-
+ 
 .panel-arrowcontent {
   margin: 0 !important;
 }
@@ -697,7 +684,13 @@ panel menuseparator,
 #PlacesToolbar menupopup[placespopup="true"] menuseparator::before {
   display: none !important;
 }
-
+menupopup[needsgutter] {
+  @media (-moz-platform: linux) or (-moz-platform: windows) {
+    & > :is(menu, menuitem) > .menu-icon {
+      display: none!important;
+    }
+  }
+}
 menupopup menu,
 menupopup menuitem,
 menupopup menucaption,
@@ -711,11 +704,11 @@ menupopup menucaption,
   min-height: calc(16px + (var(--fp-contextmenu-menuitem-padding-block) + var(--fp-contextmenu-menuitem-border-width)) * 2) !important;
 
 }
-
-:not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menuitem:not(.menuitem-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menuitem, .unified-nav-current),
-:not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menu:not(.menu-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current),
+:not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menuitem:not(.menuitem-iconic, [type="radio"], .in-menulist, .in-menulist menuitem, .unified-nav-current),
+:not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menu:not(.menu-iconic, [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current),
+:not(:not(menubar)>menu, #contentAreaContextMenu)>menupopup>menu:not(.menu-iconic, [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current),
 :not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menucaption {
-  padding-inline-start: calc(var(--fp-contextmenu-menuitem-padding-inline) + 16px + var(--fp-contextmenu-menuicon-margin-inline)) !important;
+    padding-inline-start: calc(var(--fp-contextmenu-menuitem-padding-inline) + 16px + var(--fp-contextmenu-menuicon-margin-inline)) !important;
 }
 
 
@@ -763,8 +756,7 @@ menuitem:is(.menuitem-iconic:not([data-usercontextid]), [type="checkbox"], [type
 }
 
 .menu-right,
-.menu-accel-container {
-  appearance: none !important;
+.menu-accel-container {   
   margin-inline-end: 0 !important;
   -moz-context-properties: fill;
   fill: currentColor !important;

chrome/icons/icons.css

@@ -657,6 +657,26 @@ menupopup > menuitem:is([checked="true"], [selected="true"]) .menu-iconic-icon {
 	> menu:not(
 		.menu-iconic,
 		[type="checkbox"],
+		[type="radio"],
+		.in-menulist,
+		.in-menulist menu,
+		.unified-nav-current
+	),
+:not(:not(menubar) > menu, #contentAreaContextMenu)
+	> menupopup
+	> menuitem:not(
+		.menuitem-iconic,
+ 
+		[type="radio"],
+		.in-menulist,
+		.in-menulist menuitem,
+		.unified-nav-current
+	),
+:not(:not(menubar) > menu, #contentAreaContextMenu)
+	> menupopup
+	> menu:not(
+		.menu-iconic,
+ 
 		[type="radio"],
 		.in-menulist,
 		.in-menulist menu,
@@ -931,10 +951,12 @@ menuitem[id="placesContext_open:newprivatewindow"] {
 	--menu-image: url("media-speed.svg");
 }
 
+#context-media-loop {
+	--menu-image: url("loop.svg");
+}
 #context-video-fullscreen {
 	--menu-image: url("fullscreen.svg");
 }
-
 #context-leave-dom-fullscreen,
 menuitem[contexttype="fullscreen"][label*="Exit"] {
 	--menu-image: url("fullscreen-exit.svg");
@@ -1108,34 +1130,9 @@ menuitem[id="placesContext_new:separator"] {
 	height: 24px !important;
 	width: 24px !important;
 }
-
-:not(:not(menubar) > menu, #ContentSelectDropdown)
-	> menupopup
-	> menuitem:not(
-		.menuitem-iconic,
-		[type="checkbox"],
-		[type="radio"],
-		.in-menulist,
-		.in-menulist menuitem,
-		.unified-nav-current
-	),
-:not(:not(menubar) > menu, #ContentSelectDropdown)
-	> menupopup
-	> menu:not(
-		.menu-iconic,
-		[type="checkbox"],
-		[type="radio"],
-		.in-menulist,
-		.in-menulist menu,
-		.unified-nav-current
-	),
-:not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menucaption {
-	padding-inline-start: calc(
-		var(--fp-contextmenu-menuitem-padding-inline) + 16px +
-			var(--fp-contextmenu-menuicon-margin-inline)
-	) !important;
-}
+ 
 /* new*/
 #placesContext_paste,
 #context-paste-no-formatting{
 	--menu-image: url("edit-paste.svg");
+}