fix: replace red notification block by regular information message

Additionally, unify the styling of the information messages
teddy-gustiaux · Apr 21, 2019 · 7c91801 · 7c91801
1 parent 0134689
commit 7c91801
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 34 deletions.
diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
@@ -80,9 +80,6 @@
   "options_release_full_changelog": {
     "message": "Access the full changelog"
   },
-  "options_important_note": {
-    "message": "Important note"
-  },
   "options_ff_built_in_note": {
     "message": "Those settings only apply to the built-in bookmarking system of Firefox. They allow you to select in which folder (and in which position of this folder) the new bookmarks will be added. It only affects bookmarks added through the built-in Firefox bookmark icon or shortcut (Ctrl+D), through the context menu or via the bookmarks menu."
   },

diff --git a/src/_locales/fr/messages.json b/src/_locales/fr/messages.json
@@ -80,9 +80,6 @@
   "options_release_full_changelog": {
     "message": "Accéder à l’ensemble des notes de versions"
   },
-  "options_important_note": {
-    "message": "Note importante"
-  },
   "options_ff_built_in_note": {
     "message": "Ces paramètres ne s’appliquent qu’au système de marquage interne à Firefox. Ils vous permettent de sélectionner à quel endroit (et à quelle position) les nouveaux marque-pages sont ajoutés. Cela n’affecte que les marque-pages créés via l’icône de marquage ou le raccourci (Ctrl+D) intégrés de Firefox, via le menu contextuel ou via le menu des marque-pages."
   },

diff --git a/src/_locales/hu/messages.json b/src/_locales/hu/messages.json
@@ -80,9 +80,6 @@
   "options_release_full_changelog": {
     "message": "Access the full changelog"
   },
-  "options_important_note": {
-    "message": "Fontos megjegyzés"
-  },
   "options_ff_built_in_note": {
     "message": "Those settings only apply to the built-in bookmarking system of Firefox. They allow you to select in which folder (and in which position of this folder) the new bookmarks will be added. It only affects bookmarks added through the built-in Firefox bookmark icon or shortcut (Ctrl+D), through the context menu or via the bookmarks menu."
   },

diff --git a/src/_locales/ru/messages.json b/src/_locales/ru/messages.json
@@ -80,9 +80,6 @@
   "options_release_full_changelog": {
     "message": "Access the full changelog"
   },
-  "options_important_note": {
-    "message": "Важно"
-  },
   "options_ff_built_in_note": {
     "message": "Эти настройки применяются только к встроенной (в Firefox) системе закладок. Они позволяют выбрать папку (и позицию внутри неё) куда будут добавляться новые закладки. Это затронет только закладки, добавляемые через встроенные в Firefox элементы управления: иконку закладок, горячие клавиши (Ctrl+D), кнопка и пункты в контекстных меню или меню закладок."
   },

diff --git a/src/options/css/custom.css b/src/options/css/custom.css
@@ -6,8 +6,8 @@
     --bg-color-alternate: #f5f5f5;
     --bg-color-notification: var(--bg-color-alternate);
     --bg-color-notification-global:  var(--bg-color-alternate);
-    --bg-color-box:  var(--bg-color);
-    --theme-switch-color: #ffa7c4;
+    --bg-color-box: var(--bg-color);
+    --article-border-color: #dbdbdb;
 }
 
 [data-theme="dark"] {
@@ -17,9 +17,9 @@
     --bg-color: #2d2d2d;
     --bg-color-alternate: #4a4a4a;
     --bg-color-notification: var(--bg-color-alternate);
-    --bg-color-notification-global:  var(--bg-color-alternate);
-    --bg-color-box:  var(--bg-alternate);
-    --theme-switch-color: #ffa7c4;
+    --bg-color-notification-global: var(--bg-color-alternate);
+    --bg-color-box: var(--bg-alternate);
+    --article-border-color: #dbdbdb;
 }
 
 html {
@@ -56,6 +56,15 @@ a:hover {
     background-color: var(--bg-color-notification-global);
 }
 
+.message {
+    background-color: var(--bg-color-alternate);
+}
+
+.message-body {
+    border-color: var(--article-border-color);
+    color: var(--font-color);
+}
+
 #tab_container .container_item {
     display: none;
 }

diff --git a/src/options/options.html b/src/options/options.html
@@ -105,10 +105,7 @@ <h1 class="title" data-locale="options_title"></h1>
 
                         <!-- OPTIONS TAB -->
                         <div class="container_item" data-item="2">
-                            <article class="message is-danger">
-                                <div class="message-header">
-                                    <p data-locale="options_important_note"></p>
-                                </div>
+                            <article class="message">
                                 <div class="message-body">
                                     <p data-locale="options_ff_built_in_note">
                                 </div>
@@ -134,9 +131,11 @@ <h1 class="title" data-locale="options_title"></h1>
                                 <p class="help" data-locale="options_ff_built_in_folder_top_help"></p>
                             </div>
                             <hr class="divider"/>
-                            <div class="notification">
-                                <p data-locale="options_ff_built_in_folder_all_tabs_note"></p>
-                            </div>
+                            <article class="message">
+                                <div class="message-body">
+                                    <p data-locale="options_ff_built_in_folder_all_tabs_note">
+                                </div>
+                            </article>
                             <div class="field">
                                 <label for="alltabs-folder" class="label" data-locale="options_ff_built_in_folder_all_tabs"></label>
                                 <div class="control has-icons-left">
@@ -162,12 +161,14 @@ <h1 class="title" data-locale="options_title"></h1>
 
                         <!-- OPTIONS TAB -->
                         <div class="container_item" data-item="3">
-                            <div class="notification">
-                                <p data-locale="options_icon_explanation"></p>
-                                <p><img src="img/Quick_bookmark_icon-Page_not_bookmarked.png">
-                                <img src="img/Quick_bookmark_icon-Page_bookmarked.png">
-                                </p>
-                            </div>
+                            <article class="message">
+                                <div class="message-body">
+                                    <p data-locale="options_icon_explanation"></p>
+                                    <p><img src="img/Quick_bookmark_icon-Page_not_bookmarked.png">
+                                    <img src="img/Quick_bookmark_icon-Page_bookmarked.png">
+                                    </p>
+                                </div>
+                            </article>
                             <div class="field">
                                 <input id="icon-enabled" class="switch is-rounded is-info" type="checkbox">
                                 <label for="icon-enabled" data-locale="options_icon_enable"></label>
@@ -183,10 +184,7 @@ <h1 class="title" data-locale="options_title"></h1>
                                 <p class="help" data-locale="options_icon_enable_context_menu_help"></p>
                             </div>
                             <hr class="divider"/>
-                            <article class="message is-danger">
-                                <div class="message-header">
-                                    <p data-locale="options_important_note"></p>
-                                </div>
+                            <article class="message">
                                 <div class="message-body">
                                     <p data-locale="options_icon_note"></p>
                                 </div>