v1.0.0

Author: mrholek

React_Full_Project/CHANGELOG.md

@@ -1,7 +1,7 @@
 {
-  "name": "coreui-react",
+  "name": "@coreui/react",
   "version": "1.0.0",
-  "description": "CoreUI React Open Source Bootstrap Admin Template",
+  "description": "",
   "author": "Łukasz Holeczek <[email protected]>",
   "url": "http://coreui.io",
   "copyright": "Copyright 2017 creativeLabs Łukasz Holeczek",
@@ -36,11 +36,12 @@
     "chart.js": "2.7.0",
     "font-awesome": "^4.7.0",
     "history": "4.7.2",
+    "is-url-external": "^1.0.3",
     "react": "^15.6.1",
     "react-chartjs-2": "2.6.2",
     "react-dom": "^15.6.1",
     "react-router-dom": "4.2.2",
-    "react-transition-group": "^2.2.0",
+    "react-transition-group": "^1.2.0",
     "reactstrap": "^4.8.0",
     "simple-line-icons": "^2.4.1"
   },

React_Full_Project/package.json

@@ -13,26 +13,29 @@
 
   <!-- BODY options, add following classes to body to change options
 
-    // Header options
-    1. '.header-fixed'					- Fixed Header
-
-    // Sidebar options
-    1. '.sidebar-fixed'					- Fixed Sidebar
-    2. '.sidebar-hidden'				- Hidden Sidebar
-    3. '.sidebar-off-canvas'		- Off Canvas Sidebar
-    4. '.sidebar-minimized'			- Minimized Sidebar (Only icons)
-    5. '.sidebar-compact'			  - Compact Sidebar
-
-    // Aside options
-    1. '.aside-menu-fixed'			- Fixed Aside Menu
-    2. '.aside-menu-hidden'			- Hidden Aside Menu
-    3. '.aside-menu-off-canvas'	- Off Canvas Aside Menu
-
-    // Breadcrumb options
-    1. '.breadcrumb-fixed'			- Fixed Breadcrumb
-
-    // Footer options
-    1. 'footer-fixed'						- Fixed footer
+  // Header options
+  1. '.header-fixed'					- Fixed Header
+
+  // Brand options
+  1. '.brand-minimized'       - Minimized brand (Only symbol)
+
+  // Sidebar options
+  1. '.sidebar-fixed'					- Fixed Sidebar
+  2. '.sidebar-hidden'				- Hidden Sidebar
+  3. '.sidebar-off-canvas'		- Off Canvas Sidebar
+  4. '.sidebar-minimized'			- Minimized Sidebar (Only icons)
+  5. '.sidebar-compact'			  - Compact Sidebar
+
+  // Aside options
+  1. '.aside-menu-fixed'			- Fixed Aside Menu
+  2. '.aside-menu-hidden'			- Hidden Aside Menu
+  3. '.aside-menu-off-canvas'	- Off Canvas Aside Menu
+
+  // Breadcrumb options
+  1. '.breadcrumb-fixed'			- Fixed Breadcrumb
+
+  // Footer options
+  1. '.footer-fixed'					- Fixed footer
 
   -->
 

React_Full_Project/public/img/flags/ASEAN.png

@@ -1,33 +1,17 @@
 // scss-lint:disable all
-@charset "UTF-8";
-
 .animated {
-  -webkit-animation-duration: 1s;
   animation-duration: 1s;
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
+  // animation-fill-mode: both;
 }
 
 .animated.infinite {
-  -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
 }
 
 .animated.hinge {
-  -webkit-animation-duration: 2s;
   animation-duration: 2s;
 }
 
