Merge pull request #2190 from weseek/support/adjust-modal-header

Support/adjust modal header

src/client/js/components/Page/TagEditor.jsx

@@ -48,7 +48,7 @@ export default class TagEditor extends React.Component {
     return (
       <Modal isOpen={this.state.isOpenModal} toggle={this.closeModalHandler} id="edit-tag-modal">
         <ModalHeader tag="h4" toggle={this.closeModalHandler} className="bg-primary text-light">
-          <span className="text-white">Edit Tags</span>
+          Edit Tags
         </ModalHeader>
         <ModalBody>
           <TagsInput tags={this.state.tags} onTagsUpdated={this.onTagsUpdatedByTagsInput} />

src/client/js/components/PageEditor/Editor.jsx

@@ -261,7 +261,7 @@ export default class Editor extends AbstractEditor {
     return (
       <Modal isOpen={this.state.isCheatsheetModalShown} toggle={hideCheatsheetModal} className="modal-gfm-cheatsheet">
         <ModalHeader tag="h4" toggle={hideCheatsheetModal} className="bg-primary text-light">
-          <span className="text-white"><i className="icon-fw icon-question" />Markdown Help</span>
+          <i className="icon-fw icon-question" />Markdown Help
         </ModalHeader>
         <ModalBody>
           <Cheatsheet />

src/client/styles/scss/theme/_apply-colors-kibela.scss

@@ -125,14 +125,6 @@ body.kibela {
   /* Modal */
   .modal-content {
     background-color: $themelight;
-
-    .modal-header.bg-primary {
-      color: white;
-
-      .close {
-        color: white;
-      }
-    }
   }
 
   /* Inline Code */

src/client/styles/scss/theme/_apply-colors.scss

@@ -158,6 +158,7 @@ $input-focus-color: $color-global;
   .modal-header {
     border-bottom-color: $border-color-theme;
     .close {
+      color: $light;
       opacity: 0.5;
       &:hover {
         opacity: 0.9;

src/server/views/admin/Users_reserve.html

@@ -65,7 +65,7 @@
         <div class="modal-dialog">
           <div class="modal-content">
 
-            <div class="modal-header">
+            <div class="modal-header text-light">
               <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
               <div class="modal-title">{{ t('user_management.invited') }}</div>
             </div>
@@ -88,7 +88,7 @@
       <div class="modal fade" id="admin-password-reset-modal">
         <div class="modal-dialog">
           <div class="modal-content">
-            <div class="modal-header">
+            <div class="modal-header text-light">
               <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
               <div class="modal-title">{{ t('user_management.reset_password')}}</div>
             </div>
@@ -119,7 +119,7 @@
         <div class="modal-dialog">
           <div class="modal-content">
 
-            <div class="modal-header">
+            <div class="modal-header text-light">
               <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
               <div class="modal-title">{{ t('user_management.reset_password') }}</div>
             </div>

src/server/views/modal/create_page.html

@@ -2,9 +2,9 @@
   <div class="modal-dialog modal-lg">
     <div class="modal-content">
 
-      <div class="modal-header bg-primary">
-        <div class="modal-title text-white">{{ t('New Page') }}</div>
-        <button type="button" class="close text-white" data-dismiss="modal" aria-hidden="true">&times;</button>
+      <div class="modal-header bg-primary text-light">
+        <div class="modal-title">{{ t('New Page') }}</div>
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
       </div>
 
       <div class="modal-body">

src/server/views/modal/create_template.html

@@ -4,7 +4,7 @@
   <div class="modal-dialog">
     <div class="modal-content">
 
-      <div class="modal-header bg-primary">
+      <div class="modal-header bg-primary text-light">
         <div class="modal-title">{{ t('template.modal_label.Create/Edit Template Page') }}</div>
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
       </div>

src/server/views/modal/delete.html

@@ -4,7 +4,7 @@
 
       <form role="form" id="delete-page-form" onsubmit="return false;">
 
-        <div class="modal-header {% if page.isDeleted() %}bg-danger{% else %}bg-primary{% endif %}">
+        <div class="modal-header text-light {% if page.isDeleted() %}bg-danger{% else %}bg-primary{% endif %}">
           <div class="modal-title">
             {% if page.isDeleted() %}
             <i class="icon-fw icon-fire"></i> {{ t('modal_delete.delete_completely') }}

src/server/views/modal/duplicate.html

@@ -4,7 +4,7 @@
 
       <form role="form" id="duplicatePageForm" onsubmit="return false;">
 
-        <div class="modal-header bg-primary">
+        <div class="modal-header bg-primary text-light">
           <div class="modal-title">{{ t('modal_duplicate.label.Duplicate page') }}</div>
           <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
         </div>

src/server/views/modal/empty_trash.html

@@ -4,7 +4,7 @@
 
     <form role="form" id="empty-trash-form" onsubmit="return false;">
 
-      <div class="modal-header bg-danger">
+      <div class="modal-header bg-danger text-light">
         <div class="modal-title">
           <i class="icon-fw icon-trash"></i>  {{ t('modal_empty.empty_the_trash') }}
         </div>

src/server/views/modal/put_back.html

@@ -4,7 +4,7 @@
 
       <form role="form" id="revert-delete-page-form" onsubmit="return false;">
 
-        <div class="modal-header bg-info">
+        <div class="modal-header bg-info text-light">
           <div class="modal-title"><i class="icon-action-undo"></i> {{ t('modal_putback.label.Put Back Page') }}</div>
           <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
         </div>

src/server/views/modal/rename.html

@@ -4,7 +4,7 @@
 
       <form role="form" id="renamePageForm" onsubmit="return false;">
 
-        <div class="modal-header bg-primary">
+        <div class="modal-header bg-primary text-light">
           <div class="modal-title">{{ t('modal_rename.label.Move/Rename page') }}</div>
           <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
         </div>

src/server/views/modal/shortcuts.html

@@ -2,7 +2,7 @@
   <div class="modal-dialog modal-lg">
     <div class="modal-content">
 
-      <div class="modal-header">
+      <div class="modal-header text-light">
         <div class="modal-title">{{ t('Shortcuts') }}</div>
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
       </div>

src/server/views/widget/alert_siteurl_undefined.html

@@ -1,5 +1,5 @@
 {% if !getConfig('crowi', 'app:siteUrl') %}
-<div class="alert alert-danger text-white mb-0 px-4 py-2">
+<div class="alert alert-danger mb-0 px-4 py-2">
   <i class="icon-exclamation"></i>
   {{ t("security_setting.alert_siteUrl_is_not_set", { link:t('App Settings')}) }}
 </div>