🎨 fix https://github.com/siyuan-note/siyuan/issues/10459

app/src/assets/scss/business/_card.scss

@@ -38,13 +38,6 @@
       padding: 8px 0;
       display: block;
       width: 100%;
-
-      & > div {
-        font-size: 32px;
-        display: block;
-        line-height: 46px;
-        margin-bottom: 4px;
-      }
     }
 
     & > div {
@@ -69,6 +62,13 @@
     }
   }
 
+  &__icon {
+    font-size: 32px;
+    display: block;
+    line-height: 46px;
+    margin-bottom: 4px;
+  }
+
   &__block {
     .protyle-wysiwyg:not([data-doc-type="NodeDocument"]) [data-node-id][custom-riff-decks] {
       box-shadow: none;

app/src/card/openCard.ts

@@ -18,6 +18,7 @@ import {App} from "../index";
 import {resize} from "../protyle/util/resize";
 import {setStorageVal} from "../protyle/util/compatibility";
 import {focusByRange} from "../protyle/util/selection";
+import {updateCardHV} from "./util";
 
 const genCardCount = (unreviewedNewCardCount: number, unreviewedOldCardCount: number, index = 1) => {
     return `<span class="ft__error">${index}</span>
@@ -86,35 +87,35 @@ ${window.siyuan.config.flashcard.list ? "card__block--hideli" : ""}" data-type="
         <div>
             <span>${window.siyuan.languages.nextRound}</span>
             <button data-type="-3" aria-label="0 / x" class="b3-button b3-button--cancel b3-tooltips__n b3-tooltips">
-                <div>💤</div>
+                <div class="card__icon">💤</div>
                 ${window.siyuan.languages.skip} (0)
             </button>
         </div>
         <div>
             <span></span>
             <button data-type="1" aria-label="1 / j / a" class="b3-button b3-button--error b3-tooltips__n b3-tooltips">
-                <div>🙈</div>
+                <div class="card__icon">🙈</div>
                 ${window.siyuan.languages.cardRatingAgain} (1)
             </button>
         </div>
         <div>
             <span></span>
             <button data-type="2" aria-label="2 / k / s" class="b3-button b3-button--warning b3-tooltips__n b3-tooltips">
-                <div>😬</div>
+                <div class="card__icon">😬</div>
                 ${window.siyuan.languages.cardRatingHard} (2)
             </button>
         </div>
         <div>
             <span></span>
             <button data-type="3" aria-label="3 / l / d / ${window.siyuan.languages.space} / Enter" class="b3-button b3-button--info b3-tooltips__n b3-tooltips">
-                <div>😊</div>
+                <div class="card__icon">😊</div>
                 ${window.siyuan.languages.cardRatingGood} (3)
             </button>
         </div>
         <div>
             <span></span>
             <button data-type="4" aria-label="4 / ; / f" class="b3-button b3-button--success b3-tooltips__n b3-tooltips">
-                <div>🌈</div>
+                <div class="card__icon">🌈</div>
                 ${window.siyuan.languages.cardRatingEasy} (4)
             </button>
         </div>
@@ -517,6 +518,7 @@ export const openCardByData = async (app: App, cardsData: ICardData, cardType: T
     range.collapse();
     focusByRange(range);
     /// #endif
+    updateCardHV();
 };
 
 const nextCard = (options: {

app/src/card/util.ts

@@ -0,0 +1,13 @@
+export const updateCardHV = () => {
+    /// #if MOBILE
+    if (window.matchMedia("(orientation:portrait)").matches) {
+        document.querySelectorAll(".card__action .card__icon").forEach(item => {
+            item.classList.remove("fn__none")
+        })
+    } else {
+        document.querySelectorAll(".card__action .card__icon").forEach(item => {
+            item.classList.add("fn__none")
+        })
+    }
+    /// #endif
+}

app/src/mobile/index.ts

@@ -25,6 +25,7 @@ import {loadPlugins} from "../plugin/loader";
 import {saveScroll} from "../protyle/scroll/saveScroll";
 import {removeBlock} from "../protyle/wysiwyg/remove";
 import {isNotEditBlock} from "../protyle/wysiwyg/getBlock";
+import {updateCardHV} from "../card/util";
 
 class App {
     public plugins: import("../plugin").Plugin[] = [];
@@ -79,6 +80,10 @@ class App {
         window.addEventListener("pagehide", () => {
             saveScroll(window.siyuan.mobile.editor.protyle);
         }, false);
+        // 判断手机横竖屏状态
+        window.matchMedia("(orientation:portrait)").addEventListener("change", () => {
+            updateCardHV();
+        });
         fetchPost("/api/system/getConf", {}, async (confResponse) => {
             confResponse.data.conf.keymap = Constants.SIYUAN_KEYMAP;
             window.siyuan.config = confResponse.data.conf;