colors

lib/views/admin/global-notification.html

@@ -47,76 +47,6 @@
   </tbody>
 </table>
 
-<style>
-/* The switch - the box around the slider */
-.switch {
-  position: relative;
-  display: inline-block;
-  width: 30px;
-  height: 17px;
-}
-
-/* Hide default HTML checkbox */
-.switch input {display:none;}
-
-/* The slider */
-.slider {
-  position: absolute;
-  cursor: pointer;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: #ccc;
-  -webkit-transition: .4s;
-  transition: .4s;
-}
-
-.slider:before {
-  position: absolute;
-  content: "";
-  height: 13px;
-  width: 13px;
-  left: 2px;
-  bottom: 2px;
-  background-color: white;
-  -webkit-transition: .4s;
-  transition: .4s;
-}
-
-input:checked + .slider {
-  background-color: #2196F3;
-}
-
-input:focus + .slider {
-  box-shadow: 0 0 1px #2196F3;
-}
-
-input:checked + .slider:before {
-  -webkit-transform: translateX(13px);
-  -ms-transform: translateX(13px);
-  transform: translateX(13px);
-}
-
-/* Rounded sliders */
-.slider.round {
-  border-radius: 34px;
-}
-
-.slider.round:before {
-  border-radius: 50%;
-}
-
-.clickable-row > :not(.unclickable) {
-  cursor: pointer;
-}
-
-.clickable-row:hover {
-  background-color: #2196F3;
-  color: white;
-}
-</style>
-
 <script>
   $(".clickable-row > :not('.unclickable')").click(function(event) {
     var $target = $(event.currentTarget).parent();

lib/views/admin/notification.html

@@ -11,7 +11,7 @@
 {% endblock %}
 
 {% block content_main %}
-<div class="content-main">
+<div class="content-main admin-notification">
   <div class="row">
     <div class="col-md-3">
       {% include './widget/menu.html' with {current: 'notification'} %}

resource/styles/agile-admin/inverse/colors/_apply-colors-dark.scss

@@ -161,6 +161,9 @@ legend {
       border-color: darken($themecolor,15%);
     }
   }
+  .clickable-row:hover {
+    background-color: lighten($bodycolor, 10%);;
+  }
 }
 
 /*

resource/styles/agile-admin/inverse/colors/_apply-colors-light.scss

@@ -77,6 +77,9 @@
       border-color: lighten($themecolor,20%);
     }
   }
+  .clickable-row:hover {
+    background-color: darken($bodycolor, 10%);
+  }
 }
 
 /*

resource/styles/agile-admin/inverse/colors/_apply-colors.scss

@@ -250,6 +250,22 @@ legend {
   }
 }
 
+/*
+ * Form Slider
+ */
+span.slider {
+  background-color: #ccc;
+  &:before {
+    background-color: white;
+  }
+}
+input:checked+.slider {
+  background-color: #007bff;
+}
+input:focus+.slider {
+  box-shadow: 0 0 1px #007bff;
+}
+
 
 /*
  * Crowi sidebar

resource/styles/scss/_admin.scss

@@ -42,6 +42,64 @@
     }
   }
 
+  .admin-notification {
+    .clickable-row > :not(.unclickable) {
+      cursor: pointer;
+    }
+
+    /* slider checkbox */
+    .switch {
+      position: relative;
+      display: inline-block;
+      width: 30px;
+      height: 17px;
+    }
+
+    /* Hide default HTML checkbox */
+
+    .switch input {
+      display: none;
+    }
+
+    /* The slider */
+    .slider {
+      position: absolute;
+      cursor: pointer;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      -webkit-transition: .4s;
+      transition: .4s;
+    }
+
+    .slider:before {
+      position: absolute;
+      content: "";
+      height: 13px;
+      width: 13px;
+      left: 2px;
+      bottom: 2px;
+      -webkit-transition: .4s;
+      transition: .4s;
+    }
+
+    input:checked+.slider:before {
+      -webkit-transform: translateX(13px);
+      -ms-transform: translateX(13px);
+      transform: translateX(13px);
+    }
+
+    /* Rounded sliders */
+    .slider.round {
+      border-radius: 34px;
+    }
+
+    .slider.round:before {
+      border-radius: 50%;
+    }
+  }
+
   // Toggle Twitter Bootstrap button class when active
   // https://jsfiddle.net/ms040m01/3/
   @mixin active-color($color, $bg-color, $border-color) {