Merge pull request #4 from Kitzanos/release/25-09-2024

Release/25 09 2024
This commit is contained in:
Vitalii Kiiko
2024-09-25 16:32:47 +02:00
committed by GitHub
238 changed files with 21848 additions and 155 deletions

View File

@@ -7,6 +7,7 @@
"domain": "gepafin"
}
],
"@babel/plugin-syntax-jsx"
"@babel/plugin-syntax-jsx",
"@babel/plugin-proposal-private-property-in-object"
]
}

2
.env
View File

@@ -1,3 +1,3 @@
REACT_APP_TAB_TITLE=Gepafin
REACT_APP_API_EXECUTION_ADDRESS=
REACT_APP_API_EXECUTION_ADDRESS=https://api-dev-gepafin.memento.credit/v1
REACT_APP_LOGO_FILENAME=logo.svg

4
.idea/watcherTasks.xml generated Normal file
View File

@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectTasksOptions" suppressed-tasks="SCSS" />
</project>

View File

@@ -1,16 +0,0 @@
{
"locales": [
"en",
"it"
],
"sourceLocale": "it",
"catalogs": [
{
"path": "src/locales/{locale}/messages",
"include": [
"src"
]
}
],
"format": "po"
}

2
.npmrc
View File

@@ -1,2 +0,0 @@
@sinossi:registry=https://git.sinossi.it/api/v4/projects/271/packages/npm/
//git.sinossi.it/api/v4/projects/271/packages/npm/:_authToken=kdP6WxGtg71-MzJZDRe9

View File

@@ -1,2 +1,7 @@
# GEPAFIN-FE
Gepafin Front End
## Commands
`npm run start` - start development server
`npm run build:dev` - make build based on 'dev' env variables
`npm run build:prod` - make build based on 'prod' env variables

13
buildspec.dev.yml Normal file
View File

@@ -0,0 +1,13 @@
version: 0.2
phases:
install:
runtime-versions:
nodejs: 20
build:
commands:
- npm install && npm run build:dev
artifacts:
files:
- '**/*'
base-directory: 'build'

View File

@@ -3,22 +3,10 @@ version: 0.2
phases:
install:
runtime-versions:
nodejs: 18
commands:
- npm install -g yarn
- echo yarn -v
- yarn -v
pre_build:
commands:
- echo "@sinossi:registry=https://git.sinossi.it/api/v4/projects/271/packages/npm/" > .npmrc
- echo "//git.sinossi.it/api/v4/projects/271/packages/npm/:_authToken=kdP6WxGtg71-MzJZDRe9" >> .npmrc
- yarn install
nodejs: 20
build:
commands:
- yarn extract
- yarn compile
- mkdir -pv public/loaded-files
- yarn build:prod
- npm install && npm run build:prod
artifacts:
files:
- '**/*'

View File

@@ -1,25 +0,0 @@
version: 0.2
phases:
install:
runtime-versions:
nodejs: 18
commands:
- npm install -g yarn
- echo yarn -v
- yarn -v
pre_build:
commands:
- echo "@sinossi:registry=https://git.sinossi.it/api/v4/projects/271/packages/npm/" > .npmrc
- echo "//git.sinossi.it/api/v4/projects/271/packages/npm/:_authToken=kdP6WxGtg71-MzJZDRe9" >> .npmrc
- yarn install
build:
commands:
- yarn extract
- yarn compile
- mkdir -pv public/loaded-files
- yarn build:staging
artifacts:
files:
- '**/*'
base-directory: 'build'

View File

@@ -1,3 +1,3 @@
REACT_APP_TAB_TITLE=Gepafin
REACT_APP_API_EXECUTION_ADDRESS=
REACT_APP_API_EXECUTION_ADDRESS=https://api-dev-gepafin.memento.credit/v1
REACT_APP_LOGO_FILENAME=logo.svg

View File

@@ -1,3 +1,3 @@
REACT_APP_TAB_TITLE=Gepafin
REACT_APP_API_EXECUTION_ADDRESS=
REACT_APP_API_EXECUTION_ADDRESS=http://79.137.88.15/v1
REACT_APP_LOGO_FILENAME=logo.svg

View File

@@ -1,3 +0,0 @@
REACT_APP_TAB_TITLE=Gepafin
REACT_APP_API_EXECUTION_ADDRESS=
REACT_APP_LOGO_FILENAME=logo.svg

477
package-lock.json generated
View File

@@ -8,32 +8,45 @@
"name": "bflows-gepafin",
"version": "1.0.0",
"dependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@babel/preset-react": "^7.24.7",
"@date-fns/tz": "^1.0.2",
"@emotion/react": "11.13.0",
"@emotion/styled": "11.13.0",
"@wordpress/i18n": "^5.5.0",
"@wordpress/react-i18n": "^4.5.0",
"@xyflow/react": "^12.2.0",
"codice-fiscale-js": "^2.3.22",
"deep-object-diff": "^1.1.9",
"dompurify": "3.1.6",
"fast-deep-equal": "^3.1.3",
"html-react-parser": "5.1.12",
"jwt-decode": "4.0.0",
"klona": "2.0.6",
"luxon": "3.5.0",
"primeicons": "^7.0.0",
"primereact": "^10.8.2",
"quill": "^2.0.2",
"ramda": "0.30.1",
"react": "18.3.1",
"react-dnd": "^16.0.1",
"react-dnd-html5-backend": "^16.0.1",
"react-dom": "18.3.1",
"react-hook-form": "7.52.2",
"react-router-dom": "6.26.0",
"react-scripts": "^5.0.1",
"validate.js": "^0.13.1",
"zustand": "4.5.4",
"zustand-x": "3.0.4"
},
"devDependencies": {
"@babel/cli": "7.24.8",
"@babel/core": "7.25.2",
"@babel/plugin-syntax-jsx": "^7.24.7",
"@wordpress/babel-plugin-makepot": "^6.5.0",
"@babel/plugin-syntax-jsx": "7.24.7",
"@wordpress/babel-plugin-makepot": "6.5.0",
"babel-plugin-macros": "3.1.0",
"sass": "1.77.8"
"sass": "1.77.8",
"sass-loader": "16.0.0"
}
},
"node_modules/@alloc/quick-lru": {
@@ -630,9 +643,16 @@
}
},
"node_modules/@babel/plugin-proposal-private-property-in-object": {
"version": "7.21.0-placeholder-for-preset-env.2",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz",
"integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==",
"version": "7.21.11",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.11.tgz",
"integrity": "sha512-0QZ8qP/3RLDVBwBFoWAwCtgcDZJVwA5LUJRZU8x2YFfKNuFq161wK3cuGrALu5yiPu+vzwTAg/sMWVNeWeNyaw==",
"deprecated": "This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-property-in-object instead.",
"dependencies": {
"@babel/helper-annotate-as-pure": "^7.18.6",
"@babel/helper-create-class-features-plugin": "^7.21.0",
"@babel/helper-plugin-utils": "^7.20.2",
"@babel/plugin-syntax-private-property-in-object": "^7.14.5"
},
"engines": {
"node": ">=6.9.0"
},
@@ -1883,6 +1903,17 @@
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/preset-env/node_modules/@babel/plugin-proposal-private-property-in-object": {
"version": "7.21.0-placeholder-for-preset-env.2",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz",
"integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==",
"engines": {
"node": ">=6.9.0"
},
"peerDependencies": {
"@babel/core": "^7.0.0-0"
}
},
"node_modules/@babel/preset-modules": {
"version": "0.1.6-no-external-plugins",
"resolved": "https://registry.npmjs.org/@babel/preset-modules/-/preset-modules-0.1.6-no-external-plugins.tgz",
@@ -2267,6 +2298,11 @@
"postcss-selector-parser": "^6.0.10"
}
},
"node_modules/@date-fns/tz": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@date-fns/tz/-/tz-1.0.2.tgz",
"integrity": "sha512-iKxj0kXMy7Qe6vjK+flz33cpy2j0dnTKT5i54p3fFlB411J47aSs6HBg7LOO5X9LjDi2iNlctD9rFn738ySOGQ=="
},
"node_modules/@emotion/babel-plugin": {
"version": "11.12.0",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz",
@@ -3462,6 +3498,21 @@
"node": ">= 8"
}
},
"node_modules/@react-dnd/asap": {
"version": "5.0.2",
"resolved": "https://registry.npmjs.org/@react-dnd/asap/-/asap-5.0.2.tgz",
"integrity": "sha512-WLyfoHvxhs0V9U+GTsGilGgf2QsPl6ZZ44fnv0/b8T3nQyvzxidxsg/ZltbWssbsRDlYW8UKSQMTGotuTotZ6A=="
},
"node_modules/@react-dnd/invariant": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/@react-dnd/invariant/-/invariant-4.0.2.tgz",
"integrity": "sha512-xKCTqAK/FFauOM9Ta2pswIyT3D8AQlfrYdOi/toTPEhqCuAs1v5tcJ3Y08Izh1cJ5Jchwy9SeAXmMg6zrKs2iw=="
},
"node_modules/@react-dnd/shallowequal": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
"integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA=="
},
"node_modules/@remix-run/router": {
"version": "1.19.0",
"resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.19.0.tgz",
@@ -3902,6 +3953,49 @@
"@types/node": "*"
}
},
"node_modules/@types/d3-color": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
"integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A=="
},
"node_modules/@types/d3-drag": {
"version": "3.0.7",
"resolved": "https://registry.npmjs.org/@types/d3-drag/-/d3-drag-3.0.7.tgz",
"integrity": "sha512-HE3jVKlzU9AaMazNufooRJ5ZpWmLIoc90A37WU2JMmeq28w1FQqCZswHZ3xR+SuxYftzHq6WU6KJHvqxKzTxxQ==",
"dependencies": {
"@types/d3-selection": "*"
}
},
"node_modules/@types/d3-interpolate": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-3.0.4.tgz",
"integrity": "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==",
"dependencies": {
"@types/d3-color": "*"
}
},
"node_modules/@types/d3-selection": {
"version": "3.0.10",
"resolved": "https://registry.npmjs.org/@types/d3-selection/-/d3-selection-3.0.10.tgz",
"integrity": "sha512-cuHoUgS/V3hLdjJOLTT691+G2QoqAjCVLmr4kJXR4ha56w1Zdu8UUQ5TxLRqudgNjwXeQxKMq4j+lyf9sWuslg=="
},
"node_modules/@types/d3-transition": {
"version": "3.0.8",
"resolved": "https://registry.npmjs.org/@types/d3-transition/-/d3-transition-3.0.8.tgz",
"integrity": "sha512-ew63aJfQ/ms7QQ4X7pk5NxQ9fZH/z+i24ZfJ6tJSfqxJMrYLiK01EAs2/Rtw/JreGUsS3pLPNV644qXFGnoZNQ==",
"dependencies": {
"@types/d3-selection": "*"
}
},
"node_modules/@types/d3-zoom": {
"version": "3.0.8",
"resolved": "https://registry.npmjs.org/@types/d3-zoom/-/d3-zoom-3.0.8.tgz",
"integrity": "sha512-iqMC4/YlFCSlO8+2Ii1GGGliCAY4XdeG748w5vQUbevlbDu0zSjH/+jojorQVBK/se0j6DUFNPBGSqD3YWYnDw==",
"dependencies": {
"@types/d3-interpolate": "*",
"@types/d3-selection": "*"
}
},
"node_modules/@types/eslint": {
"version": "8.56.11",
"resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.11.tgz",
@@ -4072,6 +4166,14 @@
"@types/react": "*"
}
},
"node_modules/@types/react-transition-group": {
"version": "4.4.10",
"resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.10.tgz",
"integrity": "sha512-hT/+s0VQs2ojCX823m60m5f0sL5idt9SO6Tj6Dg+rdphGPIeJbJ6CxvBYkgkGKrYeDjvIpKTR38UzmtHJOGW3Q==",
"dependencies": {
"@types/react": "*"
}
},
"node_modules/@types/resolve": {
"version": "1.17.1",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz",
@@ -4654,6 +4756,34 @@
"resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
"integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ=="
},
"node_modules/@xyflow/react": {
"version": "12.2.0",
"resolved": "https://registry.npmjs.org/@xyflow/react/-/react-12.2.0.tgz",
"integrity": "sha512-aQ1636zCfTey+k2d4xxkQrfwMWe0uazIJoKUXyCoVTX+KH5/ep9wxr7yGlSW4s1XIGzmP3f+qUwTk0GvxvP0Rg==",
"dependencies": {
"@xyflow/system": "0.0.40",
"classcat": "^5.0.3",
"zustand": "^4.4.0"
},
"peerDependencies": {
"react": ">=17",
"react-dom": ">=17"
}
},
"node_modules/@xyflow/system": {
"version": "0.0.40",
"resolved": "https://registry.npmjs.org/@xyflow/system/-/system-0.0.40.tgz",
"integrity": "sha512-pS4m6J+Q+kUoUV73rKMfGPm+FOA9OajHyADrTlTE6VaG4/vMV2gHS/ZMVZb295jkY/ZpZkpQZKp1sRm0m31Jpw==",
"dependencies": {
"@types/d3-drag": "^3.0.7",
"@types/d3-selection": "^3.0.10",
"@types/d3-transition": "^3.0.8",
"@types/d3-zoom": "^3.0.8",
"d3-drag": "^3.0.0",
"d3-selection": "^3.0.0",
"d3-zoom": "^3.0.0"
}
},
"node_modules/abab": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
@@ -5884,6 +6014,11 @@
"resolved": "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.3.1.tgz",
"integrity": "sha512-a3KdPAANPbNE4ZUv9h6LckSl9zLsYOP4MBmhIPkRaeyybt+r4UghLvq+xw/YwUcC1gqylCkL4rdVs3Lwupjm4Q=="
},
"node_modules/classcat": {
"version": "5.0.5",
"resolved": "https://registry.npmjs.org/classcat/-/classcat-5.0.5.tgz",
"integrity": "sha512-JhZUT7JFcQy/EzW605k/ktHtncoo9vnyW/2GspNYwFlN1C/WmjuV/xtS04e9SOkL2sTdw0VAZ2UGCcQ9lR6p6w=="
},
"node_modules/clean-css": {
"version": "5.3.3",
"resolved": "https://registry.npmjs.org/clean-css/-/clean-css-5.3.3.tgz",
@@ -5935,6 +6070,11 @@
"node": ">= 4.0"
}
},
"node_modules/codice-fiscale-js": {
"version": "2.3.22",
"resolved": "https://registry.npmjs.org/codice-fiscale-js/-/codice-fiscale-js-2.3.22.tgz",
"integrity": "sha512-at+XQ3kTgIq0qMoBmP4UtrSlYvHp5X5KGEB0ZKykydMnYC28zBAbdbFDu7CsatlfoOa1vH4qBpNkOCXp/YqMmA=="
},
"node_modules/collect-v8-coverage": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/collect-v8-coverage/-/collect-v8-coverage-1.0.2.tgz",
@@ -6589,6 +6729,102 @@
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
},
"node_modules/d3-color": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
"integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
"engines": {
"node": ">=12"
}
},
"node_modules/d3-dispatch": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-3.0.1.tgz",
"integrity": "sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==",
"engines": {
"node": ">=12"
}
},
"node_modules/d3-drag": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-3.0.0.tgz",
"integrity": "sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==",
"dependencies": {
"d3-dispatch": "1 - 3",
"d3-selection": "3"
},
"engines": {
"node": ">=12"
}
},
"node_modules/d3-ease": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
"integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==",
"engines": {
"node": ">=12"
}
},
"node_modules/d3-interpolate": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
"integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
"dependencies": {
"d3-color": "1 - 3"
},
"engines": {
"node": ">=12"
}
},
"node_modules/d3-selection": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
"integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
"engines": {
"node": ">=12"
}
},
"node_modules/d3-timer": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz",
"integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==",
"engines": {
"node": ">=12"
}
},
"node_modules/d3-transition": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-3.0.1.tgz",
"integrity": "sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==",
"dependencies": {
"d3-color": "1 - 3",
"d3-dispatch": "1 - 3",
"d3-ease": "1 - 3",
"d3-interpolate": "1 - 3",
"d3-timer": "1 - 3"
},
"engines": {
"node": ">=12"
},
"peerDependencies": {
"d3-selection": "2 - 3"
}
},
"node_modules/d3-zoom": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-3.0.0.tgz",
"integrity": "sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==",
"dependencies": {
"d3-dispatch": "1 - 3",
"d3-drag": "2 - 3",
"d3-interpolate": "1 - 3",
"d3-selection": "2 - 3",
"d3-transition": "2 - 3"
},
"engines": {
"node": ">=12"
}
},
"node_modules/damerau-levenshtein": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz",
@@ -6717,6 +6953,11 @@
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
"integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ=="
},
"node_modules/deep-object-diff": {
"version": "1.1.9",
"resolved": "https://registry.npmjs.org/deep-object-diff/-/deep-object-diff-1.1.9.tgz",
"integrity": "sha512-Rn+RuwkmkDwCi2/oXOFS9Gsr5lJZu/yTGpK7wAaAIE75CC+LCGEZHpY6VQJa/RoJcrmaA/docWJZvYohlNkWPA=="
},
"node_modules/deepmerge": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
@@ -6872,6 +7113,16 @@
"resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
"integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
},
"node_modules/dnd-core": {
"version": "16.0.1",
"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-16.0.1.tgz",
"integrity": "sha512-HK294sl7tbw6F6IeuK16YSBUoorvHpY8RHO+9yFfaJyCDVb6n7PRcezrOEOa2SBCqiYpemh5Jx20ZcjKdFAVng==",
"dependencies": {
"@react-dnd/asap": "^5.0.1",
"@react-dnd/invariant": "^4.0.1",
"redux": "^4.2.0"
}
},
"node_modules/dns-packet": {
"version": "5.6.1",
"resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
@@ -6902,6 +7153,15 @@
"utila": "~0.4"
}
},
"node_modules/dom-helpers": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
"integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
"dependencies": {
"@babel/runtime": "^7.8.7",
"csstype": "^3.0.2"
}
},
"node_modules/dom-serializer": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
@@ -8138,6 +8398,11 @@
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
},
"node_modules/fast-diff": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz",
"integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw=="
},
"node_modules/fast-glob": {
"version": "3.3.2",
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz",
@@ -12426,11 +12691,26 @@
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
},
"node_modules/lodash-es": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
},
"node_modules/lodash.clonedeep": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
"integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ=="
},
"node_modules/lodash.debounce": {
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
"integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow=="
},
"node_modules/lodash.isequal": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
"integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ=="
},
"node_modules/lodash.mapvalues": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
@@ -13127,6 +13407,11 @@
"tslib": "^2.0.3"
}
},
"node_modules/parchment": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/parchment/-/parchment-3.0.0.tgz",
"integrity": "sha512-HUrJFQ/StvgmXRcQ1ftY6VEZUq3jA2t9ncFN4F84J/vN0/FPpQF+8FKXb3l6fLces6q0uOHj6NJn+2xvZnxO6A=="
},
"node_modules/parent-module": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -14631,6 +14916,33 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
},
"node_modules/primeicons": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/primeicons/-/primeicons-7.0.0.tgz",
"integrity": "sha512-jK3Et9UzwzTsd6tzl2RmwrVY/b8raJ3QZLzoDACj+oTJ0oX7L9Hy+XnVwgo4QVKlKpnP/Ur13SXV/pVh4LzaDw=="
},
"node_modules/primereact": {
"version": "10.8.2",
"resolved": "https://registry.npmjs.org/primereact/-/primereact-10.8.2.tgz",
"integrity": "sha512-bf7vktogGh0PmKT9WLDcJQoQNqqFqcAlP2crUqccnlTu63FNnQV82qEYyaFvE12Qd5qhm3EYmpsHjpf6/+olTQ==",
"dependencies": {
"@types/react-transition-group": "^4.4.1",
"react-transition-group": "^4.4.1"
},
"engines": {
"node": ">=14.0.0"
},
"peerDependencies": {
"@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/process-nextick-args": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
@@ -14752,6 +15064,38 @@
}
]
},
"node_modules/quill": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/quill/-/quill-2.0.2.tgz",
"integrity": "sha512-QfazNrhMakEdRG57IoYFwffUIr04LWJxbS/ZkidRFXYCQt63c1gK6Z7IHUXMx/Vh25WgPBU42oBaNzQ0K1R/xw==",
"dependencies": {
"eventemitter3": "^5.0.1",
"lodash-es": "^4.17.21",
"parchment": "^3.0.0",
"quill-delta": "^5.1.0"
},
"engines": {
"npm": ">=8.2.3"
}
},
"node_modules/quill-delta": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-5.1.0.tgz",
"integrity": "sha512-X74oCeRI4/p0ucjb5Ma8adTXd9Scumz367kkMK5V/IatcX6A0vlgLgKbzXWy5nZmCGeNJm2oQX0d2Eqj+ZIlCA==",
"dependencies": {
"fast-diff": "^1.3.0",
"lodash.clonedeep": "^4.5.0",
"lodash.isequal": "^4.5.0"
},
"engines": {
"node": ">= 12.0.0"
}
},
"node_modules/quill/node_modules/eventemitter3": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
"integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA=="
},
"node_modules/raf": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
@@ -15022,6 +15366,43 @@
"node": ">=8"
}
},
"node_modules/react-dnd": {
"version": "16.0.1",
"resolved": "https://registry.npmjs.org/react-dnd/-/react-dnd-16.0.1.tgz",
"integrity": "sha512-QeoM/i73HHu2XF9aKksIUuamHPDvRglEwdHL4jsp784BgUuWcg6mzfxT0QDdQz8Wj0qyRKx2eMg8iZtWvU4E2Q==",
"dependencies": {
"@react-dnd/invariant": "^4.0.1",
"@react-dnd/shallowequal": "^4.0.1",
"dnd-core": "^16.0.1",
"fast-deep-equal": "^3.1.3",
"hoist-non-react-statics": "^3.3.2"
},
"peerDependencies": {
"@types/hoist-non-react-statics": ">= 3.3.1",
"@types/node": ">= 12",
"@types/react": ">= 16",
"react": ">= 16.14"
},
"peerDependenciesMeta": {
"@types/hoist-non-react-statics": {
"optional": true
},
"@types/node": {
"optional": true
},
"@types/react": {
"optional": true
}
}
},
"node_modules/react-dnd-html5-backend": {
"version": "16.0.1",
"resolved": "https://registry.npmjs.org/react-dnd-html5-backend/-/react-dnd-html5-backend-16.0.1.tgz",
"integrity": "sha512-Wu3dw5aDJmOGw8WjH1I1/yTH+vlXEL4vmjk5p+MHxP8HuHJS1lAGeIdG/hze1AvNeXWo/JgULV87LyQOr+r5jw==",
"dependencies": {
"dnd-core": "^16.0.1"
}
},
"node_modules/react-dom": {
"version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
@@ -15174,6 +15555,43 @@
}
}
},
"node_modules/react-scripts/node_modules/sass-loader": {
"version": "12.6.0",
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-12.6.0.tgz",
"integrity": "sha512-oLTaH0YCtX4cfnJZxKSLAyglED0naiYfNG1iXfU5w1LNZ+ukoA5DtyDIN5zmKVZwYNJP4KRc5Y3hkWga+7tYfA==",
"dependencies": {
"klona": "^2.0.4",
"neo-async": "^2.6.2"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
},
"peerDependencies": {
"fibers": ">= 3.1.0",
"node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0",
"sass": "^1.3.0",
"sass-embedded": "*",
"webpack": "^5.0.0"
},
"peerDependenciesMeta": {
"fibers": {
"optional": true
},
"node-sass": {
"optional": true
},
"sass": {
"optional": true
},
"sass-embedded": {
"optional": true
}
}
},
"node_modules/react-scripts/node_modules/semver": {
"version": "7.6.3",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
@@ -15208,6 +15626,21 @@
}
}
},
"node_modules/react-transition-group": {
"version": "4.4.5",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
"integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==",
"dependencies": {
"@babel/runtime": "^7.5.5",
"dom-helpers": "^5.0.1",
"loose-envify": "^1.4.0",
"prop-types": "^15.6.2"
},
"peerDependencies": {
"react": ">=16.6.0",
"react-dom": ">=16.6.0"
}
},
"node_modules/read-cache": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -15259,6 +15692,14 @@
"node": ">=6.0.0"
}
},
"node_modules/redux": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/redux/-/redux-4.2.1.tgz",
"integrity": "sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==",
"dependencies": {
"@babel/runtime": "^7.9.2"
}
},
"node_modules/reflect.getprototypeof": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.6.tgz",
@@ -15787,29 +16228,29 @@
}
},
"node_modules/sass-loader": {
"version": "12.6.0",
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-12.6.0.tgz",
"integrity": "sha512-oLTaH0YCtX4cfnJZxKSLAyglED0naiYfNG1iXfU5w1LNZ+ukoA5DtyDIN5zmKVZwYNJP4KRc5Y3hkWga+7tYfA==",
"version": "16.0.0",
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-16.0.0.tgz",
"integrity": "sha512-n13Z+3rU9A177dk4888czcVFiC8CL9dii4qpXWUg3YIIgZEvi9TCFKjOQcbK0kJM7DJu9VucrZFddvNfYCPwtw==",
"dev": true,
"dependencies": {
"klona": "^2.0.4",
"neo-async": "^2.6.2"
},
"engines": {
"node": ">= 12.13.0"
"node": ">= 18.12.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
},
"peerDependencies": {
"fibers": ">= 3.1.0",
"node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0",
"@rspack/core": "0.x || 1.x",
"node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0",
"sass": "^1.3.0",
"sass-embedded": "*",
"webpack": "^5.0.0"
},
"peerDependenciesMeta": {
"fibers": {
"@rspack/core": {
"optional": true
},
"node-sass": {
@@ -15820,6 +16261,9 @@
},
"sass-embedded": {
"optional": true
},
"webpack": {
"optional": true
}
}
},
@@ -17672,6 +18116,11 @@
"node": ">= 8"
}
},
"node_modules/validate.js": {
"version": "0.13.1",
"resolved": "https://registry.npmjs.org/validate.js/-/validate.js-0.13.1.tgz",
"integrity": "sha512-PnFM3xiZ+kYmLyTiMgTYmU7ZHkjBZz2/+F0DaALc/uUtVzdCt1wAosvYJ5hFQi/hz8O4zb52FQhHZRC+uVkJ+g=="
},
"node_modules/vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",

