Move css to the corresponding components

spring-boot-admin-server-ui/core/core.js

@@ -27,8 +27,6 @@ require('googlefonts.css');
 require('./css/core.css');
 
 
-
-
 var angular = require('angular');
 var module = angular.module('sba-core', [require('angular-ui-router')]);
 global.sbaModules.push(module.name);

spring-boot-admin-server-ui/modules/applications-details/components/healthStatus.js

@@ -15,6 +15,8 @@
  */
 'use strict';
 
+require('./healthStatus.css');
+
 module.exports = {
   bindings: {
     health: '<health'

spring-boot-admin-server-ui/modules/applications-details/module.js

@@ -35,8 +35,6 @@ module.component('sbaServletContainerStats', require('./components/servletContai
 module.component('sbaDatasourceStats', require('./components/datasourceStats.js'));
 module.component('sbaCacheStats', require('./components/cacheStats.js'));
 
-require('./css/module.css');
-
 module.config(function ($stateProvider) {
   $stateProvider.state('applications.details', {
     url: '/details',

spring-boot-admin-server-ui/modules/applications-trace/components/trace.css

+.trace-event {
+  position: relative;
+  width: 100%;
+  display: inline-block;
+  left: 15px;
+  padding-left: 5px;
+  cursor: pointer;
+}
+.trace-event .time {
+  position: absolute;
+  left: -120px;
+  margin-left: -25px;
+  display: inline-block;
+  vertical-align: middle;
+  text-align: right;
+  width: 120px;
+}
+.trace-event:before {
+  box-sizing: border-box;
+  content: ' ';
+  display: block;
+  width: 20px;
+  height: 20px;
+  background: #fff;
+  border-radius: 10px;
+  border: 4px solid #6db33f;
+  z-index: 10;
+  position: absolute;
+  left: -6px;
+  margin-left: -15px;
+}
+.trace-event.http-4xx:before {
+  border-color: #e0ba2d;
+}
+.trace-event.http-4xx > .title > .status {
+  color: #e0ba2d;
+}
+.trace-event.http-5xx:before {
+  border-color: #b30000;
+}
+.trace-event.http-5xx > .title > .status {
+  color: #b30000;
+}
+.trace-event.http-1xx:before,
+.trace-event.http-2xx:before,
+.trace-event.http-3xx:before {
+  border-color: #6db33f;
+}
+.trace-event.http-1xx > .title > .status,
+.trace-event.http-2xx > .title > .status,
+.trace-event.http-3xx > .title > .status {
+  color: #6db33f;
+}
+.trace-event.unknown:before {
+  border-color: #999999;
+}
+.trace-event.unknown > .title > .status {
+  color: #999999;
+}
+.trace-event:hover:before {
+  background: #ccc;
+}

spring-boot-admin-server-ui/modules/applications-trace/components/trace.js

@@ -15,6 +15,8 @@
  */
 'use strict';
 
+require('./trace.css');
+
 module.exports = {
   bindings: {
     trace: '<value'

spring-boot-admin-server-ui/modules/applications-trace/components/trace.tpl.html

-<div class="event" ng-class="$ctrl.getStatusClass()" ng-click="$ctrl.toggle()">
+<div class="trace-event" ng-class="$ctrl.getStatusClass()" ng-click="$ctrl.toggle()">
   <div class="time">{{$ctrl.trace.timestamp | date:'HH:mm:ss.sss'}}
     <br/><small class="muted">{{$ctrl.trace.timestamp | date:'dd.MM.yyyy'}}</small></div>
   <div class="title">

spring-boot-admin-server-ui/modules/applications-trace/css/module.css

@@ -31,65 +31,3 @@
   clear: both;
   visibility: hidden;
 }
-.timeline .event {
-  position: relative;
-  width: 100%;
-  display: inline-block;
-  left: 15px;
-  padding-left: 5px;
-  cursor: pointer;
-}
-.timeline .event .time {
-  position: absolute;
-  left: -120px;
-  margin-left: -25px;
-  display: inline-block;
-  vertical-align: middle;
-  text-align: right;
-  width: 120px;
-}
-.timeline .event:before {
-  box-sizing: border-box;
-  content: ' ';
-  display: block;
-  width: 20px;
-  height: 20px;
-  background: #fff;
-  border-radius: 10px;
-  border: 4px solid #6db33f;
-  z-index: 10;
-  position: absolute;
-  left: -6px;
-  margin-left: -15px;
-}
-.event.http-4xx:before {
-  border-color: #e0ba2d;
-}
-.event.http-4xx > .title > .status {
-  color: #e0ba2d;
-}
-.event.http-5xx:before {
-  border-color: #b30000;
-}
-.event.http-5xx > .title > .status {
-  color: #b30000;
-}
-.event.http-1xx:before,
-.event.http-2xx:before,
-.event.http-3xx:before {
-  border-color: #6db33f;
-}
-.event.http-1xx > .title > .status,
-.event.http-2xx > .title > .status,
-.event.http-3xx > .title > .status {
-  color: #6db33f;
-}
-.event.unknown:before {
-  border-color: #999999;
-}
-.event.unknown > .title > .status {
-  color: #999999;
-}
-.timeline .event:hover:before {
-  background: #ccc;
-}

spring-boot-admin-server-ui/modules/applications/components/accordionGroup.css

+.accordion-heading,
+.accordion-heading > a,
+.accordion-heading > a:hover,
+.accordion-heading > a:focus {
+  background-color: #34302D;
+  border-color: #34302D;
+  color: #f1f1f1;
+}
+.accordion-group {
+  border: 1px solid #34302D;
+}
\ No newline at end of file

spring-boot-admin-server-ui/modules/applications/components/accordionGroup.js

@@ -15,7 +15,10 @@
  */
 'use strict';
 
+require('./accordionGroup.css');
+
 var id = 0;
+
 module.exports = {
   transclude: {
     heading: 'sbaAccordionHeading',

spring-boot-admin-server-ui/modules/applications/components/infoPanel.css

+.info-panel {
+  border: 1px solid #34302D;
+  border-radius: 4px;
+  margin-bottom: 12px;
+}
+.info-panel .info-panel-title {
+  background-color: #34302D;
+  border-color: #34302D;
+  color: #f1f1f1;
+  padding: 8px 15px;
+}
+.info-panel-content .table {
+  margin-bottom: 0;
+}

spring-boot-admin-server-ui/modules/applications/components/infoPanel.js

@@ -15,6 +15,8 @@
  */
 'use strict';
 
+require('./infoPanel.css');
+
 module.exports = {
   transclude: true,
   bindings: {

spring-boot-admin-server-ui/modules/applications/components/popover.css

+.popover {
+    max-width: none !important;
+  }

spring-boot-admin-server-ui/modules/applications/components/popover.js

@@ -15,6 +15,8 @@
  */
 'use strict';
 
+require('./popover.css');
+
 module.exports = {
   transclude: true,
   bindings: {

spring-boot-admin-server-ui/modules/applications/css/module.css

@@ -11,21 +11,29 @@
   border-bottom: 1px solid #34302D;
   box-shadow: none;
 }
-.header--application .nav > li > a {
-  color: #888;
-}
+
 .header--application .nav-tabs {
   border: 0;
 }
-.header--application .nav-tabs > li > a {
-  border: 0;
-  padding: 9px 13px 8px 13px;
-  border-bottom: 1px solid #34302D;
+
+.header--application .nav > li > a  {
+  color: #c7c7c7;
 }
+
+.header--application .nav > li > a:hover,
+.header--application .nav > li > a:focus,
 .header--application .nav-tabs > li > a:hover,
 .header--application .nav-tabs > li > a:focus {
+  color: #f1f1f1;
+}
+
+.header--application .nav-tabs > li > a,
+.header--application .nav-tabs > li > a:hover,
+.header--application .nav-tabs > li > a:focus  {
   background-color: #666;
-  color: #ebf1e7;
+  border: 0;
+  padding: 9px 13px 8px 13px;
+  border-bottom: 1px solid #34302D;
 }
 .header--application .nav-tabs > .active > a,
 .header--application .nav-tabs > .active > a:hover,
@@ -39,13 +47,12 @@
   padding: 5px 12px 8px 12px;
 }
 .header--application .application--status {
-  color: #ebf1e7;
   font-size: 24px;
   line-height: 24px;
   margin: 20px;
 }
 .header--application .application--title {
-  color: #ebf1e7;
+  color: #f1f1f1;
   font-size: 24px;
   line-height: 24px;
   margin: 20px 20px 20px 0;
@@ -59,11 +66,11 @@
   height: 0px;
 }
 .application--urls > li >a {
-  color: #888;
+  color: #f1f1f1;
 }
 .application--urls > li > a:hover,
 .application--urls > li > a:focus {
-  color: #ebf1e7;
+  color: #c7c7c7;
   text-decoration: none;
 }
 
@@ -102,40 +109,3 @@
   font-weight: bold;
   color: #FF8800;
 }
-
-/* ---------- */
-
-.info-panel {
-  border: 1px solid #34302D;
-  border-radius: 4px;
-  margin-bottom: 12px;
-}
-.info-panel .info-panel-title {
-  background-color: #34302D;
-  border-color: #34302D;
-  color: #f1f1f1;
-  padding: 8px 15px;
-}
-.info-panel-content .table {
-  margin-bottom: 0;
-}
-
-/* ---------- */
-
-.accordion-heading,
-.accordion-heading > a,
-.accordion-heading > a:hover,
-.accordion-heading > a:focus {
-  background-color: #34302D;
-  border-color: #34302D;
-  color: #f1f1f1;
-}
-.accordion-group {
-  border: 1px solid #34302D;
-}
-
-/* ---------- */
-
-  .popover {
-    max-width: none !important;
-  }