-@-webkit-keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
 @keyframes fadeIn {
   from {
     opacity: 0;
@@ -39,6 +23,5 @@
 }
 
 .fadeIn {
-  -webkit-animation-name: fadeIn;
   animation-name: fadeIn;
 }

React_Full_Project/public/img/flags/Afghanistan.png

@@ -11,8 +11,8 @@
 app-dashboard,
 app-root {
   display: flex;
-  min-height: 100vh;
   flex-direction: column;
+  min-height: 100vh;
 }
 
 .app-header {
@@ -26,12 +26,12 @@ app-root {
 .app-body {
   display: flex;
   flex-direction: row;
-  overflow-x: hidden;
   flex-grow: 1;
+  overflow-x: hidden;
 
   .main {
-    min-width: 0;
     flex: 1;
+    min-width: 0;
   }
 
   .sidebar {
@@ -134,11 +134,6 @@ app-root {
   .sidebar-minimized {
     .sidebar {
       flex: 0 0 $sidebar-minimized-width;
-      .sidebar-header,
-      .sidebar-form,
-      .sidebar-footer {
-        display: none;
-      }
     }
 
     &.sidebar-hidden {
@@ -344,6 +339,10 @@ app-root {
     .nav {
       width: $mobile-sidebar-width !important;
     }
+
+    .sidebar-minimizer {
+      display: none;
+    }
   }
 
   .main, .app-footer {

React_Full_Project/public/img/flags/African Union.png

@@ -1,7 +1,7 @@
 .app-header.navbar {
   position: relative;
-  height: $navbar-height;
   flex-direction: row;
+  height: $navbar-height;
   padding: 0;
   margin: 0;
   background-color: $navbar-bg;
@@ -101,3 +101,14 @@
 .navbar-divider {
   background-color: rgba(0,0,0,.075);
 }
+
+.brand-minimized {
+  .app-header.navbar {
+    .navbar-brand {
+      width: $navbar-brand-minimized-width;
+      background-color: $navbar-brand-minimized-bg;
+      background-image: $navbar-brand-minimized-logo;
+      background-size: $navbar-brand-minimized-logo-size;
+    }
+  }
+}

React_Full_Project/public/img/flags/Albania.png

@@ -78,7 +78,8 @@
 
   .nav {
     @include sidebar-width($sidebar-borders, $sidebar-width);
-    flex-direction: column !important;
+    flex-direction: column;
+    min-height: 100%;
   }
 
   .nav-title {
@@ -148,8 +149,8 @@
     }
 
     &:hover {
-      color: $sidebar-nav-link-hover-color !important;
-      background: $sidebar-nav-link-hover-bg !important;
+      color: $sidebar-nav-link-hover-color;
+      background: $sidebar-nav-link-hover-bg;
       @include borders($sidebar-nav-link-hover-borders);
 
       i {
@@ -160,6 +161,21 @@
         background-image: $sidebar-nav-dropdown-indicator-hover;
       }
     }
+
+    @each $color, $value in $theme-colors {
+      &.nav-link-#{$color} {
+        background: $value;
+        i {
+          color: rgba(255,255,255,.7);
+        }
+        &:hover {
+          background: darken($value,5%) !important;
+          i {
+            color: #fff;
+          }
+        }
+      }
+    }
   }
 
   //  ex. <a class="nav-link nav-dropdown-toggle" href="#">Components</a>
@@ -239,6 +255,39 @@
     padding: $sidebar-footer-padding-y $sidebar-footer-padding-x;
     background: $sidebar-footer-bg;
   }
+
+  .sidebar-minimizer {
+    position: relative;
+    flex: 0 0 $sidebar-minimizer-height;
+    background-color: $sidebar-minimizer-bg;
+    border: 0;
+
+    &::before {
+      position: absolute;
+      top: 0;
+      right: 0;
+      width: $sidebar-minimizer-height;
+      height: $sidebar-minimizer-height;
+      content: "";
+      background-image: $sidebar-minimizer-indicator;
+      background-repeat: no-repeat;
+      background-position: center;
+      background-size: $sidebar-minimizer-height / 4;
+      transition: .3s;
+    }
+
+    &:focus,
+    &.focus {
+      outline: 0;
+    }
+
+    &:hover {
+      background-color: $sidebar-minimizer-hover-bg;
+      &::before {
+        background-image: $sidebar-minimizer-hover-indicator;
+      }
+    }
+  }
 }
 
 @include media-breakpoint-up(lg) {
@@ -312,6 +361,11 @@
         display: none;
       }
 
+      .sidebar-minimizer::before {
+        width: 100%;
+        transform: rotate(-180deg);
+      }
+
       .nav-item {
         width: $sidebar-minimized-width;
         overflow: hidden;

React_Full_Project/public/img/flags/Algeria.png

@@ -1,3 +1,4 @@
+// scss-lint:disable all
 // Core Admin Variables
 
 $enable-sidebar-nav-rounded:          false !default;
@@ -57,6 +58,11 @@ $navbar-brand-border: (
   )
 ) !default;
 
+$navbar-brand-minimized-width:        50px !default
+$navbar-brand-minimized-bg:           #fff !default;
+$navbar-brand-minimized-logo:         url('../img/logo-symbol.png') !default;
+$navbar-brand-minimized-logo-size:    24px !default;
+
 $navbar-color:                        $gray-600 !default;
 $navbar-hover-color:                  $gray-800 !default;
 $navbar-active-color:                 $gray-800 !default;
@@ -127,6 +133,17 @@ $sidebar-footer-bg:                   rgba(0,0,0,.2) !default;
 $sidebar-footer-padding-y:            .75rem !default;
 $sidebar-footer-padding-x:            1rem !default;
 
+// Sidebar Minimizer
+
+$sidebar-minimizer-height:            50px !default;
+$sidebar-minimizer-bg:                rgba(0,0,0,.2) !default;
+$sidebar-minimizer-indicator-color:   $gray-600 !default;
+$sidebar-minimizer-indicator:         str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 14'%3E%3Cpath fill='#{$sidebar-minimizer-indicator-color}' d='M9.148 2.352l-4.148 4.148 4.148 4.148q0.148 0.148 0.148 0.352t-0.148 0.352l-1.297 1.297q-0.148 0.148-0.352 0.148t-0.352-0.148l-5.797-5.797q-0.148-0.148-0.148-0.352t0.148-0.352l5.797-5.797q0.148-0.148 0.352-0.148t0.352 0.148l1.297 1.297q0.148 0.148 0.148 0.352t-0.148 0.352z'/%3E%3C/svg%3E"), "#", "%23") !default;
+$sidebar-minimizer-hover-bg:          rgba(0,0,0,.3) !default;
+$sidebar-minimizer-hover-indicator-color:$sidebar-nav-link-hover-color !default;
+$sidebar-minimizer-hover-indicator:   str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 14'%3E%3Cpath fill='#{$sidebar-minimizer-hover-indicator-color}' d='M9.148 2.352l-4.148 4.148 4.148 4.148q0.148 0.148 0.148 0.352t-0.148 0.352l-1.297 1.297q-0.148 0.148-0.352 0.148t-0.352-0.148l-5.797-5.797q-0.148-0.148-0.148-0.352t0.148-0.352l5.797-5.797q0.148-0.148 0.352-0.148t0.352 0.148l1.297 1.297q0.148 0.148 0.148 0.352t-0.148 0.352z'/%3E%3C/svg%3E"), "#", "%23") !default;
+
+
 // Top Navigation
 
 $top-nav-bg:                          #fff !default;

React_Full_Project/public/img/flags/American Samoa.png

@@ -1,4 +1,4 @@
-/**
+/*!
  * CoreUI - Open Source Bootstrap Admin Template
  * @version v1.0.0
  * @link http://coreui.io

React_Full_Project/public/img/flags/Andorra.png

@@ -1,6 +1,6 @@
 {
   "name": "Aside",
-  "version": "0.0.0",
+  "version": "1.0.0",
   "private": true,
   "main": "./Aside.js"
 }

React_Full_Project/public/img/flags/Angola.png

@@ -1,6 +1,6 @@
 {
   "name": "Breadcrumb",
-  "version": "0.0.0",
+  "version": "1.0.0",
   "private": true,
   "main": "./Breadcrumb.js"
 }

React_Full_Project/public/img/flags/Anguilla.png

@@ -1,6 +1,6 @@
 {
   "name": "Footer",
-  "version": "0.0.0",
+  "version": "1.0.0",
   "private": true,
   "main": "./Footer.js"
 }

React_Full_Project/public/img/flags/Antarctica.png

@@ -54,7 +54,7 @@ class Header extends Component {
       <header className="app-header navbar">
         <NavbarToggler className="d-lg-none" onClick={this.mobileSidebarToggle}>&#9776;</NavbarToggler>
         <NavbarBrand href="#"></NavbarBrand>
-        <NavbarToggler className="d-md-down-none" onClick={this.sidebarMinimize}>&#9776;</NavbarToggler>
+        <NavbarToggler className="d-md-down-none" onClick={this.sidebarToggle}>&#9776;</NavbarToggler>
         <Nav className="d-md-down-none" navbar>
           <NavItem className="px-3">
             <NavLink href="#">Dashboard</NavLink>