View File

@@ -3,32 +3,45 @@
"version": "1.0.0",
"private": true,
"dependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@babel/preset-react": "^7.24.7",
"@date-fns/tz": "^1.0.2",
"@emotion/react": "11.13.0",
"@emotion/styled": "11.13.0",
"@wordpress/i18n": "^5.5.0",
"@wordpress/react-i18n": "^4.5.0",
"@xyflow/react": "^12.2.0",
"codice-fiscale-js": "^2.3.22",
"deep-object-diff": "^1.1.9",
"dompurify": "3.1.6",
"fast-deep-equal": "^3.1.3",
"html-react-parser": "5.1.12",
"jwt-decode": "4.0.0",
"klona": "2.0.6",
"luxon": "3.5.0",
"primeicons": "^7.0.0",
"primereact": "^10.8.2",
"quill": "^2.0.2",
"ramda": "0.30.1",
"react": "18.3.1",
"react-dnd": "^16.0.1",
"react-dnd-html5-backend": "^16.0.1",
"react-dom": "18.3.1",
"react-hook-form": "7.52.2",
"react-router-dom": "6.26.0",
"react-scripts": "^5.0.1",
"validate.js": "^0.13.1",
"zustand": "4.5.4",
"zustand-x": "3.0.4"
},
"devDependencies": {
"@babel/cli": "7.24.8",
"@babel/core": "7.25.2",
"@babel/plugin-syntax-jsx": "^7.24.7",
"@wordpress/babel-plugin-makepot": "^6.5.0",
"@babel/plugin-syntax-jsx": "7.24.7",
"@wordpress/babel-plugin-makepot": "6.5.0",
"babel-plugin-macros": "3.1.0",
"sass": "1.77.8"
"sass": "1.77.8",
"sass-loader": "16.0.0"
},
"scripts": {
"start": "GENERATE_SOURCEMAP=false react-scripts start",
@@ -36,12 +49,9 @@
"start:prod": "cp environments/prod/* public/loaded-files && rm public/loaded-files/prod.env && cp environments/prod/prod.env .env && react-scripts start",
"build": "react-scripts build",
"build:dev": "cp environments/dev/* public/loaded-files && rm public/loaded-files/dev.env && cp environments/dev/dev.env .env && react-scripts build",
"build:staging": "cp environments/staging/* public/loaded-files && rm public/loaded-files/staging.env && cp environments/staging/staging.env .env && react-scripts build",
"build:prod": "cp environments/prod/* public/loaded-files && rm public/loaded-files/prod.env && cp environments/prod/prod.env .env && react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"extract": "lingui extract",
"compile": "lingui compile"
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [

View File

@@ -6,7 +6,7 @@
"domain": "gepafin"
},
"Login page": [
"Login111 page"
"Auth page"
]
}
}

View File

