プロフィールモーダルUI変更

public_new/css/chat.css

@@ -259,24 +259,6 @@ input[name="tab_item"] {
   font: 25px FontAwesome;
 }
 
-/* お気に入り */
-.star.active:before {
-  content: "\f005";
-  font: 30px FontAwesome;
-  font-family: "Font Awesome 5 Free";
-  font-weight: 900;
-  color: #F5D256;
-  padding: 20px;
-}
-.star.disable:before {
-  content: "\f005";
-  font: 30px FontAwesome;
-  font-family: "Font Awesome 5 Free";
-  font-weight: 400;
-  color: #707070;
-  padding: 20px;
-}
-
 /* メンバー選択チェックボックス */
 .chat_item_l_chk {
   height: 100%;
@@ -785,24 +767,14 @@ input[name="tab_item"] {
 
 /**************************** modal *************************/
 /* メニューモーダル */
-.modal-backdrop{
-  background-color: #F9F9F9;
-}
-.modal-backdrop.show{
-  opacity: 0.95;
-}
 .menu_modal .modal-dialog{
   max-width: 100%!important;
 }
-.profile_modal .modal-content{
-  border:none!important;
-  background-color:transparent!important;
-}
 .menu_modal .modal-content{
   border:none!important;
   background-color:transparent!important;
 }
-.modal-content-wrap {
+.menu_modal .modal-content-wrap {
   width: 100%;
   height: 100vh;
   pointer-events: auto;
@@ -811,7 +783,6 @@ input[name="tab_item"] {
   padding: 0.8rem 0.8rem!important;
   margin: 0!important;
 }
-.profile_modal button.close,
 .menu_modal button.close{
   position: fixed;
   top: 30px;
@@ -822,7 +793,6 @@ input[name="tab_item"] {
   opacity: 0;
   animation: fadein .5s ease forwards;
 }
-.profile_modal .close,
 .menu_modal .close{
   color: #707070;
   opacity: 1!important;
@@ -871,10 +841,6 @@ input[name="tab_item"] {
   opacity: 0;
   animation: fadein 1.5s ease forwards;
 }
-.profile_modal .modal-content.item01{
-  opacity: 0;
-  animation: fadein .5s ease forwards;
-}
 @keyframes fadein{
 	0%{
 		opacity: 0;

public_new/css/common.css

@@ -138,6 +138,13 @@ main {
 }
 
 /**************************** modal *************************/
+/* 共通設定 */
+.modal-backdrop{
+  background-color: #F9F9F9;
+}
+.modal-backdrop.show{
+  opacity: 0.95;
+}
 /* プロフィールモーダル */
 .profile_modal .modal-footer button {
   color: #707070;
@@ -203,6 +210,25 @@ main {
   outline: 0;
   box-shadow: none;
 }
+
+/* お気に入り */
+.star.active:before {
+  content: "\f005";
+  font: 30px FontAwesome;
+  font-family: "Font Awesome 5 Free";
+  font-weight: 900;
+  color: #F5D256;
+  padding: 20px;
+}
+.star.disable:before {
+  content: "\f005";
+  font: 30px FontAwesome;
+  font-family: "Font Awesome 5 Free";
+  font-weight: 400;
+  color: #707070;
+  padding: 20px;
+}
+
 @media screen and (max-width: 768px) {
   /* navi */
   .nav-ttl {

public_new/modal_chat_profile.html

-<div class="modal profile_modal" id="profileModal1" tabindex="-1" role="dialog" aria-labelledby="profileModal1"
+<div class="modal fade profile_modal" id="profileModal1" tabindex="-1" role="dialog" aria-labelledby="profileModal1"
   aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered" role="document">
     <div class="modal-content">
       <div class="modal-header border-0">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true" style="font-size:40px;">&times;</span>
+        </button>
         <div class="profile_desc d-flex flex-row">
           <img src="img/noImage.svg" alt="プロフィール画像">
           <div class="prifile_name"><span>名前　名前</span></div>
         </div>
-        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-          <span aria-hidden="true" style="font-size:40px;">&times;</span>
-        </button>
       </div>
       <div class="modal-body">
         <p>

public_new/modal_collabo_profile.html

-<div class="modal profile_modal w_50" id="userNameCardInCollaboration" tabindex="-1" role="dialog"
+<div class="modal fade profile_modal w_50" id="userNameCardInCollaboration" tabindex="-1" role="dialog"
   aria-labelledby="userNameCardInCollaboration" aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered" role="document">
-    <div class="modal-content-wrap d-flex align-items-center">
-      <div class="modal-content item01">
+    <div class="modal-content-wrap d-flex align-items-center m-auto">
+      <div class="modal-content">
         <div class="modal-header border-0">
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true" style="font-size:40px;">&times;</span>
+          </button>
           <div class="profile_desc_ d-flex flex-row">
             <img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" />
             <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
           </div>
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-            <span aria-hidden="true" style="font-size:40px;">&times;</span>
-          </button>
         </div>
         <div class="modal-body">
           {{#groupPathList}}

public_new/template/template_my_name_card.html

-<div class="modal profile_modal" id="myNameCard" tabindex="-1" role="dialog" aria-labelledby="myNameCard" aria-hidden="true">
+<div class="modal fade profile_modal" id="myNameCard" tabindex="-1" role="dialog" aria-labelledby="myNameCard" aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered" role="document">
-    <div class="modal-content-wrap d-flex align-items-center">
-      <div class="modal-content item01">
+    <div class="modal-content-wrap d-flex align-items-center m-auto">
+      <div class="modal-content">
         <div class="modal-header border-0">
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true" style="font-size:40px;">&times;</span>
+          </button>
           <div class="profile_desc d-flex flex-row">
             <img src="{{profileImage}}" onError="this.src='./img/noImage.png'">
             <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
           </div>
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-            <span aria-hidden="true" style="font-size:40px;">&times;</span>
-          </button>
         </div>
         <div class="modal-body">
           {{#groupPathList}}

public_new/template/template_user_name_card.html

-<div class="modal profile_modal" id="userNameCard" tabindex="-1" role="dialog" aria-labelledby="userNameCard"
+<div class="modal fade profile_modal" id="userNameCard" tabindex="-1" role="dialog" aria-labelledby="userNameCard"
   aria-hidden="true">
   <div class="modal-dialog modal-dialog-centered" role="document">
-    <div class="modal-content-wrap d-flex align-items-center">
-      <div class="modal-content item01">
+    <div class="modal-content-wrap d-flex align-items-center m-auto">
+      <div class="modal-content">
         <div class="modal-header border-0">
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true" style="font-size:40px;">&times;</span>
+          </button>
           <div class="profile_desc_ d-flex flex-row">
             <img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" />
             <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
           </div>
-          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-            <span aria-hidden="true" style="font-size:40px;">&times;</span>
-          </button>
         </div>
         <div class="modal-body" id="userNameCard-scroll">
           {{#groupPathList}}