CPCN-403 (#140)

Newspro theme added

server/theme/theme.css

@@ -2,6 +2,8 @@
     /* CORE: TYPOGRAPHY */
     --font-family-core--sans: "Lato", sans-serif;
     --font-family-core--serif: "Titillium Web", sans-serif;
+
+    --color-background:     hsl(0, 0%, 97%);
     --badge-bg-highlight1:  hsl(356, 72%, 46%);
     --color-primary:        hsl(356, 72%, 46%);
 
@@ -14,7 +16,8 @@
     --login-page-color-bg: hsl(0, 3%, 15%);
 
     /* COMPONENT: NAVBAR MAIN */
-    --top-bar-color-bg: var(--color-primary);
+    --top-bar-color-bg: hsl(0, 0%, 18%);
+    --top-bar-color-fg: hsl(0, 0%, 100%);
     --top-bar-color-bg-notifications: hsla(216, 45%, 4%, 0.3);
     --top-bar-color-bg-notifications--hover: hsla(216, 45%, 0%, 0.5);
     --top-bar-color-bg-avatar-block: hsla(216, 45%, 4%, 0);
@@ -43,16 +46,17 @@
 
 
     /* COMPONENT: SIDENAV */
-    --sidenav-color-bg:                 hsl(0, 3%, 15%);
-    --sidenav-color-item-bg--active:    hsl(356, 72%, 46%);
-    --sidenav-color-item-fg--active:    hsla(0, 0%, 100%, 1);
-    --sidenav-color-badge-bg:           hsla(0, 0%, 98%, 1);
-    --sidenav-color-badge-fg:           hsl(356, 72%, 46%);
+    --sidenav-color-bg:                     var(--color-primary);
+    --sidenav-color-item-bg--active:        hsla(0, 0%, 100%, 1);
+    --sidenav-color-item-fg--active:        hsl(356, 72%, 46%);
+    --sidenav-color-badge-bg:               hsla(0, 0%, 98%, 1);
+    --sidenav-color-badge-fg:               hsl(356, 72%, 46%);
+    --sidenav-color-badge-active-outline:   hsl(356, 72%, 46%);
 
     /* COMPONENT: BUTTONS */
     /* // Primary */
-    --button-color-bg--primary-base: 0, 3%;
-    --button-color-bg--primary-l: 25%;
+    --button-color-bg--primary-base: 356, 72%;
+    --button-color-bg--primary-l: 46%;
 
     /* COMPONENT: ICON BUTTON */
     /* // Primary */
@@ -88,7 +92,6 @@
     width: 120px;
 }
 
-
 @media only screen and (max-width: 575px) {
     .navbar__logo img.navbar__logo-img--fr {
         margin-block-start: 0;