convert scss of notification components into css

dbomfim · Aug 31, 2018 · 5db6754 · 5db6754
1 parent b820589
commit 5db6754
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 36 deletions.
diff --git a/src/components/layout/MessageItem.vue b/src/components/layout/MessageItem.vue
@@ -20,7 +20,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style scoped>
 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4,
 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > p {
   margin-left: 0;

diff --git a/src/components/layout/NotificationsMenu.vue b/src/components/layout/NotificationsMenu.vue
@@ -81,42 +81,35 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style scoped>
 .navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu {
   width: 400px;
-
-  li.header {
-    padding: 0;
-
-    span.tab-link {
-      padding: 4px;
-      text-align: center;
-      cursor: pointer;
-
-      a {
-        color: #444;
-      }
-    }
-    span.tab-link.active {
-      font-weight: bold;
-      border-bottom: 2px solid #3c8dbc;
-    }
-
-    span:hover.tab-link > a {
-      color: #3c8dbc !important;
-    }
-  }
-
-  li > ul.menu {
-    max-height: 300px;
-
-    li > span {
-      padding: 10px;
-    }
-  }
-
-  li:hover.footer > a {
-    color: #3c8dbc !important;
-  }
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li.header {
+  padding: 0;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li.header span.tab-link {
+  padding: 4px;
+  text-align: center;
+  cursor: pointer;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li.header span.tab-link a {
+  color: #444;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li.header span.tab-link.active {
+  font-weight: bold;
+  border-bottom: 2px solid #3c8dbc;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li.header span:hover.tab-link > a {
+  color: #3c8dbc !important;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li > ul.menu {
+  max-height: 300px;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li > ul.menu li > span {
+  padding: 10px;
+}
+.navbar-custom-menu > .navbar-nav > li.notifications-menu > .dropdown-menu li:hover.footer > a {
+  color: #3c8dbc !important;
 }
 </style>