v3.650

code-charity · Oct 18, 2021 · 9bfc6ed · 9bfc6ed
1 parent 904b0f6
commit 9bfc6ed
Show file tree

Hide file tree

Showing 8 changed files with 984 additions and 1,036 deletions.
diff --git a/content-styles.css b/content-styles.css
@@ -2748,12 +2748,21 @@ html[it-mini-player-cursor='nw-resize']::after {
 
 
 /*------------------------------------------------------------------------------
-4.4 SCREENSHOT
+# 
 ------------------------------------------------------------------------------*/
 
 .it-player-button {
-    position: relative;
-    min-width: 40px;
+    position: relative !important;
+    min-width: 40px !important;
+    display: flex !important;
+    justify-content: center !important;
+    align-items: center !important;
+}
+
+.it-player-button > svg {
+    fill: #fff !important;
+    width: 56% !important;
+    height: auto !important;
 }
 
 .it-player-button--tooltip {
@@ -2777,92 +2786,6 @@ body.no-scroll .it-player-button--tooltip {
     transform: translate(-50%, -75%);
 }
 
-#it-screenshot-button svg {
-    position: absolute !important;
-    top: 7px !important;
-    left: 7px !important;
-    width: 22px !important;
-    fill: #fff !important;
-}
-
-.html5-video-player.ytp-big-mode #it-screenshot-button svg {
-    top: 10px !important;
-    left: 10px !important;
-    width: 34px !important;
-}
-
-
-/*------------------------------------------------------------------------------
-4.5 REPEAT
-------------------------------------------------------------------------------*/
-
-#it-repeat-button {
-    position: relative !important;
-}
-
-#it-repeat-button svg {
-    position: absolute !important;
-    width: 80%;
-    height: 80%;
-    top: 11px !important;
-    left: 11px !important;
-    fill: #fff !important;
-}
-
-.html5-video-player.ytp-big-mode #it-repeat-button svg {
-    top: 10px !important;
-    left: 10px !important;
-    width: 34px !important;
-}
-
-
-/*------------------------------------------------------------------------------
-4.6 ROTATE
-------------------------------------------------------------------------------*/
-
-#it-rotate-button {
-    position: relative !important;
-}
-
-#it-rotate-button svg {
-    position: absolute !important;
-    width: 80%;
-    height: 80%;
-    top: 11px !important;
-    left: 11px !important;
-    fill: #fff !important;
-}
-
-.html5-video-player.ytp-big-mode #it-rotate-button svg {
-    top: 10px !important;
-    left: 10px !important;
-    width: 34px !important;
-}
-
-
-/*------------------------------------------------------------------------------
-4.7 POPUP PLAYER
-------------------------------------------------------------------------------*/
-
-#it-popup-player-button {
-    position: relative !important;
-}
-
-#it-popup-player-button svg {
-    position: absolute !important;
-    width: 80%;
-    height: 80%;
-    top: 11px !important;
-    left: 11px !important;
-    fill: #fff !important;
-}
-
-.html5-video-player.ytp-big-mode #it-popup-player-button svg {
-    top: 10px !important;
-    left: 10px !important;
-    width: 34px !important;
-}
-
 
 /*------------------------------------------------------------------------------
 4.8 hide controls options

diff --git a/manifest.json b/manifest.json
@@ -3,7 +3,7 @@
     "name": "'Improve YouTube!' (Video & YouTube Tools)🎧",
     "short_name": "ImprovedTube",
     "description": "__MSG_description_ext__",
-    "version": "3.601",
+    "version": "3.650",
     "default_locale": "en",
     "icons": {
         "128": "icons/128.png",

diff --git a/options.html b/options.html
@@ -15,7 +15,7 @@
 			}
 		</style>
 	</head>
-	<body>
+	<body page>
 		<link rel="stylesheet" href="satus.css">
 		<link rel="stylesheet" href="popup.css">
 		<script src="satus.js"></script>

diff --git a/popup.css b/popup.css
@@ -11,10 +11,6 @@
 --------------------------------------------------------------*/
 
 body {
-    font-family: sans-serif;
-    font-size: 14px;
-    overflow: hidden;
-    margin: 0;
     --satus-primary: #ff4158;
     --satus-header-background: #fff;
     --satus-header-text: #777;
@@ -140,6 +136,13 @@ body[theme=black] {
     --satus-switch-track: #ccc;
 }
 
+body {
+    font-family: sans-serif;
+    font-size: 14px;
+    overflow: hidden;
+    margin: 0;
+}
+
 
 /*--------------------------------------------------------------
 # HEADER
@@ -195,13 +198,13 @@ body[theme=black] {
 .satus-input--search[type=text] {
     position: absolute;
     z-index: 1;
-    right: 64px;
+    right: 60px;
     display: none;
-    width: calc(100vw - 80px);
-    height: 36px;
+    width: calc(100vw - 72px);
+    height: 40px;
     padding-right: 36px;
+    margin: 0;
     background: var(--satus-header-background);
-    box-shadow: 0 0 1px 1px var(--satus-hover);
 }
 
 .satus-input--search:focus {
@@ -210,6 +213,8 @@ body[theme=black] {
 
 .search-mode .satus-input--search {
     display: block;
+    border-bottom-left-radius: unset;
+    border-bottom-right-radius: unset;
 }
 
 .satus-header .satus-button--close-search {
@@ -233,20 +238,21 @@ body[theme=black] {
 }
 
 .search-results {
-    top: 56px;
+    top: 48px;
     overflow: hidden;
-    height: calc(100vh - 56px);
+    height: calc(100vh - 48px);
 }
 
 .search-results .satus-modal__scrim {
     backdrop-filter: none;
+    top: 8px;
 }
 
 .search-results .satus-modal__surface {
     position: absolute;
     top: 0;
-    left: 16px;
-    width: calc(100% - 80px);
+    left: 12px;
+    width: calc(100% - 72px);
     min-width: unset;
     max-width: unset;
     margin: 0;
@@ -255,7 +261,12 @@ body[theme=black] {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
     background-color: var(--satus-layers-background);
-    box-shadow: 0 2px 4px 2px rgba(0, 0, 0, .2);
+    box-shadow: inset 0 5px 4px -4px rgba(0,0,0,.24);
+}
+
+.search-results .satus-section--card {
+    margin: 8px;
+    width: calc(100% - 16px);
 }
 
 .search-results .satus-section>* {
@@ -332,6 +343,10 @@ body[theme=black] {
     align-items: center;
 }
 
+body[page] .satus-section--home .satus-button {
+    width: 96px;
+}
+
 .satus-section--home .satus-button:hover {
     background: transparent;
 }
@@ -413,6 +428,9 @@ body[theme=black] {
 .satus-section--appearance {
     width: 100%;
     height: 100%;
+    max-width: 900px;
+    position: relative;
+    margin: auto;
 }
 
 .satus-section--appearance .satus-button {