-
- For more information please visit our official{' '} -
+
+)
+
+DocsComponents.propTypes = {
+ href: PropTypes.string,
+}
+
+export default DocsComponents
diff --git a/src/components/DocsIcons.js b/src/components/DocsIcons.js
new file mode 100644
index 000000000..e3fab60a7
--- /dev/null
+++ b/src/components/DocsIcons.js
@@ -0,0 +1,31 @@
+import React from 'react'
+
+import IconsImg from 'src/assets/images/icons.webp'
+
+const DocsIcons = () => (
+
+
+
+ 
+
+
+ Our Admin Panel isnβt just a mix of third-party components. Itβs{' '}
+
+ the only open-source React dashboard built on a professional, enterprise-grade UI
+ Components Library
+
+ . This component is part of this library, and we present only the basic usage of it here. To
+ explore extended examples, detailed API documentation, and customization options, refer to
+ our docs.
+
+
+
+
+)
+
+export default DocsIcons
diff --git a/src/components/index.js b/src/components/index.js
index 6cdf33563..93fb52c43 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -4,7 +4,8 @@ import AppFooter from './AppFooter'
import AppHeader from './AppHeader'
import AppHeaderDropdown from './header/AppHeaderDropdown'
import AppSidebar from './AppSidebar'
-import DocsCallout from './DocsCallout'
+import DocsComponents from './DocsComponents'
+import DocsIcons from './DocsIcons'
import DocsLink from './DocsLink'
import DocsExample from './DocsExample'
@@ -15,7 +16,8 @@ export {
AppHeader,
AppHeaderDropdown,
AppSidebar,
- DocsCallout,
+ DocsComponents,
+ DocsIcons,
DocsLink,
DocsExample,
}
diff --git a/src/index.js b/src/index.js
index d19a3bcd3..11d6e8658 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,10 +1,9 @@
-import 'react-app-polyfill/stable'
-import 'core-js'
import React from 'react'
import { createRoot } from 'react-dom/client'
-import App from './App'
-import reportWebVitals from './reportWebVitals'
import { Provider } from 'react-redux'
+import 'core-js'
+
+import App from './App'
import store from './store'
createRoot(document.getElementById('root')).render(
@@ -12,8 +11,3 @@ createRoot(document.getElementById('root')).render(
+
+
+ 
+
+
+ CoreUI Icons package is delivered with more than 1500 icons in multiple formats SVG, PNG,
+ and Webfonts. CoreUI Icons are beautifully crafted symbols for common actions and items. You
+ can use them in your digital products for web or mobile app. For more information please
+ visit our documentation.
+
+
+
- Card headers can be styled by adding ex. component="h5".
+ Card headers can be styled by adding ex. as="h5".
Custom jumbotron
-- Using a series of utilities, you can create this jumbotron, just like the one in - previous versions of Bootstrap. Check out the examples below for how you can remix and - restyle it to your liking. -
-
-
- DocsExample button
-
-
- Change the background
-- Swap the background-color utility and add a `.text-*` color utility to mix up the - jumbotron look. Then, mix and match with additional component themes and more. -
-
-
- DocsExample button
-
-
- Add borders
-- Or, keep it light and add a border for some added definition to the boundaries of - your content. Be sure to look under the hood at the source HTML here as we've - adjusted the alignment and sizing of both column's content for equal-height. -
-
Use <a>s or <button>s to create{' '}
actionable list group items with hover, disabled, and active states by adding{' '}
- component="a|button". We separate these pseudo-classes to ensure
- list groups made of non-interactive elements (like <li>s or{' '}
+ as="a|button". We separate these pseudo-classes to ensure list
+ groups made of non-interactive elements (like <li>s or{' '}
<div>
s) don'tprovide a click or tap affordance.
Centered with .justify-content-center:
Right-aligned with .justify-content-end:
.flex-column utility. Need to stack them on some viewports but not
others? Use the responsive versions (e.g., .flex-sm-column).
- variant="tabs" class
to generate a tabbed interface
-
Take that same HTML, but use variant="pills" instead:
.nav-items, use layout="fill". Notice that all
horizontal space is occupied, but not every nav item has the same width.
-