refactor: minor fixes

CHANGELOG.md

@@ -1,4 +1,10 @@
-## [react](./REACT.md) version `changelog`
+## [CoreUI](https://coreui.io/) for [react](./REACT.md) changelog
+
+##### `v2.0.0-alpha.3`
+- refactor: Colors
+- refactor: FullAside - ListGroup (deprecate callout)
+- refactor: Full* containers minor fixes
+- refactor: Dropdowns minor fixes
 
 ##### `v2.0.0-alpha.2`
 - refactor: FullHeader `<AppHeaderDropdown direction="down">` (required prop `direction`)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "CoreUI-React",
-  "version": "2.0.0-alpha.2",
+  "version": "2.0.0-alpha.3",
   "description": "CoreUI React Open Source Bootstrap 4 Admin Template",
   "author": "Łukasz Holeczek",
   "homepage": "http://coreui.io",
@@ -12,8 +12,9 @@
     "url": "git@github.com:mrholek/CoreUI-React.git"
   },
   "dependencies": {
-    "@coreui/styles": "next",
-    "@coreui/react": "next",
+    "@coreui/coreui": "^2.0.0-beta.5",
+    "@coreui/react": "^2.0.0-alpha.5",
+    "babel-jest": "^22.4.3",
     "bootstrap": "4.0.0",
     "chart.js": "^2.7.2",
     "classnames": "^2.2.3",

src/containers/Full/Full.js

@@ -38,15 +38,7 @@ class Full extends Component {
             <AppSidebarMinimizer />
           </AppSidebar>
           <main className="main">
-            <AppBreadcrumb appRoutes={routes}>
-              <li class="breadcrumb-menu d-md-down-none">
-                <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
-                  <a class="btn" href="#"><i class="icon-speech"></i></a>
-                  <a class="btn" href="/dashboard"><i class="icon-graph"></i> &nbsp;Dashboard</a>
-                  <a class="btn" href="#"><i class="icon-settings"></i> &nbsp;Settings</a>
-                </div>
-              </li>
-            </AppBreadcrumb>
+            <AppBreadcrumb appRoutes={routes}/>
             <Container fluid>
               <Switch>
                 {routes.map((route, idx) => {
@@ -60,11 +52,11 @@ class Full extends Component {
               </Switch>
             </Container>
           </main>
-          <AppAside fixed hidden display="lg">
+          <AppAside fixed hidden>
             <FullAside />
           </AppAside>
         </div>
-        <AppFooter fixed>
+        <AppFooter>
           <FullFooter />
         </AppFooter>
       </div>

src/containers/Full/FullFooter.js

@@ -10,6 +10,7 @@ const defaultProps = {};
 class FullFooter extends Component {
   render() {
 
+    // eslint-disable-next-line
     const { children, ...attributes } = this.props;
 
     return (
@@ -24,4 +25,4 @@ class FullFooter extends Component {
 FullFooter.propTypes = propTypes;
 FullFooter.defaultProps = defaultProps;
 
-export default FullFooter;
+export default FullFooter;

src/containers/Full/FullHeader.js

@@ -13,6 +13,7 @@ const defaultProps = {};
 class FullHeader extends Component {
   render() {
 
+    // eslint-disable-next-line
     const { children, ...attributes } = this.props;
 
     return (
@@ -67,7 +68,7 @@ class FullHeader extends Component {
           </AppHeaderDropdown>
         </Nav>
         <AppAsideToggler className="d-md-down-none" />
-        <AppAsideToggler className="d-lg-none" mobile />
+        {/*<AppAsideToggler className="d-lg-none" mobile />*/}
       </React.Fragment>
     );
   }

src/scss/vendors/chart.js/chart.css

@@ -23,6 +23,7 @@
   white-space: nowrap;
   position: relative;
   margin-bottom: 4px;
+  border-radius: 0.25rem;
   padding: 2px 8px 2px 28px;
   font-size: smaller;
   cursor: default; }
@@ -39,4 +40,5 @@
   left: 0;
   top: 0;
   width: 20px;
-  height: 20px; }
+  height: 20px;
+  border-radius: 0.25rem; }

src/views/Base/Dropdowns/Dropdowns.js

@@ -61,7 +61,7 @@ class Dropdowns extends Component {
                   <DropdownToggle caret>
                     This dropdown's menu is right-aligned
                   </DropdownToggle>
-                  <DropdownMenu right>
+                  <DropdownMenu right style={{right: 'auto'}}>
                     <DropdownItem header>Header</DropdownItem>
                     <DropdownItem disabled>Action</DropdownItem>
                     <DropdownItem>Another Action</DropdownItem>
@@ -81,7 +81,7 @@ class Dropdowns extends Component {
                   <DropdownToggle caret>
                     Large Dropdown
                   </DropdownToggle>
-                  <DropdownMenu right>
+                  <DropdownMenu>
                     <DropdownItem header>Header</DropdownItem>
                     <DropdownItem disabled>Action</DropdownItem>
                     <DropdownItem>Another Action</DropdownItem>
@@ -93,7 +93,7 @@ class Dropdowns extends Component {
                   <DropdownToggle caret>
                     Normal Dropdown
                   </DropdownToggle>
-                  <DropdownMenu right>
+                  <DropdownMenu>
                     <DropdownItem header>Header</DropdownItem>
                     <DropdownItem disabled>Action</DropdownItem>
                     <DropdownItem>Another Action</DropdownItem>
@@ -129,11 +129,11 @@ class Dropdowns extends Component {
                   >
                     Custom Dropdown Content <strong> * </strong>
                   </DropdownToggle>
-                  <DropdownMenu right>
-                    <div onClick={() => {this.toggle(5);}}>Custom dropdown item 1</div>
-                    <div onClick={() => {this.toggle(5);}}>Custom dropdown item 2</div>
-                    <div onClick={() => {this.toggle(5);}}>Custom dropdown item 3</div>
-                    <hr className="my-0" />
+                  <DropdownMenu>
+                    <div className="dropdown-item" onClick={() => {this.toggle(5);}}>Custom dropdown item 1</div>
+                    <div className="dropdown-item" onClick={() => {this.toggle(5);}}>Custom dropdown item 2</div>
+                    <div className="dropdown-item-text" onClick={() => {this.toggle(5);}}>Custom dropdown text 3</div>
+                    <hr className="my-0 dropdown-item-text" />
                     <div onClick={() => {this.toggle(5);}}>Custom dropdown item 4</div>
                   </DropdownMenu>
                 </Dropdown>
@@ -165,4 +165,4 @@ class Dropdowns extends Component {
   }
 }
 
-export default Dropdowns;
+export default Dropdowns;

src/views/Widgets/Widget03.js

@@ -16,6 +16,8 @@ const defaultProps = {
 
 class Widget03 extends Component {
   render() {
+
+    // eslint-disable-next-line
     const { children, className, cssModule, dataBox, ...attributes } = this.props;
 
     // demo purposes only
@@ -60,4 +62,4 @@ class Widget03 extends Component {
 Widget03.propTypes = propTypes;
 Widget03.defaultProps = defaultProps;
 
-export default Widget03;
+export default Widget03;