Merge branch 'fixes-roundup4' into shigusegubu-themes3

src/App.scss

@@ -498,8 +498,6 @@ nav {
   box-sizing: content-box;
   color: inherit;
 
-  --shadow: none;
-
   &.-link {
     /* stylelint-disable-next-line declaration-no-important */
     color: var(--link) !important;
@@ -1096,3 +1094,8 @@ option {
     }
   }
 }
+
+@property --shadow {
+  syntax: "*";
+  inherits: false;
+}

src/components/checkbox/checkbox.vue

@@ -85,6 +85,8 @@ export default {
     width: 1.2em;
     height: 1.2em;
     box-shadow: none;
+
+    --_shadow: var(--shadow);
   }
 
   &-indicator::before {
@@ -96,7 +98,7 @@ export default {
     width: 1.1em;
     height: 1.1em;
     border-radius: var(--roundness);
-    box-shadow: var(--shadow);
+    box-shadow: var(--_shadow);
     background-color: var(--background);
     vertical-align: top;
     text-align: center;

src/components/post_status_form/post_status_form.js

@@ -363,6 +363,12 @@ const PostStatusForm = {
       }
     },
     safeToSaveDraft () {
+      console.log('safe', (
+        this.newStatus.status ||
+        this.newStatus.spoilerText ||
+        this.newStatus.files?.length ||
+        this.newStatus.hasPoll
+      ) && this.saveable)
       return (
         this.newStatus.status ||
         this.newStatus.spoilerText ||

src/components/post_status_form/post_status_form.vue

@@ -333,13 +333,16 @@
               <div
                 class="dropdown-menu"
                 role="menu"
+              >
+                <div
+                  class="menu-item dropdown-item"
+                  :class="{ disabled: !safeToSaveDraft }"
                 >
                   <button
                     v-if="!hideDraft || !disableDraft"
-                  class="menu-item dropdown-item"
+                    class="main-button"
                     role="menu"
-                  :disabled="!safeToSaveDraft && saveable"
+                    :disabled="!safeToSaveDraft"
-                  :class="{ disabled: !safeToSaveDraft }"
                     @click.prevent="saveDraft"
                     @click="close"
                   >
@@ -351,6 +354,7 @@
                     </template>
                   </button>
                 </div>
+              </div>
             </template>
           </Popover>
         </div>

src/components/settings_modal/tabs/general_tab.vue

@@ -269,14 +269,17 @@
             {{ $t('settings.image_compression') }}
           </BooleanSetting>
         </li>
+        <ul class="setting-list suboptions">
           <li>
             <BooleanSetting
               path="alwaysUseJpeg"
               expert="1"
+              parent-path="imageCompression"
             >
               {{ $t('settings.always_use_jpeg') }}
             </BooleanSetting>
           </li>
+        </ul>
         <li>
           <BooleanSetting
             path="useContainFit"

src/panel.scss

@@ -2,6 +2,7 @@
 .panel {
   --__panel-background: var(--background);
   --__panel-backdrop-filter: var(--backdrop-filter);
+  --_shadow: var(--shadow);
 
   .tab-switcher .tabs {
     background: var(--__panel-background);
@@ -29,7 +30,7 @@
     left: 0;
     right: 0;
     z-index: 5;
-    box-shadow: var(--shadow);
+    box-shadow: var(--_shadow);
     pointer-events: none;
   }
 }
@@ -154,11 +155,13 @@
     linear-gradient(to bottom, var(--background), var(--background)),
     linear-gradient(to bottom, var(--__panel-background), var(--__panel-background));
 
+  --_shadow: var(--shadow);
+
   &::after {
     background-color: var(--background);
     z-index: -2;
     border-radius: var(--roundness) var(--roundness) 0 0;
-    box-shadow: var(--shadow);
+    box-shadow: var(--_shadow);
   }
 
   &:not(.-flexible-height) {

src/services/theme_data/theme_data_3.service.js

@@ -567,7 +567,13 @@ export const init = ({
       if (!liteMode && combination.state.indexOf('hover') >= 0) {
         combination.lazy = true
       }
-      if (extraCompileComponents.has(component.name)) {
+
+      if (
+        parent?.component !== 'Root' &&
+          !virtualComponents.has(component.name) &&
+          !transparentComponents.has(component.name) &&
+          extraCompileComponents.has(component.name)
+      ) {
         combination.lazy = true
       }