userChrome/editBookmarkPanel: new file (MR 19)
After a boatload of trail and error, here's a config that appears to be working well with the editBookmarkPanel.
This commit is contained in:
		
							parent
							
								
									8759370c25
								
							
						
					
					
						commit
						3d3ef8a516
					
				
					 2 changed files with 54 additions and 0 deletions
				
			
		
							
								
								
									
										43
									
								
								src/userChrome/editBookmarkPanel.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										43
									
								
								src/userChrome/editBookmarkPanel.css
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
					@ -0,0 +1,43 @@
 | 
				
			||||||
 | 
					/* Copyright 2021 Oliver Smith
 | 
				
			||||||
 | 
					 * SPDX-License-Identifier: GPL-3.0-or-later */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					@media (max-width: 700px) {
 | 
				
			||||||
 | 
					    /* The only way I (ollieparanoid) found to make this not glitchy, was to
 | 
				
			||||||
 | 
					     * reduce the bookmark panel to the minimum amount of useful controls and
 | 
				
			||||||
 | 
					     * hardcode width and height. Patches to improve this welcome, but make
 | 
				
			||||||
 | 
					     * sure that you don't introduce new UI glitches by doing extensive
 | 
				
			||||||
 | 
					     * testing. */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    #editBookmarkPanel {
 | 
				
			||||||
 | 
					        margin-top: -390px !important;
 | 
				
			||||||
 | 
					        height: 200px;
 | 
				
			||||||
 | 
					        max-height: 200px;
 | 
				
			||||||
 | 
					        max-width: calc(100vw - 100px);
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    #editBookmarkPanel box.panel-header,
 | 
				
			||||||
 | 
					    #editBookmarkHeaderSeparator {
 | 
				
			||||||
 | 
					        display: none !important;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    #editBookmarkPanelContent {
 | 
				
			||||||
 | 
					        max-width: 250px !important;
 | 
				
			||||||
 | 
					        width: 250px !important;
 | 
				
			||||||
 | 
					        padding-right: 20px;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    /* Hide the screenshot and the line below it. The page is right there when
 | 
				
			||||||
 | 
					     * you bring up the menu, no need for a screenshot. Also it has a glitch
 | 
				
			||||||
 | 
					     * when taking the screenshot in mobile portrait view, half the screenshot
 | 
				
			||||||
 | 
					     * is just black. Let's rather use the space to edit the bookmark
 | 
				
			||||||
 | 
					     * information. */
 | 
				
			||||||
 | 
					    #editBookmarkPanelInfoArea,
 | 
				
			||||||
 | 
					    #editBookmarkSeparator {
 | 
				
			||||||
 | 
					        display: none;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    #editBMPanel_folderRow,
 | 
				
			||||||
 | 
					    #editBMPanel_tagsRow {
 | 
				
			||||||
 | 
					        display: none;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
| 
						 | 
					@ -2,6 +2,17 @@
 | 
				
			||||||
 * SPDX-License-Identifier: GPL-3.0-or-later */
 | 
					 * SPDX-License-Identifier: GPL-3.0-or-later */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@media (max-width: 700px) {
 | 
					@media (max-width: 700px) {
 | 
				
			||||||
 | 
					    /* Hack to prevent popups from flickering around. It looks like e.g. the
 | 
				
			||||||
 | 
					     * editBookmarkPanel has two heights otherwise, and draws one frame with a
 | 
				
			||||||
 | 
					     * short height and one frame with the proper one. */
 | 
				
			||||||
 | 
					    #mainPopupSet {
 | 
				
			||||||
 | 
					        position: fixed !important;
 | 
				
			||||||
 | 
					        top: 0px;
 | 
				
			||||||
 | 
					        left: 0px;
 | 
				
			||||||
 | 
					        right: 0px;
 | 
				
			||||||
 | 
					        bottom: 100px;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    /* Popup notifications (install add-on etc.): set max-width, remove icon and
 | 
					    /* Popup notifications (install add-on etc.): set max-width, remove icon and
 | 
				
			||||||
     * make font smaller so it fits the box */
 | 
					     * make font smaller so it fits the box */
 | 
				
			||||||
    .popup-notification-body-container {
 | 
					    .popup-notification-body-container {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue