Font Awesomeが利用できなくなっていたのでUnicodeに差し替え

kznrluk · Dec 13, 2024 · acfe7c3 · acfe7c3
1 parent fddbb61
commit acfe7c3
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 7 deletions.
diff --git a/static/index.html b/static/index.html
@@ -170,6 +170,14 @@ <h4 class="howto__head"><a href="manual.html">よくある質問</a></h4>
             <div class="changelog">
                 <h4 class="changelog__head">更新履歴</h4>
                 <div class="changelog__list">
+                    <div class="changelog__content">
+                        <div class="changelog__date">
+                            2024-12-14
+                        </div>
+                        <div class="changelog__description">
+                            <p>アイコンが表示されない問題を修正</p>
+                        </div>
+                    </div>
                     <div class="changelog__content">
                         <div class="changelog__date">
                             2024-12-01

diff --git a/static/js/script.js b/static/js/script.js
@@ -218,16 +218,16 @@ shareButton.addEventListener('click', () => {
 });
 
 document.getElementById('volume_button').addEventListener('click', () => {
-    const muteIconClass = 'fas fa-volume-mute';
-    const unmuteIconClass = 'fas fa-volume-up';
+    const muteIcon = '🔇';
+    const unmuteIcon = '🔊';
     store.isMute = !store.isMute;
     if (!store.isMute) {
         store.audioInstance = new Audio('/sound/pochi.wav');
         store.audioInstance.play();
     } else {
         store.audioInstance = null;
     }
-    document.getElementById('volume_button_icon').className = store.isMute ? muteIconClass : unmuteIconClass;
+    document.getElementById('volume_button').innerText = store.isMute ? muteIcon : unmuteIcon;
 });
 
 const simpleBackgroundList = [

diff --git a/static/session.html b/static/session.html
@@ -3,7 +3,6 @@
 <head>
     <script src="js/socket.io.min.js"></script>
     <script type="module" src="js/script.js"></script>
-    <script src="https://kit.fontawesome.com/0c1dabc956.js" crossorigin="anonymous"></script>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
     <link rel="stylesheet" href="style/session.css">
     <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
@@ -76,17 +75,17 @@
         <div class="controllers">
             <div class="controllers__item">
                 <button id="openShareModal" class="controllers__button controllers__button--shadow">
-                    <i class="fas fa-share-alt"></i>
+                    🔗
                 </button>
             </div>
             <div class="controllers__item">
                 <button id="volume_button" class="controllers__button controllers__button--shadow">
-                    <i id="volume_button_icon" class="fas fa-volume-mute"></i>
+                    🔇
                 </button>
             </div>
             <div class="controllers__item">
                 <button id="image_button" class="controllers__button controllers__button--shadow">
-                    <i class="far fa-images"></i>
+                    🖼️
                 </button>
             </div>
         </div>

diff --git a/static/style/session.css b/static/style/session.css
@@ -326,6 +326,7 @@ body {
 
 .controllers__button {
     border: 0 none;
+    font-size: 1.4rem;
     border-radius: 4px;
     padding: 10px;
     height: 100%;