@@ -1,27 +1,48 @@
import { useState, useEffect } from 'react';
import { useEffect } from 'react';
import { BrowserRouter } from 'react-router-dom';
import Routes from './routes';
import { createI18n, setLocaleData } from '@wordpress/i18n';
import { I18nProvider } from '@wordpress/react-i18n';
import './assets/scss/theme.scss';
import AuthenticationService from './service/authentication-service';
const i18n = createI18n();
// store
import { useStore, storeSet } from './store';
const i18n = createI18n({}, 'gepafin');
function App() {
const [messages, setMessages] = useState({});
const role = useStore().main.getRole();
const callback = (data) => {
if (data.status === 'SUCCESS') {
storeSet.main.userData(data.data);
} else {
storeSet.main.doLogout();
}
storeSet.main.unsetAsyncRequest();
}
const errCallback = (data) => {
storeSet.main.doLogout();
storeSet.main.unsetAsyncRequest();
}
useEffect(() => {
/*import('../languages/en_US.json').then((translations) => {
setLocaleData(translations, 'gepafin');
});*/
storeSet.main.setAsyncRequest();
AuthenticationService.me(callback, errCallback);
fetch('/languages/en_US.json')
.then((res) => res.json())
.then(res => console.log(res))
.then(res => {
setLocaleData(res.locale_data['gepafin'], 'gepafin')
})
}, []);
return (
<I18nProvider i18n={i18n}>
<BrowserRouter>
<Routes/>
<Routes role={role}/>
</BrowserRouter>
</I18nProvider>
);

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@@ -0,0 +1,149 @@
.appForm {
display: flex;
flex-direction: column;
gap: 24px;
}
.appForm__field {
display: flex;
flex-direction: column;
gap: 14px;
padding: 5px 0;
width: 100%;
label {
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: normal;
span {
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: normal;
margin-left: 10px;
}
}
small {
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 21px;
}
&.datepicker, &.formfieldrepeater, &.datepickerrange, &.fileupload {
.p-button:not(.p-button-danger) {
background: var(--button-secondary-background);
border: 1px solid var(--button-secondary-borderColor);
}
.p-button:not(:disabled, .p-button-danger):hover {
background: var(--button-secondary-borderColor);
}
}
}
.appForm__fieldItem {
display: flex;
gap: 0.5rem;
}
.appForm__fileUploadItem {
display: grid;
grid-template-columns: 2fr 0.5fr 0.5fr;
> div {
display: flex;
align-items: center;
&:nth-of-type(2) {
justify-content: center;
}
&:nth-of-type(3) {
justify-content: flex-end;
}
}
}
.appForm__fileUploadItemName {
color: var(--global-textColor);
font-style: italic;
}
.appForm__row {
display: flex;
gap: 7px;
align-items: center;
}
.appForm__col {
display: flex;
flex-direction: column;
gap: 7px;
label {
font-weight: 400;
}
}
.appForm__cols {
display: grid;
gap: 0.5rem;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
width: 100%;
> div {
display: flex;
flex-direction: column;
gap: 14px;
}
> div:not(.appForm__field) {
label {
font-weight: 400;
}
}
}
.appForm__repeaterItem {
padding: 0.5rem 0.5rem 0.5rem 1rem;
border-left: 3px solid #dadada;
&:hover {
border-color: var(--button-secondary-background);
background: #FCF7E7;
}
}
.appForm__faqHeaderControls {
display: flex;
gap: 1rem;
button {
flex: 0 0 auto;
}
> div {
flex: 1 1 auto;
}
}
.appForm__faqTab {
display: flex;
justify-content: space-between;
gap: 1rem;
}
.appForm__faqTabItem {
display: flex;
gap: 0.5rem;
align-items: center;
.p-togglebutton[data-p-highlight="true"] {
.p-button:not(.p-button-danger) {
background: var(--menuitem-active-background);
border: 1px solid var(--menuitem-active-background);
}
}
}

View File

@@ -0,0 +1,259 @@
.appPage {
position: relative;
display: flex;
flex-direction: column;
flex-grow: 2;
h1 {
color: var(--primary-color);
font-size: 28px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.appPageLogin__wrapper {
h1 {
text-align: center;
}
}
}
.appPage__pageHeader {
display: flex;
flex-direction: column;
gap: 14px;
padding: 28px;
border-left: 4px solid var(--card-borderColor-color);
h1, h2, h3 {
margin: 0;
}
p, span {
color: var(--text-color-secondary);
font-size: 17.5px;
font-style: normal;
font-weight: 400;
line-height: 120%;
margin: 0;
}
span {
margin-left: 10px;
text-transform: uppercase;
}
}
.appPage__spacer {
width: 100%;
padding: 24px 0;
}
.appPageSection__hr {
position: relative;
width: 100%;
padding: 0 0 0 30px;
&:before {
position: absolute;
width: 100%;
height: 1px;
content: '';
top: 50%;
left: 0;
z-index: 1;
background-color: #E5E7EB;
}
span {
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: normal;
padding: 0 10px;
background-color: white;
z-index: 9;
position: relative;
}
}
.appPage__content {
display: flex;
flex-direction: column;
gap: 48px;
}
.appPageSection {
display: flex;
flex-direction: column;
align-items: flex-start;
h2 {
color: var(--global-textColor);
font-size: 21px;
font-style: normal;
font-weight: 600;
line-height: normal;
margin: 0 0 24px;
}
.row {
display: flex;
gap: 1rem;
align-items: center;
padding: 5px 0;
}
}
.appPageSection__withBorder {
display: flex;
flex-direction: column;
gap: 16px;
width: 100%;
padding: 17px;
border-radius: 6px;
border: 1px solid var(--card-borderColor-color);
container-name: section_with_border;
container-type: inline-size;
&.disabled {
filter: grayscale(1);
opacity: 0.8;
}
h2 {
color: var(--global-textColor);
font-size: 21px;
font-style: normal;
font-weight: 600;
line-height: normal;
margin: 0;
}
.row {
display: flex;
gap: 1rem;
align-items: center;
padding: 5px 0;
&.rowContent {
padding: 7px 0;
flex-direction: column;
align-items: flex-start;
gap: 0.3rem;
}
p {
margin: 0;
flex: 1 1 100%;
}
ul {
padding-left: 1rem;
}
button {
flex: 0 0 auto;
}
}
}
@container section_with_border (max-width: 600px) {
.appPageSection__withBorder {
.row {
flex-direction: column;
align-items: flex-start;
}
}
}
.appPageSection__hero {
display: flex;
height: 172px;
width: 100%;
img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
.appPageSection__preview {
padding: 17px 0;
background: repeating-linear-gradient(
45deg,
transparent,
transparent 10px,
#f8d282 10px,
#f8d282 20px
);
.p-button {
background: white;
}
}
.appPageSection__row {
display: flex;
gap: 1rem;
}
.appPageSection__pMeta {
display: flex;
gap: 0.5rem;
justify-content: space-between;
margin: 0;
span {
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
}
.appPageSection__table {
width: 100%;
}
.appTableHeader {
display: flex;
justify-content: space-between;
}
.appPageSection__actions {
display: flex;
gap: 24px;
padding: 24px 0 48px;
flex-wrap: wrap;
}
.appPageSection__tableActions {
display: flex;
gap: 24px;
padding: 0;
flex-wrap: wrap;
}
.appPageSection__addToFavourites {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
border: none;
background-color: var(--message-info-color);
color: white;
padding: 0;
&:hover {
cursor: pointer;
}
&[disabled] {
background-color: var(--message-info-background);
}
}

View File

@@ -0,0 +1,7 @@
.bandoStatusTag {
text-transform: uppercase;
font-size: 10.5px;
font-style: normal;
font-weight: 600;
line-height: 150%;
}

View File

@@ -0,0 +1,35 @@
.flowBuilder__wrapper {
width: 100%;
height: 500px;
}
.nodeInitialForm {
padding: 10px 20px;
background-color: white;
border: 1px solid black;
border-radius: 4px;
display: flex;
flex-direction: column;
gap: 10px;
label {
font-size: 13px;
text-align: center;
}
}
.nodeIntermediateForm {
padding: 10px 20px;
background-color: white;
border: 1px solid black;
border-radius: 4px;
display: flex;
flex-direction: column;
gap: 10px;
max-width: 180px;
label {
font-size: 13px;
text-align: center;
}
}

View File

@@ -0,0 +1,141 @@
.formBuilder {
position: relative;
display: flex;
gap: 20px;
width: 100%;
height: 600px;
}
.formBuilder__main {
flex: 1 1 100%;
display: flex;
flex-direction: column;
h2 {
color: #404D5B;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
}
.formBuilder__content {
height: 100%;
overflow-y: scroll;
flex-grow: 2;
display: flex;
flex-direction: column;
gap: 7px;
padding: 20px;
border: 1px #DDD;
background: var(--surface-50);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.10);
.dropzone {
width: 100%;
height: 100%;
border-radius: 1rem;
border: 3px dashed #bdbdbd;
}
}
.formBuilder__element {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
padding: 10px 20px;
border: 1px solid var(--button-secondary-borderColor);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 21px;
.meta {
display: flex;
flex-direction: column;
gap: 5px;
align-items: flex-start;
}
.actions {
display: flex;
gap: 0.5rem;
}
}
.formBuilder__aside {
flex: 0 0 250px;
display: flex;
flex-direction: column;
h2 {
color: #404D5B;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
}
.formBuilder__list {
display: flex;
flex-direction: column;
gap: 5px;
list-style: none;
padding: 0;
margin: 0;
height: 100%;
overflow-y: scroll;
}
.formBuilder__elementItem {
display: flex;
padding: 10px 20px;
border: 1px dashed var(--button-secondary-borderColor);
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 21px;
&:hover {
cursor: grab;
}
}
.formBuilder__elementSettings {
width: 40rem;
}
.formElementSettings {
display: flex;
flex-direction: column;
gap: 1rem;
align-items: flex-start;
}
.formElementSettings__field {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.formElementSettings__tabs {
width: 100%;
.p-tabview-nav-link[aria-selected="true"] {
background-color: var(--message-info-background);
}
.p-tabview-panel {
display: flex;
flex-direction: column;
gap: 1rem;
}
}
.formElementSettings__repeater {
display: flex;
flex-direction: column;
gap: 0.5rem;
}

View File

@@ -0,0 +1,105 @@
html {
min-height: 100%;
display: flex;
flex-direction: column;
}
body {
min-height: 100%;
display: flex;
flex-direction: column;
flex-grow: 1;
margin: 0;
font-family: "Montserrat", sans-serif;
p, span:not(.p-button-label, .p-button-icon, .p-badge, .p-message-detail, .p-highlight),
input, label:not(.p-error), textarea, a, li, h1, h2, h3, h4, h5, h6, div, th, td {
color: var(--global-textColor);
}
}
#root, .wrapper {
min-height: 100%;
display: flex;
flex-direction: column;
flex-grow: 1;
}
.inner {
display: flex;
height: 100%;
min-height: 0;
flex-grow: 1;
> aside {
flex: 0 0 320px;
border-right: 1px solid var(--menu-borderColor);
ul {
display: flex;
flex-direction: column;
list-style: none;
margin: 0;
padding: 0;
li a, li button {
display: flex;
padding: 10.5px 17.5px;
align-items: center;
gap: 7px;
width: 100%;
border: 0;
border-bottom: 1px solid var(--menu-borderColor);
color: var(--menuitem-color);
background-color: transparent;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 100%;
text-decoration: none;
&:hover {
cursor: pointer;
}
i {
color: var(--text-color-secondary);
}
&.active {
color: var(--menuitem-active-color);
background-color: var(--menuitem-active-background);
i {
color: white;
}
span {
color: var(--menuitem-active-color);
}
}
}
}
}
> main {
flex: 1 1 auto;
box-sizing: border-box;
padding: 0 24px 20px;
display: flex;
flex-direction: column;
width: calc(100% - 320px);
> footer {
margin-top: auto;
padding: 100px 0 0;
p {
text-align: center;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
}
}
}

View File

@@ -0,0 +1,40 @@
.appPageLogin {
display: flex;
justify-content: center;
align-items: center;
}
.appPageLogin__wrapper {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
max-width: 540px;
padding: 24px;
.appForm {
width: 100%;
}
}
.appPageLogin__spidBtn.appPageLogin__spidBtn {
display: flex;
align-items: center;
width: 100%;
padding: 8px;
gap: 11px;
background: #06C;
border: none;
&:hover {
cursor: pointer;
}
span {
color: #FFF;
font-size: 17.25px;
font-style: normal;
font-weight: 600;
line-height: 15px;
}
}

View File

@@ -0,0 +1,117 @@
.p-steps {
.p-highlight {
span.p-steps-number {
color: var(--menuitem-active-color);
}
}
}
.p-badge {
color: var(--menuitem-active-color);
}
.p-button:not(.p-button-outlined, .p-button-secondary, .p-confirm-popup-reject),
.p-button:not(.p-button-outlined, .p-button-secondary, .p-confirm-popup-reject) span {
color: var(--menuitem-active-color);
}
.p-fileupload-row {
.p-button-danger {
background-color: #f44336;
opacity: 0.8;
&:hover {
opacity: 1;
}
}
}
.p-tag {
.p-tag-value {
color: var(--menuitem-active-color);
}
}
.p-paginator-page {
/*color: var(--menuitem-active-color);*/
}
.p-datepicker-buttonbar .p-button {
color: var(--global-textColor);
}
.p-message.p-message-error {
background: var(--message-error-background);
border-left: 5px solid var(--message-error-color);
span.p-message-detail, span.p-message-summary {
color: var(--message-error-color);
}
svg {
path {
fill: var(--message-error-color);
}
}
}
.p-message.p-message-info {
background: var(--message-info-background);
border-left: 5px solid var(--message-info-color);
span.p-message-detail, span.p-message-summary {
color: var(--message-info-color);
}
svg {
path {
fill: var(--message-info-color);
}
}
}
.p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight {
background: #C9E3CC;
}
.p-accordion {
width: 100%;
}
.p-steps .p-steps-item.p-highlight .p-steps-number {
background: var(--theme-highlight-background);
color: var(--primary-text);
}
.p-toast-detail {
color: white;
margin: 0;
}
.p-fileupload .p-fileupload-content {
padding: 1rem 0.5rem;
}
.p-fileupload .p-fileupload-row > div {
padding: 0.5rem;
}
.p-message-detail, .p-progressbar-label {
color: white;
}
.p-dialog-content {
padding: 1rem 1.5rem;
}
.blockingOverlay {
position: absolute;
z-index: 999;
inset: 0;
background-color: rgba(255,255,255,0.3)
}
.mb-2 {
margin-bottom: 4px;
}
.mb-8 {
margin-bottom: 16px;
}
.mr-8 {
margin-right: 16px;
}

View File

@@ -0,0 +1,9 @@
.pageBando__templateSelection {
display: flex;
gap: 14px;
align-items: flex-end;
button {
flex: 0 0 auto;
}
}

View File

@@ -0,0 +1,65 @@
.statsBigBadges {
}
.statsBigBadges__grid {
display: grid;
align-items: stretch;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 1rem;
width: 100%;
container-name: big-badges-grid;
container-type: inline-size;
}
.statsBigBadges__grid .statsBigBadges__gridItem span {
color: #FFF;
}
.statsBigBadges__gridItem {
display: flex;
justify-content: space-between;
padding: 28px;
border-radius: 6px;
border: 1px solid var(--yellow-500);
background: var(--card-full-background-color-2);
align-items: center;
gap: 48px;
span {
color: #FFF;
font-size: 21px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
span:nth-last-of-type(1) {
font-size: 28px;
}
&:nth-of-type(2) {
border: 1px solid var(--yellow-500);
background: var(--card-full-background-color-3);
}
&:nth-of-type(3) {
border: 1px solid var(--yellow-500);
background: var(--card-full-background-color-4);
}
&:nth-of-type(4) {
border: 1px solid var(--yellow-500);
background: var(--card-full-background-color-1);
}
}
@container big-badges-grid (max-width: 700px) {
.statsBigBadges__gridItem {
padding: 12px;
span {
font-size: 16px;
}
span:nth-last-of-type(1) {
font-size: 16px;
}
}
}

View File

@@ -0,0 +1,49 @@
.topBar {
background: var(--horizontalMenu-background)
}
.topBar__endContent {
display: flex;
gap: 24px;
align-items: center;
}
.topBar__profileBtn {
display: flex;
gap: 14px;
}
.topBar__icon {
font-size: 1.3rem;
color: var(--text-color-secondary)
}
.topBar__menuProfileItem {
display: flex;
gap: 7px;
padding: 0.75rem 1rem;
.p-avatar {
width: 40px;
height: 40px;
flex: 0 0 auto;
}
.userInfo {
display: flex;
flex-direction: column;
gap: 4px;
width: 120px;
}
span {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.userName {
font-weight: bold;
}
}
.topBar__menuProfile {
.p-menu-separator {
border-color: var(--menu-borderColor);
}
}

View File

@@ -0,0 +1 @@
/* Customizations to the designer theme should be defined here */

View File

@@ -0,0 +1,44 @@
/* montserrat-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url('../../fonts/montserrat-v26-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-italic - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Montserrat';
font-style: italic;
font-weight: 400;
src: url('../../fonts/montserrat-v26-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-600 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Montserrat';
font-style: normal;
font-weight: 600;
src: url('../../fonts/montserrat-v26-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-700 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
src: url('../../fonts/montserrat-v26-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-800 - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
font-family: 'Montserrat';
font-style: normal;
font-weight: 800;
src: url('../../fonts/montserrat-v26-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

View File

@@ -0,0 +1,88 @@
$primaryColor: #3B7C43;
$primaryDarkColor: #3B7C43;
$primaryDarkerColor: #3B7C43;
$primaryTextColor: #ffffff;
$chipBg: $primaryColor;
$chipTextColor: $primaryTextColor;
$chipBorderRadius: 16px !default;
$chipFocusBg: $primaryColor;
$chipFocusTextColor: $primaryTextColor;
$colors: (
"grey": #6B7280,
"blue": #2196F3,
"green": #4caf50,
"yellow": #FBC02D,
"cyan": #00BCD4,
"pink": #E91E63,
"indigo": #3F51B5,
"teal": #009688,
"orange": #F57C00,
"bluegray": #607D8B,
"purple": #9C27B0,
"red": #FF4032,
"primary": $primaryColor
);
@import './variables/_general.scss';
@import './variables/_form.scss';
@import './variables/_button.scss';
@import './variables/_panel.scss';
@import './variables/_data.scss';
@import './variables/_overlay.scss';
@import './variables/_message.scss';
@import './variables/_menu.scss';
@import './variables/_media.scss';
@import './variables/_misc.scss';
:root {
font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
--surface-a:#ffffff;
--surface-b:#f8f9fa;
--surface-c:#e9ecef;
--surface-d:#dee2e6;
--surface-e:#ffffff;
--surface-f:#ffffff;
--text-color:#4B5563;
--text-color-secondary:#6B7280;
--primary-color:#4A644E;
--primary-color-text:#ffffff;
--surface-0: #ffffff;
--surface-50: #FAFAFA;
--surface-100: #F5F5F5;
--surface-200: #EEEEEE;
--surface-300: #E0E0E0;
--surface-400: #BDBDBD;
--surface-500: #9E9E9E;
--surface-600: #757575;
--surface-700: #616161;
--surface-800: #424242;
--surface-900: #212121;
--gray-50: #FAFAFA;
--gray-100: #F5F5F5;
--gray-200: #EEEEEE;
--gray-300: #E0E0E0;
--gray-400: #BDBDBD;
--gray-500: #9E9E9E;
--gray-600: #757575;
--gray-700: #616161;
--gray-800: #424242;
--gray-900: #212121;
--content-padding:#{$panelContentPadding};
--inline-spacing:#{$inlineSpacing};
--border-radius:#{$borderRadius};
--surface-ground:#EFF3F8;
--surface-section:#ffffff;
--surface-card:#ffffff;
--surface-overlay:#ffffff;
--surface-border:#DFE7EF;
--surface-hover:#F6F9FC;
--focus-ring: #{$focusShadow};
--maskbg: #{$maskBg};
--highlight-bg: #{$highlightBg};
--highlight-text-color: #{$highlightTextColor};
color-scheme: light;
}

View File

@@ -0,0 +1,4 @@
@import './_variables.scss';
@import './_fonts.scss';
@import '../theme-base/_components.scss';
@import './_extensions.scss';

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 7.3 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 7.4 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 7.2 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 7.2 KiB

View File

@@ -0,0 +1,56 @@
/* global document */
(function ($, global) {
'use strict';
// Constructor
var App = function (conf) {
this.conf = $.extend({
// Search module
search: new global.Search(),
// Sidebar module
sidebar: new global.Sidebar(),
// Initialisation
init: true
}, conf || {});
// Launch the module
if (this.conf.init !== false) {
this.initialize();
}
};
// Initialisation method
App.prototype.initialize = function () {
this.codePreview();
};
// Toggle code preview collapsed/expanded modes
App.prototype.codePreview = function () {
var $item;
var $code;
var switchTo;
$('.item__code--togglable').on('click', function () {
$item = $(this);
$code = $item.find('code');
switchTo = $item.attr('data-current-state') === 'expanded' ? 'collapsed' : 'expanded';
$item.attr('data-current-state', switchTo);
$code.html($item.attr('data-' + switchTo));
Prism.highlightElement($code[0]);
});
};
global.App = App;
}(window.jQuery, window));
(function ($, global) {
$(document).ready(function () {
var app = new global.App();
});
}(window.jQuery, window));

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,146 @@
(function ($, global) {
var Search = function (conf) {
this.conf = $.extend({
// Search DOM
search: {
items: '.sassdoc__item',
input: '#js-search-input',
form: '#js-search',
suggestionsWrapper: '#js-search-suggestions'
},
// Fuse options
fuse: {
keys: ['name'],
threshold: 0.3
},
init: true
}, conf || {});
if (this.conf.init === true) {
this.initialize();
}
};
Search.prototype.initialize = function () {
// Fuse engine instanciation
this.index = new Fuse($.map($(this.conf.search.items), function (item) {
var $item = $(item);
return {
group: $item.data('group'),
name: $item.data('name'),
type: $item.data('type'),
node: $item
};
}), this.conf.fuse);
this.initializeSearch();
};
// Fill DOM with search suggestions
Search.prototype.fillSuggestions = function (items) {
var searchSuggestions = $(this.conf.search.suggestionsWrapper);
searchSuggestions.html('');
var suggestions = $.map(items.slice(0, 10), function (item) {
var $li = $('<li />', {
'data-group': item.group,
'data-type': item.type,
'data-name': item.name,
'html': '<a href="#' + item.group + '-' + item.type + '-' + item.name + '"><code>' + item.type.slice(0, 3) + '</code> ' + item.name + '</a>'
});
searchSuggestions.append($li);
return $li;
});
return suggestions;
};
// Perform a search on a given term
Search.prototype.search = function (term) {
return this.fillSuggestions(this.index.search(term));
};
// Search logic
Search.prototype.initializeSearch = function () {
var searchForm = $(this.conf.search.form);
var searchInput = $(this.conf.search.input);
var searchSuggestions = $(this.conf.search.suggestionsWrapper);
var currentSelection = -1;
var suggestions = [];
var selected;
var self = this;
// Clicking on a suggestion
searchSuggestions.on('click', function (e) {
var target = $(event.target);
if (target.nodeName === 'A') {
searchInput.val(target.parent().data('name'));
suggestions = self.fillSuggestions([]);
}
});
// Filling the form
searchForm.on('keyup', function (e) {
e.preventDefault();
// Enter
if (e.keyCode === 13) {
if (selected) {
suggestions = self.fillSuggestions([]);
searchInput.val(selected.data('name'));
window.location = selected.children().first().attr('href');
}
e.stopPropagation();
}
// KeyDown
if (e.keyCode === 40) {
currentSelection = (currentSelection + 1) % suggestions.length;
}
// KeyUp
if (e.keyCode === 38) {
currentSelection = currentSelection - 1;
if (currentSelection < 0) {
currentSelection = suggestions.length - 1;
}
}
if (suggestions[currentSelection]) {
if (selected) {
selected.removeClass('selected');
}
selected = suggestions[currentSelection];
selected.addClass('selected');
}
});
searchInput.on('keyup', function (e) {
if (e.keyCode !== 40 && e.keyCode !== 38) {
currentSelection = -1;
suggestions = self.search($(this).val());
}
else {
e.preventDefault();
}
}).on('search', function () {
suggestions = self.search($(this).val());
});
};
global.Search = Search;
}(window.jQuery, window));

View File

@@ -0,0 +1,163 @@
(function ($, global) {
var Sidebar = function (conf) {
this.conf = $.extend({
// Collapsed class
collapsedClass: 'is-collapsed',
// Storage key
storageKey: '_sassdoc_sidebar_index',
// Index attribute
indexAttribute: 'data-slug',
// Toggle button
toggleBtn: '.js-btn-toggle',
// Automatic initialization
init: true
}, conf || {});
if (this.conf.init === true) {
this.initialize();
}
};
/**
* Initialize module
*/
Sidebar.prototype.initialize = function () {
this.conf.nodes = $('[' + this.conf.indexAttribute + ']');
this.load();
this.updateDOM();
this.bind();
this.loadToggle();
};
/**
* Load sidebar toggle
*/
Sidebar.prototype.loadToggle = function () {
$('<span />', {
'class': 'layout-toggle',
'html': '&times;',
'data-alt': '&#8594;'
}).appendTo( $('.header') );
$('.layout-toggle').on('click', function () {
var $this = $(this);
var alt;
$('body').toggleClass('sidebar-closed');
alt = $this.html();
$this.html($this.data('alt'));
$this.data('alt', alt);
});
};
/**
* Load data from storage or create fresh index
*/
Sidebar.prototype.load = function () {
var index = 'localStorage' in global ?
global.localStorage.getItem(this.conf.storageKey) :
null;
this.index = index ? JSON.parse(index) : this.buildIndex();
};
/**
* Build a fresh index
*/
Sidebar.prototype.buildIndex = function () {
var index = {};
var $item;
this.conf.nodes.each($.proxy(function (index, item) {
$item = $(item);
index[$item.attr(this.conf.indexAttribute)] = !$item.hasClass(this.conf.collapsedClass);
}, this));
return index;
};
/**
* Update DOM based on index
*/
Sidebar.prototype.updateDOM = function () {
var item;
for (item in this.index) {
if (this.index[item] === false) {
$('[' + this.conf.indexAttribute + '="' + item + '"]').addClass(this.conf.collapsedClass);
}
}
};
/**
* Save index in storage
*/
Sidebar.prototype.save = function () {
if (!('localStorage' in global)) {
return;
}
global.localStorage.setItem(this.conf.storageKey, JSON.stringify(this.index));
};
/**
* Bind UI events
*/
Sidebar.prototype.bind = function () {
var $item, slug, fn, text;
var collapsed = false;
// Save index in localStorage
global.onbeforeunload = $.proxy(function () {
this.save();
}, this);
// Toggle all
$(this.conf.toggleBtn).on('click', $.proxy(function (event) {
$node = $(event.target);
text = $node.attr('data-alt');
$node.attr('data-alt', $node.text());
$node.text(text);
fn = collapsed === true ? 'removeClass' : 'addClass';
this.conf.nodes.each($.proxy(function (index, item) {
$item = $(item);
slug = $item.attr(this.conf.indexAttribute);
this.index[slug] = collapsed;
$('[' + this.conf.indexAttribute + '="' + slug + '"]')[fn](this.conf.collapsedClass);
}, this));
collapsed = !collapsed;
this.save();
}, this));
// Toggle item
this.conf.nodes.on('click', $.proxy(function (event) {
$item = $(event.target);
slug = $item.attr(this.conf.indexAttribute);
// Update index
this.index[slug] = !this.index[slug];
// Update DOM
$item.toggleClass(this.conf.collapsedClass);
}, this));
};
global.Sidebar = Sidebar;
}(window.jQuery, window));

View File

@@ -0,0 +1,20 @@
/**
* @license
* Fuse - Lightweight fuzzy-search
*
* Copyright (c) 2012 Kirollos Risk <kirollos@gmail.com>.
* All Rights Reserved. Apache Software License 2.0
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
!function(t){function e(t,n){this.list=t,this.options=n=n||{};var i,o,s;for(i=0,keys=["sort","includeScore","shouldSort"],o=keys.length;o>i;i++)s=keys[i],this.options[s]=s in n?n[s]:e.defaultOptions[s];for(i=0,keys=["searchFn","sortFn","keys","getFn"],o=keys.length;o>i;i++)s=keys[i],this.options[s]=n[s]||e.defaultOptions[s]}var n=function(t,e){if(e=e||{},this.options=e,this.options.location=e.location||n.defaultOptions.location,this.options.distance="distance"in e?e.distance:n.defaultOptions.distance,this.options.threshold="threshold"in e?e.threshold:n.defaultOptions.threshold,this.options.maxPatternLength=e.maxPatternLength||n.defaultOptions.maxPatternLength,this.pattern=e.caseSensitive?t:t.toLowerCase(),this.patternLen=t.length,this.patternLen>this.options.maxPatternLength)throw new Error("Pattern length is too long");this.matchmask=1<<this.patternLen-1,this.patternAlphabet=this._calculatePatternAlphabet()};n.defaultOptions={location:0,distance:100,threshold:.6,maxPatternLength:32},n.prototype._calculatePatternAlphabet=function(){var t={},e=0;for(e=0;e<this.patternLen;e++)t[this.pattern.charAt(e)]=0;for(e=0;e<this.patternLen;e++)t[this.pattern.charAt(e)]|=1<<this.pattern.length-e-1;return t},n.prototype._bitapScore=function(t,e){var n=t/this.patternLen,i=Math.abs(this.options.location-e);return this.options.distance?n+i/this.options.distance:i?1:n},n.prototype.search=function(t){if(t=this.options.caseSensitive?t:t.toLowerCase(),this.pattern===t)return{isMatch:!0,score:0};var e,n,i,o,s,r,a,h,p,c=t.length,l=this.options.location,u=this.options.threshold,f=t.indexOf(this.pattern,l),d=this.patternLen+c,g=1,m=[];for(-1!=f&&(u=Math.min(this._bitapScore(0,f),u),f=t.lastIndexOf(this.pattern,l+this.patternLen),-1!=f&&(u=Math.min(this._bitapScore(0,f),u))),f=-1,e=0;e<this.patternLen;e++){for(i=0,o=d;o>i;)this._bitapScore(e,l+o)<=u?i=o:d=o,o=Math.floor((d-i)/2+i);for(d=o,s=Math.max(1,l-o+1),r=Math.min(l+o,c)+this.patternLen,a=Array(r+2),a[r+1]=(1<<e)-1,n=r;n>=s;n--)if(p=this.patternAlphabet[t.charAt(n-1)],a[n]=0===e?(a[n+1]<<1|1)&p:(a[n+1]<<1|1)&p|((h[n+1]|h[n])<<1|1)|h[n+1],a[n]&this.matchmask&&(g=this._bitapScore(e,n-1),u>=g)){if(u=g,f=n-1,m.push(f),!(f>l))break;s=Math.max(1,2*l-f)}if(this._bitapScore(e+1,l)>u)break;h=a}return{isMatch:f>=0,score:g}};var i={deepValue:function(t,e){for(var n=0,e=e.split("."),i=e.length;i>n;n++){if(!t)return null;t=t[e[n]]}return t}};e.defaultOptions={id:null,caseSensitive:!1,includeScore:!1,shouldSort:!0,searchFn:n,sortFn:function(t,e){return t.score-e.score},getFn:i.deepValue,keys:[]},e.prototype.search=function(t){var e,n,o,s,r,a=new this.options.searchFn(t,this.options),h=this.list,p=h.length,c=this.options,l=this.options.keys,u=l.length,f=[],d={},g=[],m=function(t,e,n){void 0!==t&&null!==t&&"string"==typeof t&&(s=a.search(t),s.isMatch&&(r=d[n],r?r.score=Math.min(r.score,s.score):(d[n]={item:e,score:s.score},f.push(d[n]))))};if("string"==typeof h[0])for(var e=0;p>e;e++)m(h[e],e,e);else for(var e=0;p>e;e++)for(o=h[e],n=0;u>n;n++)m(this.options.getFn(o,l[n]),o,e);c.shouldSort&&f.sort(c.sortFn);for(var y=c.includeScore?function(t){return f[t]}:function(t){return f[t].item},L=c.id?function(t){return i.deepValue(y(t),c.id)}:function(t){return y(t)},e=0,v=f.length;v>e;e++)g.push(L(e));return g},"object"==typeof exports?module.exports=e:"function"==typeof define&&define.amd?define(function(){return e}):t.Fuse=e}(this);

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,9 @@
/* http://prismjs.com/download.html?themes=prism&languages=markup+css+css-extras+clike+javascript+scss */
var self=typeof window!="undefined"?window:{},Prism=function(){var e=/\blang(?:uage)?-(?!\*)(\w+)\b/i,t=self.Prism={util:{encode:function(e){return e instanceof n?new n(e.type,t.util.encode(e.content)):t.util.type(e)==="Array"?e.map(t.util.encode):e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/\u00a0/g," ")},type:function(e){return Object.prototype.toString.call(e).match(/\[object (\w+)\]/)[1]},clone:function(e){var n=t.util.type(e);switch(n){case"Object":var r={};for(var i in e)e.hasOwnProperty(i)&&(r[i]=t.util.clone(e[i]));return r;case"Array":return e.slice()}return e}},languages:{extend:function(e,n){var r=t.util.clone(t.languages[e]);for(var i in n)r[i]=n[i];return r},insertBefore:function(e,n,r,i){i=i||t.languages;var s=i[e],o={};for(var u in s)if(s.hasOwnProperty(u)){if(u==n)for(var a in r)r.hasOwnProperty(a)&&(o[a]=r[a]);o[u]=s[u]}return i[e]=o},DFS:function(e,n){for(var r in e){n.call(e,r,e[r]);t.util.type(e)==="Object"&&t.languages.DFS(e[r],n)}}},highlightAll:function(e,n){var r=document.querySelectorAll('code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code');for(var i=0,s;s=r[i++];)t.highlightElement(s,e===!0,n)},highlightElement:function(r,i,s){var o,u,a=r;while(a&&!e.test(a.className))a=a.parentNode;if(a){o=(a.className.match(e)||[,""])[1];u=t.languages[o]}if(!u)return;r.className=r.className.replace(e,"").replace(/\s+/g," ")+" language-"+o;a=r.parentNode;/pre/i.test(a.nodeName)&&(a.className=a.className.replace(e,"").replace(/\s+/g," ")+" language-"+o);var f=r.textContent;if(!f)return;var l={element:r,language:o,grammar:u,code:f};t.hooks.run("before-highlight",l);if(i&&self.Worker){var c=new Worker(t.filename);c.onmessage=function(e){l.highlightedCode=n.stringify(JSON.parse(e.data),o);t.hooks.run("before-insert",l);l.element.innerHTML=l.highlightedCode;s&&s.call(l.element);t.hooks.run("after-highlight",l)};c.postMessage(JSON.stringify({language:l.language,code:l.code}))}else{l.highlightedCode=t.highlight(l.code,l.grammar,l.language);t.hooks.run("before-insert",l);l.element.innerHTML=l.highlightedCode;s&&s.call(r);t.hooks.run("after-highlight",l)}},highlight:function(e,r,i){var s=t.tokenize(e,r);return n.stringify(t.util.encode(s),i)},tokenize:function(e,n,r){var i=t.Token,s=[e],o=n.rest;if(o){for(var u in o)n[u]=o[u];delete n.rest}e:for(var u in n){if(!n.hasOwnProperty(u)||!n[u])continue;var a=n[u],f=a.inside,l=!!a.lookbehind,c=0;a=a.pattern||a;for(var h=0;h<s.length;h++){var p=s[h];if(s.length>e.length)break e;if(p instanceof i)continue;a.lastIndex=0;var d=a.exec(p);if(d){l&&(c=d[1].length);var v=d.index-1+c,d=d[0].slice(c),m=d.length,g=v+m,y=p.slice(0,v+1),b=p.slice(g+1),w=[h,1];y&&w.push(y);var E=new i(u,f?t.tokenize(d,f):d);w.push(E);b&&w.push(b);Array.prototype.splice.apply(s,w)}}}return s},hooks:{all:{},add:function(e,n){var r=t.hooks.all;r[e]=r[e]||[];r[e].push(n)},run:function(e,n){var r=t.hooks.all[e];if(!r||!r.length)return;for(var i=0,s;s=r[i++];)s(n)}}},n=t.Token=function(e,t){this.type=e;this.content=t};n.stringify=function(e,r,i){if(typeof e=="string")return e;if(Object.prototype.toString.call(e)=="[object Array]")return e.map(function(t){return n.stringify(t,r,e)}).join("");var s={type:e.type,content:n.stringify(e.content,r,i),tag:"span",classes:["token",e.type],attributes:{},language:r,parent:i};s.type=="comment"&&(s.attributes.spellcheck="true");t.hooks.run("wrap",s);var o="";for(var u in s.attributes)o+=u+'="'+(s.attributes[u]||"")+'"';return"<"+s.tag+' class="'+s.classes.join(" ")+'" '+o+">"+s.content+"</"+s.tag+">"};if(!self.document){if(!self.addEventListener)return self.Prism;self.addEventListener("message",function(e){var n=JSON.parse(e.data),r=n.language,i=n.code;self.postMessage(JSON.stringify(t.tokenize(i,t.languages[r])));self.close()},!1);return self.Prism}var r=document.getElementsByTagName("script");r=r[r.length-1];if(r){t.filename=r.src;document.addEventListener&&!r.hasAttribute("data-manual")&&document.addEventListener("DOMContentLoaded",t.highlightAll)}return self.Prism}();typeof module!="undefined"&&module.exports&&(module.exports=Prism);;
Prism.languages.markup={comment:/<!--[\w\W]*?-->/g,prolog:/<\?.+?\?>/,doctype:/<!DOCTYPE.+?>/,cdata:/<!\[CDATA\[[\w\W]*?]]>/i,tag:{pattern:/<\/?[\w:-]+\s*(?:\s+[\w:-]+(?:=(?:("|')(\\?[\w\W])*?\1|[^\s'">=]+))?\s*)*\/?>/gi,inside:{tag:{pattern:/^<\/?[\w:-]+/i,inside:{punctuation:/^<\/?/,namespace:/^[\w-]+?:/}},"attr-value":{pattern:/=(?:('|")[\w\W]*?(\1)|[^\s>]+)/gi,inside:{punctuation:/=|>|"/g}},punctuation:/\/?>/g,"attr-name":{pattern:/[\w:-]+/g,inside:{namespace:/^[\w-]+?:/}}}},entity:/\&#?[\da-z]{1,8};/gi};Prism.hooks.add("wrap",function(e){e.type==="entity"&&(e.attributes.title=e.content.replace(/&amp;/,"&"))});;
Prism.languages.css={comment:/\/\*[\w\W]*?\*\//g,atrule:{pattern:/@[\w-]+?.*?(;|(?=\s*{))/gi,inside:{punctuation:/[;:]/g}},url:/url\((["']?).*?\1\)/gi,selector:/[^\{\}\s][^\{\};]*(?=\s*\{)/g,property:/(\b|\B)[\w-]+(?=\s*:)/ig,string:/("|')(\\?.)*?\1/g,important:/\B!important\b/gi,punctuation:/[\{\};:]/g,"function":/[-a-z0-9]+(?=\()/ig};Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{style:{pattern:/<style[\w\W]*?>[\w\W]*?<\/style>/ig,inside:{tag:{pattern:/<style[\w\W]*?>|<\/style>/ig,inside:Prism.languages.markup.tag.inside},rest:Prism.languages.css}}});;
Prism.languages.css.selector={pattern:/[^\{\}\s][^\{\}]*(?=\s*\{)/g,inside:{"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/g,"pseudo-class":/:[-\w]+(?:\(.*\))?/g,"class":/\.[-:\.\w]+/g,id:/#[-:\.\w]+/g}};Prism.languages.insertBefore("css","ignore",{hexcode:/#[\da-f]{3,6}/gi,entity:/\\[\da-f]{1,8}/gi,number:/[\d%\.]+/g});;
Prism.languages.clike={comment:{pattern:/(^|[^\\])(\/\*[\w\W]*?\*\/|(^|[^:])\/\/.*?(\r?\n|$))/g,lookbehind:!0},string:/("|')(\\?.)*?\1/g,"class-name":{pattern:/((?:(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[a-z0-9_\.\\]+/ig,lookbehind:!0,inside:{punctuation:/(\.|\\)/}},keyword:/\b(if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/g,"boolean":/\b(true|false)\b/g,"function":{pattern:/[a-z0-9_]+\(/ig,inside:{punctuation:/\(/}},number:/\b-?(0x[\dA-Fa-f]+|\d*\.?\d+([Ee]-?\d+)?)\b/g,operator:/[-+]{1,2}|!|<=?|>=?|={1,3}|&{1,2}|\|?\||\?|\*|\/|\~|\^|\%/g,ignore:/&(lt|gt|amp);/gi,punctuation:/[{}[\];(),.:]/g};;
Prism.languages.javascript=Prism.languages.extend("clike",{keyword:/\b(break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|false|finally|for|function|get|if|implements|import|in|instanceof|interface|let|new|null|package|private|protected|public|return|set|static|super|switch|this|throw|true|try|typeof|var|void|while|with|yield)\b/g,number:/\b-?(0x[\dA-Fa-f]+|\d*\.?\d+([Ee]-?\d+)?|NaN|-?Infinity)\b/g});Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/(^|[^/])\/(?!\/)(\[.+?]|\\.|[^/\r\n])+\/[gim]{0,3}(?=\s*($|[\r\n,.;})]))/g,lookbehind:!0}});Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{script:{pattern:/<script[\w\W]*?>[\w\W]*?<\/script>/ig,inside:{tag:{pattern:/<script[\w\W]*?>|<\/script>/ig,inside:Prism.languages.markup.tag.inside},rest:Prism.languages.javascript}}});
;
Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(\/\*[\w\W]*?\*\/|\/\/.*?(\r?\n|$))/g,lookbehind:!0},atrule:/@[\w-]+(?=\s+(\(|\{|;))/gi,url:/([-a-z]+-)*url(?=\()/gi,selector:/([^@;\{\}\(\)]?([^@;\{\}\(\)]|&|\#\{\$[-_\w]+\})+)(?=\s*\{(\}|\s|[^\}]+(:|\{)[^\}]+))/gm});Prism.languages.insertBefore("scss","atrule",{keyword:/@(if|else if|else|for|each|while|import|extend|debug|warn|mixin|include|function|return|content)|(?=@for\s+\$[-_\w]+\s)+from/i});Prism.languages.insertBefore("scss","property",{variable:/((\$[-_\w]+)|(#\{\$[-_\w]+\}))/i});Prism.languages.insertBefore("scss","ignore",{placeholder:/%[-_\w]+/i,statement:/\B!(default|optional)\b/gi,"boolean":/\b(true|false)\b/g,"null":/\b(null)\b/g,operator:/\s+([-+]{1,2}|={1,2}|!=|\|?\||\?|\*|\/|\%)\s+/g});;

View File

@@ -0,0 +1,327 @@
$buttonPadding: .5rem 1rem;
$buttonIconOnlyWidth: 2.357rem;
$buttonIconOnlyPadding: .5rem 0;
$buttonBg: $primaryColor;
$buttonTextColor: $primaryTextColor;
$buttonBorder: 1px solid $primaryColor;
$buttonHoverBg: $primaryDarkColor;
$buttonTextHoverColor: $primaryTextColor;
$buttonHoverBorderColor: $primaryDarkColor;
$buttonActiveBg: $primaryDarkerColor;
$buttonTextActiveColor: $primaryTextColor;
$buttonActiveBorderColor: $primaryDarkerColor;
$raisedButtonShadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
$roundedButtonBorderRadius: 2rem;
$textButtonHoverBgOpacity:.04;
$textButtonActiveBgOpacity:.16;
$outlinedButtonBorder:1px solid;
$plainButtonTextColor:#6c757d;
$plainButtonHoverBgColor:#e9ecef;
$plainButtonActiveBgColor:#dee2e6;
$secondaryButtonBg: #607D8B;
$secondaryButtonTextColor: #ffffff;
$secondaryButtonBorder: 1px solid #607D8B;
$secondaryButtonHoverBg: #546E7A;
$secondaryButtonTextHoverColor: #ffffff;
$secondaryButtonHoverBorderColor: #546E7A;
$secondaryButtonActiveBg: #455A64;
$secondaryButtonTextActiveColor: #ffffff;
$secondaryButtonActiveBorderColor: #455A64;
$secondaryButtonFocusShadow: 0 0 0 0.2rem #B0BEC5;
$infoButtonBg: #03A9F4;
$infoButtonTextColor: #ffffff;
$infoButtonBorder: 1px solid #03A9F4;
$infoButtonHoverBg: #039BE5;
$infoButtonTextHoverColor: #ffffff;
$infoButtonHoverBorderColor: #039BE5;
$infoButtonActiveBg: #0288D1;
$infoButtonTextActiveColor: #ffffff;
$infoButtonActiveBorderColor: #0288D1;
$infoButtonFocusShadow: 0 0 0 0.2rem lighten($infoButtonBg, 35%);
$successButtonBg: #4CAF50;
$successButtonTextColor: #ffffff;
$successButtonBorder: 1px solid #4CAF50;
$successButtonHoverBg: #43A047;
$successButtonTextHoverColor: #ffffff;
$successButtonHoverBorderColor: #43A047;
$successButtonActiveBg: #388E3C;
$successButtonTextActiveColor: #ffffff;
$successButtonActiveBorderColor: #388E3C;
$successButtonFocusShadow: 0 0 0 0.2rem lighten($successButtonBg, 35%);
$warningButtonBg: #F97316;
$closedButtonBg: #6B7280;
$warningButtonTextColor: $textColor;
$warningButtonBorder: 1px solid #F97316;
$warningButtonHoverBg: #FFB300;
$warningButtonTextHoverColor: $textColor;
$warningButtonHoverBorderColor: #FFB300;
$warningButtonActiveBg: #FFA000;
$warningButtonTextActiveColor: $textColor;
$warningButtonActiveBorderColor: #FFA000;
$warningButtonFocusShadow: 0 0 0 0.2rem lighten($warningButtonBg, 35%);
$helpButtonBg:#9C27B0;
$helpButtonTextColor:#ffffff;
$helpButtonBorder:1px solid #9C27B0;
$helpButtonHoverBg:#8E24AA;
$helpButtonTextHoverColor:#ffffff;
$helpButtonHoverBorderColor:#8E24AA;
$helpButtonActiveBg:#7B1FA2;
$helpButtonTextActiveColor:#ffffff;
$helpButtonActiveBorderColor:#7B1FA2;
$helpButtonFocusShadow:0 0 0 0.2rem #CE93D8;
$dangerButtonBg: #f44336;
$dangerButtonTextColor: #ffffff;
$dangerButtonBorder: 1px solid #f44336;
$dangerButtonHoverBg: #e53935;
$dangerButtonTextHoverColor: #ffffff;
$dangerButtonHoverBorderColor: #e53935;
$dangerButtonActiveBg: #d32f2f;
$dangerButtonTextActiveColor: #ffffff;
$dangerButtonActiveBorderColor: #d32f2f;
$dangerButtonFocusShadow: 0 0 0 0.2rem lighten($dangerButtonBg, 35%);
$linkButtonColor:$primaryDarkerColor;
$linkButtonHoverColor:$primaryDarkerColor;
$linkButtonTextHoverDecoration:underline;
$linkButtonFocusShadow: 0 0 0 0.2rem $focusOutlineColor;
$toggleButtonBg: #ffffff;
$toggleButtonBorder: 1px solid #ced4da;
$toggleButtonTextColor: $textColor;
$toggleButtonIconColor: $textSecondaryColor;
$toggleButtonHoverBg: #e9ecef;
$toggleButtonHoverBorderColor: #ced4da;
$toggleButtonTextHoverColor: $textColor;
$toggleButtonIconHoverColor: $textSecondaryColor;
$toggleButtonActiveBg: $primaryColor;
$toggleButtonActiveBorderColor: $primaryColor;
$toggleButtonTextActiveColor: $primaryTextColor;
$toggleButtonIconActiveColor: $primaryTextColor;
$toggleButtonActiveHoverBg: $primaryDarkColor;
$toggleButtonActiveHoverBorderColor: $primaryDarkColor;
$toggleButtonTextActiveHoverColor: $primaryTextColor;
$toggleButtonIconActiveHoverColor: $primaryTextColor;
$speedDialButtonWidth: 4rem;
$speedDialButtonHeight: 4rem;
$speedDialButtonIconFontSize: 1.3rem;
$speedDialActionWidth: 3rem;
$speedDialActionHeight: 3rem;
$speedDialActionBg: #495057;
$speedDialActionHoverBg: #343a40;
$speedDialActionTextColor: #fff;
$speedDialActionTextHoverColor: #fff;

View File

@@ -0,0 +1,350 @@
$paginatorBg: #ffffff;
$paginatorTextColor: $textSecondaryColor;
$paginatorBorder: solid #e9ecef;
$paginatorBorderWidth: 0;
$paginatorPadding: .5rem 1rem;
$paginatorElementWidth: $buttonIconOnlyWidth;
$paginatorElementHeight: $buttonIconOnlyWidth;
$paginatorElementBg: transparent;
$paginatorElementBorder: 0 none;
$paginatorElementIconColor: $textSecondaryColor;
$paginatorElementHoverBg: #e9ecef;
$paginatorElementHoverBorderColor: transparent;
$paginatorElementIconHoverColor: $textSecondaryColor;
$paginatorElementBorderRadius: $borderRadius;
$paginatorElementMargin: .143rem;
$paginatorElementPadding: 0;
$tableHeaderBorder: 1px solid #e9ecef;
$tableHeaderBorderWidth: 0 0 1px 0;
$tableHeaderBg: #f8f9fa;
$tableHeaderTextColor: $textColor;
$tableHeaderFontWeight: 600;
$tableHeaderPadding: 1rem 1rem;
$tableHeaderCellPadding: 1rem 1rem;
$tableHeaderCellBg: #f8f9fa;
$tableHeaderCellTextColor: $textColor;
$tableHeaderCellFontWeight: 600;
$tableHeaderCellBorder: 1px solid #e9ecef;
$tableHeaderCellBorderWidth: 0 0 1px 0;
$tableHeaderCellHoverBg: #e9ecef;
$tableHeaderCellTextHoverColor: $textColor;
$tableHeaderCellIconColor: $textSecondaryColor;
$tableHeaderCellIconHoverColor: $textSecondaryColor;
$tableHeaderCellHighlightBg:#f8f9fa;
$tableHeaderCellHighlightTextColor:$primaryColor;
$tableHeaderCellHighlightHoverBg:#e9ecef;
$tableHeaderCellHighlightTextHoverColor:$primaryColor;
$tableSortableColumnBadgeSize: 1.143rem;
$tableBodyRowBg: #ffffff;
$tableBodyRowTextColor: $textColor;
$tableBodyRowEvenBg: #ffffff;
$tableBodyRowHoverBg: #e9ecef;
$tableBodyRowTextHoverColor: $textColor;
$tableBodyCellBorder: 1px solid rgba(0,0,0,0.08);
$tableBodyCellBorderWidth: 0 0 1px 0;
$tableBodyCellPadding: 1rem 1rem;
$tableFooterCellPadding: 1rem 1rem;
$tableFooterCellBg: #f8f9fa;
$tableFooterCellTextColor: $textColor;
$tableFooterCellFontWeight: 600;
$tableFooterCellBorder: 1px solid #e9ecef;
$tableFooterCellBorderWidth: 0 0 1px 0;
$tableResizerHelperBg: $primaryColor;
$tableDragHelperBg: rgba($primaryColor, .16);
$tableFooterBorder: 1px solid #e9ecef;
$tableFooterBorderWidth: 0 0 1px 0;
$tableFooterBg: #f8f9fa;
$tableFooterTextColor: $textColor;
$tableFooterFontWeight: 600;
$tableFooterPadding: 1rem 1rem;
$tableCellContentAlignment: left;
$tableTopPaginatorBorderWidth: 1px 0 1px 0;
$tableBottomPaginatorBorderWidth: 0 0 1px 0;
$tableScaleSM: 0.5;
$tableScaleLG: 1.25;
$dataViewContentPadding: 0;
$dataViewContentBorder: 0 none;
$dataViewListItemBorder: solid #e9ecef;
$dataViewListItemBorderWidth: 0 0 1px 0;
$dataScrollerContentPadding: 0;
$dataScrollerContentBorder: 0 none;
$dataScrollerListItemBorder: solid #e9ecef;
$dataScrollerListItemBorderWidth: 0 0 1px 0;
$treeContainerPadding: 0.286rem;
$treeNodePadding: 0.143rem;
$treeNodeContentPadding: .5rem;
$treeNodeChildrenPadding: 0 0 0 1rem;
$treeNodeIconColor: $textSecondaryColor;
$timelineVerticalEventContentPadding:0 1rem;
$timelineHorizontalEventContentPadding:1rem 0;
$timelineEventMarkerWidth:1rem;
$timelineEventMarkerHeight:1rem;
$timelineEventMarkerBorderRadius:50%;
$timelineEventMarkerBorder:2px solid $highlightBg;
$timelineEventMarkerBackground:$highlightTextColor;
$timelineEventConnectorSize:2px;
$timelineEventColor:#dee2e6;
$organizationChartConnectorColor: #dee2e6;

View File

@@ -0,0 +1,559 @@
$inputPadding: 0.5rem 0.5rem;
$inputBg: #ffffff;
$inputTextFontSize: 1rem;
$inputTextColor: $textColor;
$inputIconColor: $textColor;
$inputBorder: 1px solid #ced4da;
$inputHoverBorderColor: $primaryColor;
$inputFocusBorderColor: $primaryColor;
$inputErrorBorderColor: #ced4da #ced4da #ced4da $errorColor;
$inputPlaceholderTextColor: #6c757d;
$inputFilledBg: #f8f9fa;
$inputFilledHoverBg: #f8f9fa;
$inputFilledFocusBg: #f8f9fa;
$inputGroupBg: #e9ecef;
$inputGroupTextColor: $textSecondaryColor;
$inputGroupAddOnMinWidth: 2.357rem;
$inputListBg: #ffffff;
$inputListTextColor: $textColor;
$inputListBorder: $inputBorder;
$inputListPadding: 0.5rem 0;
$inputListItemPadding: 0.5rem 1rem;
$inputListItemBg: transparent;
$inputListItemTextColor: $textColor;
$inputListItemHoverBg: #e9ecef;
$inputListItemTextHoverColor: $textColor;
$inputListItemTextFocusColor: $textColor;
$inputListItemFocusBg: #f8f9fa;
$inputListItemBorder: 0 none;
$inputListItemBorderRadius: 0;
$inputListItemMargin: 0;
$inputListItemFocusShadow: inset 0 0 0 0.15rem $focusOutlineColor;
$inputListHeaderPadding: 0.5rem 1rem;
$inputListHeaderMargin: 0;
$inputListHeaderBg: #f8f9fa;
$inputListHeaderTextColor: $textColor;
$inputListHeaderBorder: 0 none;
$inputOverlayBg: $inputListBg;
$inputOverlayHeaderBg: $inputListHeaderBg;
$inputOverlayBorder: 0 none;
$inputOverlayShadow: 0 3px 6px 0 rgba(0, 0, 0, 0.1);
$checkboxWidth: 20px;
$checkboxHeight: 20px;
$checkboxBorder: 2px solid #ced4da;
$checkboxIconFontSize: 14px;
$checkboxActiveBorderColor: $primaryColor;
$checkboxActiveBg: $primaryColor;
$checkboxIconActiveColor: $primaryTextColor;
$checkboxActiveHoverBg: $primaryDarkerColor;
$checkboxIconActiveHoverColor: $primaryTextColor;
$checkboxActiveHoverBorderColor: $primaryDarkerColor;
$radiobuttonWidth: 20px;
$radiobuttonHeight: 20px;
$radiobuttonBorder: 2px solid #ced4da;
$radiobuttonIconSize: 12px;
$radiobuttonActiveBorderColor: $primaryColor;
$radiobuttonActiveBg: $primaryColor;
$radiobuttonIconActiveColor: $primaryTextColor;
$radiobuttonActiveHoverBg: $primaryDarkerColor;
$radiobuttonIconActiveHoverColor: $primaryTextColor;
$radiobuttonActiveHoverBorderColor: $primaryDarkerColor;
$colorPickerPreviewWidth: 2rem;
$colorPickerPreviewHeight: 2rem;
$colorPickerBg: #323232;
$colorPickerBorder: 1px solid #191919;
$colorPickerHandleColor: #ffffff;
$ratingIconFontSize: 1.143rem;
$ratingCancelIconColor: #e74c3c;
$ratingCancelIconHoverColor: #c0392b;
$ratingStarIconOffColor: $textColor;
$ratingStarIconOnColor: $primaryColor;
$ratingStarIconHoverColor: $primaryColor;
$sliderBg: #dee2e6;
$sliderBorder: 0 none;
$sliderHorizontalHeight: 0.286rem;
$sliderVerticalWidth: 0.286rem;
$sliderHandleWidth: 1.143rem;
$sliderHandleHeight: 1.143rem;
$sliderHandleBg: #ffffff;
$sliderHandleBorder: 2px solid $primaryColor;
$sliderHandleBorderRadius: 50%;
$sliderHandleHoverBorderColor: $primaryColor;
$sliderHandleHoverBg: $primaryColor;
$sliderRangeBg: $primaryColor;
$calendarTableMargin: 0.5rem 0;
$calendarPadding: 0.5rem;
$calendarBg: #ffffff;
$calendarInlineBg: $calendarBg;
$calendarTextColor: $textColor;
$calendarBorder: $inputListBorder;
$calendarOverlayBorder: $inputOverlayBorder;
$calendarHeaderPadding: 0.5rem;
$calendarMonthYearHeaderHoverTextColor: $primaryColor !default;
$calendarHeaderBg: #ffffff;
$calendarInlineHeaderBg: $calendarBg;
$calendarHeaderBorder: 1px solid #dee2e6;
$calendarHeaderTextColor: $textColor;
$calendarHeaderFontWeight: 600;
$calendarHeaderCellPadding: 0.5rem;
$calendarCellDatePadding: 0.5rem;
$calendarCellDateWidth: 2.5rem;
$calendarCellDateHeight: 2.5rem;
$calendarCellDateBorderRadius: 50%;
$calendarCellDateBorder: 1px solid transparent;
$calendarCellDateHoverBg: #e9ecef;
$calendarCellDateTodayBg: #ced4da;
$calendarCellDateTodayBorderColor: transparent;
$calendarCellDateTodayTextColor: $textColor;
$calendarButtonBarPadding: 1rem 0;
$calendarTimePickerPadding: 0.5rem;
$calendarTimePickerElementPadding: 0 0.429rem;
$calendarTimePickerTimeFontSize: 1.286rem;
$calendarBreakpoint: 769px;
$calendarCellDatePaddingSM: 0;
$inputSwitchWidth: 3rem;
$inputSwitchHeight: 1.75rem;
$inputSwitchBorderRadius: 30px;
$inputSwitchHandleWidth: 1.25rem;
$inputSwitchHandleHeight: 1.25rem;
$inputSwitchHandleBorderRadius: 50%;
$inputSwitchSliderPadding: 0.25rem;
$inputSwitchSliderOffBg: #ced4da;
$inputSwitchHandleOffBg: #ffffff;
$inputSwitchSliderOffHoverBg: #c3cad2;
$inputSwitchSliderOnBg: $primaryColor;
$inputSwitchSliderOnHoverBg: $primaryDarkColor;
$inputSwitchHandleOnBg: #ffffff;
$fileUploadProgressBarHeight: 0.25rem;
$fileUploadContentPadding: 2rem 1rem;
$editorToolbarBg: #f8f9fa;
$editorToolbarBorder: 1px solid #dee2e6;
$editorToolbarPadding: 1rem;
$editorToolbarIconColor: #6c757d;
$editorToolbarIconHoverColor: #495057;
$editorIconActiveColor: $primaryColor;
$editorContentBorder: 1px solid #dee2e6;
$editorContentBg: #ffffff;
$passwordMeterBg: #dee2e6;
$passwordWeakBg: #e53935;
$passwordMediumBg: #ffb300;
$passwordStrongBg: #43a047;

View File

@@ -0,0 +1,144 @@
$fontFamily: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
$fontSize: 1rem;
$fontWeight: normal;
$textColor: #495057;
$textSecondaryColor: #6c757d;
$highlightBg: $primaryColor;
$highlightTextColor: $primaryTextColor;
$highlightFocusBg: rgba($primaryColor, 0.24) !default;
$borderRadius: 3px;
$transitionDuration: 0.2s;
$formElementTransition: background-color $transitionDuration,
color $transitionDuration, border-color $transitionDuration,
box-shadow $transitionDuration;
$actionIconTransition: background-color $transitionDuration,
color $transitionDuration, box-shadow $transitionDuration;
$listItemTransition: background-color $transitionDuration,
border-color $transitionDuration, box-shadow $transitionDuration;
$primeIconFontSize: 1rem;
$divider: 1px solid #dee2e6;
$inlineSpacing: 0.5rem;
$disabledOpacity: 0.8;
$maskBg: rgba(0, 0, 0, 0.4);
$loadingIconFontSize: 2rem;
$errorColor: #e4677e;
$focusOutlineColor: #bfd1f6;
$focusOutline: 0 none;
$focusOutlineOffset: 0;
$focusShadow: 0 0 0 0.2rem $focusOutlineColor;
$actionIconWidth: 2rem;
$actionIconHeight: 2rem;
$actionIconBg: transparent;
$actionIconBorder: 0 none;
$actionIconColor: $textSecondaryColor;
$actionIconHoverBg: #e9ecef;
$actionIconHoverBorderColor: transparent;
$actionIconHoverColor: $textColor;
$actionIconBorderRadius: 50%;
$scaleSM: 0.875;
$scaleLG: 1.25;

View File

@@ -0,0 +1,231 @@
$carouselIndicatorsPadding: 1rem;
$carouselIndicatorBg: #e9ecef;
$carouselIndicatorHoverBg: #dee2e6;
$carouselIndicatorBorderRadius: 0;
$carouselIndicatorWidth: 2rem;
$carouselIndicatorHeight: .5rem;
$galleriaMaskBg: rgba(0,0,0,0.9);
$galleriaCloseIconMargin: .5rem;
$galleriaCloseIconFontSize: 2rem;
$galleriaCloseIconBg: transparent;
$galleriaCloseIconColor: #ebedef;
$galleriaCloseIconHoverBg: rgba(255,255,255,0.1);
$galleriaCloseIconHoverColor: #ebedef;
$galleriaCloseIconWidth: 4rem;
$galleriaCloseIconHeight: 4rem;
$galleriaCloseIconBorderRadius: 50%;
$galleriaItemNavigatorBg: rgba(0,0,0,.2);
$galleriaItemNavigatorColor: #aeb6bf;
$galleriaItemNavigatorMargin: .5rem 0;
$galleriaItemNavigatorFontSize: 2rem;
$galleriaItemNavigatorHoverBg: rgba(0,0,0,.3);
$galleriaItemNavigatorHoverColor: #ebedef;
$galleriaItemNavigatorWidth: 4rem;
$galleriaItemNavigatorHeight: 4rem;
$galleriaItemNavigatorBorderRadius: $borderRadius;
$galleriaCaptionBg: rgba(0,0,0,.5);
$galleriaCaptionTextColor: #ebedef;
$galleriaCaptionPadding: 1rem;
$galleriaIndicatorsPadding: 1rem;
$galleriaIndicatorBg: #e9ecef;
$galleriaIndicatorHoverBg: #dee2e6;
$galleriaIndicatorBorderRadius: 50%;
$galleriaIndicatorWidth: 1rem;
$galleriaIndicatorHeight: 1rem;
$galleriaIndicatorsBgOnItem: rgba(0,0,0,.5);
$galleriaIndicatorBgOnItem: rgba(255,255,255,.4);
$galleriaIndicatorHoverBgOnItem: rgba(255,255,255,.6);
$galleriaThumbnailContainerBg: rgba(0,0,0,.9);
$galleriaThumbnailContainerPadding: 1rem .25rem;
$galleriaThumbnailNavigatorBg: transparent;
$galleriaThumbnailNavigatorColor: #aeb6bf;
$galleriaThumbnailNavigatorHoverBg: rgba(255,255,255,0.1);
$galleriaThumbnailNavigatorHoverColor: #aeb6bf;
$galleriaThumbnailNavigatorBorderRadius: 50%;
$galleriaThumbnailNavigatorWidth: 2rem;
$galleriaThumbnailNavigatorHeight: 2rem;
$imageMaskBg:rgba(0,0,0,0.9) !default;
$imagePreviewToolbarPadding:1rem !default;
$imagePreviewIndicatorColor:#f8f9fa !default;
$imagePreviewIndicatorBg:rgba(0,0,0,0.5) !default;
$imagePreviewActionIconBg:transparent !default;
$imagePreviewActionIconColor:#f8f9fa !default;
$imagePreviewActionIconHoverBg:rgba(255,255,255,0.1) !default;
$imagePreviewActionIconHoverColor:#f8f9fa !default;
$imagePreviewActionIconWidth:3rem !default;
$imagePreviewActionIconHeight:3rem !default;
$imagePreviewActionIconFontSize:1.5rem !default;
$imagePreviewActionIconBorderRadius:50% !default;

View File

@@ -0,0 +1,287 @@
$stepsItemBg: #ffffff;
$stepsItemBorder: 1px solid #c8c8c8;
$stepsItemTextColor: $textSecondaryColor;
$stepsItemNumberWidth: 2rem;
$stepsItemNumberHeight: 2rem;
$stepsItemNumberFontSize: 1.143rem;
$stepsItemNumberColor: $textColor;
$stepsItemNumberBorderRadius: 50%;
$stepsItemActiveFontWeight: 600;
$menuWidth: 12.5rem;
$menuBg: #ffffff;
$menuBorder: 1px solid #dee2e6;
$menuTextColor: $textColor;
$menuitemPadding: 0.75rem 1rem;
$menuitemBorderRadius: 0;
$menuitemTextColor: $textColor;
$menuitemIconColor: $textSecondaryColor;
$menuitemTextHoverColor: $textColor;
$menuitemIconHoverColor: $textSecondaryColor;
$menuitemHoverBg: #e9ecef;
$menuitemTextFocusColor: $textColor;
$menuitemIconFocusColor: $textColor;
$menuitemFocusBg: #f8f9fa;
$menuitemTextActiveColor: $textColor;
$menuitemIconActiveColor: $textSecondaryColor;
$menuitemActiveBg: #e9ecef;
$menuitemActiveFocusBg: #e9ecef;
$menuitemSubmenuIconFontSize: 0.875rem;
$submenuHeaderMargin: 0;
$submenuHeaderPadding: 0.75rem 1rem;
$submenuHeaderBg: #ffffff;
$submenuHeaderTextColor: $textColor;
$submenuHeaderBorderRadius: 0;
$submenuHeaderFontWeight: 600;
$overlayMenuBg: $menuBg;
$overlayMenuBorder: 0 none;
$overlayMenuShadow: 0 1px 6px 0 rgba(0, 0, 0, 0.1);
$verticalMenuPadding: 0.25rem 0;
$menuSeparatorMargin: 0.25rem 0;
$breadcrumbPadding: 1rem;
$breadcrumbBg: $menuBg;
$breadcrumbBorder: $menuBorder;
$breadcrumbItemTextColor: $menuitemTextColor;
$breadcrumbItemIconColor: $menuitemIconColor;
$breadcrumbLastItemTextColor: $menuitemTextColor;
$breadcrumbLastItemIconColor: $menuitemIconColor;
$breadcrumbSeparatorColor: $menuitemTextColor;
$horizontalMenuPadding: 0.5rem;
$horizontalMenuBg: #f8f9fa;
$horizontalMenuBorder: $menuBorder;
$horizontalMenuTextColor: $menuTextColor;
$horizontalMenuRootMenuitemPadding: $menuitemPadding;
$horizontalMenuRootMenuitemBorderRadius: $borderRadius;
$horizontalMenuRootMenuitemTextColor: $menuitemTextColor;
$horizontalMenuRootMenuitemIconColor: $menuitemIconColor;
$horizontalMenuRootMenuitemTextHoverColor: $menuitemTextHoverColor;
$horizontalMenuRootMenuitemIconHoverColor: $menuitemIconHoverColor;
$horizontalMenuRootMenuitemHoverBg: $menuitemHoverBg;
$horizontalMenuRootMenuitemTextActiveColor: $menuitemTextActiveColor;
$horizontalMenuRootMenuitemIconActiveColor: $menuitemIconActiveColor;
$horizontalMenuRootMenuitemActiveBg: $menuitemActiveBg;
$dockActionWidth: 4rem;
$dockActionHeight: 4rem;
$dockItemPadding: 0.5rem;
$dockItemBorderRadius: $borderRadius;
$dockCurrentItemMargin: 1.5rem;
$dockFirstItemsMargin: 1.3rem;
$dockSecondItemsMargin: 0.9rem;
$dockBg: rgba(255, 255, 255, 0.1);
$dockBorder: 1px solid rgba(255, 255, 255, 0.2);
$dockPadding: 0.5rem 0.5rem;
$dockBorderRadius: 0.5rem;

View File

@@ -0,0 +1,143 @@
$messageMargin: 1rem 0;
$messagePadding: 1rem 1.5rem;
$messageBorderWidth: 0 0 0 4px;
$messageIconFontSize: 1.5rem;
$messageTextFontSize: 1rem;
$messageTextFontWeight: 500;
$inlineMessagePadding: $inputPadding;
$inlineMessageMargin: 0;
$inlineMessageIconFontSize: 1rem;
$inlineMessageTextFontSize: 1rem;
$inlineMessageBorderWidth: 1px;
$toastIconFontSize: 2rem;
$toastMessageTextMargin: 0 0 0 1rem;
$toastMargin: 0 0 1rem 0;
$toastPadding: 1rem;
$toastBorderWidth: 0 0 0 4px;
$toastShadow: 0 3px 14px 0 rgba(0, 0, 0, 0.3);
$toastOpacity: .9;
$toastTitleFontWeight: 700;
$toastDetailMargin: $inlineSpacing 0 0 0;
$infoMessageBg: #039BE5;
$infoMessageBorder: solid #027cb7;
$infoMessageTextColor: #ffffff;
$infoMessageIconColor: #ffffff;
$successMessageBg: #43A047;
$successMessageBorder: 0 none;
$successMessageTextColor: #ffffff;
$successMessageIconColor: #ffffff;
$warningMessageBg: #FFB300;
$warningMessageBorder: 0 none;
$warningMessageTextColor: $textColor;
$warningMessageIconColor: $textColor;
$errorMessageBg: #E53935;
$errorMessageBorder: 0 none;
$errorMessageTextColor: #ffffff;
$errorMessageIconColor: #ffffff;

View File

@@ -0,0 +1,113 @@
$inplacePadding: $inputPadding;
$inplaceHoverBg: #e9ecef;
$inplaceTextHoverColor: $textColor;
$badgeBg: $primaryColor;
$badgeTextColor: $primaryTextColor;
$badgeMinWidth: 1.5rem;
$badgeHeight: 1.5rem;
$badgeFontWeight: 700;
$badgeFontSize: .75rem;
$tagPadding: .25rem .4rem;
$progressBarHeight: 1.5rem;
$progressBarBorder: 0 none;
$progressBarBg: #dee2e6;
$progressBarValueBg: $primaryColor;
$progressBarValueTextColor:$primaryTextColor;
$avatarBg:#dee2e6;
$avatarTextColor:$textColor;
$chipBg:#dee2e6;
$chipTextColor:$textColor;
$chipBorderRadius:16px;
$scrollTopBg:rgba(0,0,0,0.7);
$scrollTopHoverBg:rgba(0,0,0,0.8);
$scrollTopWidth:3rem;
$scrollTopHeight:3rem;
$scrollTopBorderRadius:50%;
$scrollTopFontSize:1.5rem;
$scrollTopTextColor:#f8f9fa;
$skeletonBg:#e9ecef;
$skeletonAnimationBg:rgba(255,255,255,0.4);

View File

@@ -0,0 +1,67 @@
$overlayContentBorder: 0 none;
$overlayContentBg:$panelContentBg;
$overlayContainerShadow: 0 0 14px 0 rgba(0, 0, 0, 0.1);
$dialogHeaderBg: #ffffff;
$dialogHeaderBorder: 1px solid #dee2e6;
$dialogHeaderTextColor: $panelHeaderTextColor;
$dialogHeaderFontWeight: 600;
$dialogHeaderFontSize: 1.25rem;
$dialogHeaderPadding: 1.5rem;
$dialogContentPadding: 0 1.5rem;
$dialogFooterBorder: 1px solid #dee2e6;
$dialogFooterPadding: 1.5rem;
$confirmPopupContentPadding:$panelContentPadding;
$confirmPopupFooterPadding:0 1rem 1rem 1rem;
$tooltipBg: $textColor;
$tooltipTextColor: #ffffff;
$tooltipPadding: $inputPadding;

View File

@@ -0,0 +1,316 @@
$panelHeaderBorderColor: #dee2e6;
$panelHeaderBorder: 1px solid #dee2e6;
$panelHeaderBg: #f8f9fa;
$panelHeaderTextColor: $textColor;
$panelHeaderFontWeight: 600;
$panelHeaderPadding: 1rem;
$panelToggleableHeaderPadding: .5rem 1rem;
$panelContentBorderColor: #dee2e6;
$panelContentBorder: 1px solid #dee2e6;
$panelContentBg: #ffffff;
$panelContentEvenRowBg: #e9ecef;
$panelContentTextColor: $textColor;
$panelContentPadding: 1rem;
$panelFooterBorder: 1px solid #dee2e6;
$panelFooterBg: #ffffff;
$panelFooterTextColor: $textColor;
$panelFooterPadding: 0.5rem 1rem;
$accordionSpacing: 0;
$accordionHeaderBorder: $panelHeaderBorder;
$accordionHeaderBg: $panelHeaderBg;
$accordionHeaderTextColor: $panelHeaderTextColor;
$accordionHeaderFontWeight: $panelHeaderFontWeight;
$accordionHeaderPadding: $panelHeaderPadding;
$accordionHeaderHoverBg: #e9ecef;
$accordionHeaderHoverBorderColor: $panelHeaderBorder;
$accordionHeaderTextHoverColor: $textColor;
$accordionHeaderActiveBg: $panelHeaderBg;
$accordionHeaderActiveBorderColor: #dee2e6;
$accordionHeaderTextActiveColor: $textColor;
$accordionHeaderActiveHoverBg: #e9ecef;
$accordionHeaderActiveHoverBorderColor: #dee2e6;
$accordionHeaderTextActiveHoverColor: $textColor;
$accordionContentBorder: $panelContentBorder;
$accordionContentBg: $panelContentBg;
$accordionContentTextColor: $panelContentTextColor;
$accordionContentPadding: $panelContentPadding;
$tabviewNavBorder: 1px solid #dee2e6;
$tabviewNavBorderWidth: 0 0 2px 0;
$tabviewNavBg: #ffffff;
$tabviewHeaderSpacing: 0;
$tabviewHeaderBorder: solid #dee2e6;
$tabviewHeaderBorderWidth: 0 0 2px 0;
$tabviewHeaderBorderColor: transparent transparent #dee2e6 transparent;
$tabviewHeaderBg: #ffffff;
$tabviewHeaderTextColor: $textSecondaryColor;
$tabviewHeaderFontWeight: $panelHeaderFontWeight;
$tabviewHeaderPadding: $panelHeaderPadding;
$tabviewHeaderMargin: 0 0 -2px 0;
$tabviewHeaderHoverBg: #ffffff;
$tabviewHeaderHoverBorderColor: #9ba2aa;
$tabviewHeaderTextHoverColor: $textSecondaryColor;
$tabviewHeaderActiveBg: #ffffff;
$tabviewHeaderActiveBorderColor: $primaryColor;
$tabviewHeaderTextActiveColor: $primaryColor;
$tabviewContentBorder: 0 none;
$tabviewContentBg: $panelContentBg;
$tabviewContentTextColor: $panelContentTextColor;
$tabviewContentPadding: $panelContentPadding;
$panelHeaderHoverBg: #e9ecef;
$panelHeaderHoverBorderColor: #dee2e6;
$panelHeaderTextHoverColor: $textColor;
$scrollPanelTrackBorder: 0 none;
$scrollPanelTrackBg: #f8f9fa;
$cardBodyPadding: 1rem;
$cardTitleFontSize: 1.5rem;
$cardTitleFontWeight: 700;
$cardSubTitleFontWeight: 700;
$cardSubTitleColor: $textSecondaryColor;
$cardContentPadding: 1rem 0;
$cardFooterPadding: 1rem 0 0 0;
$cardShadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0,0,0,.12);
$dividerHorizontalMargin:1rem 0;
$dividerHorizontalPadding:0 1rem;
$dividerVerticalMargin:0 1rem;
$dividerVerticalPadding:1rem 0;
$dividerSize:1px;
$dividerColor:#dee2e6;
$splitterGutterBg:#f8f9fa;
$splitterGutterHandleBg:#dee2e6;

View File

@@ -0,0 +1,18 @@
:root {
@if variable-exists(colors) {
@each $name, $color in $colors {
@for $i from 0 through 5 {
@if ($i == 0) {
--#{$name}-50:#{tint($color, (5 - $i) * 19%)};
}
@else {
--#{$name}-#{$i * 100}:#{tint($color, (5 - $i) * 19%)};
}
}
@for $i from 1 through 4 {
--#{$name}-#{($i + 5) * 100}:#{shade($color, $i * 15%)};
}
}
}
}

View File

@@ -0,0 +1,75 @@
* {
box-sizing: border-box;
}
.p-component {
font-family: var(--font-family);
font-feature-settings: var(--font-feature-settings, normal);
font-size: $fontSize;
font-weight: $fontWeight;
}
.p-component-overlay {
background-color: $maskBg;
transition-duration: $transitionDuration;
}
.p-disabled, .p-component:disabled {
opacity: $disabledOpacity;
}
.p-error {
color: $errorColor;
}
.p-text-secondary {
color: $textSecondaryColor;
}
.pi {
font-size: $primeIconFontSize;
}
.p-icon {
width: $primeIconFontSize;
height: $primeIconFontSize;
}
.p-link {
font-family: var(--font-family);
font-feature-settings: var(--font-feature-settings, normal);
font-size: $fontSize;
border-radius: $borderRadius;
&:focus-visible {
@include focused();
}
}
.p-component-overlay-enter {
animation: p-component-overlay-enter-animation 150ms forwards;
}
.p-component-overlay-leave {
animation: p-component-overlay-leave-animation 150ms forwards;
}
.p-component-overlay {
@keyframes p-component-overlay-enter-animation {
from {
background-color: transparent;
}
to {
background-color: var(--maskbg);
}
}
@keyframes p-component-overlay-leave-animation {
from {
background-color: var(--maskbg);
}
to {
background-color: transparent;
}
}
}

View File

@@ -0,0 +1,111 @@
@import '_mixins.scss';
@import '_colors.scss';
@import './components/input/_editor.scss';
@layer primereact {
@import '_common.scss';
/*//Input*/
@import './components/input/_autocomplete.scss';
@import './components/input/_calendar.scss';
@import './components/input/_cascadeselect.scss';
@import './components/input/_checkbox.scss';
@import './components/input/tristatecheckbox.scss';
@import './components/input/_chips.scss';
@import './components/input/_colorpicker.scss';
@import './components/input/_dropdown.scss';
@import './components/input/_inputgroup.scss';
@import './components/input/_inputnumber.scss';
@import './components/input/_inputswitch.scss';
@import './components/input/_inputtext.scss';
@import './components/input/_iconfield.scss';
@import './components/input/_inputicon.scss';
@import './components/input/_inputotp.scss';
@import './components/input/_listbox.scss';
@import './components/input/_mention.scss';
@import './components/input/_multiselect.scss';
@import './components/input/_password.scss';
@import './components/input/_radiobutton.scss';
@import './components/input/_rating.scss';
@import './components/input/_selectbutton.scss';
@import './components/input/_slider.scss';
@import './components/input/_treeselect.scss';
@import './components/input/_togglebutton.scss';
/*//Button*/
@import './components/button/_button.scss';
@import './components/button/_splitbutton.scss';
@import './components/button/_speeddial.scss';
/*//Data*/
@import './components/data/_carousel.scss';
@import './components/data/_datatable.scss';
@import './components/data/_dataview.scss';
@import './components/data/_datascroller.scss';
@import './components/data/_filter.scss';
@import './components/data/_orderlist.scss';
@import './components/data/_organizationchart.scss';
@import './components/data/_paginator.scss';
@import './components/data/_picklist.scss';
@import './components/data/_tree.scss';
@import './components/data/_treetable.scss';
@import './components/data/_timeline.scss';
/*//Panel*/
@import './components/panel/_accordion.scss';
@import './components/panel/_card.scss';
@import './components/panel/_fieldset.scss';
@import './components/panel/_divider.scss';
@import './components/panel/_panel.scss';
@import './components/panel/_splitter.scss';
@import './components/panel/_stepper.scss';
@import './components/panel/_scrollpanel.scss';
@import './components/panel/_tabview.scss';
@import './components/panel/_toolbar.scss';
/*//Overlay*/
@import './components/overlay/_confirmpopup.scss';
@import './components/overlay/_dialog.scss';
@import './components/overlay/_overlaypanel.scss';
@import './components/overlay/_sidebar.scss';
@import './components/overlay/_tooltip.scss';
/*//File*/
@import './components/file/_fileupload.scss';
/*//Menu*/
@import './components/menu/_breadcrumb.scss';
@import './components/menu/_contextmenu.scss';
@import './components/menu/_dock.scss';
@import './components/menu/_megamenu.scss';
@import './components/menu/_menu.scss';
@import './components/menu/_menubar.scss';
@import './components/menu/_panelmenu.scss';
@import './components/menu/_slidemenu.scss';
@import './components/menu/_steps.scss';
@import './components/menu/_tabmenu.scss';
@import './components/menu/_tieredmenu.scss';
/*//Messages*/
@import './components/messages/_inlinemessage.scss';
@import './components/messages/_message.scss';
@import 'components/messages/toast.scss';
/*//MultiMedia*/
@import './components/multimedia/_galleria.scss';
@import './components/multimedia/_image.scss';
/*//Misc*/
@import './components/misc/_avatar.scss';
@import './components/misc/_chip.scss';
@import './components/misc/_scrolltop.scss';
@import './components/misc/_skeleton.scss';
@import './components/misc/_tag.scss';
@import './components/misc/_inplace.scss';
@import './components/misc/metergroup.scss';
@import './components/misc/_progressbar.scss';
@import './components/misc/_terminal.scss';
@import './components/misc/_blockui.scss';
@import './components/misc/_badge.scss';
}

View File

@@ -0,0 +1,243 @@
@mixin icon-override($icon) {
&:before {
content: $icon;
}
}
@mixin focused() {
outline: $focusOutline;
outline-offset: $focusOutlineOffset;
box-shadow: $focusShadow;
}
@mixin focused-inset() {
outline: $focusOutline;
outline-offset: $focusOutlineOffset;
box-shadow: inset $focusShadow;
}
@mixin focused-input() {
@include focused();
border-color: $inputFocusBorderColor;
}
@mixin focused-listitem() {
outline: $focusOutline;
outline-offset: $focusOutlineOffset;
box-shadow: $inputListItemFocusShadow;
}
@mixin invalid-input() {
border-color: $inputErrorBorderColor;
}
@mixin menuitem-link {
> .p-menuitem-content {
color: $menuitemTextColor;
transition: $listItemTransition;
border-radius: $menuitemBorderRadius;
.p-menuitem-link {
color: $menuitemTextColor;
padding: $menuitemPadding;
user-select: none;
.p-menuitem-text {
color: $menuitemTextColor;
}
.p-menuitem-icon {
color: $menuitemIconColor;
margin-right: $inlineSpacing;
}
.p-submenu-icon {
color: $menuitemIconColor;
}
}
}
&.p-highlight {
> .p-menuitem-content {
color: $menuitemTextActiveColor;
background: $menuitemActiveBg;
.p-menuitem-link {
.p-menuitem-text {
color: $menuitemTextActiveColor;
}
.p-menuitem-icon,
.p-submenu-icon {
color: $menuitemIconActiveColor;
}
}
}
&.p-focus {
> .p-menuitem-content {
background: $menuitemActiveFocusBg;
}
}
}
&:not(.p-highlight):not(.p-disabled) {
&.p-focus {
> .p-menuitem-content {
color: $menuitemTextFocusColor;
background: $menuitemFocusBg;
.p-menuitem-link {
.p-menuitem-text {
color: $menuitemTextFocusColor;
}
.p-menuitem-icon,
.p-submenu-icon {
color: $menuitemIconFocusColor;
}
}
}
}
> .p-menuitem-content {
&:hover {
color: $menuitemTextHoverColor;
background: $menuitemHoverBg;
.p-menuitem-link {
.p-menuitem-text {
color: $menuitemTextHoverColor;
}
.p-menuitem-icon,
.p-submenu-icon {
color: $menuitemIconHoverColor;
}
}
}
}
}
}
@mixin horizontal-rootmenuitem-link {
> .p-menuitem-content {
color: $horizontalMenuRootMenuitemTextColor;
transition: $listItemTransition;
border-radius: $horizontalMenuRootMenuitemBorderRadius;
.p-menuitem-link {
padding: $horizontalMenuRootMenuitemPadding;
user-select: none;
.p-menuitem-text {
color: $horizontalMenuRootMenuitemTextColor;
}
.p-menuitem-icon {
color: $horizontalMenuRootMenuitemIconColor;
margin-right: $inlineSpacing;
}
.p-submenu-icon {
color: $horizontalMenuRootMenuitemIconColor;
margin-left: $inlineSpacing;
}
}
}
&:not(.p-highlight):not(.p-disabled) {
> .p-menuitem-content {
&:hover {
color: $horizontalMenuRootMenuitemTextHoverColor;
background: $horizontalMenuRootMenuitemHoverBg;
.p-menuitem-link {
.p-menuitem-text {
color: $horizontalMenuRootMenuitemTextHoverColor;
}
.p-menuitem-icon,
.p-submenu-icon {
color: $horizontalMenuRootMenuitemIconHoverColor;
}
}
}
}
}
}
@mixin placeholder {
::-webkit-input-placeholder {
@content;
}
:-moz-placeholder {
@content;
}
::-moz-placeholder {
@content;
}
:-ms-input-placeholder {
@content;
}
}
@mixin scaledPadding($val, $scale) {
padding: nth($val, 1) * $scale nth($val, 2) * $scale;
}
@mixin scaledFontSize($val, $scale) {
font-size: $val * $scale;
}
@mixin nested-submenu-indents($val, $index, $length) {
ul {
li {
a {
padding-left: $val * ($index + 1);
}
@if $index < $length {
@include nested-submenu-indents($val, $index + 2, $length);
}
}
}
}
@mixin action-icon($enabled: true) {
width: $actionIconWidth;
height: $actionIconHeight;
color: $actionIconColor;
border: $actionIconBorder;
background: $actionIconBg;
border-radius: $actionIconBorderRadius;
transition: $actionIconTransition;
@if $enabled {
&:enabled:hover {
@include action-icon-hover();
}
} @else {
&:hover {
@include action-icon-hover();
}
}
&:focus-visible {
@include focused();
}
}
@mixin action-icon-hover() {
color: $actionIconHoverColor;
border-color: $actionIconHoverBorderColor;
background: $actionIconHoverBg;
}
@function tint($color, $percentage) {
@return mix(#fff, $color, $percentage);
}
@function shade($color, $percentage) {
@return mix(#000, $color, $percentage);
}

View File

@@ -0,0 +1,644 @@
.p-button {
color: $buttonTextColor;
background: $buttonBg;
border: $buttonBorder;
padding: $buttonPadding;
font-size: $fontSize;
transition: $formElementTransition;
border-radius: $borderRadius;
&:not(:disabled):hover {
background: $buttonHoverBg;
color: $buttonTextHoverColor;
border-color: $buttonHoverBorderColor;
}
&:not(:disabled):active {
background: $buttonActiveBg;
color: $buttonTextActiveColor;
border-color: $buttonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $buttonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($buttonBg, $textButtonHoverBgOpacity);
color: $buttonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($buttonBg, $textButtonActiveBgOpacity);
color: $buttonBg;
border: $outlinedButtonBorder;
}
&.p-button-plain {
color: $plainButtonTextColor;
border-color: $plainButtonTextColor;
&:not(:disabled):hover {
background: $plainButtonHoverBgColor;
color: $plainButtonTextColor;
}
&:not(:disabled):active {
background: $plainButtonActiveBgColor;
color: $plainButtonTextColor;
}
}
}
&.p-button-text {
background-color: transparent;
color: $buttonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($buttonBg, $textButtonHoverBgOpacity);
color: $buttonBg;
border-color: transparent;
}
&:not(:disabled):active {
background: rgba($buttonBg, $textButtonActiveBgOpacity);
color: $buttonBg;
border-color: transparent;
}
&.p-button-plain {
color: $plainButtonTextColor;
&:not(:disabled):hover {
background: $plainButtonHoverBgColor;
color: $plainButtonTextColor;
}
&:not(:disabled):active {
background: $plainButtonActiveBgColor;
color: $plainButtonTextColor;
}
}
}
&:focus {
@include focused();
}
.p-button-label {
transition-duration: $transitionDuration;
}
.p-button-icon-left {
margin-right: $inlineSpacing;
}
.p-button-icon-right {
margin-left: $inlineSpacing;
}
.p-button-icon-bottom {
margin-top: $inlineSpacing;
}
.p-button-icon-top {
margin-bottom: $inlineSpacing;
}
.p-badge {
margin-left: $inlineSpacing;
min-width: $fontSize;
height: $fontSize;
line-height: $fontSize;
color: $buttonBg;
background-color: $buttonTextColor;
}
&.p-button-raised {
box-shadow: $raisedButtonShadow;
}
&.p-button-rounded {
border-radius: $roundedButtonBorderRadius;
}
&.p-button-icon-only {
width: $buttonIconOnlyWidth;
padding: $buttonIconOnlyPadding;
.p-button-icon-left,
.p-button-icon-right {
margin: 0;
}
&.p-button-rounded {
border-radius: 50%;
height: $buttonIconOnlyWidth;
}
}
&.p-button-sm {
@include scaledFontSize($fontSize, $scaleSM);
@include scaledPadding($buttonPadding, $scaleSM);
.p-button-icon {
@include scaledFontSize($primeIconFontSize, $scaleSM);
}
}
&.p-button-lg {
@include scaledFontSize($fontSize, $scaleLG);
@include scaledPadding($buttonPadding, $scaleLG);
.p-button-icon {
@include scaledFontSize($primeIconFontSize, $scaleLG);
}
}
&.p-button-loading-label-only {
&.p-button-loading-left {
.p-button-label {
margin-left: $inlineSpacing;
}
}
&.p-button-loading-right {
.p-button-label {
margin-right: $inlineSpacing;
}
}
&.p-button-loading-top {
.p-button-label {
margin-top: $inlineSpacing;
}
}
&.p-button-loading-bottom {
.p-button-label {
margin-bottom: $inlineSpacing;
}
}
.p-button-loading-icon {
margin: 0;
}
}
}
.p-fluid {
.p-button {
width: 100%;
}
.p-button-icon-only {
width: $buttonIconOnlyWidth;
}
.p-button-group {
display: flex;
.p-button {
flex: 1;
}
}
}
.p-button.p-button-secondary, .p-button-group.p-button-secondary > .p-button, .p-splitbutton.p-button-secondary > .p-button, .p-fileupload-choose.p-button-secondary {
color: $secondaryButtonTextColor;
background: $secondaryButtonBg;
border: $secondaryButtonBorder;
&:not(:disabled):hover {
background: $secondaryButtonHoverBg;
color: $secondaryButtonTextHoverColor;
border-color: $secondaryButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $secondaryButtonFocusShadow;
}
&:not(:disabled):active {
background: $secondaryButtonActiveBg;
color: $secondaryButtonTextActiveColor;
border-color: $secondaryButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $secondaryButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($secondaryButtonBg, $textButtonHoverBgOpacity);
color: $secondaryButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($secondaryButtonBg, $textButtonActiveBgOpacity);
color: $secondaryButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $secondaryButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($secondaryButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $secondaryButtonBg;
}
&:not(:disabled):active {
background: rgba($secondaryButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $secondaryButtonBg;
}
}
}
.p-button.p-button-info, .p-button-group.p-button-info > .p-button, .p-splitbutton.p-button-info > .p-button, .p-fileupload-choose.p-button-info {
color: $infoButtonTextColor;
background: $infoButtonBg;
border: $infoButtonBorder;
&:not(:disabled):hover {
background: $infoButtonHoverBg;
color: $infoButtonTextHoverColor;
border-color: $infoButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $infoButtonFocusShadow;
}
&:not(:disabled):active {
background: $infoButtonActiveBg;
color: $infoButtonTextActiveColor;
border-color: $infoButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $infoButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($infoButtonBg, $textButtonHoverBgOpacity);
color: $infoButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($infoButtonBg, $textButtonActiveBgOpacity);
color: $infoButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $infoButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($infoButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $infoButtonBg;
}
&:not(:disabled):active {
background: rgba($infoButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $infoButtonBg;
}
}
}
.p-button.p-button-success, .p-button-group.p-button-success > .p-button, .p-splitbutton.p-button-success > .p-button, .p-fileupload-choose.p-button-success {
color: $successButtonTextColor;
background: $successButtonBg;
border: $successButtonBorder;
&:not(:disabled):hover {
background: $successButtonHoverBg;
color: $successButtonTextHoverColor;
border-color: $successButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $successButtonFocusShadow;
}
&:not(:disabled):active {
background: $successButtonActiveBg;
color: $successButtonTextActiveColor;
border-color: $successButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $successButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($successButtonBg, $textButtonHoverBgOpacity);
color: $successButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($successButtonBg, $textButtonActiveBgOpacity);
color: $successButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $successButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($successButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $successButtonBg;
}
&:not(:disabled):active {
background: rgba($successButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $successButtonBg;
}
}
}
.p-button.p-button-warning, .p-button-group.p-button-warning > .p-button, .p-splitbutton.p-button-warning > .p-button, .p-fileupload-choose.p-button-warning {
color: $warningButtonTextColor;
background: $warningButtonBg;
border: $warningButtonBorder;
&:not(:disabled):hover {
background: $warningButtonHoverBg;
color: $warningButtonTextHoverColor;
border-color: $warningButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $warningButtonFocusShadow;
}
&:not(:disabled):active {
background: $warningButtonActiveBg;
color: $warningButtonTextActiveColor;
border-color: $warningButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $warningButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($warningButtonBg, $textButtonHoverBgOpacity);
color: $warningButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($warningButtonBg, $textButtonActiveBgOpacity);
color: $warningButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $warningButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($warningButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $warningButtonBg;
}
&:not(:disabled):active {
background: rgba($warningButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $warningButtonBg;
}
}
}
.p-button.p-button-help, .p-button-group.p-button-help > .p-button, .p-splitbutton.p-button-help > .p-button, .p-fileupload-choose.p-button-help {
color: $helpButtonTextColor;
background: $helpButtonBg;
border: $helpButtonBorder;
&:not(:disabled):hover {
background: $helpButtonHoverBg;
color: $helpButtonTextHoverColor;
border-color: $helpButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $helpButtonFocusShadow;
}
&:not(:disabled):active {
background: $helpButtonActiveBg;
color: $helpButtonTextActiveColor;
border-color: $helpButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $helpButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($helpButtonBg, $textButtonHoverBgOpacity);
color: $helpButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($helpButtonBg, $textButtonActiveBgOpacity);
color: $helpButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $helpButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($helpButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $helpButtonBg;
}
&:not(:disabled):active {
background: rgba($helpButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $helpButtonBg;
}
}
}
.p-button.p-button-danger, .p-button-group.p-button-danger > .p-button, .p-splitbutton.p-button-danger > .p-button, .p-fileupload-choose.p-button-danger {
color: $dangerButtonTextColor;
background: $dangerButtonBg;
border: $dangerButtonBorder;
&:not(:disabled):hover {
background: $dangerButtonHoverBg;
color: $dangerButtonTextHoverColor;
border-color: $dangerButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $dangerButtonFocusShadow;
}
&:not(:disabled):active {
background: $dangerButtonActiveBg;
color: $dangerButtonTextActiveColor;
border-color: $dangerButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $dangerButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($dangerButtonBg, $textButtonHoverBgOpacity);
color: $dangerButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($dangerButtonBg, $textButtonActiveBgOpacity);
color: $dangerButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $dangerButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($dangerButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $dangerButtonBg;
}
&:not(:disabled):active {
background: rgba($dangerButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $dangerButtonBg;
}
}
}
@if variable-exists(contrastButtonTextColor) {
.p-button.p-button-contrast, .p-button-group.p-button-contrast > .p-button, .p-splitbutton.p-button-contrast > .p-button {
color: $contrastButtonTextColor;
background: $contrastButtonBg;
border: $contrastButtonBorder;
&:not(:disabled):hover {
background: $contrastButtonHoverBg;
color: $contrastButtonTextHoverColor;
border-color: $contrastButtonHoverBorderColor;
}
&:not(:disabled):focus {
box-shadow: $contrastButtonFocusShadow;
}
&:not(:disabled):active {
background: $contrastButtonActiveBg;
color: $contrastButtonTextActiveColor;
border-color: $contrastButtonActiveBorderColor;
}
&.p-button-outlined {
background-color: transparent;
color: $contrastButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($contrastButtonBg, $textButtonHoverBgOpacity);
color: $contrastButtonBg;
border: $outlinedButtonBorder;
}
&:not(:disabled):active {
background: rgba($contrastButtonBg, $textButtonActiveBgOpacity);
color: $contrastButtonBg;
border: $outlinedButtonBorder;
}
}
&.p-button-text {
background-color: transparent;
color: $contrastButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($contrastButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $contrastButtonBg;
}
&:not(:disabled):active {
background: rgba($contrastButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $contrastButtonBg;
}
}
}
}
.p-button.p-button-link {
color: $linkButtonColor;
background: transparent;
border: transparent;
&:not(:disabled):hover {
background: transparent;
color: $linkButtonHoverColor;
border-color: transparent;
.p-button-label {
text-decoration: $linkButtonTextHoverDecoration;
}
}
&:not(:disabled):focus {
background: transparent;
box-shadow: $linkButtonFocusShadow;
border-color: transparent;
}
&:not(:disabled):active {
background: transparent;
color: $linkButtonColor;
border-color: transparent;
}
}

View File

@@ -0,0 +1,91 @@
@use "sass:math";
.p-speeddial-button {
&.p-button.p-button-icon-only {
width: $speedDialButtonWidth;
height: $speedDialButtonHeight;
.p-button-icon {
font-size: $speedDialButtonIconFontSize;
&.p-icon {
width: $speedDialButtonIconFontSize;
height: $speedDialButtonIconFontSize;
}
}
}
}
.p-speeddial-list {
outline: 0 none;
}
.p-speeddial-action {
width: $speedDialActionWidth;
height: $speedDialActionHeight;
background: $speedDialActionBg;
color: $speedDialActionTextColor;
&:hover {
background: $speedDialActionHoverBg;
color: $speedDialActionTextHoverColor;
}
}
.p-speeddial-direction-up {
.p-speeddial-item {
margin: math.div($inlineSpacing, 2);
&:first-child {
margin-bottom: $inlineSpacing;
}
}
}
.p-speeddial-direction-down {
.p-speeddial-item {
margin: math.div($inlineSpacing, 2);
&:first-child {
margin-top: $inlineSpacing;
}
}
}
.p-speeddial-direction-left {
.p-speeddial-item {
margin: 0 math.div($inlineSpacing, 2);
&:first-child {
margin-right: $inlineSpacing;
}
}
}
.p-speeddial-direction-right {
.p-speeddial-item {
margin: 0 math.div($inlineSpacing, 2);
&:first-child {
margin-left: $inlineSpacing;
}
}
}
.p-speeddial-circle,
.p-speeddial-semi-circle,
.p-speeddial-quarter-circle {
.p-speeddial-item {
margin: 0;
&:first-child,
&:last-child {
margin: 0;
}
}
}
.p-speeddial-mask {
background-color: $maskBg;
border-radius: $borderRadius;
}

View File

@@ -0,0 +1,359 @@
.p-splitbutton {
border-radius: $borderRadius;
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $buttonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($buttonBg, $textButtonHoverBgOpacity);
color: $buttonBg;
}
&:not(:disabled):active {
background: rgba($buttonBg, $textButtonActiveBgOpacity);
color: $buttonBg;
}
}
&.p-button-plain {
> .p-button {
color: $plainButtonTextColor;
border-color: $plainButtonTextColor;
&:not(:disabled):hover {
background: $plainButtonHoverBgColor;
color: $plainButtonTextColor;
}
&:not(:disabled):active {
background: $plainButtonActiveBgColor;
color: $plainButtonTextColor;
}
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $buttonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($buttonBg, $textButtonHoverBgOpacity);
color: $buttonBg;
border-color: transparent;
}
&:not(:disabled):active {
background: rgba($buttonBg, $textButtonActiveBgOpacity);
color: $buttonBg;
border-color: transparent;
}
}
&.p-button-plain {
> .p-button {
color: $plainButtonTextColor;
&:not(:disabled):hover {
background: $plainButtonHoverBgColor;
color: $plainButtonTextColor;
}
&:not(:disabled):active {
background: $plainButtonActiveBgColor;
color: $plainButtonTextColor;
}
}
}
}
&.p-button-raised {
box-shadow: $raisedButtonShadow;
}
&.p-button-rounded {
border-radius: $roundedButtonBorderRadius;
> .p-button {
border-radius: $roundedButtonBorderRadius;
}
}
&.p-button-sm {
> .p-button {
@include scaledFontSize($fontSize, $scaleSM);
@include scaledPadding($buttonPadding, $scaleSM);
.p-button-icon {
@include scaledFontSize($primeIconFontSize, $scaleSM);
}
}
}
&.p-button-lg {
> .p-button {
@include scaledFontSize($fontSize, $scaleLG);
@include scaledPadding($buttonPadding, $scaleLG);
&.p-button-icon-only {
width: auto;
}
.p-button-icon {
@include scaledFontSize($primeIconFontSize, $scaleLG);
}
}
}
.p-splitbutton-menubutton,
.p-splitbutton.p-button-rounded > .p-splitbutton-menubutton.p-button,
.p-splitbutton.p-button-outlined > .p-splitbutton-menubutton.p-button {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
}
.p-splitbutton.p-button-secondary {
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $secondaryButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($secondaryButtonBg, $textButtonHoverBgOpacity);
color: $secondaryButtonBg;
}
&:not(:disabled):active {
background: rgba($secondaryButtonBg, $textButtonActiveBgOpacity);
color: $secondaryButtonBg;
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $secondaryButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($secondaryButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $secondaryButtonBg;
}
&:not(:disabled):active {
background: rgba($secondaryButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $secondaryButtonBg;
}
}
}
}
.p-splitbutton.p-button-info {
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $infoButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($infoButtonBg, $textButtonHoverBgOpacity);
color: $infoButtonBg;
}
&:not(:disabled):active {
background: rgba($infoButtonBg, $textButtonActiveBgOpacity);
color: $infoButtonBg;
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $infoButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($infoButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $infoButtonBg;
}
&:not(:disabled):active {
background: rgba($infoButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $infoButtonBg;
}
}
}
}
.p-splitbutton.p-button-success {
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $successButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($successButtonBg, $textButtonHoverBgOpacity);
color: $successButtonBg;
}
&:not(:disabled):active {
background: rgba($successButtonBg, $textButtonActiveBgOpacity);
color: $successButtonBg;
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $successButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($successButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $successButtonBg;
}
&:not(:disabled):active {
background: rgba($successButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $successButtonBg;
}
}
}
}
.p-splitbutton.p-button-warning {
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $warningButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($warningButtonBg, $textButtonHoverBgOpacity);
color: $warningButtonBg;
}
&:not(:disabled):active {
background: rgba($warningButtonBg, $textButtonActiveBgOpacity);
color: $warningButtonBg;
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $warningButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($warningButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $warningButtonBg;
}
&:not(:disabled):active {
background: rgba($warningButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $warningButtonBg;
}
}
}
}
.p-splitbutton.p-button-help {
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $helpButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($helpButtonBg, $textButtonHoverBgOpacity);
color: $helpButtonBg;
}
&:not(:disabled):active {
background: rgba($helpButtonBg, $textButtonActiveBgOpacity);
color: $helpButtonBg;
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $helpButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($helpButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $helpButtonBg;
}
&:not(:disabled):active {
background: rgba($helpButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $helpButtonBg;
}
}
}
}
.p-splitbutton.p-button-danger {
&.p-button-outlined {
> .p-button {
background-color: transparent;
color: $dangerButtonBg;
border: $outlinedButtonBorder;
&:not(:disabled):hover {
background: rgba($dangerButtonBg, $textButtonHoverBgOpacity);
color: $dangerButtonBg;
}
&:not(:disabled):active {
background: rgba($dangerButtonBg, $textButtonActiveBgOpacity);
color: $dangerButtonBg;
}
}
}
&.p-button-text {
> .p-button {
background-color: transparent;
color: $dangerButtonBg;
border-color: transparent;
&:not(:disabled):hover {
background: rgba($dangerButtonBg, $textButtonHoverBgOpacity);
border-color: transparent;
color: $dangerButtonBg;
}
&:not(:disabled):active {
background: rgba($dangerButtonBg, $textButtonActiveBgOpacity);
border-color: transparent;
color: $dangerButtonBg;
}
}
}
}

View File

@@ -0,0 +1,37 @@
.p-carousel {
.p-carousel-content {
.p-carousel-prev,
.p-carousel-next {
margin: $inlineSpacing;
@include action-icon();
}
}
.p-carousel-indicators {
padding: $carouselIndicatorsPadding;
.p-carousel-indicator {
margin-right: $inlineSpacing;
margin-bottom: $inlineSpacing;
button {
background-color: $carouselIndicatorBg;
width: $carouselIndicatorWidth;
height: $carouselIndicatorHeight;
transition: $actionIconTransition;
border-radius: $carouselIndicatorBorderRadius;
&:hover {
background: $carouselIndicatorHoverBg;
}
}
&.p-highlight {
button {
background: $highlightBg;
color: $highlightTextColor;
}
}
}
}
}

View File

@@ -0,0 +1,47 @@
.p-datascroller {
.p-paginator-top {
border-width: $tableTopPaginatorBorderWidth;
border-radius: 0;
}
.p-paginator-bottom {
border-width: $tableBottomPaginatorBorderWidth;
border-radius: 0;
}
.p-datascroller-header {
background: $tableHeaderBg;
color: $tableHeaderTextColor;
border: $tableHeaderBorder;
border-width: $tableHeaderBorderWidth;
padding: $tableHeaderPadding;
font-weight: $tableHeaderFontWeight;
}
.p-datascroller-content {
background: $tableBodyRowBg;
color: $tableBodyRowTextColor;
border: $dataViewContentBorder;
padding: $dataViewContentPadding;
}
&.p-datascroller-inline {
.p-datascroller-list {
> li {
border: $dataViewListItemBorder;
border-width: $dataViewListItemBorderWidth;
}
}
}
.p-datascroller-footer {
background: $tableFooterBg;
color: $tableFooterTextColor;
border: $tableFooterBorder;
border-width: $tableFooterBorderWidth;
padding: $tableFooterPadding;
font-weight: $tableFooterFontWeight;
border-bottom-left-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
}

View File

@@ -0,0 +1,389 @@
.p-datatable {
.p-paginator-top {
border-width: $tableTopPaginatorBorderWidth;
border-radius: 0;
}
.p-paginator-bottom {
border-width: $tableBottomPaginatorBorderWidth;
border-radius: 0;
}
.p-datatable-header {
background: $tableHeaderBg;
color: $tableHeaderTextColor;
border: $tableHeaderBorder;
border-width: $tableHeaderBorderWidth;
padding: $tableHeaderPadding;
font-weight: $tableHeaderFontWeight;
}
.p-datatable-footer {
background: $tableFooterBg;
color: $tableFooterTextColor;
border: $tableFooterBorder;
border-width: $tableFooterBorderWidth;
padding: $tableFooterPadding;
font-weight: $tableFooterFontWeight;
}
.p-datatable-thead > tr > th {
text-align: $tableCellContentAlignment;
padding: $tableHeaderCellPadding;
border: $tableHeaderCellBorder;
border-width: $tableHeaderCellBorderWidth;
font-weight: $tableHeaderCellFontWeight;
color: $tableHeaderCellTextColor;
background: $tableHeaderCellBg;
transition: $listItemTransition;
}
.p-datatable-tfoot > tr > td {
text-align: $tableCellContentAlignment;
padding: $tableFooterCellPadding;
border: $tableFooterCellBorder;
border-width: $tableFooterCellBorderWidth;
font-weight: $tableFooterCellFontWeight;
color: $tableFooterCellTextColor;
background: $tableFooterCellBg;
}
.p-sortable-column {
.p-sortable-column-icon {
color: $tableHeaderCellIconColor;
margin-left: $inlineSpacing;
}
.p-sortable-column-badge {
border-radius: 50%;
height: $tableSortableColumnBadgeSize;
min-width: $tableSortableColumnBadgeSize;
line-height: $tableSortableColumnBadgeSize;
color: $highlightTextColor;
background: $highlightBg;
margin-left: $inlineSpacing;
}
&:not(.p-highlight):not(.p-sortable-disabled):hover {
background: $tableHeaderCellHoverBg;
color: $tableHeaderCellTextHoverColor;
.p-sortable-column-icon {
color: $tableHeaderCellIconHoverColor;
}
}
&.p-highlight {
background: $tableHeaderCellHighlightBg;
color: $tableHeaderCellHighlightTextColor;
.p-sortable-column-icon {
color: $tableHeaderCellHighlightTextColor;
}
&:not(.p-sortable-disabled):hover {
background: $tableHeaderCellHighlightHoverBg;
color: $tableHeaderCellHighlightTextColor;
.p-sortable-column-icon {
color: $tableHeaderCellHighlightTextColor;
}
}
}
&:focus-visible {
box-shadow: $inputListItemFocusShadow;
outline: 0 none;
}
}
.p-datatable-tbody {
> tr {
background: $tableBodyRowBg;
color: $tableBodyRowTextColor;
transition: $listItemTransition;
> td {
text-align: $tableCellContentAlignment;
border: $tableBodyCellBorder;
border-width: $tableBodyCellBorderWidth;
padding: $tableBodyCellPadding;
.p-row-toggler,
.p-row-editor-init,
.p-row-editor-save,
.p-row-editor-cancel {
@include action-icon();
}
.p-row-editor-save {
margin-right: $inlineSpacing;
}
> .p-column-title {
font-weight: $tableHeaderCellFontWeight;
}
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
}
}
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
}
&.p-highlight-contextmenu {
outline: 0.15rem solid $focusOutlineColor;
outline-offset: -0.15rem;
}
&.p-datatable-dragpoint-top > td {
box-shadow: inset 0 2px 0 0 $highlightBg;
}
&.p-datatable-dragpoint-bottom > td {
box-shadow: inset 0 -2px 0 0 $highlightBg;
}
}
}
&.p-datatable-selectable {
.p-datatable-tbody > tr.p-selectable-row {
&:not(.p-highlight):not(.p-datatable-emptymessage):hover {
background: $tableBodyRowHoverBg;
color: $tableBodyRowTextHoverColor;
}
&:focus-visible {
outline: .15rem solid $focusOutlineColor;
outline-offset: -.15rem;
}
}
}
&.p-datatable-selectable-cell {
.p-datatable-tbody > tr.p-selectable-row {
& > td.p-selectable-cell {
&:not(.p-highlight):hover {
background: $tableBodyRowHoverBg;
color: $tableBodyRowTextHoverColor;
}
&:focus-visible {
outline: .15rem solid $focusOutlineColor;
outline-offset: -.15rem;
}
}
}
}
&.p-datatable-hoverable-rows {
.p-datatable-tbody > tr:not(.p-highlight):not(.p-datatable-emptymessage):hover {
background: $tableBodyRowHoverBg;
color: $tableBodyRowTextHoverColor;
}
}
.p-column-resizer-helper {
background: $tableResizerHelperBg;
}
.p-datatable-scrollable-header,
.p-datatable-scrollable-footer {
background: $panelHeaderBg;
}
&.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table,
&.p-datatable-scrollable > .p-datatable-wrapper > .p-virtualscroller > .p-datatable-table {
> .p-datatable-thead,
> .p-datatable-tfoot {
background-color: $tableHeaderCellBg;
}
}
.p-datatable-loading-icon {
font-size: $loadingIconFontSize;
&.p-icon {
width: $loadingIconFontSize;
height: $loadingIconFontSize;
}
}
&.p-datatable-gridlines {
.p-datatable-header {
border-width: 1px 1px 0 1px;
}
.p-datatable-footer {
border-width: 0 1px 1px 1px;
}
.p-paginator-top {
border-width: 0 1px 0 1px;
}
.p-paginator-bottom {
border-width: 0 1px 1px 1px;
}
.p-datatable-thead {
> tr {
> th {
border-width: 1px 0 1px 1px;
&:last-child {
border-width: 1px;
}
}
}
}
.p-datatable-tbody {
> tr {
> td {
border-width: 1px 0 0 1px;
&:last-child {
border-width: 1px 1px 0 1px;
}
}
&:last-child {
> td {
border-width: 1px 0 1px 1px;
&:last-child {
border-width: 1px;
}
}
}
}
}
.p-datatable-tfoot {
> tr {
> td {
border-width: 1px 0 1px 1px;
&:last-child {
border-width: 1px 1px 1px 1px;
}
}
}
}
.p-datatable-thead + .p-datatable-tfoot {
> tr {
> td {
border-width: 0 0 1px 1px;
&:last-child {
border-width: 0 1px 1px 1px;
}
}
}
}
&:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody {
> tr {
> td {
border-width: 0 0 1px 1px;
&:last-child {
border-width: 0 1px 1px 1px;
}
}
}
}
&:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody {
> tr {
&:last-child {
> td {
border-width: 0 0 0 1px;
&:last-child {
border-width: 0 1px 0 1px;
}
}
}
}
}
}
&.p-datatable-striped {
.p-datatable-tbody {
> tr.p-row-odd {
background: $tableBodyRowEvenBg;
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
.p-row-toggler {
color: $highlightTextColor;
&:hover {
color: $highlightTextColor;
}
}
}
& + .p-row-expanded {
background: $tableBodyRowEvenBg;
}
}
}
}
&.p-datatable-sm {
.p-datatable-header {
@include scaledPadding($tableHeaderPadding, $tableScaleSM);
}
.p-datatable-thead > tr > th {
@include scaledPadding($tableHeaderCellPadding, $tableScaleSM);
}
.p-datatable-tbody > tr > td {
@include scaledPadding($tableBodyCellPadding, $tableScaleSM);
}
.p-datatable-tfoot > tr > td {
@include scaledPadding($tableFooterPadding, $tableScaleSM);
}
.p-datatable-footer {
@include scaledPadding($tableFooterPadding, $tableScaleSM);
}
}
&.p-datatable-lg {
.p-datatable-header {
@include scaledPadding($tableHeaderPadding, $tableScaleLG);
}
.p-datatable-thead > tr > th {
@include scaledPadding($tableHeaderCellPadding, $tableScaleLG);
}
.p-datatable-tbody > tr > td {
@include scaledPadding($tableBodyCellPadding, $tableScaleLG);
}
.p-datatable-tfoot > tr > td {
@include scaledPadding($tableFooterPadding, $tableScaleLG);
}
.p-datatable-footer {
@include scaledPadding($tableFooterPadding, $tableScaleLG);
}
}
}
.p-datatable-drag-selection-helper {
background: $tableDragHelperBg;
}

View File

@@ -0,0 +1,47 @@
.p-dataview {
.p-paginator-top {
border-width: $tableTopPaginatorBorderWidth;
border-radius: 0;
}
.p-paginator-bottom {
border-width: $tableBottomPaginatorBorderWidth;
border-radius: 0;
}
.p-dataview-header {
background: $tableHeaderBg;
color: $tableHeaderTextColor;
border: $tableHeaderBorder;
border-width: $tableHeaderBorderWidth;
padding: $tableHeaderPadding;
font-weight: $tableHeaderFontWeight;
}
.p-dataview-content {
background: $tableBodyRowBg;
color: $tableBodyRowTextColor;
border: $dataViewContentBorder;
padding: $dataViewContentPadding;
}
.p-dataview-footer {
background: $tableFooterBg;
color: $tableFooterTextColor;
border: $tableFooterBorder;
border-width: $tableFooterBorderWidth;
padding: $tableFooterPadding;
font-weight: $tableFooterFontWeight;
border-bottom-left-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
.p-dataview-loading-icon {
font-size: $loadingIconFontSize;
&.p-icon {
width: $loadingIconFontSize;
height: $loadingIconFontSize;
}
}
}

View File

@@ -0,0 +1,138 @@
.p-column-filter-row {
.p-column-filter-menu-button,
.p-column-filter-clear-button {
margin-left: $inlineSpacing;
}
}
.p-column-filter-menu-button {
width: $actionIconWidth;
height: $actionIconHeight;
color: $actionIconColor;
border: $actionIconBorder;
background: $actionIconBg;
border-radius: $actionIconBorderRadius;
transition: $actionIconTransition;
&:hover {
color: $actionIconHoverColor;
border-color: $actionIconHoverBorderColor;
background: $actionIconHoverBg;
}
&.p-column-filter-menu-button-open,
&.p-column-filter-menu-button-open:hover {
background: $actionIconHoverBg;
color: $actionIconHoverColor;
}
&.p-column-filter-menu-button-active,
&.p-column-filter-menu-button-active:hover {
background: $highlightBg;
color: $highlightTextColor;
}
&:focus-visible {
@include focused();
}
}
.p-column-filter-clear-button {
width: $actionIconWidth;
height: $actionIconHeight;
color: $actionIconColor;
border: $actionIconBorder;
background: $actionIconBg;
border-radius: $actionIconBorderRadius;
transition: $actionIconTransition;
&:hover {
color: $actionIconHoverColor;
border-color: $actionIconHoverBorderColor;
background: $actionIconHoverBg;
}
&:focus-visible {
@include focused();
}
}
.p-column-filter-overlay {
background: $inputOverlayBg;
color: $inputListTextColor;
border: $inputOverlayBorder;
border-radius: $borderRadius;
box-shadow: $inputOverlayShadow;
min-width: $menuWidth;
.p-column-filter-row-items {
padding: $inputListPadding;
.p-column-filter-row-item {
margin: $inputListItemMargin;
padding: $inputListItemPadding;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
&:not(.p-highlight):not(.p-disabled):hover {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
&:focus-visible {
@include focused-listitem();
}
}
.p-column-filter-separator {
border-top: $divider;
margin: $menuSeparatorMargin;
}
}
}
.p-column-filter-overlay-menu {
.p-column-filter-operator {
padding: $inputListHeaderPadding;
border-bottom: $inputListHeaderBorder;
color: $inputListHeaderTextColor;
background: $inputOverlayHeaderBg;
margin: $inputListHeaderMargin;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
}
.p-column-filter-constraint {
padding: $panelContentPadding;
border-bottom: $divider;
.p-column-filter-matchmode-dropdown {
margin-bottom: $inlineSpacing;
}
.p-column-filter-remove-button {
margin-top: $inlineSpacing;
}
&:last-child {
border-bottom: 0 none;
}
}
.p-column-filter-add-rule {
padding: $panelFooterPadding;
}
.p-column-filter-buttonbar {
padding: $panelContentPadding;
}
}

View File

@@ -0,0 +1,86 @@
.p-orderlist {
.p-orderlist-controls {
padding: $panelContentPadding;
.p-button {
margin-bottom: $inlineSpacing;
}
}
.p-orderlist-header {
background: $panelHeaderBg;
color: $panelHeaderTextColor;
border: $panelHeaderBorder;
padding: $panelHeaderPadding;
font-weight: $panelHeaderFontWeight;
border-bottom: 0 none;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
}
.p-orderlist-filter-container {
padding: $panelHeaderPadding;
background: $panelContentBg;
border: $panelHeaderBorder;
border-bottom: 0 none;
.p-orderlist-filter-input {
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
}
.p-orderlist-filter-icon {
right: nth($inputPadding, 2);
color: $inputIconColor;
}
}
.p-orderlist-list {
border: $panelContentBorder;
background: $panelContentBg;
color: $panelContentTextColor;
padding: $inputListPadding;
border-bottom-right-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
outline: 0 none;
.p-orderlist-item {
padding: $inputListItemPadding;
margin: $inputListItemMargin;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: transform $transitionDuration, $listItemTransition;
&:not(.p-highlight):hover {
background: $inputListItemHoverBg;
color: $inputListItemTextHoverColor;
}
&.p-focus {
color: $inputListItemTextFocusColor;
background: $inputListItemFocusBg;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
&.p-focus {
background: $highlightFocusBg;
}
}
}
}
&.p-orderlist-striped {
.p-orderlist-list {
.p-orderlist-item:nth-child(even) {
background: $panelContentEvenRowBg;
&:hover {
background: $inputListItemHoverBg;
}
}
}
}
}

View File

@@ -0,0 +1,50 @@
.p-organizationchart {
.p-organizationchart-node-content {
&.p-organizationchart-selectable-node:not(.p-highlight):hover {
background: $inputListItemHoverBg;
color: $inputListItemTextHoverColor;
}
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
.p-node-toggler {
i {
color: darken($highlightBg, 25%);
}
}
}
}
.p-organizationchart-line-down {
background: $organizationChartConnectorColor;
}
.p-organizationchart-line-left {
border-right: $panelContentBorder;
border-color: $organizationChartConnectorColor;
}
.p-organizationchart-line-top {
border-top: $panelContentBorder;
border-color: $organizationChartConnectorColor;
}
.p-organizationchart-node-content {
border: $panelContentBorder;
background: $panelContentBg;
color: $panelContentTextColor;
padding: $panelContentPadding;
}
.p-organizationchart-node-content .p-node-toggler {
background: inherit;
color: inherit;
border-radius: 50%;
&:focus-visible {
@include focused();
}
}
}

View File

@@ -0,0 +1,91 @@
.p-paginator {
background: $paginatorBg;
color: $paginatorTextColor;
border: $paginatorBorder;
border-width: $paginatorBorderWidth;
padding: $paginatorPadding;
border-radius: $borderRadius;
.p-paginator-first,
.p-paginator-prev,
.p-paginator-next,
.p-paginator-last {
background-color: $paginatorElementBg;
border: $paginatorElementBorder;
color: $paginatorElementIconColor;
min-width: $paginatorElementWidth;
height: $paginatorElementHeight;
margin: $paginatorElementMargin;
transition: $listItemTransition;
border-radius: $paginatorElementBorderRadius;
&:not(.p-disabled):not(.p-highlight):hover {
background: $paginatorElementHoverBg;
border-color: $paginatorElementHoverBorderColor;
color: $paginatorElementIconHoverColor;
}
}
.p-paginator-first {
border-top-left-radius: $paginatorElementBorderRadius;
border-bottom-left-radius: $paginatorElementBorderRadius;
}
.p-paginator-last {
border-top-right-radius: $paginatorElementBorderRadius;
border-bottom-right-radius: $paginatorElementBorderRadius;
}
.p-dropdown {
margin-left: $inlineSpacing;
height: $paginatorElementHeight;
.p-dropdown-label {
padding-right: 0;
}
}
.p-paginator-page-input {
margin-left: $inlineSpacing;
margin-right: $inlineSpacing;
.p-inputtext {
max-width: $paginatorElementWidth;
}
}
.p-paginator-current {
background-color: $paginatorElementBg;
border: $paginatorElementBorder;
color: $paginatorElementIconColor;
min-width: $paginatorElementWidth;
height: $paginatorElementHeight;
margin: $paginatorElementMargin;
padding: 0 $inlineSpacing;
}
.p-paginator-pages {
.p-paginator-page {
background-color: $paginatorElementBg;
border: $paginatorElementBorder;
color: $paginatorElementIconColor;
min-width: $paginatorElementWidth;
height: $paginatorElementHeight;
margin: $paginatorElementMargin;
transition: $listItemTransition;
border-radius: $paginatorElementBorderRadius;
&.p-highlight {
background: $highlightBg;
border-color: $highlightBg;
color: $highlightTextColor;
}
&:not(.p-highlight):hover {
background: $paginatorElementHoverBg;
border-color: $paginatorElementHoverBorderColor;
color: $paginatorElementIconHoverColor;
}
}
}
}

View File

@@ -0,0 +1,74 @@
.p-picklist {
.p-picklist-buttons {
padding: $panelContentPadding;
.p-button {
margin-bottom: $inlineSpacing;
}
}
.p-picklist-header {
background: $panelHeaderBg;
color: $panelHeaderTextColor;
border: $panelHeaderBorder;
padding: $panelHeaderPadding;
font-weight: $panelHeaderFontWeight;
border-bottom: 0 none;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
}
.p-picklist-filter-container {
padding: $panelHeaderPadding;
background: $panelContentBg;
border: $panelHeaderBorder;
border-bottom: 0 none;
.p-picklist-filter-input {
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
}
.p-picklist-filter-icon {
right: nth($inputPadding, 2);
color: $inputIconColor;
}
}
.p-picklist-list {
border: $panelContentBorder;
background: $panelContentBg;
color: $panelContentTextColor;
padding: $inputListPadding;
border-bottom-right-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
outline: 0 none;
.p-picklist-item {
padding: $inputListItemPadding;
margin: $inputListItemMargin;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: transform $transitionDuration, $listItemTransition;
&:not(.p-highlight):hover {
background: $inputListItemHoverBg;
color: $inputListItemTextHoverColor;
}
&.p-focus {
color: $inputListItemTextFocusColor;
background: $inputListItemFocusBg;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
&.p-focus {
background: $highlightFocusBg;
}
}
}
}
}

View File

@@ -0,0 +1,38 @@
.p-timeline {
.p-timeline-event-marker {
border: $timelineEventMarkerBorder;
border-radius: $timelineEventMarkerBorderRadius;
width: $timelineEventMarkerWidth;
height: $timelineEventMarkerHeight;
background-color: $timelineEventMarkerBackground;
}
.p-timeline-event-connector {
background-color: $timelineEventColor;
}
&.p-timeline-vertical {
.p-timeline-event-opposite,
.p-timeline-event-content {
padding: $timelineVerticalEventContentPadding;
}
.p-timeline-event-connector {
width: $timelineEventConnectorSize;
}
}
&.p-timeline-horizontal {
.p-timeline-event-opposite,
.p-timeline-event-content {
padding: $timelineHorizontalEventContentPadding;
}
.p-timeline-event-connector {
height: $timelineEventConnectorSize;
}
}
}

View File

@@ -0,0 +1,184 @@
.p-tree-container {
margin: 0;
padding: 0;
list-style-type: none;
overflow: auto;
}
.p-treenode-children {
margin: 0;
padding: 0;
list-style-type: none;
}
.p-treenode-selectable {
cursor: pointer;
user-select: none;
}
.p-tree-toggler {
cursor: pointer;
user-select: none;
display: inline-flex;
align-items: center;
justify-content: center;
overflow: hidden;
position: relative;
flex-shrink: 0;
}
.p-treenode-leaf > .p-treenode-content .p-tree-toggler {
visibility: hidden;
}
.p-treenode-content {
display: flex;
align-items: center;
}
.p-tree-filter {
width: 100%;
}
.p-tree-filter-container {
position: relative;
display: block;
width: 100%;
}
.p-tree-filter-icon {
position: absolute;
top: 50%;
margin-top: -0.5rem;
}
.p-tree-loading {
position: relative;
min-height: 4rem;
}
.p-tree .p-tree-loading-overlay {
position: absolute;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
}
.p-tree {
border: $panelContentBorder;
background: $panelContentBg;
color: $panelContentTextColor;
padding: $panelContentPadding;
border-radius: $borderRadius;
.p-tree-container {
.p-treenode {
padding: $treeNodePadding;
outline: 0 none;
&:focus > .p-treenode-content {
@include focused-listitem();
}
.p-treenode-content {
border-radius: $borderRadius;
transition: $listItemTransition;
padding: $treeNodeContentPadding;
.p-tree-toggler {
margin-right: $inlineSpacing;
@include action-icon();
}
.p-treenode-icon {
margin-right: $inlineSpacing;
color: $treeNodeIconColor;
}
.p-checkbox {
margin-right: $inlineSpacing;
&.p-indeterminate {
.p-checkbox-icon {
color: $textColor;
}
}
}
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
.p-tree-toggler,
.p-treenode-icon {
color: $highlightTextColor;
&:hover {
color: $highlightTextColor;
}
}
}
&.p-treenode-selectable:not(.p-highlight):hover {
background: $inputListItemHoverBg;
color: $inputListItemTextHoverColor;
}
&.p-treenode-dragover {
background: $inputListItemHoverBg;
color: $inputListItemTextHoverColor;
}
}
}
}
.p-tree-filter-container {
margin-bottom: $inlineSpacing;
.p-tree-filter {
width: 100%;
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
}
.p-tree-filter-icon {
right: nth($inputPadding, 2);
color: $inputIconColor;
}
}
.p-treenode-children {
padding: $treeNodeChildrenPadding;
}
.p-tree-loading-icon {
font-size: $loadingIconFontSize;
&.p-icon {
width: $loadingIconFontSize;
height: $loadingIconFontSize;
}
}
.p-treenode-droppoint {
height: $inlineSpacing;
&.p-treenode-droppoint-active {
background: scale-color($highlightBg, $lightness: -20%);
}
}
}

View File

@@ -0,0 +1,429 @@
.p-treetable {
position: relative;
}
.p-treetable > .p-treetable-wrapper {
overflow: auto;
}
.p-treetable table {
border-collapse: collapse;
width: 100%;
table-layout: fixed;
}
.p-treetable .p-sortable-column {
cursor: pointer;
user-select: none;
}
.p-treetable-selectable .p-treetable-tbody > tr {
cursor: pointer;
}
.p-treetable-toggler {
cursor: pointer;
user-select: none;
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
vertical-align: middle;
overflow: hidden;
position: relative;
}
.p-treetable-toggler + .p-checkbox {
vertical-align: middle;
}
.p-treetable-toggler + .p-checkbox + span {
vertical-align: middle;
}
/* Resizable */
.p-treetable-resizable > .p-treetable-wrapper {
overflow-x: auto;
}
.p-treetable-resizable .p-treetable-thead > tr > th,
.p-treetable-resizable .p-treetable-tfoot > tr > td,
.p-treetable-resizable .p-treetable-tbody > tr > td {
overflow: hidden;
}
.p-treetable-resizable .p-resizable-column {
background-clip: padding-box;
position: relative;
}
.p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {
display: none;
}
.p-treetable .p-column-resizer {
display: block;
position: absolute;
top: 0;
right: 0;
margin: 0;
width: 0.5rem;
height: 100%;
padding: 0px;
cursor: col-resize;
border: 1px solid transparent;
}
.p-treetable .p-column-resizer-helper {
width: 1px;
position: absolute;
z-index: 10;
display: none;
}
/* Scrollable */
.p-treetable-scrollable-wrapper {
position: relative;
}
.p-treetable-scrollable-header,
.p-treetable-scrollable-footer {
overflow: hidden;
border: 0 none;
}
.p-treetable-scrollable-body {
overflow: auto;
position: relative;
}
.p-treetable-virtual-table {
position: absolute;
}
/* Frozen Columns */
.p-treetable-frozen-view .p-treetable-scrollable-body {
overflow: hidden;
}
.p-treetable-unfrozen-view {
position: absolute;
top: 0px;
left: 0px;
}
/* Reorder */
.p-treetable-reorder-indicator-up,
.p-treetable-reorder-indicator-down {
position: absolute;
display: none;
}
/* Loader */
.p-treetable .p-treetable-loading-overlay {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}
/* Alignment */
.p-treetable .p-treetable-thead > tr > th.p-align-left > .p-column-header-content,
.p-treetable .p-treetable-tbody > tr > td.p-align-left,
.p-treetable .p-treetable-tfoot > tr > td.p-align-left {
text-align: left;
justify-content: flex-start;
}
.p-treetable .p-treetable-thead > tr > th.p-align-right > .p-column-header-content,
.p-treetable .p-treetable-tbody > tr > td.p-align-right,
.p-treetable .p-treetable-tfoot > tr > td.p-align-right {
text-align: right;
justify-content: flex-end;
}
.p-treetable .p-treetable-thead > tr > th.p-align-center > .p-column-header-content,
.p-treetable .p-treetable-tbody > tr > td.p-align-center,
.p-treetable .p-treetable-tfoot > tr > td.p-align-center {
text-align: center;
justify-content: center;
}
.p-treetable {
.p-paginator-top {
border-width: $tableTopPaginatorBorderWidth;
border-radius: 0;
}
.p-paginator-bottom {
border-width: $tableBottomPaginatorBorderWidth;
border-radius: 0;
}
.p-treetable-header {
background: $tableHeaderBg;
color: $tableHeaderTextColor;
border: $tableHeaderBorder;
border-width: $tableHeaderBorderWidth;
padding: $tableHeaderPadding;
font-weight: $tableHeaderFontWeight;
}
.p-treetable-footer {
background: $tableFooterBg;
color: $tableFooterTextColor;
border: $tableFooterBorder;
border-width: $tableFooterBorderWidth;
padding: $tableFooterPadding;
font-weight: $tableFooterFontWeight;
}
.p-treetable-thead > tr > th {
text-align: $tableCellContentAlignment;
padding: $tableHeaderCellPadding;
border: $tableHeaderCellBorder;
border-width: $tableHeaderCellBorderWidth;
font-weight: $tableHeaderCellFontWeight;
color: $tableHeaderCellTextColor;
background: $tableHeaderCellBg;
transition: $listItemTransition;
}
.p-treetable-tfoot > tr > td {
text-align: $tableCellContentAlignment;
padding: $tableFooterCellPadding;
border: $tableFooterCellBorder;
border-width: $tableFooterCellBorderWidth;
font-weight: $tableFooterCellFontWeight;
color: $tableFooterCellTextColor;
background: $tableFooterCellBg;
}
.p-sortable-column {
outline-color: $focusOutlineColor;
.p-sortable-column-icon {
color: $tableHeaderCellIconColor;
margin-left: $inlineSpacing;
}
.p-sortable-column-badge {
border-radius: 50%;
height: $tableSortableColumnBadgeSize;
min-width: $tableSortableColumnBadgeSize;
line-height: $tableSortableColumnBadgeSize;
color: $highlightTextColor;
background: $highlightBg;
margin-left: $inlineSpacing;
}
&:not(.p-highlight):hover {
background: $tableHeaderCellHoverBg;
color: $tableHeaderCellTextHoverColor;
.p-sortable-column-icon {
color: $tableHeaderCellIconHoverColor;
}
}
&.p-highlight {
background: $tableHeaderCellHighlightBg;
color: $tableHeaderCellHighlightTextColor;
.p-sortable-column-icon {
color: $tableHeaderCellHighlightTextColor;
}
}
}
.p-treetable-tbody {
> tr {
background: $tableBodyRowBg;
color: $tableBodyRowTextColor;
transition: $listItemTransition;
> td {
text-align: $tableCellContentAlignment;
border: $tableBodyCellBorder;
border-width: $tableBodyCellBorderWidth;
padding: $tableBodyCellPadding;
.p-treetable-toggler {
margin-right: $inlineSpacing;
@include action-icon();
& + .p-checkbox {
margin-right: $inlineSpacing;
.p-indeterminate {
.p-checkbox-icon {
color: $textColor;
}
}
}
}
}
&:focus-visible {
outline: .15rem solid $focusOutlineColor;
outline-offset: -.15rem;
}
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
.p-treetable-toggler {
color: $highlightTextColor;
&:hover {
color: $highlightTextColor;
}
}
}
}
}
&.p-treetable-selectable,
&.p-treetable-hoverable-rows {
.p-treetable-tbody > tr:not(.p-highlight):hover {
background: $tableBodyRowHoverBg;
color: $tableBodyRowTextHoverColor;
.p-treetable-toggler {
color: $tableBodyRowTextHoverColor;
}
}
}
.p-column-resizer-helper {
background: $tableResizerHelperBg;
}
.p-treetable-scrollable-header,
.p-treetable-scrollable-footer {
background: $panelHeaderBg;
}
.p-treetable-loading-icon {
font-size: $loadingIconFontSize;
&.p-icon {
width: $loadingIconFontSize;
height: $loadingIconFontSize;
}
}
&.p-treetable-gridlines {
.p-treetable-header {
border-width: 1px 1px 0 1px;
}
.p-treetable-footer {
border-width: 0 1px 1px 1px;
}
.p-treetable-top {
border-width: 0 1px 0 1px;
}
.p-treetable-bottom {
border-width: 0 1px 1px 1px;
}
.p-treetable-thead {
> tr {
> th {
border-width: 1px;
}
}
}
.p-treetable-tbody {
> tr {
> td {
border-width: 1px;
}
}
}
.p-treetable-tfoot {
> tr {
> td {
border-width: 1px;
}
}
}
}
&.p-treetable-striped {
.p-treetable-tbody {
> tr.p-row-odd {
background: $tableBodyRowEvenBg;
&.p-highlight {
background: $highlightBg;
color: $highlightTextColor;
.p-row-toggler {
color: $highlightTextColor;
&:hover {
color: $highlightTextColor;
}
}
}
& + .p-row-expanded {
background: $tableBodyRowEvenBg;
}
}
}
}
&.p-treetable-sm {
.p-treetable-header {
@include scaledPadding($tableHeaderPadding, $scaleSM);
}
.p-treetable-thead > tr > th {
@include scaledPadding($tableHeaderCellPadding, $tableScaleSM);
}
.p-treetable-tbody > tr > td {
@include scaledPadding($tableBodyCellPadding, $tableScaleSM);
}
.p-treetable-tfoot > tr > td {
@include scaledPadding($tableFooterPadding, $tableScaleSM);
}
.p-treetable-footer {
@include scaledPadding($tableFooterPadding, $tableScaleSM);
}
}
&.p-treetable-lg {
.p-treetable-header {
@include scaledPadding($tableHeaderPadding, $tableScaleLG);
}
.p-treetable-thead > tr > th {
@include scaledPadding($tableHeaderCellPadding, $tableScaleLG);
}
.p-treetable-tbody > tr > td {
@include scaledPadding($tableBodyCellPadding, $tableScaleLG);
}
.p-treetable-tfoot > tr > td {
@include scaledPadding($tableFooterPadding, $tableScaleLG);
}
.p-treetable-footer {
@include scaledPadding($tableFooterPadding, $tableScaleLG);
}
}
}

View File

@@ -0,0 +1,41 @@
.p-fileupload {
.p-fileupload-buttonbar {
background: $panelHeaderBg;
padding: $panelHeaderPadding;
border: $panelHeaderBorder;
color: $panelHeaderTextColor;
border-bottom: 0 none;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
gap: $inlineSpacing;
.p-button {
margin-right: $inlineSpacing;
}
}
.p-fileupload-content {
background: $panelContentBg;
padding: $fileUploadContentPadding;
border: $panelContentBorder;
color: $panelContentTextColor;
border-bottom-right-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
}
.p-progressbar {
height: $fileUploadProgressBarHeight;
}
.p-fileupload-row {
> div {
padding: $tableBodyCellPadding;
}
}
&.p-fileupload-advanced {
.p-message {
margin-top: 0;
}
}
}

View File

@@ -0,0 +1,95 @@
@use 'sass:math';
.p-autocomplete {
.p-autocomplete-loader {
right: nth($inputPadding, 2);
}
&.p-autocomplete-dd {
.p-autocomplete-loader {
right: nth($inputPadding, 2) + $buttonIconOnlyWidth;
}
}
.p-autocomplete-multiple-container {
padding: math.div(nth($inputPadding, 1), 2) nth($inputPadding, 2);
gap: $inlineSpacing;
&:not(.p-disabled):hover {
border-color: $inputHoverBorderColor;
}
&:not(.p-disabled).p-focus {
@include focused-input();
}
.p-autocomplete-input-token {
padding: math.div(nth($inputPadding, 1), 2) 0;
input {
font-family: var(--font-family);
font-feature-settings: var(--font-feature-settings, normal);
font-size: $inputTextFontSize;
color: $textColor;
padding: 0;
margin: 0;
}
}
.p-autocomplete-token {
padding: math.div(nth($inputPadding, 1), 2) nth($inputPadding, 2);
margin-right: $inlineSpacing;
background: $highlightBg;
color: $highlightTextColor;
border-radius: $borderRadius;
.p-autocomplete-token-icon {
margin-left: $inlineSpacing;
}
}
}
&.p-invalid.p-component > .p-inputtext {
@include invalid-input();
}
}
.p-autocomplete-panel {
background: $inputOverlayBg;
color: $inputListTextColor;
border: $inputOverlayBorder;
border-radius: $borderRadius;
box-shadow: $inputOverlayShadow;
.p-autocomplete-items {
padding: $inputListPadding;
.p-autocomplete-item {
margin: $inputListItemMargin;
padding: $inputListItemPadding;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&:hover {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
}
.p-autocomplete-item-group {
margin: $submenuHeaderMargin;
padding: $submenuHeaderPadding;
color: $submenuHeaderTextColor;
background: $submenuHeaderBg;
font-weight: $submenuHeaderFontWeight;
}
}
}

View File

@@ -0,0 +1,251 @@
.p-calendar {
&.p-invalid.p-component > .p-inputtext {
@include invalid-input();
}
&:not(.p-calendar-disabled).p-focus > .p-inputtext {
@include focused-input();
}
}
.p-datepicker {
padding: $calendarPadding;
background: $calendarInlineBg;
color: $calendarTextColor;
border: $calendarBorder;
border-radius: $borderRadius;
&:not(.p-datepicker-inline) {
background: $calendarBg;
border: $calendarOverlayBorder;
box-shadow: $inputOverlayShadow;
.p-datepicker-header {
background: $calendarHeaderBg;
}
}
.p-datepicker-header {
padding: $calendarHeaderPadding;
color: $calendarHeaderTextColor;
background: $calendarInlineHeaderBg;
font-weight: $calendarHeaderFontWeight;
margin: $inputListHeaderMargin;
border-bottom: $calendarHeaderBorder;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
.p-datepicker-prev,
.p-datepicker-next {
@include action-icon();
}
.p-datepicker-title {
line-height: $actionIconHeight;
.p-datepicker-year,
.p-datepicker-month {
color: $calendarHeaderTextColor;
transition: $actionIconTransition;
font-weight: $calendarHeaderFontWeight;
padding: $calendarHeaderCellPadding;
&:enabled:hover {
color: $calendarMonthYearHeaderHoverTextColor;
}
}
.p-datepicker-month {
margin-right: $inlineSpacing;
}
}
}
table {
font-size: $fontSize;
margin: $calendarTableMargin;
th {
padding: $calendarHeaderCellPadding;
> span {
width: $calendarCellDateWidth;
height: $calendarCellDateHeight;
}
}
td {
padding: $calendarCellDatePadding;
> span {
width: $calendarCellDateWidth;
height: $calendarCellDateHeight;
border-radius: $calendarCellDateBorderRadius;
transition: $listItemTransition;
border: $calendarCellDateBorder;
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
&:focus {
@include focused();
}
}
&.p-datepicker-today {
> span {
background: $calendarCellDateTodayBg;
color: $calendarCellDateTodayTextColor;
border-color: $calendarCellDateTodayBorderColor;
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
}
}
}
}
.p-datepicker-buttonbar {
padding: $calendarButtonBarPadding;
border-top: $divider;
.p-button {
width: auto;
}
}
.p-timepicker {
border-top: $divider;
padding: $calendarTimePickerPadding;
button {
@include action-icon();
&:last-child {
margin-top: 0.2em;
}
}
span {
font-size: $calendarTimePickerTimeFontSize;
}
> div {
padding: $calendarTimePickerElementPadding;
}
}
&.p-datepicker-timeonly {
.p-timepicker {
border-top: 0 none;
}
}
.p-monthpicker {
margin: $calendarTableMargin;
.p-monthpicker-month {
padding: $calendarCellDatePadding;
transition: $listItemTransition;
border-radius: $borderRadius;
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
}
}
.p-yearpicker {
margin: $calendarTableMargin;
.p-yearpicker-year {
padding: $calendarCellDatePadding;
transition: $listItemTransition;
border-radius: $borderRadius;
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
}
}
&.p-datepicker-multiple-month {
.p-datepicker-group {
border-left: $divider;
padding-right: $calendarPadding;
padding-left: $calendarPadding;
padding-top: 0;
padding-bottom: 0;
&:first-child {
padding-left: 0;
border-left: 0 none;
}
&:last-child {
padding-right: 0;
}
}
}
&:not(.p-disabled) {
table {
td {
span:not(.p-highlight):not(.p-disabled) {
&:hover {
background: $calendarCellDateHoverBg;
}
&:focus {
@include focused();
}
}
}
}
.p-monthpicker {
.p-monthpicker-month {
&:not(.p-disabled) {
&:not(.p-highlight):hover {
background: $calendarCellDateHoverBg;
}
&:focus {
@include focused();
}
}
}
}
.p-yearpicker {
.p-yearpicker-year {
&:not(.p-disabled) {
&:not(.p-highlight):hover {
background: $calendarCellDateHoverBg;
}
&:focus {
@include focused();
}
}
}
}
}
}
@media screen and (max-width: $calendarBreakpoint) {
.p-datepicker {
table {
th,
td {
padding: $calendarCellDatePaddingSM;
}
}
}
}

View File

@@ -0,0 +1,107 @@
.p-cascadeselect {
background: $inputBg;
border: $inputBorder;
transition: $formElementTransition;
border-radius: $borderRadius;
outline-color: transparent;
&:not(.p-disabled):hover {
border-color: $inputHoverBorderColor;
}
&:not(.p-disabled).p-focus {
@include focused-input();
}
&.p-variant-filled {
background-color: $inputFilledBg;
&:enabled:hover {
background-color: $inputFilledHoverBg;
}
&:enabled:focus {
background-color: $inputFilledFocusBg;
}
}
.p-cascadeselect-label {
background: transparent;
border: 0 none;
padding: $inputPadding;
&.p-placeholder {
color: $inputPlaceholderTextColor;
}
&:enabled:focus {
outline: 0 none;
box-shadow: none;
}
}
.p-cascadeselect-trigger {
background: transparent;
color: $inputIconColor;
width: $inputGroupAddOnMinWidth;
border-top-right-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
&.p-invalid.p-component {
@include invalid-input();
}
}
.p-cascadeselect-panel {
background: $inputOverlayBg;
color: $inputListTextColor;
border: $inputOverlayBorder;
border-radius: $borderRadius;
box-shadow: $inputOverlayShadow;
.p-cascadeselect-items {
padding: $inputListPadding;
.p-cascadeselect-item {
margin: $inputListItemMargin;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
&.p-focus {
background: $highlightFocusBg;
}
}
&:not(.p-highlight):not(.p-disabled) {
&.p-focus {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
}
.p-cascadeselect-item-content {
padding: $inputListItemPadding;
}
.p-cascadeselect-group-icon {
font-size: $menuitemSubmenuIconFontSize;
}
}
}
}

View File

@@ -0,0 +1,181 @@
.p-checkbox {
position: relative;
display: inline-flex;
user-select: none;
vertical-align: bottom;
}
.p-checkbox-input {
appearance: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
opacity: 0;
z-index: 1;
outline: 0 none;
cursor: pointer;
}
.p-checkbox-box {
display: flex;
justify-content: center;
align-items: center;
}
.p-checkbox {
width: $checkboxWidth;
height: $checkboxHeight;
.p-checkbox-input {
border: $checkboxBorder;
border-radius: $borderRadius;
}
.p-checkbox-box {
border: $checkboxBorder;
background: $inputBg;
width: $checkboxWidth;
height: $checkboxHeight;
color: $textColor;
border-radius: $borderRadius;
transition: $formElementTransition;
outline-color: transparent;
.p-checkbox-icon {
transition-duration: $transitionDuration;
color: $checkboxIconActiveColor;
font-size: $checkboxIconFontSize;
&.p-icon {
width: $checkboxIconFontSize;
height: $checkboxIconFontSize;
}
}
}
.p-checkbox-box {
border: $checkboxBorder;
background: $inputBg;
width: $checkboxWidth;
height: $checkboxHeight;
color: $textColor;
border-radius: $borderRadius;
transition: $formElementTransition;
outline-color: transparent;
.p-checkbox-icon {
transition-duration: $transitionDuration;
color: $checkboxIconActiveColor;
font-size: $checkboxIconFontSize;
&.p-icon {
width: $checkboxIconFontSize;
height: $checkboxIconFontSize;
}
}
}
&.p-highlight {
.p-checkbox-box {
border-color: $checkboxActiveBorderColor;
background: $checkboxActiveBg;
}
}
&:not(.p-disabled) {
&:has(.p-checkbox-input:hover) {
.p-checkbox-box {
border-color: $inputHoverBorderColor;
}
&.p-highlight {
.p-checkbox-box {
border-color: $checkboxActiveHoverBorderColor;
background: $checkboxActiveHoverBg;
color: $checkboxIconActiveHoverColor;
}
}
}
&:has(.p-checkbox-input:focus-visible) {
.p-checkbox-box {
@include focused-input();
}
}
}
&.p-invalid > .p-checkbox-box {
@include invalid-input();
}
&.p-variant-filled {
.p-checkbox-box {
background-color: $inputFilledBg;
}
&.p-highlight {
.p-checkbox-box {
background: $checkboxActiveBg;
}
}
&:not(.p-disabled) {
&:has(.p-checkbox-input:hover) {
.p-checkbox-box {
background-color: $inputFilledHoverBg;
}
&.p-highlight {
.p-checkbox-box {
background: $checkboxActiveHoverBg;
}
}
}
}
}
}
.p-input-filled {
.p-checkbox {
.p-checkbox-box {
background-color: $inputFilledBg;
}
&.p-highlight {
.p-checkbox-box {
background: $checkboxActiveBg;
}
}
&:not(.p-disabled) {
&:has(.p-checkbox-input:hover) {
.p-checkbox-box {
background-color: $inputFilledHoverBg;
}
&.p-highlight {
.p-checkbox-box {
background: $checkboxActiveHoverBg;
}
}
}
}
}
}
@if ($highlightBg == $checkboxActiveBg) {
.p-highlight {
.p-checkbox {
.p-checkbox-box {
border-color: $checkboxIconActiveColor;
}
}
}
}

View File

@@ -0,0 +1,102 @@
@use "sass:math";
.p-chips {
display: inline-flex;
}
.p-chips-multiple-container {
margin: 0;
padding: 0;
list-style-type: none;
cursor: text;
overflow: hidden;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.p-chips-token {
cursor: default;
display: inline-flex;
align-items: center;
flex: 0 0 auto;
}
.p-chips-input-token {
flex: 1 1 auto;
display: inline-flex;
}
.p-chips-token-icon {
cursor: pointer;
}
.p-chips-input-token input {
border: 0 none;
outline: 0 none;
background-color: transparent;
margin: 0;
padding: 0;
box-shadow: none;
border-radius: 0;
width: 100%;
}
.p-fluid .p-chips {
display: flex;
}
.p-chips {
&:not(.p-disabled):hover {
.p-chips-multiple-container {
border-color: $inputHoverBorderColor;
}
}
&:not(.p-disabled).p-focus {
.p-chips-multiple-container {
@include focused-input();
}
}
.p-chips-multiple-container {
padding: math.div(nth($inputPadding, 1), 2) nth($inputPadding, 2);
outline-color: transparent;
.p-chips-token {
padding: math.div(nth($inputPadding, 1), 2) nth($inputPadding, 2);
margin-right: $inlineSpacing;
background: $chipBg;
color: $chipTextColor;
border-radius: $chipBorderRadius;
&.p-focus {
background: $chipFocusBg;
color: $chipFocusTextColor;
}
.p-chips-token-icon {
margin-left: $inlineSpacing;
}
}
.p-chips-input-token {
padding: math.div(nth($inputPadding, 1), 2) 0;
input {
font-family: var(--font-family);
font-feature-settings: var(--font-feature-settings, normal);
font-size: $inputTextFontSize;
color: $textColor;
padding: 0;
margin: 0;
}
}
}
&.p-invalid.p-component > .p-inputtext {
@include invalid-input();
}
}

View File

@@ -0,0 +1,18 @@
.p-colorpicker-preview {
width: $colorPickerPreviewWidth;
height: $colorPickerPreviewHeight;
}
.p-colorpicker-panel {
background: $colorPickerBg;
border: $colorPickerBorder;
.p-colorpicker-color-handle,
.p-colorpicker-hue-handle {
border-color: $colorPickerHandleColor;
}
}
.p-colorpicker-overlay-panel {
box-shadow: $inputOverlayShadow;
}

View File

@@ -0,0 +1,252 @@
.p-dropdown {
display: inline-flex;
cursor: pointer;
position: relative;
user-select: none;
}
.p-dropdown-clear-icon {
position: absolute;
top: 50%;
margin-top: -0.5rem;
}
.p-dropdown-trigger {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.p-dropdown-label {
display: block;
white-space: nowrap;
overflow: hidden;
flex: 1 1 auto;
width: 1%;
text-overflow: ellipsis;
cursor: pointer;
}
.p-dropdown-label-empty {
overflow: hidden;
opacity: 0;
}
input.p-dropdown-label {
cursor: default;
}
.p-dropdown .p-dropdown-panel {
min-width: 100%;
}
.p-dropdown-panel {
position: absolute;
top: 0;
left: 0;
}
.p-dropdown-items-wrapper {
overflow: auto;
}
.p-dropdown-item {
cursor: pointer;
font-weight: normal;
white-space: nowrap;
position: relative;
overflow: hidden;
display: flex;
align-items: center;
}
.p-dropdown-item-group {
cursor: auto;
}
.p-dropdown-items {
margin: 0;
padding: 0;
list-style-type: none;
}
.p-dropdown-filter {
width: 100%;
}
.p-dropdown-filter-container {
position: relative;
}
.p-dropdown-filter-icon {
position: absolute;
top: 50%;
margin-top: -0.5rem;
}
.p-fluid .p-dropdown {
display: flex;
}
.p-fluid .p-dropdown .p-dropdown-label {
width: 1%;
}
.p-dropdown {
background: $inputBg;
border: $inputBorder;
transition: $formElementTransition;
border-radius: $borderRadius;
outline-color: transparent;
&:not(.p-disabled):hover {
border-color: $inputHoverBorderColor;
}
&:not(.p-disabled).p-focus {
@include focused-input();
}
&.p-variant-filled {
background: $inputFilledBg;
&:not(.p-disabled):hover {
background-color: $inputFilledHoverBg;
}
&:not(.p-disabled).p-focus {
background-color: $inputFilledFocusBg;
.p-inputtext {
background-color: transparent;
}
}
}
&.p-dropdown-clearable {
.p-dropdown-label {
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
}
}
.p-dropdown-label {
background: transparent;
border: 0 none;
&.p-placeholder {
color: $inputPlaceholderTextColor;
}
&:focus,
&:enabled:focus {
outline: 0 none;
box-shadow: none;
}
}
.p-dropdown-trigger {
background: transparent;
color: $inputIconColor;
width: $inputGroupAddOnMinWidth;
border-top-right-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
.p-dropdown-clear-icon {
color: $inputIconColor;
right: $inputGroupAddOnMinWidth;
}
&.p-invalid.p-component {
@include invalid-input();
}
}
.p-dropdown-panel {
background: $inputOverlayBg;
color: $inputListTextColor;
border: $inputOverlayBorder;
border-radius: $borderRadius;
box-shadow: $inputOverlayShadow;
.p-dropdown-header {
padding: $inputListHeaderPadding;
border-bottom: $inputListHeaderBorder;
color: $inputListHeaderTextColor;
background: $inputOverlayHeaderBg;
margin: $inputListHeaderMargin;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
.p-dropdown-filter {
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
margin-right: -1 * (nth($inputPadding, 2) + $primeIconFontSize);
}
.p-dropdown-filter-icon {
right: nth($inputPadding, 2);
color: $inputIconColor;
}
}
.p-dropdown-items {
padding: $inputListPadding;
.p-dropdown-item {
margin: $inputListItemMargin;
padding: $inputListItemPadding;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
&.p-focus {
background: $highlightFocusBg;
}
}
&:not(.p-highlight):not(.p-disabled) {
&.p-focus {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
}
.p-dropdown-check-icon {
position: relative;
margin-left: -1 * $inlineSpacing;
margin-right: $inlineSpacing;
}
}
.p-dropdown-item-group {
margin: $submenuHeaderMargin;
padding: $submenuHeaderPadding;
color: $submenuHeaderTextColor;
background: $submenuHeaderBg;
font-weight: $submenuHeaderFontWeight;
}
.p-dropdown-empty-message {
padding: $inputListItemPadding;
color: $inputListItemTextColor;
background: $inputListItemBg;
}
}
}

View File

@@ -0,0 +1,122 @@
.p-editor-container {
.p-editor-toolbar {
background: $editorToolbarBg;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
&.ql-snow {
border: $editorToolbarBorder;
.ql-stroke {
stroke: $editorToolbarIconColor;
}
.ql-fill {
fill: $editorToolbarIconColor;
}
.ql-picker {
.ql-picker-label {
border: 0 none;
color: $editorToolbarIconColor;
&:hover {
color: $editorToolbarIconHoverColor;
.ql-stroke {
stroke: $editorToolbarIconHoverColor;
}
.ql-fill {
fill: $editorToolbarIconHoverColor;
}
}
}
&.ql-expanded {
.ql-picker-label {
color: $editorToolbarIconHoverColor;
.ql-stroke {
stroke: $editorToolbarIconHoverColor;
}
.ql-fill {
fill: $editorToolbarIconHoverColor;
}
}
.ql-picker-options {
background: $inputOverlayBg;
border:$inputOverlayBorder;
box-shadow:$inputOverlayShadow;
border-radius: $borderRadius;
padding: $inputListPadding;
.ql-picker-item {
color: $inputListItemTextColor;
&:hover {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
}
}
&:not(.ql-icon-picker) {
.ql-picker-item {
padding: $inputListItemPadding;
}
}
}
}
}
}
.p-editor-content {
border-bottom-right-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
&.ql-snow {
border: $editorContentBorder;
}
.ql-editor {
background: $inputBg;
color: $inputTextColor;
border-bottom-right-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
}
}
.ql-snow.ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus {
color: $editorToolbarIconHoverColor;
.ql-stroke {
stroke: $editorToolbarIconHoverColor;
}
.ql-fill {
fill: $editorToolbarIconHoverColor;
}
}
.ql-snow.ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected {
color: $editorIconActiveColor;
.ql-stroke {
stroke: $editorIconActiveColor;
}
.ql-fill {
fill: $editorIconActiveColor;
}
.ql-picker-label {
color: $editorIconActiveColor;
}
}
}

View File

@@ -0,0 +1,10 @@
.p-icon-field {
position: relative;
}
.p-icon-field > .p-input-icon {
position: absolute;
top: 50%;
margin-top: -.5rem;
}

View File

@@ -0,0 +1,74 @@
.p-inputgroup-addon {
background: $inputGroupBg;
color: $inputGroupTextColor;
border-top: $inputBorder;
border-left: $inputBorder;
border-bottom: $inputBorder;
padding: $inputPadding;
min-width: $inputGroupAddOnMinWidth;
&:last-child {
border-right: $inputBorder;
}
}
.p-inputgroup {
> .p-component,
> .p-inputwrapper > .p-inputtext,
> .p-float-label > .p-component {
border-radius: 0;
margin: 0;
+ .p-inputgroup-addon {
border-left: 0 none;
}
&:focus {
z-index: 1;
~ label {
z-index: 1;
}
}
}
}
.p-inputgroup-addon:first-child,
.p-inputgroup button:first-child,
.p-inputgroup input:first-child,
.p-inputgroup > .p-inputwrapper:first-child,
.p-inputgroup > .p-inputwrapper:first-child > .p-inputtext {
border-top-left-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
}
.p-inputgroup .p-float-label:first-child input {
border-top-left-radius: $borderRadius;
border-bottom-left-radius: $borderRadius;
}
.p-inputgroup-addon:last-child,
.p-inputgroup button:last-child,
.p-inputgroup input:last-child,
.p-inputgroup > .p-inputwrapper:last-child,
.p-inputgroup > .p-inputwrapper:last-child > .p-inputtext {
border-top-right-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
.p-inputgroup .p-float-label:last-child input {
border-top-right-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
.p-fluid {
.p-inputgroup {
.p-button {
width: auto;
&.p-button-icon-only {
width: $buttonIconOnlyWidth;
}
}
}
}

View File

@@ -0,0 +1,15 @@
.p-fluid .p-icon-field-left,
.p-fluid .p-icon-field-right {
width: 100%;
}
.p-icon-field-left > .p-input-icon:first-of-type {
left: nth($inputPadding, 2);
color: $inputIconColor;
}
.p-icon-field-right > .p-input-icon:last-of-type {
right: nth($inputPadding, 2);
color: $inputIconColor;
}

View File

@@ -0,0 +1,5 @@
.p-inputnumber {
&.p-invalid.p-component > .p-inputtext {
@include invalid-input();
}
}

View File

@@ -0,0 +1,10 @@
.p-inputotp {
display: flex;
align-items: center;
gap: $inlineSpacing;
}
.p-inputotp-input {
text-align: center;
width: 2 * nth($inputPadding, 2) + 1rem;
}

View File

@@ -0,0 +1,100 @@
@use 'sass:math';
.p-inputswitch {
position: relative;
display: inline-block;
}
.p-inputswitch-input {
appearance: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
opacity: 0;
z-index: 1;
outline: 0 none;
cursor: pointer;
}
.p-inputswitch-slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 1px solid transparent;
}
.p-inputswitch-slider:before {
position: absolute;
content: '';
top: 50%;
}
.p-inputswitch {
width: $inputSwitchWidth;
height: $inputSwitchHeight;
.p-inputswitch-input {
border-radius: $inputSwitchBorderRadius;
}
.p-inputswitch-slider {
background: $inputSwitchSliderOffBg;
transition: $formElementTransition;
border-radius: $inputSwitchBorderRadius;
outline-color: transparent;
&:before {
background: $inputSwitchHandleOffBg;
width: $inputSwitchHandleWidth;
height: $inputSwitchHandleHeight;
left: $inputSwitchSliderPadding;
margin-top: math.div(-1 * $inputSwitchHandleHeight, 2);
border-radius: $inputSwitchHandleBorderRadius;
transition-duration: $transitionDuration;
}
}
&.p-highlight {
.p-inputswitch-slider {
background: $inputSwitchSliderOnBg;
&:before {
background: $inputSwitchHandleOnBg;
transform: translateX($inputSwitchHandleWidth);
}
}
}
&:not(.p-disabled) {
&:has(.p-inputswitch-input:hover) {
.p-inputswitch-slider {
background: $inputSwitchSliderOffHoverBg;
}
&.p-highlight {
.p-inputswitch-slider {
background: $inputSwitchSliderOnHoverBg;
}
}
}
&:has(.p-inputswitch-input:focus-visible) {
.p-inputswitch-slider {
@include focused();
}
}
}
&.p-invalid > .p-inputswitch-slider {
@include invalid-input();
}
}

View File

@@ -0,0 +1,101 @@
.p-inputtext {
font-family: var(--font-family);
font-feature-settings: var(--font-feature-settings, normal);
font-size: $inputTextFontSize;
color: $inputTextColor;
background: $inputBg;
padding: $inputPadding;
border: $inputBorder;
transition: $formElementTransition;
appearance: none;
border-radius: $borderRadius;
outline-color: transparent;
&:enabled:hover {
border-color: $inputHoverBorderColor;
}
&:enabled:focus {
@include focused-input();
}
&.p-invalid.p-component {
@include invalid-input();
}
&.p-variant-filled {
background-color: $inputFilledBg;
&:enabled:hover {
background-color: $inputFilledHoverBg;
}
&:enabled:focus {
background-color: $inputFilledFocusBg;
}
}
&.p-inputtext-sm {
@include scaledFontSize($inputTextFontSize, $scaleSM);
@include scaledPadding($inputPadding, $scaleSM);
}
&.p-inputtext-lg {
@include scaledFontSize($inputTextFontSize, $scaleLG);
@include scaledPadding($inputPadding, $scaleLG);
}
}
.p-float-label > label {
left: nth($inputPadding, 2);
color: $inputPlaceholderTextColor;
transition-duration: $transitionDuration;
}
.p-float-label > .p-invalid + label {
color: $inputErrorBorderColor;
}
.p-icon-field-left > .p-inputtext {
padding-left: nth($inputPadding, 2) * 2 + $primeIconFontSize;
}
.p-icon-field-left.p-float-label > label {
left: nth($inputPadding, 2) * 2 + $primeIconFontSize;
}
.p-icon-field-right > .p-inputtext {
padding-right: nth($inputPadding, 2) * 2 + $primeIconFontSize;
}
@include placeholder {
color: $inputPlaceholderTextColor;
}
.p-input-filled {
.p-inputtext {
background-color: $inputFilledBg;
&:enabled:hover {
background-color: $inputFilledHoverBg;
}
&:enabled:focus {
background-color: $inputFilledFocusBg;
}
}
}
.p-inputtext-sm {
.p-inputtext {
@include scaledFontSize($inputTextFontSize, $scaleSM);
@include scaledPadding($inputPadding, $scaleSM);
}
}
.p-inputtext-lg {
.p-inputtext {
@include scaledFontSize($inputTextFontSize, $scaleLG);
@include scaledPadding($inputPadding, $scaleLG);
}
}

View File

@@ -0,0 +1,139 @@
.p-listbox-list-wrapper {
overflow: auto;
}
.p-listbox-list {
list-style-type: none;
margin: 0;
padding: 0;
}
.p-listbox-item {
cursor: pointer;
position: relative;
overflow: hidden;
}
.p-listbox-item-group {
cursor: auto;
}
.p-listbox-filter-container {
position: relative;
}
.p-listbox-filter-icon {
position: absolute;
top: 50%;
margin-top: -0.5rem;
}
.p-listbox-filter {
width: 100%;
}
.p-listbox {
background: $inputListBg;
color: $inputListTextColor;
border: $inputListBorder;
border-radius: $borderRadius;
transition: $formElementTransition;
outline-color: transparent;
.p-listbox-header {
padding: $inputListHeaderPadding;
border-bottom: $inputListHeaderBorder;
color: $inputListHeaderTextColor;
background: $inputListHeaderBg;
margin: $inputListHeaderMargin;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
.p-listbox-filter {
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
}
.p-listbox-filter-icon {
right: nth($inputPadding, 2);
color: $inputIconColor;
}
}
.p-listbox-list {
padding: $inputListPadding;
outline: 0 none;
.p-listbox-item {
margin: $inputListItemMargin;
padding: $inputListItemPadding;
border: $inputListItemBorder;
color: $inputListItemTextColor;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
}
.p-listbox-item-group {
margin: $submenuHeaderMargin;
padding: $submenuHeaderPadding;
color: $submenuHeaderTextColor;
background: $submenuHeaderBg;
font-weight: $submenuHeaderFontWeight;
}
.p-listbox-empty-message {
padding: $inputListItemPadding;
color: $inputListItemTextColor;
background: $inputListItemBg;
}
}
&:not(.p-disabled) {
.p-listbox-item {
&.p-highlight {
&.p-focus {
background: $highlightFocusBg;
}
}
&:not(.p-highlight):not(.p-disabled) {
&.p-focus {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
&:hover {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
&.p-focus {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
}
}
}
}
&.p-focus {
@include focused-input();
}
&.p-invalid {
@include invalid-input();
}
}

View File

@@ -0,0 +1,31 @@
.p-mention-panel {
background: $inputOverlayBg;
color: $inputListTextColor;
border: $inputOverlayBorder;
border-radius: $borderRadius;
box-shadow: $inputOverlayShadow;
.p-mention-items {
padding: $inputListPadding;
.p-mention-item {
margin: $inputListItemMargin;
padding: $inputListItemPadding;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&:hover {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
}
}
}
}

View File

@@ -0,0 +1,278 @@
@use "sass:math";
.p-multiselect {
display: inline-flex;
cursor: pointer;
user-select: none;
}
.p-multiselect-trigger {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.p-multiselect-label-container {
overflow: hidden;
flex: 1 1 auto;
cursor: pointer;
}
.p-multiselect-label {
display: block;
white-space: nowrap;
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
}
.p-multiselect-label-empty {
overflow: hidden;
visibility: hidden;
}
.p-multiselect-token {
cursor: default;
display: inline-flex;
align-items: center;
flex: 0 0 auto;
}
.p-multiselect-token-icon {
cursor: pointer;
}
.p-multiselect .p-multiselect-panel {
min-width: 100%;
}
.p-multiselect-items-wrapper {
overflow: auto;
}
.p-multiselect-items {
margin: 0;
padding: 0;
list-style-type: none;
}
.p-multiselect-item {
cursor: pointer;
display: flex;
align-items: center;
font-weight: normal;
white-space: nowrap;
position: relative;
overflow: hidden;
}
.p-multiselect-item-group {
cursor: auto;
}
.p-multiselect-header {
display: flex;
align-items: center;
justify-content: space-between;
}
.p-multiselect-filter-container {
position: relative;
flex: 1 1 auto;
}
.p-multiselect-filter-icon {
position: absolute;
top: 50%;
margin-top: -0.5rem;
}
.p-multiselect-filter-container .p-inputtext {
width: 100%;
}
.p-multiselect-close {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
overflow: hidden;
position: relative;
margin-left: auto;
}
.p-fluid .p-multiselect {
display: flex;
}
.p-multiselect {
background: $inputBg;
border: $inputBorder;
transition: $formElementTransition;
border-radius: $borderRadius;
outline-color: transparent;
&:not(.p-disabled):hover {
border-color: $inputHoverBorderColor;
}
&:not(.p-disabled).p-focus {
@include focused-input();
}
&.p-variant-filled {
background: $inputFilledBg;
&:not(.p-disabled):hover {
background-color: $inputFilledHoverBg;
}
&:not(.p-disabled).p-focus {
background-color: $inputFilledFocusBg;
}
}
.p-multiselect-label {
padding: $inputPadding;
transition: $formElementTransition;
&.p-placeholder {
color: $inputPlaceholderTextColor;
}
}
&.p-multiselect-chip {
.p-multiselect-token {
padding: math.div(nth($inputPadding, 1), 2) nth($inputPadding, 2);
margin-right: $inlineSpacing;
background: $chipBg;
color: $chipTextColor;
border-radius: $chipBorderRadius;
.p-multiselect-token-icon {
margin-left: $inlineSpacing;
}
}
}
.p-multiselect-trigger {
background: transparent;
color: $inputIconColor;
width: $inputGroupAddOnMinWidth;
border-top-right-radius: $borderRadius;
border-bottom-right-radius: $borderRadius;
}
&.p-invalid.p-component {
@include invalid-input();
}
}
.p-inputwrapper-filled {
&.p-multiselect {
&.p-multiselect-chip {
.p-multiselect-label {
padding: math.div(nth($inputPadding, 1), 2)
nth($inputPadding, 2);
}
}
}
}
.p-multiselect-panel {
background: $inputOverlayBg;
color: $inputListTextColor;
border: $inputOverlayBorder;
border-radius: $borderRadius;
box-shadow: $inputOverlayShadow;
.p-multiselect-header {
padding: $inputListHeaderPadding;
border-bottom: $inputListHeaderBorder;
color: $inputListHeaderTextColor;
background: $inputOverlayHeaderBg;
margin: $inputListHeaderMargin;
border-top-right-radius: $borderRadius;
border-top-left-radius: $borderRadius;
.p-multiselect-filter-container {
.p-inputtext {
padding-right: nth($inputPadding, 2) + $primeIconFontSize;
}
.p-multiselect-filter-icon {
right: nth($inputPadding, 2);
color: $inputIconColor;
}
}
.p-checkbox {
margin-right: $inlineSpacing;
}
.p-multiselect-close {
margin-left: $inlineSpacing;
@include action-icon();
}
}
.p-multiselect-items {
padding: $inputListPadding;
.p-multiselect-item {
margin: $inputListItemMargin;
padding: $inputListItemPadding;
border: $inputListItemBorder;
color: $inputListItemTextColor;
background: $inputListItemBg;
transition: $listItemTransition;
border-radius: $inputListItemBorderRadius;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
&.p-highlight {
color: $highlightTextColor;
background: $highlightBg;
&.p-focus {
background: $highlightFocusBg;
}
}
&:not(.p-highlight):not(.p-disabled) {
&.p-focus {
color: $inputListItemTextHoverColor;
background: $inputListItemHoverBg;
}
}
.p-checkbox {
margin-right: $inlineSpacing;
}
}
.p-multiselect-item-group {
margin: $submenuHeaderMargin;
padding: $submenuHeaderPadding;
color: $submenuHeaderTextColor;
background: $submenuHeaderBg;
font-weight: $submenuHeaderFontWeight;
}
.p-multiselect-empty-message {
padding: $inputListItemPadding;
color: $inputListItemTextColor;
background: $inputListItemBg;
}
}
}

View File

@@ -0,0 +1,33 @@
.p-password {
&.p-invalid.p-component > .p-inputtext {
@include invalid-input();
}
}
.p-password-panel {
padding: $panelContentPadding;
background: $panelContentBg;
color: $panelContentTextColor;
border: $overlayContentBorder;
box-shadow: $inputOverlayShadow;
border-radius: $borderRadius;
.p-password-meter {
margin-bottom: $inlineSpacing;
background: $passwordMeterBg;
.p-password-strength {
&.weak {
background: $passwordWeakBg;
}
&.medium {
background: $passwordMediumBg;
}
&.strong {
background: $passwordStrongBg;
}
}
}
}

View File

@@ -0,0 +1,170 @@
.p-radiobutton {
position: relative;
display: inline-flex;
user-select: none;
vertical-align: bottom;
}
.p-radiobutton-input {
cursor: pointer;
}
.p-radiobutton-box {
display: flex;
justify-content: center;
align-items: center;
}
.p-radiobutton-icon {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0) scale(.1);
border-radius: 50%;
visibility: hidden;
}
.p-radiobutton.p-highlight .p-radiobutton-icon {
transform: translateZ(0) scale(1.0, 1.0);
visibility: visible;
}
.p-radiobutton {
width: $radiobuttonWidth;
height: $radiobuttonHeight;
.p-radiobutton-input {
appearance: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
opacity: 0;
z-index: 1;
outline: 0 none;
border: $radiobuttonBorder;
border-radius: 50%;
}
.p-radiobutton-box {
border: $radiobuttonBorder;
background: $inputBg;
width: $radiobuttonWidth;
height: $radiobuttonHeight;
color: $textColor;
border-radius: 50%;
transition: $formElementTransition;
outline-color: transparent;
.p-radiobutton-icon {
width: $radiobuttonIconSize;
height: $radiobuttonIconSize;
transition-duration: $transitionDuration;
background-color: $radiobuttonIconActiveColor;
}
}
&.p-highlight {
.p-radiobutton-box {
border-color: $radiobuttonActiveBorderColor;
background: $radiobuttonActiveBg;
}
}
&:not(.p-disabled) {
&:has(.p-radiobutton-input:hover) {
.p-radiobutton-box {
border-color: $inputHoverBorderColor;
}
&.p-highlight {
.p-radiobutton-box {
border-color: $radiobuttonActiveHoverBorderColor;
background: $radiobuttonActiveHoverBg;
.p-radiobutton-icon {
background-color: $radiobuttonIconActiveHoverColor;
}
}
}
}
&:has(.p-radiobutton-input:focus-visible) {
.p-radiobutton-box {
@include focused-input();
}
}
}
&.p-invalid > .p-radiobutton-box {
@include invalid-input();
}
&.p-variant-filled {
.p-radiobutton-box {
background-color: $inputFilledBg;
}
&.p-highlight {
.p-radiobutton-box {
background: $radiobuttonActiveBg;
}
}
&:not(.p-disabled) {
&:has(.p-radiobutton-input:hover) {
.p-radiobutton-box {
background-color: $inputFilledHoverBg;
}
&.p-highlight {
.p-radiobutton-box {
background: $radiobuttonActiveHoverBg;
}
}
}
}
}
}
.p-input-filled {
.p-radiobutton {
.p-radiobutton-box {
background-color: $inputFilledBg;
}
&.p-highlight {
.p-radiobutton-box {
background: $radiobuttonActiveBg;
}
}
&:not(.p-disabled) {
&:has(.p-radiobutton-input:hover) {
.p-radiobutton-box {
background-color: $inputFilledHoverBg;
}
&.p-highlight {
.p-radiobutton-box {
background: $radiobuttonActiveHoverBg;
}
}
}
}
}
}
@if ($highlightBg == $radiobuttonActiveBg) {
.p-highlight {
.p-radiobutton {
.p-radiobutton-box {
border-color: $radiobuttonIconActiveColor;
}
}
}
}

Some files were not shown because too many files have changed in this diff Show More