├── .editorconfig ├── .env ├── .eslintrc ├── .gitignore ├── .prettierrc ├── .stylelintrc.json ├── README.md ├── config-overrides.js ├── package.json ├── public ├── favicon.png ├── index.html ├── manifest.json └── resources │ ├── fonts │ ├── font-awesome │ │ ├── HELP-US-OUT.txt │ │ ├── css │ │ │ ├── font-awesome.css │ │ │ └── font-awesome.min.css │ │ ├── fonts │ │ │ ├── FontAwesome.otf │ │ │ ├── fontawesome-webfont.eot │ │ │ ├── fontawesome-webfont.svg │ │ │ ├── fontawesome-webfont.ttf │ │ │ ├── fontawesome-webfont.woff │ │ │ └── fontawesome-webfont.woff2 │ │ ├── less │ │ │ ├── animated.less │ │ │ ├── bordered-pulled.less │ │ │ ├── core.less │ │ │ ├── fixed-width.less │ │ │ ├── font-awesome.less │ │ │ ├── icons.less │ │ │ ├── larger.less │ │ │ ├── list.less │ │ │ ├── mixins.less │ │ │ ├── path.less │ │ │ ├── rotated-flipped.less │ │ │ ├── screen-reader.less │ │ │ ├── stacked.less │ │ │ └── variables.less │ │ └── scss │ │ │ ├── _animated.scss │ │ │ ├── _bordered-pulled.scss │ │ │ ├── _core.scss │ │ │ ├── _fixed-width.scss │ │ │ ├── _icons.scss │ │ │ ├── _larger.scss │ │ │ ├── _list.scss │ │ │ ├── _mixins.scss │ │ │ ├── _path.scss │ │ │ ├── _rotated-flipped.scss │ │ │ ├── _screen-reader.scss │ │ │ ├── _stacked.scss │ │ │ ├── _variables.scss │ │ │ └── font-awesome.scss │ ├── font-icomoon │ │ ├── Read Me.txt │ │ ├── demo-files │ │ │ ├── demo.css │ │ │ └── demo.js │ │ ├── demo.html │ │ ├── fonts │ │ │ ├── icomoon.eot │ │ │ ├── icomoon.svg │ │ │ ├── icomoon.ttf │ │ │ └── icomoon.woff │ │ ├── selection.json │ │ └── style.css │ └── font-linearicons │ │ ├── Read Me.txt │ │ ├── demo-files │ │ ├── demo.css │ │ └── demo.js │ │ ├── demo.html │ │ ├── fonts │ │ ├── Linearicons-Free.eot │ │ ├── Linearicons-Free.svg │ │ ├── Linearicons-Free.ttf │ │ ├── Linearicons-Free.woff │ │ └── Linearicons-Free.woff2 │ │ ├── selection.json │ │ └── style.css │ └── images │ ├── amazon.jpg │ ├── avatar.jpg │ ├── avatars │ ├── 1.jpg │ ├── 2.jpg │ ├── 3.jpg │ ├── 4.jpg │ ├── 5.jpg │ └── temp.jpg │ ├── ecommerce │ ├── 001.jpg │ ├── 002.jpg │ ├── 003.jpg │ ├── 004.jpg │ ├── amazon.jpg │ └── ecommerce-empty.jpg │ ├── favicon.ico │ ├── icons │ └── icon-next-step.svg │ ├── logo-inverse-mobile.png │ ├── logo-inverse.png │ ├── logo-mobile.png │ ├── logo.png │ ├── mediatec-inverse.png │ ├── mediatec.png │ ├── n.jpg │ ├── photos │ ├── 1.jpeg │ ├── 2.jpeg │ ├── 3.jpeg │ ├── 4.jpeg │ ├── 5.jpeg │ └── 6.jpeg │ ├── s.jpg │ └── temp-company.jpg └── src ├── assets ├── images │ ├── cluster.png │ ├── davidshimjs-qrcodejs-04f46c6.tar.gz │ ├── file.png │ ├── folder.png │ ├── ipfs.png │ ├── pin-off-outline.png │ ├── pin-outline.png │ └── pin.png └── styles │ ├── Antd │ ├── antd.cleanui.scss │ └── import │ │ ├── backtop.scss │ │ ├── badge.scss │ │ ├── calendar.scss │ │ ├── cascader.scss │ │ ├── dropdown.scss │ │ ├── form.scss │ │ ├── input.scss │ │ ├── layout.scss │ │ ├── menu.scss │ │ ├── modal.scss │ │ ├── notification.scss │ │ ├── progress.scss │ │ ├── select.scss │ │ ├── slider.scss │ │ └── spin.scss │ ├── Bootstrap │ ├── bootstrap.cleanui.scss │ └── import │ │ ├── alerts.scss │ │ ├── badge.scss │ │ ├── breadcrumb.scss │ │ ├── buttons.scss │ │ ├── card.scss │ │ ├── carousel.scss │ │ ├── collapse.scss │ │ ├── dropdowns.scss │ │ ├── forms.scss │ │ ├── grid.scss │ │ ├── modal.scss │ │ ├── pagination.scss │ │ ├── popovers.scss │ │ ├── selectboxes.scss │ │ ├── table.scss │ │ ├── tabs.scss │ │ ├── typography.scss │ │ └── utilities.scss │ ├── Chartist │ └── chartist.cleanui.scss │ ├── CleanUI │ ├── cleanui.scss │ └── import │ │ ├── core.scss │ │ ├── measurements.scss │ │ ├── settings.scss │ │ └── utils.scss │ ├── Nprogress │ └── nprogress.cleanui.scss │ ├── Rcdrawer │ └── rcdrawer.cleanui.scss │ └── mixins.scss ├── components ├── CleanUIComponents │ ├── Avatar │ │ ├── index.js │ │ └── style.module.scss │ ├── ChartCard │ │ ├── index.js │ │ └── style.module.scss │ ├── Chat │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss │ ├── Donut │ │ ├── index.js │ │ └── style.module.scss │ ├── InfoCard │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss │ ├── Invoice │ │ ├── data.json │ │ └── index.js │ ├── PaymentAccount │ │ ├── index.js │ │ └── style.module.scss │ ├── PaymentCard │ │ ├── index.js │ │ └── style.module.scss │ ├── PaymentTransaction │ │ ├── index.js │ │ └── style.module.scss │ ├── PricingItem │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss │ ├── ProductCard │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss │ ├── ProfileHeadCard │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss │ ├── ProgressCard │ │ ├── index.js │ │ └── style.module.scss │ ├── ProgressGroup │ │ ├── data.json │ │ └── index.js │ ├── ShortItemInfo │ │ ├── index.js │ │ └── style.module.scss │ ├── SliderCard │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss │ └── UserCard │ │ ├── data.json │ │ ├── index.js │ │ └── style.module.scss └── LayoutComponents │ ├── Authorize │ └── index.js │ ├── Breadcrumbs │ ├── index.js │ └── style.module.scss │ ├── Footer │ ├── index.js │ └── style.module.scss │ ├── Loader │ ├── index.js │ └── style.module.scss │ ├── Localization │ └── index.js │ ├── Menu │ ├── MenuLeft │ │ ├── index.js │ │ └── style.module.scss │ ├── MenuTop │ │ ├── index.js │ │ └── style.module.scss │ └── index.js │ ├── Settings │ ├── index.js │ └── style.module.scss │ └── TopBar │ ├── BitcoinPrice │ ├── index.js │ └── style.module.scss │ ├── HomeMenu │ ├── index.js │ └── style.module.scss │ ├── IssuesHistory │ ├── index.js │ └── style.module.scss │ ├── LanguageSelector │ ├── index.js │ └── style.module.scss │ ├── LiveSearch │ ├── index.js │ └── style.module.scss │ ├── ProfileMenu │ ├── index.js │ └── style.module.scss │ ├── ProjectManagement │ ├── index.js │ └── style.module.scss │ ├── index.js │ └── style.module.scss ├── global.scss ├── index.js ├── layouts ├── Main │ └── index.js └── index.js ├── locales ├── en-US.js ├── fr-FR.js ├── ru-RU.js └── zh-CN.js ├── pages ├── 404.js └── dashboard │ ├── data │ └── index.js │ └── stats │ └── index.js ├── redux ├── cluster │ ├── actions.js │ ├── reducers.js │ └── type.js ├── reducers.js ├── sagas.js └── views │ ├── menu │ ├── actions.js │ ├── reducers.js │ └── sagas.js │ ├── settings │ ├── actions.js │ ├── reducers.js │ └── sagas.js │ └── user │ ├── actions.js │ ├── reducers.js │ └── sagas.js ├── router.js ├── serviceWorker.js ├── services ├── menu.js └── user.js ├── theme.js └── utils ├── clusterPinToIpfsPin.js ├── formatBytes.js ├── ipfs-cluster-api └── index.js ├── ipfs-http-client └── index.js └── sortPins.js /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | 15 | [Makefile] 16 | indent_style = tab 17 | -------------------------------------------------------------------------------- /.env: -------------------------------------------------------------------------------- 1 | NODE_PATH=src -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | // { 2 | // "extends": ["react-app", "airbnb", "prettier"], 3 | // "rules": { 4 | // "react/jsx-filename-extension": [1, { "extensions": [".js",".jsx"] }], 5 | // "no-useless-escape": "off", 6 | // "no-script-url": "off", 7 | // "jsx-a11y/anchor-has-content": "off", 8 | // "jsx-a11y/href-no-hash": "off", 9 | // "jsx-a11y/anchor-is-valid": "off", 10 | // "no-template-curly-in-string": "off", 11 | // "react/prop-types": 0, 12 | // "react/prefer-stateless-function": 0, 13 | // "react/jsx-one-expression-per-line": 0, 14 | // "linebreak-style": 0, 15 | // "react/jsx-wrap-multilines": 0, 16 | // "react/no-danger": 0, 17 | // "react/forbid-prop-types": 0, 18 | // "no-use-before-define": 0, 19 | // "no-param-reassign": 0, 20 | // "import/no-unresolved": 0, 21 | // "no-console": 0 22 | // }, 23 | // "parserOptions": { 24 | // "ecmaFeatures": { 25 | // "legacyDecorators": true 26 | // } 27 | // } 28 | // } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | yarn.lock* 25 | package-lock.json 26 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "trailingComma": "all", 4 | "printWidth": 100, 5 | "tabWidth": 2, 6 | "semi": false, 7 | "overrides": [ 8 | { 9 | "files": ".prettierrc", 10 | "options": { "parser": "babylon" } 11 | } 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /.stylelintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["stylelint-config-standard", "stylelint-config-prettier"], 3 | "rules": { 4 | "declaration-empty-line-before": null, 5 | "no-descending-specificity": null, 6 | "selector-pseudo-class-no-unknown": null, 7 | "selector-pseudo-element-colon-notation": null, 8 | "at-rule-no-unknown": null, 9 | "comment-empty-line-before": null 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## Horizon 2 | > A Dashboard to manage IPFS Cluster nodes and data. 3 | 4 | ## Maintainer 5 | [**Vaibhav Saini**](https://github.com/vasa-develop) 6 | 7 | ## Installation 8 | 9 | #### Requirements 10 | 11 | * You must have `nodejs` and `npm` installed. 12 | * You must have `ipfs daemon` running & it's HTTP APIs are exposed on PORT `5001` 13 | * You must have `ipfs-cluster-service daemon` running & it's HTTP APIs are exposed on PORT `9094` 14 | 15 | #### Running the dashboard 16 | 17 | * `npm i` 18 | * `npm start` 19 | 20 | This will start the dashboard on PORT `3000` by default. 21 | 22 | #### Preview 23 | 24 | > Node Stats 25 | 26 | ![Horizon preview](https://i.pinimg.com/originals/76/84/6e/76846e9409110974d5d619af58b59c7f.png) 27 | 28 | 29 | 30 | > Files Browser 31 | 32 | ![Horizon preview](https://i.pinimg.com/originals/1e/ba/05/1eba05a6d7cccff712fdbecc338e242b.png) 33 | 34 | 35 | 36 | #### Feature Requests & Bugs 37 | Please add your feature requests & report Bugs [**here**](https://github.com/cluster-labs/horizon/issues) 38 | 39 | #### Contribute 40 | 41 | You can contribute to the project by submitting a PR or contacting me at [**vasa@towardsblockchain.com**](mailto:vasa@towardsblockchain.com) -------------------------------------------------------------------------------- /config-overrides.js: -------------------------------------------------------------------------------- 1 | // Overriding CreateReactApp settings, ref: https://github.com/arackaf/customize-cra 2 | const antdTheme = require('./src/theme.js') 3 | const { 4 | override, 5 | fixBabelImports, 6 | addLessLoader, 7 | disableEsLint, 8 | addDecoratorsLegacy, 9 | } = require('customize-cra') 10 | 11 | module.exports = override( 12 | addDecoratorsLegacy(), 13 | disableEsLint(), 14 | fixBabelImports('import', { 15 | libraryName: 'antd', libraryDirectory: 'es', style: true 16 | }), 17 | addLessLoader({ 18 | javascriptEnabled: true, 19 | modifyVars: antdTheme 20 | }) 21 | ) -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "clean-ui-admin-template-cra", 3 | "version": "2.1.1", 4 | "private": true, 5 | "scripts": { 6 | "start": "react-app-rewired start", 7 | "build": "react-app-rewired build", 8 | "test": "react-app-rewired test", 9 | "lint-staged": "lint-staged", 10 | "prettier": "prettier --write \"src/**/*.{js,jsx,ts,tsx,scss,less}\"", 11 | "eslint": "eslint --ext .js,jsx src", 12 | "tslint": "tslint \"src/**/*.{ts,tsx}\"", 13 | "stylelint": "stylelint \"src/**/*.{scss,less}\"" 14 | }, 15 | "husky": { 16 | "hooks": { 17 | "pre-commit": "npm run lint-staged" 18 | } 19 | }, 20 | "lint-staged": { 21 | "src/**/*.{js,jsx,ts,tsx,scss,less}": [ 22 | "prettier --write", 23 | "git add" 24 | ], 25 | "src/**/*.{js,jsx}": [ 26 | "eslint" 27 | ], 28 | "src/**/*.{scss,less}": [ 29 | "stylelint" 30 | ] 31 | }, 32 | "dependencies": { 33 | "@rowno/sparkline": "^3.0.1", 34 | "antd": "^3.13.2", 35 | "bootstrap-css-only": "^4.2.1", 36 | "chart.js": "^2.7.3", 37 | "chartist": "^0.11.0", 38 | "chartist-plugin-tooltips-updated": "^0.0.20", 39 | "classnames": "^2.2.6", 40 | "connected-react-router": "^6.3.1", 41 | "d3-dsv": "^1.1.1", 42 | "d3-format": "^1.3.2", 43 | "d3-time-format": "^2.1.3", 44 | "enquire-js": "^0.2.1", 45 | "firebase": "^5.8.2", 46 | "history": "^4.7.2", 47 | "ipfs-cluster-api": "0.0.9", 48 | "ipfs-http-client": "^30.1.4", 49 | "ipfs-unixfs": "^0.1.16", 50 | "lodash": "^4.17.11", 51 | "nprogress": "^0.2.0", 52 | "peity-react": "^0.0.7", 53 | "prop-types": "^15.7.1", 54 | "qs": "^6.6.0", 55 | "rc-drawer": "^1.7.7", 56 | "react": "^16.8.1", 57 | "react-c3js": "^0.1.20", 58 | "react-chartist": "^0.13.3", 59 | "react-chartjs-2": "^2.7.4", 60 | "react-custom-scrollbars": "^4.2.1", 61 | "react-dom": "^16.8.1", 62 | "react-draft-wysiwyg": "^1.13.1", 63 | "react-helmet": "^5.2.0", 64 | "react-intl": "^2.8.0", 65 | "react-loadable": "^5.5.0", 66 | "react-redux": "^6.0.0", 67 | "react-redux-spinner": "^2.0.0", 68 | "react-router": "^4.3", 69 | "react-router-dom": "^4.3.1", 70 | "react-router-redux": "^4.0.8", 71 | "react-scripts": "2.1.5", 72 | "react-stockcharts": "^0.7.8", 73 | "redux": "^4.0.1", 74 | "redux-logger": "^3.0.6", 75 | "redux-saga": "^1.0.1", 76 | "redux-thunk": "^2.3.0", 77 | "store": "^2.0.12" 78 | }, 79 | "devDependencies": { 80 | "@babel/plugin-proposal-decorators": "^7.3.0", 81 | "babel-plugin-import": "^1.11.0", 82 | "customize-cra": "^0.2.11", 83 | "eslint-config-airbnb": "^17.1.0", 84 | "eslint-config-prettier": "^4.0.0", 85 | "husky": "^1.3.1", 86 | "less": "^3.9.0", 87 | "less-loader": "^4.1.0", 88 | "lint-staged": "^8.1.3", 89 | "node-sass": "^4.11.0", 90 | "react-app-rewired": "^2.1.0", 91 | "stylelint": "^9.10.1", 92 | "stylelint-config-prettier": "^4.0.0", 93 | "stylelint-config-standard": "^18.2.0" 94 | }, 95 | "browserslist": [ 96 | ">0.2%", 97 | "not dead", 98 | "not ie <= 11", 99 | "not op_mini all" 100 | ] 101 | } 102 | -------------------------------------------------------------------------------- /public/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/favicon.png -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/HELP-US-OUT.txt: -------------------------------------------------------------------------------- 1 | I hope you love Font Awesome. If you've found it useful, please do me a favor and check out my latest project, 2 | Fort Awesome (https://fortawesome.com). It makes it easy to put the perfect icons on your website. Choose from our awesome, 3 | comprehensive icon sets or copy and paste your own. 4 | 5 | Please. Check it out. 6 | 7 | -Dave Gandy 8 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/fonts/FontAwesome.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-awesome/fonts/FontAwesome.otf -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/fonts/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-awesome/fonts/fontawesome-webfont.eot -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/fonts/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-awesome/fonts/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/fonts/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-awesome/fonts/fontawesome-webfont.woff -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/fonts/fontawesome-webfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-awesome/fonts/fontawesome-webfont.woff2 -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/animated.less: -------------------------------------------------------------------------------- 1 | // Animated Icons 2 | // -------------------------- 3 | 4 | .@{fa-css-prefix}-spin { 5 | -webkit-animation: fa-spin 2s infinite linear; 6 | animation: fa-spin 2s infinite linear; 7 | } 8 | 9 | .@{fa-css-prefix}-pulse { 10 | -webkit-animation: fa-spin 1s infinite steps(8); 11 | animation: fa-spin 1s infinite steps(8); 12 | } 13 | 14 | @-webkit-keyframes fa-spin { 15 | 0% { 16 | -webkit-transform: rotate(0deg); 17 | transform: rotate(0deg); 18 | } 19 | 100% { 20 | -webkit-transform: rotate(359deg); 21 | transform: rotate(359deg); 22 | } 23 | } 24 | 25 | @keyframes fa-spin { 26 | 0% { 27 | -webkit-transform: rotate(0deg); 28 | transform: rotate(0deg); 29 | } 30 | 100% { 31 | -webkit-transform: rotate(359deg); 32 | transform: rotate(359deg); 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/bordered-pulled.less: -------------------------------------------------------------------------------- 1 | // Bordered & Pulled 2 | // ------------------------- 3 | 4 | .@{fa-css-prefix}-border { 5 | padding: .2em .25em .15em; 6 | border: solid .08em @fa-border-color; 7 | border-radius: .1em; 8 | } 9 | 10 | .@{fa-css-prefix}-pull-left { float: left; } 11 | .@{fa-css-prefix}-pull-right { float: right; } 12 | 13 | .@{fa-css-prefix} { 14 | &.@{fa-css-prefix}-pull-left { margin-right: .3em; } 15 | &.@{fa-css-prefix}-pull-right { margin-left: .3em; } 16 | } 17 | 18 | /* Deprecated as of 4.4.0 */ 19 | .pull-right { float: right; } 20 | .pull-left { float: left; } 21 | 22 | .@{fa-css-prefix} { 23 | &.pull-left { margin-right: .3em; } 24 | &.pull-right { margin-left: .3em; } 25 | } 26 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/core.less: -------------------------------------------------------------------------------- 1 | // Base Class Definition 2 | // ------------------------- 3 | 4 | .@{fa-css-prefix} { 5 | display: inline-block; 6 | font: normal normal normal @fa-font-size-base/@fa-line-height-base FontAwesome; // shortening font declaration 7 | font-size: inherit; // can't have font-size inherit on line above, so need to override 8 | text-rendering: auto; // optimizelegibility throws things off #1094 9 | -webkit-font-smoothing: antialiased; 10 | -moz-osx-font-smoothing: grayscale; 11 | 12 | } 13 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/fixed-width.less: -------------------------------------------------------------------------------- 1 | // Fixed Width Icons 2 | // ------------------------- 3 | .@{fa-css-prefix}-fw { 4 | width: (18em / 14); 5 | text-align: center; 6 | } 7 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/font-awesome.less: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome 3 | * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) 4 | */ 5 | 6 | @import "variables.less"; 7 | @import "mixins.less"; 8 | @import "path.less"; 9 | @import "core.less"; 10 | @import "larger.less"; 11 | @import "fixed-width.less"; 12 | @import "list.less"; 13 | @import "bordered-pulled.less"; 14 | @import "animated.less"; 15 | @import "rotated-flipped.less"; 16 | @import "stacked.less"; 17 | @import "icons.less"; 18 | @import "screen-reader.less"; 19 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/larger.less: -------------------------------------------------------------------------------- 1 | // Icon Sizes 2 | // ------------------------- 3 | 4 | /* makes the font 33% larger relative to the icon container */ 5 | .@{fa-css-prefix}-lg { 6 | font-size: (4em / 3); 7 | line-height: (3em / 4); 8 | vertical-align: -15%; 9 | } 10 | .@{fa-css-prefix}-2x { font-size: 2em; } 11 | .@{fa-css-prefix}-3x { font-size: 3em; } 12 | .@{fa-css-prefix}-4x { font-size: 4em; } 13 | .@{fa-css-prefix}-5x { font-size: 5em; } 14 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/list.less: -------------------------------------------------------------------------------- 1 | // List Icons 2 | // ------------------------- 3 | 4 | .@{fa-css-prefix}-ul { 5 | padding-left: 0; 6 | margin-left: @fa-li-width; 7 | list-style-type: none; 8 | > li { position: relative; } 9 | } 10 | .@{fa-css-prefix}-li { 11 | position: absolute; 12 | left: -@fa-li-width; 13 | width: @fa-li-width; 14 | top: (2em / 14); 15 | text-align: center; 16 | &.@{fa-css-prefix}-lg { 17 | left: (-@fa-li-width + (4em / 14)); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/mixins.less: -------------------------------------------------------------------------------- 1 | // Mixins 2 | // -------------------------- 3 | 4 | .fa-icon() { 5 | display: inline-block; 6 | font: normal normal normal @fa-font-size-base/@fa-line-height-base FontAwesome; // shortening font declaration 7 | font-size: inherit; // can't have font-size inherit on line above, so need to override 8 | text-rendering: auto; // optimizelegibility throws things off #1094 9 | -webkit-font-smoothing: antialiased; 10 | -moz-osx-font-smoothing: grayscale; 11 | 12 | } 13 | 14 | .fa-icon-rotate(@degrees, @rotation) { 15 | -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=@{rotation})"; 16 | -webkit-transform: rotate(@degrees); 17 | -ms-transform: rotate(@degrees); 18 | transform: rotate(@degrees); 19 | } 20 | 21 | .fa-icon-flip(@horiz, @vert, @rotation) { 22 | -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=@{rotation}, mirror=1)"; 23 | -webkit-transform: scale(@horiz, @vert); 24 | -ms-transform: scale(@horiz, @vert); 25 | transform: scale(@horiz, @vert); 26 | } 27 | 28 | 29 | // Only display content to screen readers. A la Bootstrap 4. 30 | // 31 | // See: http://a11yproject.com/posts/how-to-hide-content/ 32 | 33 | .sr-only() { 34 | position: absolute; 35 | width: 1px; 36 | height: 1px; 37 | padding: 0; 38 | margin: -1px; 39 | overflow: hidden; 40 | clip: rect(0,0,0,0); 41 | border: 0; 42 | } 43 | 44 | // Use in conjunction with .sr-only to only display content when it's focused. 45 | // 46 | // Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 47 | // 48 | // Credit: HTML5 Boilerplate 49 | 50 | .sr-only-focusable() { 51 | &:active, 52 | &:focus { 53 | position: static; 54 | width: auto; 55 | height: auto; 56 | margin: 0; 57 | overflow: visible; 58 | clip: auto; 59 | } 60 | } 61 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/path.less: -------------------------------------------------------------------------------- 1 | /* FONT PATH 2 | * -------------------------- */ 3 | 4 | @font-face { 5 | font-family: 'FontAwesome'; 6 | src: url('@{fa-font-path}/fontawesome-webfont.eot?v=@{fa-version}'); 7 | src: url('@{fa-font-path}/fontawesome-webfont.eot?#iefix&v=@{fa-version}') format('embedded-opentype'), 8 | url('@{fa-font-path}/fontawesome-webfont.woff2?v=@{fa-version}') format('woff2'), 9 | url('@{fa-font-path}/fontawesome-webfont.woff?v=@{fa-version}') format('woff'), 10 | url('@{fa-font-path}/fontawesome-webfont.ttf?v=@{fa-version}') format('truetype'), 11 | url('@{fa-font-path}/fontawesome-webfont.svg?v=@{fa-version}#fontawesomeregular') format('svg'); 12 | // src: url('@{fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts 13 | font-weight: normal; 14 | font-style: normal; 15 | } 16 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/rotated-flipped.less: -------------------------------------------------------------------------------- 1 | // Rotated & Flipped Icons 2 | // ------------------------- 3 | 4 | .@{fa-css-prefix}-rotate-90 { .fa-icon-rotate(90deg, 1); } 5 | .@{fa-css-prefix}-rotate-180 { .fa-icon-rotate(180deg, 2); } 6 | .@{fa-css-prefix}-rotate-270 { .fa-icon-rotate(270deg, 3); } 7 | 8 | .@{fa-css-prefix}-flip-horizontal { .fa-icon-flip(-1, 1, 0); } 9 | .@{fa-css-prefix}-flip-vertical { .fa-icon-flip(1, -1, 2); } 10 | 11 | // Hook for IE8-9 12 | // ------------------------- 13 | 14 | :root .@{fa-css-prefix}-rotate-90, 15 | :root .@{fa-css-prefix}-rotate-180, 16 | :root .@{fa-css-prefix}-rotate-270, 17 | :root .@{fa-css-prefix}-flip-horizontal, 18 | :root .@{fa-css-prefix}-flip-vertical { 19 | filter: none; 20 | } 21 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/screen-reader.less: -------------------------------------------------------------------------------- 1 | // Screen Readers 2 | // ------------------------- 3 | 4 | .sr-only { .sr-only(); } 5 | .sr-only-focusable { .sr-only-focusable(); } 6 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/less/stacked.less: -------------------------------------------------------------------------------- 1 | // Stacked Icons 2 | // ------------------------- 3 | 4 | .@{fa-css-prefix}-stack { 5 | position: relative; 6 | display: inline-block; 7 | width: 2em; 8 | height: 2em; 9 | line-height: 2em; 10 | vertical-align: middle; 11 | } 12 | .@{fa-css-prefix}-stack-1x, .@{fa-css-prefix}-stack-2x { 13 | position: absolute; 14 | left: 0; 15 | width: 100%; 16 | text-align: center; 17 | } 18 | .@{fa-css-prefix}-stack-1x { line-height: inherit; } 19 | .@{fa-css-prefix}-stack-2x { font-size: 2em; } 20 | .@{fa-css-prefix}-inverse { color: @fa-inverse; } 21 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_animated.scss: -------------------------------------------------------------------------------- 1 | // Spinning Icons 2 | // -------------------------- 3 | 4 | .#{$fa-css-prefix}-spin { 5 | -webkit-animation: fa-spin 2s infinite linear; 6 | animation: fa-spin 2s infinite linear; 7 | } 8 | 9 | .#{$fa-css-prefix}-pulse { 10 | -webkit-animation: fa-spin 1s infinite steps(8); 11 | animation: fa-spin 1s infinite steps(8); 12 | } 13 | 14 | @-webkit-keyframes fa-spin { 15 | 0% { 16 | -webkit-transform: rotate(0deg); 17 | transform: rotate(0deg); 18 | } 19 | 100% { 20 | -webkit-transform: rotate(359deg); 21 | transform: rotate(359deg); 22 | } 23 | } 24 | 25 | @keyframes fa-spin { 26 | 0% { 27 | -webkit-transform: rotate(0deg); 28 | transform: rotate(0deg); 29 | } 30 | 100% { 31 | -webkit-transform: rotate(359deg); 32 | transform: rotate(359deg); 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_bordered-pulled.scss: -------------------------------------------------------------------------------- 1 | // Bordered & Pulled 2 | // ------------------------- 3 | 4 | .#{$fa-css-prefix}-border { 5 | padding: .2em .25em .15em; 6 | border: solid .08em $fa-border-color; 7 | border-radius: .1em; 8 | } 9 | 10 | .#{$fa-css-prefix}-pull-left { float: left; } 11 | .#{$fa-css-prefix}-pull-right { float: right; } 12 | 13 | .#{$fa-css-prefix} { 14 | &.#{$fa-css-prefix}-pull-left { margin-right: .3em; } 15 | &.#{$fa-css-prefix}-pull-right { margin-left: .3em; } 16 | } 17 | 18 | /* Deprecated as of 4.4.0 */ 19 | .pull-right { float: right; } 20 | .pull-left { float: left; } 21 | 22 | .#{$fa-css-prefix} { 23 | &.pull-left { margin-right: .3em; } 24 | &.pull-right { margin-left: .3em; } 25 | } 26 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_core.scss: -------------------------------------------------------------------------------- 1 | // Base Class Definition 2 | // ------------------------- 3 | 4 | .#{$fa-css-prefix} { 5 | display: inline-block; 6 | font: normal normal normal #{$fa-font-size-base}/#{$fa-line-height-base} FontAwesome; // shortening font declaration 7 | font-size: inherit; // can't have font-size inherit on line above, so need to override 8 | text-rendering: auto; // optimizelegibility throws things off #1094 9 | -webkit-font-smoothing: antialiased; 10 | -moz-osx-font-smoothing: grayscale; 11 | 12 | } 13 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_fixed-width.scss: -------------------------------------------------------------------------------- 1 | // Fixed Width Icons 2 | // ------------------------- 3 | .#{$fa-css-prefix}-fw { 4 | width: (18em / 14); 5 | text-align: center; 6 | } 7 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_larger.scss: -------------------------------------------------------------------------------- 1 | // Icon Sizes 2 | // ------------------------- 3 | 4 | /* makes the font 33% larger relative to the icon container */ 5 | .#{$fa-css-prefix}-lg { 6 | font-size: (4em / 3); 7 | line-height: (3em / 4); 8 | vertical-align: -15%; 9 | } 10 | .#{$fa-css-prefix}-2x { font-size: 2em; } 11 | .#{$fa-css-prefix}-3x { font-size: 3em; } 12 | .#{$fa-css-prefix}-4x { font-size: 4em; } 13 | .#{$fa-css-prefix}-5x { font-size: 5em; } 14 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_list.scss: -------------------------------------------------------------------------------- 1 | // List Icons 2 | // ------------------------- 3 | 4 | .#{$fa-css-prefix}-ul { 5 | padding-left: 0; 6 | margin-left: $fa-li-width; 7 | list-style-type: none; 8 | > li { position: relative; } 9 | } 10 | .#{$fa-css-prefix}-li { 11 | position: absolute; 12 | left: -$fa-li-width; 13 | width: $fa-li-width; 14 | top: (2em / 14); 15 | text-align: center; 16 | &.#{$fa-css-prefix}-lg { 17 | left: -$fa-li-width + (4em / 14); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_mixins.scss: -------------------------------------------------------------------------------- 1 | // Mixins 2 | // -------------------------- 3 | 4 | @mixin fa-icon() { 5 | display: inline-block; 6 | font: normal normal normal #{$fa-font-size-base}/#{$fa-line-height-base} FontAwesome; // shortening font declaration 7 | font-size: inherit; // can't have font-size inherit on line above, so need to override 8 | text-rendering: auto; // optimizelegibility throws things off #1094 9 | -webkit-font-smoothing: antialiased; 10 | -moz-osx-font-smoothing: grayscale; 11 | 12 | } 13 | 14 | @mixin fa-icon-rotate($degrees, $rotation) { 15 | -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation})"; 16 | -webkit-transform: rotate($degrees); 17 | -ms-transform: rotate($degrees); 18 | transform: rotate($degrees); 19 | } 20 | 21 | @mixin fa-icon-flip($horiz, $vert, $rotation) { 22 | -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}, mirror=1)"; 23 | -webkit-transform: scale($horiz, $vert); 24 | -ms-transform: scale($horiz, $vert); 25 | transform: scale($horiz, $vert); 26 | } 27 | 28 | 29 | // Only display content to screen readers. A la Bootstrap 4. 30 | // 31 | // See: http://a11yproject.com/posts/how-to-hide-content/ 32 | 33 | @mixin sr-only { 34 | position: absolute; 35 | width: 1px; 36 | height: 1px; 37 | padding: 0; 38 | margin: -1px; 39 | overflow: hidden; 40 | clip: rect(0,0,0,0); 41 | border: 0; 42 | } 43 | 44 | // Use in conjunction with .sr-only to only display content when it's focused. 45 | // 46 | // Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 47 | // 48 | // Credit: HTML5 Boilerplate 49 | 50 | @mixin sr-only-focusable { 51 | &:active, 52 | &:focus { 53 | position: static; 54 | width: auto; 55 | height: auto; 56 | margin: 0; 57 | overflow: visible; 58 | clip: auto; 59 | } 60 | } 61 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_path.scss: -------------------------------------------------------------------------------- 1 | /* FONT PATH 2 | * -------------------------- */ 3 | 4 | @font-face { 5 | font-family: 'FontAwesome'; 6 | src: url('#{$fa-font-path}/fontawesome-webfont.eot?v=#{$fa-version}'); 7 | src: url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'), 8 | url('#{$fa-font-path}/fontawesome-webfont.woff2?v=#{$fa-version}') format('woff2'), 9 | url('#{$fa-font-path}/fontawesome-webfont.woff?v=#{$fa-version}') format('woff'), 10 | url('#{$fa-font-path}/fontawesome-webfont.ttf?v=#{$fa-version}') format('truetype'), 11 | url('#{$fa-font-path}/fontawesome-webfont.svg?v=#{$fa-version}#fontawesomeregular') format('svg'); 12 | // src: url('#{$fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts 13 | font-weight: normal; 14 | font-style: normal; 15 | } 16 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_rotated-flipped.scss: -------------------------------------------------------------------------------- 1 | // Rotated & Flipped Icons 2 | // ------------------------- 3 | 4 | .#{$fa-css-prefix}-rotate-90 { @include fa-icon-rotate(90deg, 1); } 5 | .#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); } 6 | .#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); } 7 | 8 | .#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); } 9 | .#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(1, -1, 2); } 10 | 11 | // Hook for IE8-9 12 | // ------------------------- 13 | 14 | :root .#{$fa-css-prefix}-rotate-90, 15 | :root .#{$fa-css-prefix}-rotate-180, 16 | :root .#{$fa-css-prefix}-rotate-270, 17 | :root .#{$fa-css-prefix}-flip-horizontal, 18 | :root .#{$fa-css-prefix}-flip-vertical { 19 | filter: none; 20 | } 21 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_screen-reader.scss: -------------------------------------------------------------------------------- 1 | // Screen Readers 2 | // ------------------------- 3 | 4 | .sr-only { @include sr-only(); } 5 | .sr-only-focusable { @include sr-only-focusable(); } 6 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/_stacked.scss: -------------------------------------------------------------------------------- 1 | // Stacked Icons 2 | // ------------------------- 3 | 4 | .#{$fa-css-prefix}-stack { 5 | position: relative; 6 | display: inline-block; 7 | width: 2em; 8 | height: 2em; 9 | line-height: 2em; 10 | vertical-align: middle; 11 | } 12 | .#{$fa-css-prefix}-stack-1x, .#{$fa-css-prefix}-stack-2x { 13 | position: absolute; 14 | left: 0; 15 | width: 100%; 16 | text-align: center; 17 | } 18 | .#{$fa-css-prefix}-stack-1x { line-height: inherit; } 19 | .#{$fa-css-prefix}-stack-2x { font-size: 2em; } 20 | .#{$fa-css-prefix}-inverse { color: $fa-inverse; } 21 | -------------------------------------------------------------------------------- /public/resources/fonts/font-awesome/scss/font-awesome.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome 3 | * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) 4 | */ 5 | 6 | @import "variables"; 7 | @import "mixins"; 8 | @import "path"; 9 | @import "core"; 10 | @import "larger"; 11 | @import "fixed-width"; 12 | @import "list"; 13 | @import "bordered-pulled"; 14 | @import "animated"; 15 | @import "rotated-flipped"; 16 | @import "stacked"; 17 | @import "icons"; 18 | @import "screen-reader"; 19 | -------------------------------------------------------------------------------- /public/resources/fonts/font-icomoon/Read Me.txt: -------------------------------------------------------------------------------- 1 | Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures. 2 | 3 | To use the generated font in desktop programs, you can install the TTF font. In order to copy the character associated with each icon, refer to the text box at the bottom right corner of each glyph in demo.html. The character inside this text box may be invisible; but it can still be copied. See this guide for more info: https://icomoon.io/#docs/local-fonts 4 | 5 | You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects. 6 | 7 | You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu → Manage Projects) to retrieve your icon selection. 8 | -------------------------------------------------------------------------------- /public/resources/fonts/font-icomoon/demo-files/demo.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding: 0; 3 | margin: 0; 4 | font-family: sans-serif; 5 | font-size: 1em; 6 | line-height: 1.5; 7 | color: #555; 8 | background: #fff; 9 | } 10 | h1 { 11 | font-size: 1.5em; 12 | font-weight: normal; 13 | } 14 | small { 15 | font-size: .66666667em; 16 | } 17 | a { 18 | color: #e74c3c; 19 | text-decoration: none; 20 | } 21 | a:hover, a:focus { 22 | box-shadow: 0 1px #e74c3c; 23 | } 24 | .bshadow0, input { 25 | box-shadow: inset 0 -2px #e7e7e7; 26 | } 27 | input:hover { 28 | box-shadow: inset 0 -2px #ccc; 29 | } 30 | input, fieldset { 31 | font-family: sans-serif; 32 | font-size: 1em; 33 | margin: 0; 34 | padding: 0; 35 | border: 0; 36 | } 37 | input { 38 | color: inherit; 39 | line-height: 1.5; 40 | height: 1.5em; 41 | padding: .25em 0; 42 | } 43 | input:focus { 44 | outline: none; 45 | box-shadow: inset 0 -2px #449fdb; 46 | } 47 | .glyph { 48 | font-size: 16px; 49 | width: 15em; 50 | padding-bottom: 1em; 51 | margin-right: 4em; 52 | margin-bottom: 1em; 53 | float: left; 54 | overflow: hidden; 55 | } 56 | .liga { 57 | width: 80%; 58 | width: calc(100% - 2.5em); 59 | } 60 | .talign-right { 61 | text-align: right; 62 | } 63 | .talign-center { 64 | text-align: center; 65 | } 66 | .bgc1 { 67 | background: #f1f1f1; 68 | } 69 | .fgc1 { 70 | color: #999; 71 | } 72 | .fgc0 { 73 | color: #000; 74 | } 75 | p { 76 | margin-top: 1em; 77 | margin-bottom: 1em; 78 | } 79 | .mvm { 80 | margin-top: .75em; 81 | margin-bottom: .75em; 82 | } 83 | .mtn { 84 | margin-top: 0; 85 | } 86 | .mtl, .mal { 87 | margin-top: 1.5em; 88 | } 89 | .mbl, .mal { 90 | margin-bottom: 1.5em; 91 | } 92 | .mal, .mhl { 93 | margin-left: 1.5em; 94 | margin-right: 1.5em; 95 | } 96 | .mhmm { 97 | margin-left: 1em; 98 | margin-right: 1em; 99 | } 100 | .mls { 101 | margin-left: .25em; 102 | } 103 | .ptl { 104 | padding-top: 1.5em; 105 | } 106 | .pbs, .pvs { 107 | padding-bottom: .25em; 108 | } 109 | .pvs, .pts { 110 | padding-top: .25em; 111 | } 112 | .unit { 113 | float: left; 114 | } 115 | .unitRight { 116 | float: right; 117 | } 118 | .size1of2 { 119 | width: 50%; 120 | } 121 | .size1of1 { 122 | width: 100%; 123 | } 124 | .clearfix:before, .clearfix:after { 125 | content: " "; 126 | display: table; 127 | } 128 | .clearfix:after { 129 | clear: both; 130 | } 131 | .hidden-true { 132 | display: none; 133 | } 134 | .textbox0 { 135 | width: 3em; 136 | background: #f1f1f1; 137 | padding: .25em .5em; 138 | line-height: 1.5; 139 | height: 1.5em; 140 | } 141 | #testDrive { 142 | display: block; 143 | padding-top: 24px; 144 | line-height: 1.5; 145 | } 146 | .fs0 { 147 | font-size: 16px; 148 | } 149 | .fs1 { 150 | font-size: 32px; 151 | } 152 | 153 | -------------------------------------------------------------------------------- /public/resources/fonts/font-icomoon/demo-files/demo.js: -------------------------------------------------------------------------------- 1 | if (!('boxShadow' in document.body.style)) { 2 | document.body.setAttribute('class', 'noBoxShadow') 3 | } 4 | 5 | document.body.addEventListener('click', (e) => { 6 | const target = e.target 7 | if (target.tagName === 'INPUT' && target.getAttribute('class').indexOf('liga') === -1) { 8 | target.select() 9 | } 10 | }) 11 | ;(function() { 12 | const fontSize = document.getElementById('fontSize'); 13 | 14 | 15 | const testDrive = document.getElementById('testDrive'); 16 | 17 | 18 | const testText = document.getElementById('testText') 19 | function updateTest() { 20 | testDrive.innerHTML = testText.value || String.fromCharCode(160) 21 | if (window.icomoonLiga) { 22 | window.icomoonLiga(testDrive) 23 | } 24 | } 25 | function updateSize() { 26 | testDrive.style.fontSize = `${fontSize.value }px` 27 | } 28 | fontSize.addEventListener('change', updateSize, false) 29 | testText.addEventListener('input', updateTest, false) 30 | testText.addEventListener('change', updateTest, false) 31 | updateSize() 32 | })() 33 | -------------------------------------------------------------------------------- /public/resources/fonts/font-icomoon/fonts/icomoon.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-icomoon/fonts/icomoon.eot -------------------------------------------------------------------------------- /public/resources/fonts/font-icomoon/fonts/icomoon.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-icomoon/fonts/icomoon.ttf -------------------------------------------------------------------------------- /public/resources/fonts/font-icomoon/fonts/icomoon.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-icomoon/fonts/icomoon.woff -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/Read Me.txt: -------------------------------------------------------------------------------- 1 | Open "demo.html" to see a list of all the glyphs in the Linearicons-Free font along with their codes. 2 | 3 | You won't need any of the files located under the "demo-files" directory when including the generated font in your own projects. 4 | 5 | You can import "selection.json" to the IcoMoon app (https://icomoon.io/app) using the "Import Icons" button (or via Main Menu > Manage Projects) to modify or subset this font for further optimization. 6 | -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/demo-files/demo.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding: 0; 3 | margin: 0; 4 | font-family: sans-serif; 5 | font-size: 1em; 6 | line-height: 1.5; 7 | color: #555; 8 | background: #fff; 9 | } 10 | h1 { 11 | font-size: 1.5em; 12 | font-weight: normal; 13 | } 14 | small { 15 | font-size: .66666667em; 16 | } 17 | a { 18 | color: #e74c3c; 19 | text-decoration: none; 20 | } 21 | a:hover, a:focus { 22 | box-shadow: 0 1px #e74c3c; 23 | } 24 | .bshadow0, input { 25 | box-shadow: inset 0 -2px #e7e7e7; 26 | } 27 | input:hover { 28 | box-shadow: inset 0 -2px #ccc; 29 | } 30 | input, fieldset { 31 | font-size: 1em; 32 | margin: 0; 33 | padding: 0; 34 | border: 0; 35 | } 36 | input { 37 | color: inherit; 38 | line-height: 1.5; 39 | height: 1.5em; 40 | padding: .25em 0; 41 | } 42 | input:focus { 43 | outline: none; 44 | box-shadow: inset 0 -2px #449fdb; 45 | } 46 | .glyph { 47 | font-size: 16px; 48 | width: 15em; 49 | padding-bottom: 1em; 50 | margin-right: 4em; 51 | margin-bottom: 1em; 52 | float: left; 53 | overflow: hidden; 54 | } 55 | .liga { 56 | width: 80%; 57 | width: calc(100% - 2.5em); 58 | } 59 | .talign-right { 60 | text-align: right; 61 | } 62 | .talign-center { 63 | text-align: center; 64 | } 65 | .bgc1 { 66 | background: #f1f1f1; 67 | } 68 | .fgc1 { 69 | color: #999; 70 | } 71 | .fgc0 { 72 | color: #000; 73 | } 74 | p { 75 | margin-top: 1em; 76 | margin-bottom: 1em; 77 | } 78 | .mvm { 79 | margin-top: .75em; 80 | margin-bottom: .75em; 81 | } 82 | .mtn { 83 | margin-top: 0; 84 | } 85 | .mtl, .mal { 86 | margin-top: 1.5em; 87 | } 88 | .mbl, .mal { 89 | margin-bottom: 1.5em; 90 | } 91 | .mal, .mhl { 92 | margin-left: 1.5em; 93 | margin-right: 1.5em; 94 | } 95 | .mhmm { 96 | margin-left: 1em; 97 | margin-right: 1em; 98 | } 99 | .mls { 100 | margin-left: .25em; 101 | } 102 | .ptl { 103 | padding-top: 1.5em; 104 | } 105 | .pbs, .pvs { 106 | padding-bottom: .25em; 107 | } 108 | .pvs, .pts { 109 | padding-top: .25em; 110 | } 111 | .unit { 112 | float: left; 113 | } 114 | .unitRight { 115 | float: right; 116 | } 117 | .size1of2 { 118 | width: 50%; 119 | } 120 | .size1of1 { 121 | width: 100%; 122 | } 123 | .clearfix:before, .clearfix:after { 124 | content: " "; 125 | display: table; 126 | } 127 | .clearfix:after { 128 | clear: both; 129 | } 130 | .hidden-true { 131 | display: none; 132 | } 133 | .textbox0 { 134 | width: 3em; 135 | background: #f1f1f1; 136 | padding: .25em .5em; 137 | line-height: 1.5; 138 | height: 1.5em; 139 | } 140 | #testDrive { 141 | display: block; 142 | padding-top: 24px; 143 | line-height: 1.5; 144 | } 145 | .fs0 { 146 | font-size: 16px; 147 | } 148 | .fs1 { 149 | font-size: 20px; 150 | } 151 | -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/demo-files/demo.js: -------------------------------------------------------------------------------- 1 | if (!('boxShadow' in document.body.style)) { 2 | document.body.setAttribute('class', 'noBoxShadow') 3 | } 4 | 5 | document.body.addEventListener('click', (e) => { 6 | const target = e.target 7 | if (target.tagName === 'INPUT' && target.getAttribute('class').indexOf('liga') === -1) { 8 | target.select() 9 | } 10 | }) 11 | ;(function() { 12 | const fontSize = document.getElementById('fontSize'); 13 | 14 | 15 | const testDrive = document.getElementById('testDrive'); 16 | 17 | 18 | const testText = document.getElementById('testText') 19 | function updateTest() { 20 | testDrive.innerHTML = testText.value || String.fromCharCode(160) 21 | if (window.icomoonLiga) { 22 | window.icomoonLiga(testDrive) 23 | } 24 | } 25 | function updateSize() { 26 | testDrive.style.fontSize = `${fontSize.value }px` 27 | } 28 | fontSize.addEventListener('change', updateSize, false) 29 | testText.addEventListener('input', updateTest, false) 30 | testText.addEventListener('change', updateTest, false) 31 | updateSize() 32 | })() 33 | -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/fonts/Linearicons-Free.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-linearicons/fonts/Linearicons-Free.eot -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/fonts/Linearicons-Free.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-linearicons/fonts/Linearicons-Free.ttf -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/fonts/Linearicons-Free.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-linearicons/fonts/Linearicons-Free.woff -------------------------------------------------------------------------------- /public/resources/fonts/font-linearicons/fonts/Linearicons-Free.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/fonts/font-linearicons/fonts/Linearicons-Free.woff2 -------------------------------------------------------------------------------- /public/resources/images/amazon.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/amazon.jpg -------------------------------------------------------------------------------- /public/resources/images/avatar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatar.jpg -------------------------------------------------------------------------------- /public/resources/images/avatars/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatars/1.jpg -------------------------------------------------------------------------------- /public/resources/images/avatars/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatars/2.jpg -------------------------------------------------------------------------------- /public/resources/images/avatars/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatars/3.jpg -------------------------------------------------------------------------------- /public/resources/images/avatars/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatars/4.jpg -------------------------------------------------------------------------------- /public/resources/images/avatars/5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatars/5.jpg -------------------------------------------------------------------------------- /public/resources/images/avatars/temp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/avatars/temp.jpg -------------------------------------------------------------------------------- /public/resources/images/ecommerce/001.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/ecommerce/001.jpg -------------------------------------------------------------------------------- /public/resources/images/ecommerce/002.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/ecommerce/002.jpg -------------------------------------------------------------------------------- /public/resources/images/ecommerce/003.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/ecommerce/003.jpg -------------------------------------------------------------------------------- /public/resources/images/ecommerce/004.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/ecommerce/004.jpg -------------------------------------------------------------------------------- /public/resources/images/ecommerce/amazon.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/ecommerce/amazon.jpg -------------------------------------------------------------------------------- /public/resources/images/ecommerce/ecommerce-empty.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/ecommerce/ecommerce-empty.jpg -------------------------------------------------------------------------------- /public/resources/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/favicon.ico -------------------------------------------------------------------------------- /public/resources/images/icons/icon-next-step.svg: -------------------------------------------------------------------------------- 1 | icon-next-step -------------------------------------------------------------------------------- /public/resources/images/logo-inverse-mobile.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/logo-inverse-mobile.png -------------------------------------------------------------------------------- /public/resources/images/logo-inverse.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/logo-inverse.png -------------------------------------------------------------------------------- /public/resources/images/logo-mobile.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/logo-mobile.png -------------------------------------------------------------------------------- /public/resources/images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/logo.png -------------------------------------------------------------------------------- /public/resources/images/mediatec-inverse.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/mediatec-inverse.png -------------------------------------------------------------------------------- /public/resources/images/mediatec.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/mediatec.png -------------------------------------------------------------------------------- /public/resources/images/n.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/n.jpg -------------------------------------------------------------------------------- /public/resources/images/photos/1.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/photos/1.jpeg -------------------------------------------------------------------------------- /public/resources/images/photos/2.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/photos/2.jpeg -------------------------------------------------------------------------------- /public/resources/images/photos/3.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/photos/3.jpeg -------------------------------------------------------------------------------- /public/resources/images/photos/4.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/photos/4.jpeg -------------------------------------------------------------------------------- /public/resources/images/photos/5.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/photos/5.jpeg -------------------------------------------------------------------------------- /public/resources/images/photos/6.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/photos/6.jpeg -------------------------------------------------------------------------------- /public/resources/images/s.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/s.jpg -------------------------------------------------------------------------------- /public/resources/images/temp-company.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/public/resources/images/temp-company.jpg -------------------------------------------------------------------------------- /src/assets/images/cluster.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/cluster.png -------------------------------------------------------------------------------- /src/assets/images/davidshimjs-qrcodejs-04f46c6.tar.gz: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/davidshimjs-qrcodejs-04f46c6.tar.gz -------------------------------------------------------------------------------- /src/assets/images/file.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/file.png -------------------------------------------------------------------------------- /src/assets/images/folder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/folder.png -------------------------------------------------------------------------------- /src/assets/images/ipfs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/ipfs.png -------------------------------------------------------------------------------- /src/assets/images/pin-off-outline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/pin-off-outline.png -------------------------------------------------------------------------------- /src/assets/images/pin-outline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/pin-outline.png -------------------------------------------------------------------------------- /src/assets/images/pin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cluster-labs/horizon/f8fd36f752f2a74917434daa6b657fb8b6bfabdb/src/assets/images/pin.png -------------------------------------------------------------------------------- /src/assets/styles/Antd/antd.cleanui.scss: -------------------------------------------------------------------------------- 1 | body { 2 | // overriding (making high level priority) antd styles by wrapping this styles body tag 3 | @import 'import/backtop'; 4 | @import 'import/badge'; 5 | @import 'import/calendar'; 6 | @import 'import/cascader'; 7 | @import 'import/dropdown'; 8 | @import 'import/form'; 9 | @import 'import/input'; 10 | @import 'import/modal'; 11 | @import 'import/select'; 12 | @import 'import/slider'; 13 | @import 'import/spin'; 14 | @import 'import/layout'; 15 | @import 'import/notification'; 16 | @import 'import/progress'; 17 | @import 'import/menu'; 18 | } 19 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/backtop.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN BACKTOP */ 6 | 7 | .ant-back-top { 8 | right: rem(50); 9 | bottom: rem(50); 10 | } 11 | 12 | .ant-back-top-content { 13 | border-radius: 5px; 14 | background: $gray; 15 | 16 | &:hover { 17 | background: $gray-darken; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/badge.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN BADGE */ 6 | 7 | .ant-badge-count { 8 | font-family: inherit; 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/calendar.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN CALENDAR */ 6 | 7 | .ant-calendar { 8 | border: 1px solid #e9e9e9; 9 | } 10 | 11 | .events { 12 | list-style: none; 13 | margin: 0; 14 | padding: 0; 15 | } 16 | .events .ant-badge-status { 17 | overflow: hidden; 18 | white-space: nowrap; 19 | width: 100%; 20 | text-overflow: ellipsis; 21 | font-size: 12px; 22 | } 23 | 24 | .notes-month { 25 | text-align: center; 26 | font-size: 28px; 27 | } 28 | 29 | .notes-month section { 30 | font-size: 28px; 31 | } 32 | 33 | .ant-fullcalendar-month-select { 34 | margin-left: 5px; 35 | } 36 | 37 | .ant-calendar-picker-container { 38 | animation-duration: 0s !important; 39 | } 40 | 41 | .ant-calendar-range .ant-calendar-input-wrap { 42 | height: 38px; 43 | } 44 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/cascader.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN CASCADER */ 6 | 7 | .ant-cascader-menus { 8 | border: 1px solid #e9e9e9; 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/dropdown.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN DROPDOWN */ 6 | 7 | .ant-dropdown-menu { 8 | border: 1px solid #e9e9e9; 9 | } 10 | 11 | .ant-dropdown-menu-item, 12 | .ant-dropdown-menu-submenu-title { 13 | font-size: rem(13); 14 | padding: rem(8) rem(20); 15 | } 16 | 17 | .ant-dropdown-menu-item > a, 18 | .ant-dropdown-menu-submenu-title > a { 19 | padding: rem(8) rem(20); 20 | margin: rem(-8) rem(-20); 21 | } 22 | 23 | .ant-dropdown-menu-item > a.btn, 24 | .ant-dropdown-menu-submenu-title > a.btn { 25 | margin: rem(-8) 0; 26 | } 27 | 28 | .ant-dropdown-menu-item-group-list { 29 | list-style: none; 30 | padding: 0; 31 | } 32 | 33 | .ant-dropdown-menu-item-group-title { 34 | font-weight: bold; 35 | font-size: rem(13); 36 | padding: rem(12) rem(20); 37 | color: $text; 38 | } 39 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/form.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN FORM */ 6 | 7 | .ant-form input[type='file'] { 8 | min-height: 40px; 9 | } 10 | 11 | .ant-form input.ant-input-sm[type='file'] { 12 | min-height: 48px; 13 | } 14 | 15 | .ant-form input.ant-input-lg[type='file'] { 16 | min-height: 52px; 17 | } 18 | 19 | .ant-form-item-label { 20 | text-align: left; 21 | white-space: normal; 22 | } 23 | 24 | .ant-form-item > .ant-form-item, 25 | .ant-form-item :not(.ant-form) > .ant-form-item { 26 | margin-top: -2px; 27 | } 28 | 29 | form .ant-select:only-child, 30 | form .ant-cascader-picker:only-child { 31 | display: inline-block; 32 | } 33 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/input.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN INPUT */ 6 | 7 | .ant-input-disabled { 8 | background: $gray-lighten-more-more; 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/layout.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN LAYOUT */ 6 | 7 | .ant-layout { 8 | min-height: 100vh; 9 | background: transparent; 10 | } 11 | 12 | .ant-layout-header { 13 | padding: 0; 14 | } 15 | 16 | .ant-layout-footer { 17 | padding: 0; 18 | background: transparent; 19 | } 20 | 21 | .ant-collapse { 22 | background: transparent; 23 | } 24 | 25 | .ant-layout-sider { 26 | transition: all 0.2s; 27 | } 28 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/menu.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN MENU */ 6 | 7 | .ant-menu-item { 8 | outline: none !important; 9 | } 10 | 11 | .ant-menu-dark.ant-menu-submenu-popup { 12 | .ant-menu-item-divider { 13 | opacity: 0.2; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/modal.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN MODAL */ 6 | 7 | .ant-modal-close { 8 | outline: none !important; 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/notification.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN NOTIFICATION */ 6 | 7 | .ant-notification { 8 | max-width: calc(100vw - 48px); 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/progress.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN PROGRESS */ 6 | 7 | .ant-progress-text { 8 | white-space: nowrap; 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/select.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN SELECT */ 6 | 7 | .ant-select { 8 | font-family: 'Nunito Sans', sans-serif; 9 | } 10 | 11 | .ant-select-dropdown { 12 | border: 1px solid #e9e9e9; 13 | animation-duration: 0s !important; 14 | } 15 | 16 | .ant-select-auto-complete { 17 | ol, 18 | ul, 19 | dl { 20 | margin: 0; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/slider.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN SLIDER */ 6 | 7 | .ant-slider-with-marks { 8 | margin-bottom: 19px; 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/Antd/import/spin.scss: -------------------------------------------------------------------------------- 1 | // Import mixins 2 | @import 'assets/styles/mixins.scss'; 3 | 4 | ///////////////////////////////////////////////////////////////////////////////////////// 5 | /* ANT DESIGN SPIN */ 6 | 7 | .ant-spin-blur { 8 | filter: none !important; 9 | } 10 | 11 | .ant-spin-nested-loading > div > .ant-spin { 12 | max-height: none; 13 | } 14 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/bootstrap.cleanui.scss: -------------------------------------------------------------------------------- 1 | @import 'import/grid'; 2 | @import 'import/card'; 3 | @import 'import/utilities'; 4 | @import 'import/buttons'; 5 | @import 'import/table'; 6 | @import 'import/typography'; 7 | @import 'import/breadcrumb'; 8 | @import 'import/forms'; 9 | @import 'import/dropdowns'; 10 | @import 'import/selectboxes'; 11 | @import 'import/badge'; 12 | @import 'import/carousel'; 13 | @import 'import/collapse'; 14 | @import 'import/modal'; 15 | @import 'import/alerts'; 16 | @import 'import/pagination'; 17 | @import 'import/tabs'; 18 | @import 'import/popovers'; 19 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/alerts.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* ALERTS */ 5 | 6 | .alert { 7 | border: none; 8 | font-weight: normal; 9 | color: $white; 10 | .close { 11 | color: $white; 12 | opacity: 0.5; 13 | outline: none !important; 14 | &:hover { 15 | opacity: 1; 16 | } 17 | } 18 | a, 19 | .alert-link { 20 | font-weight: normal; 21 | color: $white; 22 | opacity: 0.7; 23 | @include transition-color(); 24 | &:hover { 25 | opacity: 1; 26 | color: $white; 27 | } 28 | } 29 | &.alert-default { 30 | background: $default; 31 | } 32 | &.alert-primary { 33 | background: $primary; 34 | } 35 | &.alert-secondary { 36 | background: $secondary; 37 | } 38 | &.alert-success { 39 | background: $success; 40 | } 41 | &.alert-info { 42 | background: $info; 43 | } 44 | &.alert-warning { 45 | background: $warning; 46 | } 47 | &.alert-danger { 48 | background: $danger; 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/badge.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* BADGES */ 5 | 6 | .badge { 7 | font-weight: normal; 8 | background: $white; 9 | color: $secondary; 10 | &.badge-default { 11 | background: $default; 12 | color: $white; 13 | } 14 | &.badge-primary { 15 | background: $primary; 16 | color: $white; 17 | } 18 | &.badge-secondary { 19 | background: $secondary; 20 | color: $white; 21 | } 22 | &.badge-success { 23 | background: $success; 24 | color: $white; 25 | } 26 | &.badge-info { 27 | background: $info; 28 | color: $white; 29 | } 30 | &.badge-danger { 31 | background: $danger; 32 | color: $white; 33 | } 34 | &.badge-warning { 35 | background: $warning; 36 | color: $white; 37 | } 38 | } 39 | 40 | .btn .badge { 41 | top: 1px; 42 | } 43 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/breadcrumb.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* BREADCRUMB */ 5 | 6 | .breadcrumb { 7 | background: $gray-lighten-more; 8 | 9 | &--custom { 10 | display: inline-block; 11 | padding: 0; 12 | margin-bottom: 0; 13 | background: none; 14 | li { 15 | padding: 0; 16 | &:before { 17 | display: none !important; 18 | } 19 | > a, 20 | > span { 21 | display: inline-block; 22 | padding: 9px 30px; 23 | position: relative; 24 | background: $gray-lighten; 25 | margin: 0 rem(8) rem(6); 26 | font-size: 13px; 27 | &:before { 28 | content: ''; 29 | display: block; 30 | position: absolute; 31 | top: 0; 32 | left: -10px; 33 | width: 0; 34 | height: 0; 35 | border-style: solid; 36 | border-width: 39px 10px 0 0; 37 | border-color: transparent $gray-lighten transparent transparent; 38 | 39 | @include transition-slow(); 40 | } 41 | &:after { 42 | content: ''; 43 | display: block; 44 | position: absolute; 45 | top: 0; 46 | right: -10px; 47 | width: 0; 48 | height: 0; 49 | border-style: solid; 50 | border-width: 0 0 39px 10px; 51 | border-color: transparent transparent transparent $gray-lighten; 52 | 53 | @include transition-slow(); 54 | } 55 | } 56 | > a { 57 | @include transition-slow(); 58 | &:hover, 59 | &.active { 60 | background: $blue; 61 | color: $white; 62 | &:before { 63 | border-color: transparent $blue transparent transparent; 64 | } 65 | &:after { 66 | border-color: transparent transparent transparent $blue; 67 | } 68 | } 69 | } 70 | &:first-child { 71 | > a, 72 | > span { 73 | margin-left: 0; 74 | &:before { 75 | display: none; 76 | } 77 | } 78 | } 79 | &:last-child { 80 | > a, 81 | > span { 82 | &:after { 83 | display: none; 84 | } 85 | } 86 | } 87 | &:after { 88 | padding: 0; 89 | content: ''; 90 | } 91 | } 92 | } 93 | } 94 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/card.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* CARDS */ 5 | 6 | .card, 7 | .card-header, 8 | .list-group-item, 9 | .card-footer { 10 | border-color: $gray-border; 11 | } 12 | 13 | .card-header, 14 | .card-footer { 15 | padding-left: rem(30); 16 | padding-right: rem(30); 17 | background: $white; 18 | 19 | &:last-child { 20 | border-radius: 0 0 calc(7px - 1px) calc(7px - 1px); 21 | } 22 | 23 | &:first-child { 24 | border-radius: calc(7px - 1px) calc(7px - 1px) 0 0; 25 | } 26 | 27 | @media (max-width: $md-max-width) { 28 | padding-left: rem(20); 29 | padding-right: rem(20); 30 | } 31 | } 32 | 33 | .card-body { 34 | flex: 1 1 auto; 35 | padding: rem(25) rem(30); 36 | 37 | @media (max-width: $md-max-width) { 38 | padding-left: rem(20); 39 | padding-right: rem(20); 40 | } 41 | } 42 | 43 | .card { 44 | margin-bottom: rem(30); 45 | border-radius: 7px; 46 | 47 | &--withShadow { 48 | transition: box-shadow 0.1s ease-in-out; 49 | 50 | &:hover { 51 | box-shadow: 0 0 2.25rem #e1e1e1; 52 | } 53 | } 54 | 55 | &--fullHeight { 56 | height: calc(100% - 2.3rem); 57 | } 58 | 59 | @at-root { 60 | .utils__content > & { 61 | &:last-child { 62 | margin-bottom: 0; 63 | } 64 | } 65 | } 66 | } 67 | 68 | .card--example { 69 | border: 1px solid $gray-border !important; 70 | .card-header > h5 { 71 | margin-bottom: 0; 72 | } 73 | } 74 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/carousel.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* CAROUSEL */ 5 | 6 | .carousel-indicators { 7 | li { 8 | background: $gray-lighten; 9 | opacity: 0.5; 10 | &.active { 11 | opacity: 1; 12 | background: $gray-lighten; 13 | } 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/collapse.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* COLLAPSE */ 5 | 6 | .accordion { 7 | .card { 8 | border-radius: 0; 9 | margin-bottom: 0; 10 | border-bottom-width: 0; 11 | &:first-child { 12 | border-radius: 5px 5px 0 0; 13 | } 14 | &:last-child { 15 | border-radius: 0 0 5px 5px; 16 | border-bottom-width: 1px; 17 | } 18 | .card-header { 19 | cursor: pointer; 20 | .card-title { 21 | margin-bottom: 0; 22 | } 23 | &.collapsed { 24 | border: none; 25 | } 26 | } 27 | } 28 | &.accordion-margin-bottom { 29 | .card { 30 | border-radius: 5px; 31 | margin-bottom: rem(15); 32 | border-bottom-width: 1px; 33 | } 34 | } 35 | .accordion-indicator { 36 | padding-top: 1px; 37 | color: $gray-darken; 38 | .plus { 39 | display: none; 40 | } 41 | .minus { 42 | display: inline; 43 | } 44 | } 45 | .collapsed { 46 | .accordion-indicator { 47 | .plus { 48 | display: inline; 49 | } 50 | .minus { 51 | display: none; 52 | } 53 | } 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/forms.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* FORMS */ 5 | 6 | input::-webkit-input-placeholder { 7 | color: $gray-darken !important; 8 | } 9 | input::-moz-placeholder { 10 | color: $gray-darken !important; 11 | } 12 | input:-moz-placeholder { 13 | color: $gray-darken !important; 14 | } 15 | input:-ms-input-placeholder { 16 | color: $gray-darken !important; 17 | } 18 | 19 | .form-actions { 20 | border-top: 1px solid $gray-border; 21 | padding-top: rem(20); 22 | margin: rem(20) 0; 23 | } 24 | 25 | .form-control { 26 | font-family: $base__font-family; 27 | padding: rem(11) rem(16); 28 | border-color: $gray-border; 29 | color: $text; 30 | &.form-control-rounded { 31 | border-radius: 500px; 32 | } 33 | &:focus { 34 | border-color: $primary; 35 | } 36 | &.form-control-sm { 37 | padding: rem(7) rem(8); 38 | } 39 | } 40 | 41 | .col-form-label { 42 | padding-top: rem(9); 43 | padding-bottom: rem(9); 44 | } 45 | 46 | .form-control:disabled, 47 | .form-control[readonly] { 48 | background-color: $gray-lighten; 49 | } 50 | 51 | .input-group-addon { 52 | border-color: $gray-border; 53 | background-color: $gray-lighten; 54 | } 55 | 56 | span.input-group-addon { 57 | outline: none !important; 58 | } 59 | 60 | .form-group { 61 | &.has-danger { 62 | .form-control { 63 | border-color: $danger; 64 | } 65 | } 66 | &.has-success { 67 | .form-control { 68 | border-color: $success; 69 | } 70 | } 71 | &.has-warning { 72 | .form-control { 73 | border-color: $warning; 74 | } 75 | } 76 | &.has-focused { 77 | .form-control { 78 | border-color: $primary; 79 | } 80 | } 81 | } 82 | 83 | .form-input-icon { 84 | position: relative; 85 | > i { 86 | color: $gray-darken; 87 | position: absolute; 88 | margin: rem(13) rem(2) rem(4) rem(10); 89 | z-index: 3; 90 | width: rem(16); 91 | font-size: rem(16); 92 | text-align: center; 93 | left: 0; 94 | } 95 | .form-control { 96 | padding-left: rem(34); 97 | } 98 | &.form-input-icon-right { 99 | > i { 100 | left: auto; 101 | right: rem(3); 102 | margin: rem(13) rem(10) rem(4) rem(2); 103 | } 104 | .form-control { 105 | padding-left: rem(16); 106 | padding-right: rem(34); 107 | } 108 | } 109 | } 110 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/grid.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* GRID */ 5 | 6 | .row { 7 | margin-left: rem(-15); 8 | margin-right: rem(-15); 9 | } 10 | 11 | .col, 12 | .col-1, 13 | .col-10, 14 | .col-11, 15 | .col-12, 16 | .col-2, 17 | .col-3, 18 | .col-4, 19 | .col-5, 20 | .col-6, 21 | .col-7, 22 | .col-8, 23 | .col-9, 24 | .col-lg, 25 | .col-lg-1, 26 | .col-lg-10, 27 | .col-lg-11, 28 | .col-lg-12, 29 | .col-lg-2, 30 | .col-lg-3, 31 | .col-lg-4, 32 | .col-lg-5, 33 | .col-lg-6, 34 | .col-lg-7, 35 | .col-lg-8, 36 | .col-lg-9, 37 | .col-md, 38 | .col-md-1, 39 | .col-md-10, 40 | .col-md-11, 41 | .col-md-12, 42 | .col-md-2, 43 | .col-md-3, 44 | .col-md-4, 45 | .col-md-5, 46 | .col-md-6, 47 | .col-md-7, 48 | .col-md-8, 49 | .col-md-9, 50 | .col-sm, 51 | .col-sm-1, 52 | .col-sm-10, 53 | .col-sm-11, 54 | .col-sm-12, 55 | .col-sm-2, 56 | .col-sm-3, 57 | .col-sm-4, 58 | .col-sm-5, 59 | .col-sm-6, 60 | .col-sm-7, 61 | .col-sm-8, 62 | .col-sm-9, 63 | .col-xl, 64 | .col-xl-1, 65 | .col-xl-10, 66 | .col-xl-11, 67 | .col-xl-12, 68 | .col-xl-2, 69 | .col-xl-3, 70 | .col-xl-4, 71 | .col-xl-5, 72 | .col-xl-6, 73 | .col-xl-7, 74 | .col-xl-8, 75 | .col-xl-9 { 76 | padding-left: rem(15); 77 | padding-right: rem(15); 78 | } 79 | 80 | .container-fluid { 81 | padding-left: rem(15); 82 | padding-right: rem(15); 83 | } 84 | 85 | @media (max-width: $xxl-max-width) { 86 | .hidden-xxl-down { 87 | display: none; 88 | } 89 | } 90 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/modal.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* MODAL */ 5 | 6 | .modal { 7 | .modal-content { 8 | border: none; 9 | } 10 | .modal-header { 11 | .close { 12 | outline: none !important; 13 | width: 30px; 14 | height: 30px; 15 | display: inline-block; 16 | line-height: 30px; 17 | text-align: center; 18 | span { 19 | position: relative; 20 | top: 3px; 21 | } 22 | } 23 | } 24 | &.modal-size-small { 25 | .modal-dialog { 26 | max-width: 300px; 27 | width: auto; 28 | @media (max-width: $xs-max-width) { 29 | max-width: none; 30 | } 31 | } 32 | padding-left: 10px; 33 | padding-right: 10px; 34 | } 35 | &.modal-size-large { 36 | .modal-dialog { 37 | max-width: 980px; 38 | width: auto; 39 | } 40 | padding-left: 10px; 41 | padding-right: 10px; 42 | } 43 | } 44 | 45 | .modal-backdrop { 46 | background: $black; 47 | &.in { 48 | opacity: 0.3; 49 | } 50 | } 51 | 52 | .modal-body { 53 | padding: rem(20) rem(50); 54 | min-width: rem(900); 55 | 56 | @media (max-width: $md-max-width) { 57 | min-width: 0; 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/pagination.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* PAGINATION */ 5 | 6 | .pagination { 7 | .page-link { 8 | border-color: $gray-border; 9 | color: $text; 10 | outline: none; 11 | margin-bottom: rem(10); 12 | &:hover, 13 | &:focus { 14 | background: $default; 15 | color: $white; 16 | border-color: $default; 17 | } 18 | } 19 | .page-item { 20 | &.disabled { 21 | .page-link { 22 | background: $gray-lighten-more; 23 | } 24 | } 25 | &.active { 26 | .page-link { 27 | background: $primary; 28 | border-color: $primary; 29 | } 30 | } 31 | } 32 | } 33 | 34 | .pager { 35 | li > a { 36 | border-color: $gray-darken; 37 | color: $black-lighten-more; 38 | outline: none; 39 | border-radius: 3px; 40 | &:hover, 41 | &:focus { 42 | background: $default; 43 | color: $white; 44 | border-color: $default; 45 | } 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/popovers.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* TOOLTIPS & POPOVERS */ 5 | 6 | .popover { 7 | border-color: $gray; 8 | .popover-inner { 9 | border-width: rem(8); 10 | &:after { 11 | border-width: rem(7); 12 | } 13 | } 14 | &.left:before, 15 | &.bs-tether-element-attached-left:before { 16 | border-right-color: $gray; 17 | } 18 | &.right:before, 19 | &.bs-tether-element-attached-right:before { 20 | border-left-color: $gray; 21 | } 22 | &.top:before, 23 | &.bs-tether-element-attached-top:before { 24 | border-bottom-color: $gray; 25 | } 26 | &.bottom:before, 27 | &.bs-tether-element-attached-bottom:before { 28 | border-top-color: $gray; 29 | } 30 | .popover-title { 31 | font-weight: 600; 32 | background: $gray-lighten-more; 33 | margin: -1px; 34 | padding: rem(8) rem(15); 35 | border-radius: 3px 3px 0 0; 36 | } 37 | } 38 | 39 | .tooltip { 40 | .tooltip-inner { 41 | background: $black-lighten; 42 | padding: rem(4) rem(15); 43 | color: $white; 44 | font-size: rem(13); 45 | } 46 | &.left .tooltip-inner:before, 47 | &.bs-tether-element-attached-left .tooltip-inner:before { 48 | border-right-color: $black-lighten; 49 | } 50 | &.right .tooltip-inner:before, 51 | &.bs-tether-element-attached-right .tooltip-inner:before { 52 | border-left-color: $black-lighten; 53 | } 54 | &.top .tooltip-inner:before, 55 | &.bs-tether-element-attached-top .tooltip-inner:before { 56 | border-bottom-color: $black-lighten; 57 | } 58 | &.bottom .tooltip-inner:before, 59 | &.bs-tether-element-attached-bottom .tooltip-inner:before { 60 | border-top-color: $black-lighten; 61 | } 62 | } 63 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/selectboxes.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* SELECTBOXES */ 5 | 6 | select { 7 | appearance: none; 8 | } 9 | 10 | select.form-control { 11 | color: $text; 12 | height: auto; 13 | background: #fff center right no-repeat 14 | url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAFCAYAAABB9hwOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA25pVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpiNWZkMzNlMC0zNTcxLTI4NDgtYjA3NC01ZTRhN2RjMWVmNjEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODZDNDdFRTkxRTJBMTFFNjg0MUM5MTMwMjYwRDYwRDkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODZDNDdFRTgxRTJBMTFFNjg0MUM5MTMwMjYwRDYwRDkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RTUxRUI3MDZEQjk4MTFFNUI1NDA5QTcyNTlFQzRERTYiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RTUxRUI3MDdEQjk4MTFFNUI1NDA5QTcyNTlFQzRERTYiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz69wtu7AAAAe0lEQVR42mLce+zSOVFhYUMGNHDv4cOd/q6WHgxkAqbvP77H/P339zey4Nfv3z7ceXA/hoECwCQnLXPtw8eP05EFHz15WuRm7/CGIoNBhLCgUPnPX79egdgv37w+qKmqOp+BQsAEpX8wMTFm/fnz5/P/f//DGagAAAIMAKIuMR+q/rU9AAAAAElFTkSuQmCC'); 15 | } 16 | 17 | select.form-control[multiple] { 18 | background: #fff; 19 | } 20 | 21 | select.form-control:not([size]):not([multiple]) { 22 | height: auto; 23 | } 24 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/table.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* TABLE */ 5 | 6 | .table { 7 | width: 100% !important; 8 | 9 | thead { 10 | th { 11 | border-bottom: 1px solid $gray-border; 12 | outline: none !important; 13 | &:focus { 14 | background: $gray-border; 15 | } 16 | } 17 | } 18 | td, 19 | th { 20 | border-color: $gray-border; 21 | &:focus { 22 | background-color: $gray-border; 23 | } 24 | } 25 | tbody { 26 | tr:first-child { 27 | td { 28 | border-top: none; 29 | } 30 | } 31 | } 32 | &.table-hover { 33 | tbody { 34 | tr { 35 | &:hover { 36 | background: $gray-lighten-more; 37 | } 38 | } 39 | } 40 | } 41 | tr.active, 42 | th.active { 43 | background: $gray-lighten-more; 44 | } 45 | .thead-inverse { 46 | th { 47 | background: $black-lighten; 48 | } 49 | } 50 | .thead-default { 51 | th { 52 | background: $gray-lighten-more; 53 | } 54 | } 55 | 56 | &.table-striped { 57 | tbody tr:nth-of-type(odd) { 58 | background: $gray-lighten-more; 59 | } 60 | } 61 | 62 | &.table-vertical-middle { 63 | td, 64 | th { 65 | vertical-align: middle; 66 | } 67 | } 68 | } 69 | 70 | .table-inverse { 71 | color: $gray-darken; 72 | 73 | thead th { 74 | border-bottom-color: $black-lighten-more; 75 | color: $white; 76 | } 77 | th, 78 | td { 79 | border-top-color: $black-lighten-more; 80 | } 81 | th, 82 | td, 83 | thead th { 84 | background: $black-lighten; 85 | &:focus { 86 | background: $black-lighten; 87 | } 88 | } 89 | tr.active, 90 | th.active { 91 | background: $gray-lighten; 92 | } 93 | } 94 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/tabs.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* TABS */ 5 | 6 | .nav-tabs-horizontal { 7 | .nav-tabs { 8 | border-bottom: 1px solid $gray-border; 9 | .nav-item { 10 | margin-bottom: -2px; 11 | cursor: pointer; 12 | .nav-link { 13 | border: none; 14 | border-bottom: 3px solid transparent; 15 | &.active, 16 | &:focus { 17 | border-bottom-color: $primary !important; 18 | } 19 | &:hover { 20 | border-bottom-color: $gray-darken; 21 | } 22 | } 23 | } 24 | } 25 | } 26 | 27 | .nav-tabs-vertical { 28 | &:after { 29 | clear: both; 30 | content: ''; 31 | display: block; 32 | } 33 | .nav-tabs { 34 | border-bottom: none; 35 | border-right: 1px solid $gray-border; 36 | float: left; 37 | margin-right: 30px; 38 | display: block; 39 | .nav-item { 40 | margin: 0 -2px 1px 0; 41 | float: none; 42 | cursor: pointer; 43 | .nav-link { 44 | border: none; 45 | border-right: 3px solid transparent; 46 | padding-left: 0; 47 | border-radius: 0; 48 | &.active, 49 | &:focus { 50 | border-right-color: $primary !important; 51 | } 52 | &:hover { 53 | border-right-color: $gray-darken; 54 | } 55 | } 56 | } 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/typography.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* TYPOGRAPHY */ 5 | 6 | .mark, 7 | mark { 8 | background: $orange; 9 | color: $white; 10 | } 11 | 12 | .blockquote { 13 | background: $gray-lighten-more; 14 | padding: 30px; 15 | border-left: 3px solid $gray; 16 | font-size: rem(15); 17 | 18 | &-reverse { 19 | text-align: right; 20 | border-left: none; 21 | border-right: 3px solid $gray; 22 | } 23 | &-footer { 24 | margin-top: rem(20); 25 | color: $gray-darken; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /src/assets/styles/Bootstrap/import/utilities.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* UTILITIES */ 5 | 6 | // font color 7 | .text { 8 | &-muted { 9 | color: $text-lighten !important; 10 | } 11 | &-primary { 12 | color: $primary; 13 | } 14 | &-success { 15 | color: $success; 16 | } 17 | &-info { 18 | color: $info; 19 | } 20 | &-warning { 21 | color: $warning; 22 | } 23 | &-danger { 24 | color: $danger; 25 | } 26 | &-default { 27 | color: $default; 28 | } 29 | &-black { 30 | color: $black; 31 | } 32 | } 33 | 34 | // background color 35 | .bg { 36 | &-primary { 37 | background-color: $primary !important; 38 | } 39 | &-success { 40 | background-color: $success !important; 41 | } 42 | &-info { 43 | background-color: $info !important; 44 | } 45 | &-warning { 46 | background-color: $warning !important; 47 | } 48 | &-danger { 49 | background-color: $danger !important; 50 | } 51 | &-inverse { 52 | background-color: $black-lighten !important; 53 | } 54 | &-faded { 55 | background-color: $gray-lighten-more !important; 56 | } 57 | 58 | &-white { 59 | background-color: $white !important; 60 | } 61 | &-default { 62 | background-color: $default !important; 63 | } 64 | } 65 | 66 | // progress bars 67 | .progress { 68 | background: $gray-lighten-more; 69 | &-bar { 70 | height: rem(18); 71 | } 72 | } 73 | -------------------------------------------------------------------------------- /src/assets/styles/CleanUI/cleanui.scss: -------------------------------------------------------------------------------- 1 | @import 'import/core.scss'; 2 | @import 'import/utils.scss'; 3 | @import 'import/measurements.scss'; 4 | @import 'import/settings.scss'; 5 | -------------------------------------------------------------------------------- /src/assets/styles/CleanUI/import/core.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* CORE MODULE STYLES */ 5 | 6 | html { 7 | font-size: 13px; 8 | overflow-y: scroll; 9 | @media (max-width: $sm-max-width) { 10 | font-size: 12px; 11 | } 12 | } 13 | 14 | body { 15 | font-family: $base__font-family; 16 | color: $text-darken-more; 17 | background: $gray-lighten-more; 18 | line-height: 1.7; 19 | @media (max-width: $sm-max-width) { 20 | font-size: 12px; 21 | } 22 | } 23 | 24 | svg { 25 | vertical-align: baseline; 26 | overflow: auto; 27 | } 28 | 29 | a { 30 | text-decoration: none; 31 | color: $text; 32 | @include transition-color(); 33 | &:hover, 34 | &:active, 35 | &:focus { 36 | color: $blue; 37 | text-decoration: none; 38 | } 39 | } 40 | 41 | input { 42 | outline: none !important; 43 | font-family: $base__font-family; 44 | color: $text-darken-more; 45 | } 46 | 47 | button, 48 | input { 49 | box-shadow: none !important; 50 | } 51 | 52 | input[type='text'], 53 | input[type='password'], 54 | input[type='email'], 55 | textarea { 56 | appearance: none !important; 57 | } 58 | 59 | input:-webkit-autofill { 60 | box-shadow: 0 0 0 50px white inset !important; 61 | } 62 | 63 | label { 64 | display: inline-block; 65 | margin-bottom: 0; 66 | } 67 | 68 | // code element 69 | code { 70 | color: $text; 71 | background: $gray-lighten-more; 72 | display: inline-block; 73 | padding: rem(2) rem(5); 74 | border-radius: 3px; 75 | } 76 | 77 | // pre element 78 | pre { 79 | color: $text; 80 | padding: rem(20); 81 | border-radius: 3px; 82 | border: 1px solid $gray-border; 83 | background: $gray-lighten-more; 84 | } 85 | 86 | // ant design font overrides 87 | button, 88 | input, 89 | select, 90 | textarea { 91 | font-family: inherit; 92 | } 93 | -------------------------------------------------------------------------------- /src/assets/styles/CleanUI/import/settings.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* THEME SETTINGS STYLES */ 5 | 6 | .settings { 7 | &__fixedWidth { 8 | max-width: 1420px; 9 | margin: 0 auto; 10 | 11 | &:not(.settings__menuTop) { 12 | .utils__content { 13 | padding-right: 0; 14 | } 15 | 16 | div[class^='style-module__inner'] { 17 | margin-right: 0; 18 | } 19 | 20 | @media (max-width: 1445px) { 21 | .utils__content { 22 | padding-right: rem(30); 23 | } 24 | 25 | div[class^='style-module__inner'] { 26 | margin-right: rem(30); 27 | } 28 | } 29 | } 30 | 31 | &.settings__menuTop { 32 | .utils__content { 33 | padding-left: 0; 34 | padding-right: 0; 35 | } 36 | 37 | div[class^='style-module__inner'] { 38 | margin: 0; 39 | } 40 | 41 | @media (max-width: 1445px) { 42 | .utils__content { 43 | padding-left: rem(30); 44 | padding-right: rem(30); 45 | } 46 | 47 | div[class^='style-module__inner'] { 48 | margin: 0 rem(30); 49 | } 50 | } 51 | } 52 | } 53 | 54 | &__squaredBorders { 55 | .card { 56 | border-radius: 0; 57 | } 58 | } 59 | 60 | &__menuShadow { 61 | .ant-layout-sider { 62 | position: relative; 63 | z-index: 1; 64 | box-shadow: 0 0 200px -20px rgba(57, 55, 73, 0.4); 65 | } 66 | } 67 | 68 | &__borderLess { 69 | .card { 70 | border: none; 71 | } 72 | 73 | .card-header { 74 | padding-top: rem(20); 75 | padding-bottom: 0; 76 | border-bottom: 0; 77 | } 78 | 79 | .card-footer { 80 | padding-top: 0; 81 | border-top: 0; 82 | } 83 | 84 | .utils__title { 85 | text-transform: uppercase; 86 | font-size: rem(16); 87 | } 88 | } 89 | } 90 | -------------------------------------------------------------------------------- /src/assets/styles/CleanUI/import/utils.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* CORE COMPONENTS & UTILITIES */ 5 | 6 | .utils { 7 | &__visibilityHidden { 8 | position: absolute; 9 | width: 1px; 10 | height: 1px; 11 | margin: -1px; 12 | padding: 0; 13 | overflow: hidden; 14 | white-space: nowrap; 15 | border: 0; 16 | clip: rect(0 0 0 0); 17 | clip-path: inset(100%); 18 | } 19 | 20 | // main container 21 | &__content { 22 | padding: rem(30); 23 | max-width: rem(1560); 24 | margin: 0 auto; 25 | 26 | @media (max-width: $sm-max-width) { 27 | padding: rem(30) rem(10) !important; 28 | overflow-x: hidden; 29 | } 30 | } 31 | 32 | &__title { 33 | font-size: rem(17); 34 | color: $black; 35 | } 36 | 37 | &__titleDescription { 38 | color: $text-lighten; 39 | } 40 | 41 | // scrollable block 42 | &__scrollable { 43 | overflow: auto; 44 | } 45 | 46 | // example block 47 | &__example { 48 | padding: rem(25); 49 | border: 1px solid $gray-border; 50 | &:before { 51 | content: 'EXAMPLE'; 52 | display: block; 53 | margin-bottom: rem(15); 54 | color: $text; 55 | } 56 | } 57 | 58 | // links 59 | &__link { 60 | &--underlined { 61 | border-bottom: 1px solid rgba($black-lighten-more, 0.25); 62 | &:hover { 63 | border-bottom-color: rgba($blue, 0.2); 64 | } 65 | } 66 | &--blue { 67 | color: $blue; 68 | &:hover { 69 | color: $blue-darken; 70 | } 71 | &.link-underlined { 72 | border-bottom: 1px solid rgba($blue, 0.25); 73 | &:hover { 74 | border-bottom-color: rgba($blue, 0.2); 75 | } 76 | } 77 | } 78 | } 79 | 80 | // icons block 81 | &__iconsBlock { 82 | padding: 0 0 rem(30); 83 | text-align: center; 84 | p { 85 | height: rem(30); 86 | } 87 | li { 88 | text-align: center; 89 | display: inline-block; 90 | width: rem(40); 91 | height: rem(40); 92 | line-height: rem(40); 93 | font-size: rem(36); 94 | padding: rem(10) rem(30); 95 | box-sizing: content-box; 96 | border-radius: 3px; 97 | background: $gray-lighten; 98 | margin: rem(10); 99 | &:hover { 100 | background: $black-lighten; 101 | color: $white; 102 | } 103 | } 104 | .tooltip { 105 | font-size: rem(18); 106 | } 107 | } 108 | 109 | &__scrollTable { 110 | white-space: nowrap !important; 111 | .ant-table-body { 112 | overflow-x: auto !important; 113 | } 114 | } 115 | } 116 | -------------------------------------------------------------------------------- /src/assets/styles/Nprogress/nprogress.cleanui.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* NPROGRESS */ 5 | 6 | #nprogress { 7 | pointer-events: none; 8 | } 9 | 10 | #nprogress .bar { 11 | height: 3px; 12 | background: $primary; 13 | 14 | position: fixed; 15 | z-index: 1031; 16 | top: 0; 17 | left: 0; 18 | 19 | width: 100%; 20 | } 21 | 22 | /* Fancy blur effect */ 23 | #nprogress .peg { 24 | display: block; 25 | position: absolute; 26 | right: 0; 27 | width: 100px; 28 | height: 100%; 29 | box-shadow: 0 0 10px #29d, 0 0 5px #29d; 30 | opacity: 1; 31 | 32 | -webkit-transform: rotate(3deg) translate(0, -4px); 33 | -ms-transform: rotate(3deg) translate(0, -4px); 34 | transform: rotate(3deg) translate(0, -4px); 35 | } 36 | 37 | #nprogress .spinner { 38 | display: block; 39 | position: fixed; 40 | z-index: 1031; 41 | 42 | width: rem(140); 43 | padding: rem(8) rem(15); 44 | background: $white; 45 | border-radius: 4px; 46 | border: 1px solid $gray-border; 47 | right: auto; 48 | left: 50%; 49 | top: rem(13); 50 | margin-left: rem(-73); 51 | &:after { 52 | content: 'Loading...'; 53 | display: inline-block; 54 | position: absolute; 55 | top: rem(7); 56 | left: rem(48); 57 | } 58 | } 59 | 60 | #nprogress .spinner-icon { 61 | width: 18px; 62 | height: 18px; 63 | box-sizing: border-box; 64 | 65 | border: solid 2px transparent; 66 | border-top-color: $primary; 67 | border-left-color: $primary; 68 | border-radius: 50%; 69 | 70 | -webkit-animation: nprogress-spinner 400ms linear infinite; 71 | animation: nprogress-spinner 400ms linear infinite; 72 | } 73 | 74 | .nprogress-custom-parent { 75 | overflow: hidden; 76 | position: relative; 77 | } 78 | 79 | .nprogress-custom-parent #nprogress .spinner, 80 | .nprogress-custom-parent #nprogress .bar { 81 | position: absolute; 82 | } 83 | 84 | @-webkit-keyframes nprogress-spinner { 85 | 0% { 86 | -webkit-transform: rotate(0deg); 87 | } 88 | 100% { 89 | -webkit-transform: rotate(360deg); 90 | } 91 | } 92 | @keyframes nprogress-spinner { 93 | 0% { 94 | transform: rotate(0deg); 95 | } 96 | 100% { 97 | transform: rotate(360deg); 98 | } 99 | } 100 | -------------------------------------------------------------------------------- /src/assets/styles/Rcdrawer/rcdrawer.cleanui.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | ///////////////////////////////////////////////////////////////////////////////////////// 4 | /* RCDRAWER */ 5 | 6 | .drawer-handle { 7 | background: $menuBg !important; 8 | top: 104px; 9 | } 10 | 11 | .drawer.drawer-open .drawer-handle-icon { 12 | background: transparent !important; 13 | } 14 | 15 | .drawer-handle-icon { 16 | background: $white !important; 17 | &:after, 18 | &:before { 19 | background: $white !important; 20 | } 21 | } 22 | 23 | .drawer { 24 | .drawer-content { 25 | overflow: visible; 26 | background: $menuBg; 27 | transition: background 0.3s; 28 | } 29 | 30 | &.drawer-light { 31 | .drawer-content { 32 | background: $white; 33 | } 34 | } 35 | } 36 | 37 | .drawer-content-wrapper { 38 | box-shadow: none !important; 39 | } 40 | -------------------------------------------------------------------------------- /src/assets/styles/mixins.scss: -------------------------------------------------------------------------------- 1 | // Colors 2 | $white: #fff; 3 | 4 | $text: #74708d; 5 | $text-lighten: #c0bdd0; 6 | $text-darken: #615d7c; 7 | $text-darken-more: #514d6a; 8 | 9 | $gray: #d2d9e5; 10 | $gray-lighten: #eef0f4; 11 | $gray-lighten-more: #f2f4f8; 12 | $gray-lighten-more-more: #f9fafc; 13 | $gray-darken: #b8beca; 14 | $gray-border: #e4e9f0; 15 | 16 | $black: #0e0b20; 17 | $black-lighten: #222034; 18 | $black-lighten-more: #393749; 19 | 20 | $blue: #08f; 21 | $blue-darken: #0072d6; 22 | $orange: #f2a654; 23 | $yellow: yellow; 24 | 25 | $menuBg: #001529; 26 | $menuBg-darken: #000c17; 27 | 28 | // Accent colors 29 | $default: #acb7bf; 30 | $primary: #0190fe; 31 | $secondary: #6a7a84; 32 | $success: #46be8a; 33 | $info: #0887c9; 34 | $warning: #f39834; 35 | $danger: #fb434a; 36 | 37 | // Font Family 38 | $base__font-family: 'Nunito Sans', sans-serif !important; 39 | 40 | // Font Size 41 | $base__font-size: 13 !default; 42 | 43 | // Convert value rem() sass mixin 44 | @function rem($px, $base: $base__font-size) { 45 | @return #{floor(($px/$base) * 100) / 100}rem; // to REMs 46 | // comment code above and uncomment below for change REMs to PXs 47 | //@return #{$px}px; 48 | } 49 | 50 | // Transitions 51 | @mixin transition-fast() { 52 | transition: all 0.05s ease-in-out; 53 | } 54 | @mixin transition-middle() { 55 | transition: all 0.1s ease-in-out; 56 | } 57 | @mixin transition-slow() { 58 | transition: all 0.2s ease-in-out; 59 | } 60 | @mixin transition-very-slow() { 61 | transition: all 0.4s ease-in-out; 62 | } 63 | @mixin transition-color() { 64 | transition: color 0.2s ease-in-out; 65 | } 66 | 67 | // Responsive utils 68 | $xxl-min-width: 1600px; 69 | $xxl-max-width: 1599px; 70 | $xl-min-width: 1200px; 71 | $xl-max-width: 1199px; 72 | $md-min-width: 992px; 73 | $md-max-width: 991px; 74 | $sm-min-width: 768px; 75 | $sm-max-width: 767px; 76 | $xs-min-width: 576px; 77 | $xs-max-width: 575px; 78 | -------------------------------------------------------------------------------- /src/components/CleanUIComponents/Avatar/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import style from './style.module.scss' 3 | 4 | class Avatar extends React.Component { 5 | static defaultProps = { 6 | size: false, 7 | border: false, 8 | borderColor: '#d2d9e5', 9 | src: '', 10 | } 11 | 12 | render() { 13 | const { size, borderColor, src, border } = this.props 14 | return ( 15 | 24 | User 25 | 26 | ) 27 | } 28 | } 29 | 30 | export default Avatar 31 | -------------------------------------------------------------------------------- /src/components/CleanUIComponents/Avatar/style.module.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | .avatar { 4 | width: rem(35); 5 | height: rem(35); 6 | background-color: $gray-lighten; 7 | border-color: $gray-darken; 8 | display: inline-block; 9 | overflow: hidden; 10 | border-radius: 50%; 11 | 12 | img { 13 | width: 100%; 14 | max-width: 100%; 15 | height: auto; 16 | } 17 | } 18 | 19 | .size20 { 20 | width: rem(20); 21 | height: rem(20); 22 | } 23 | 24 | .size25 { 25 | width: rem(25); 26 | height: rem(25); 27 | } 28 | 29 | .size50 { 30 | width: rem(50); 31 | height: rem(50); 32 | } 33 | 34 | .size70 { 35 | width: rem(70); 36 | height: rem(70); 37 | } 38 | 39 | .size90 { 40 | width: rem(90); 41 | height: rem(90); 42 | } 43 | 44 | .size110 { 45 | width: rem(110); 46 | height: rem(110); 47 | } 48 | 49 | .border { 50 | border: 4px solid $gray; 51 | } 52 | -------------------------------------------------------------------------------- /src/components/CleanUIComponents/ChartCard/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Sparkline from '@rowno/sparkline' 3 | import style from './style.module.scss' 4 | 5 | class ChartCard extends React.Component { 6 | static defaultProps = { 7 | chartProps: {}, 8 | title: '', 9 | amount: '', 10 | } 11 | 12 | render() { 13 | const { chartProps, title, amount } = this.props 14 | return ( 15 |
16 | {chartProps && ( 17 |
18 | 19 |
20 | )} 21 | {amount &&
{amount}
} 22 | {title &&
{title}
} 23 |
24 | ) 25 | } 26 | } 27 | 28 | export default ChartCard 29 | -------------------------------------------------------------------------------- /src/components/CleanUIComponents/ChartCard/style.module.scss: -------------------------------------------------------------------------------- 1 | @import 'assets/styles/mixins.scss'; 2 | 3 | .card { 4 | padding: rem(15) rem(30) rem(20); 5 | position: relative; 6 | overflow: hidden; 7 | } 8 | 9 | .chart { 10 | height: 100%; 11 | width: 120px; 12 | position: absolute; 13 | top: 0; 14 | right: 0; 15 | } 16 | 17 | .amount { 18 | font-size: rem(36); 19 | color: $black; 20 | margin-bottom: rem(-10); 21 | } 22 | 23 | .title { 24 | color: $text; 25 | text-transform: uppercase; 26 | font-weight: bold; 27 | } 28 | -------------------------------------------------------------------------------- /src/components/CleanUIComponents/Chat/data.json: -------------------------------------------------------------------------------- 1 | { 2 | "chats": [{ 3 | "username": "Chris Evans", 4 | "content": "Hello World!", 5 | "img": "resources/images/avatars/1.jpg" 6 | }, { 7 | "username": "Diana May", 8 | "content": "Love it!", 9 | "img": "resources/images/avatars/2.jpg" 10 | }, { 11 | "username": "Chris Evans", 12 | "img": "resources/images/avatars/1.jpg", 13 | "content": "Lorem ipsum dolor sit amet, nibh ipsum. Cum class sem inceptos incidunt sed sed. Tempus wisi enim id, arcu sed lectus aliquam, nulla vitae est bibendum molestie elit risus." 14 | }, { 15 | "username": "Chris Evans", 16 | "content": "So", 17 | "img": "resources/images/avatars/1.jpg" 18 | }, { 19 | "username": "Chris Evans", 20 | "content": "Chilltime is going to be an app for you to view videos with friends", 21 | "img": "resources/images/avatars/1.jpg" 22 | }, { 23 | "username": "Chris Evans", 24 | "content": "You can sign-up now to try out our private beta!", 25 | "img": "resources/images/avatars/1.jpg" 26 | }, { 27 | "username": "Diana May", 28 | "content": "Definitely! Sounds great!", 29 | "img": "resources/images/avatars/2.jpg" 30 | }] 31 | } 32 | -------------------------------------------------------------------------------- /src/components/CleanUIComponents/Chat/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { chats } from './data.json' 3 | import Avatar from '../Avatar' 4 | 5 | import style from './style.module.scss' 6 | 7 | const Message = ({ chat, user }) => ( 8 |
9 |
10 | 11 |
12 |
13 | {chat.username} 14 |

{chat.content}

15 |
16 |
17 | ) 18 | 19 | class Chat extends React.Component { 20 | state = { 21 | username: 'Chris Evans', 22 | } 23 | 24 | render() { 25 | const { username } = this.state 26 | return ( 27 |
28 |
29 |
30 | {chats.map(chat => ( 31 | 32 | ))} 33 |
34 |
35 |
36 |