Compare commits
245 Commits
master
...
v2.4.0-bet
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
7cfbe94b7e | ||
|
|
187dcfae4d | ||
|
|
f4ee8fba68 | ||
|
|
fbbc450c41 | ||
|
|
4b0d73bab9 | ||
|
|
41d3db21ed | ||
|
|
6f77ce584e | ||
|
|
87209a984a | ||
|
|
406cda26d9 | ||
|
|
c6b45cdfa0 | ||
|
|
a60df9f050 | ||
|
|
4169db0857 | ||
|
|
342a0ac17f | ||
|
|
ec245fd46e | ||
|
|
ccb00ccdad | ||
|
|
7089f63213 | ||
|
|
bf174bfcb0 | ||
|
|
1f797fd5f7 | ||
|
|
b12cc7d9e4 | ||
|
|
26a56938ce | ||
|
|
4c25d55149 | ||
|
|
eb782d743b | ||
|
|
b7da81b3d3 | ||
|
|
6f754362f5 | ||
|
|
d1dd9b8013 | ||
|
|
936302b847 | ||
|
|
a0475e08ae | ||
|
|
235481d1d6 | ||
|
|
37c8bbb019 | ||
|
|
890ccbdb09 | ||
|
|
30324f4f33 | ||
|
|
324bca9f14 | ||
|
|
2c372a2ce2 | ||
|
|
b04a99466d | ||
|
|
201d482066 | ||
|
|
b5f4bba4e6 | ||
|
|
a1f6bb07d3 | ||
|
|
024e3faa9d | ||
|
|
436513ac24 | ||
|
|
d2d63c857a | ||
|
|
57c62f4222 | ||
|
|
af4ece9a80 | ||
|
|
3f5abdbfca | ||
|
|
383d685a5f | ||
|
|
075fe294ed | ||
|
|
9f870d0fad | ||
|
|
3c672fe9aa | ||
|
|
a7d49bd656 | ||
|
|
f02c61eb0e | ||
|
|
469e9cd136 | ||
|
|
84ca9cdc24 | ||
|
|
01b4740d93 | ||
|
|
17c9366f4b | ||
|
|
7cecd1922d | ||
|
|
d10ba04ec9 | ||
|
|
51142e7fc9 | ||
|
|
28c75ef8a0 | ||
|
|
cdc2e7e3d0 | ||
|
|
b5e67488e7 | ||
|
|
178adf5dc0 | ||
|
|
6683ab7303 | ||
|
|
7aa9f44d66 | ||
|
|
bfbccf9bf7 | ||
|
|
61cd9ca7b0 | ||
|
|
aa945e6e6f | ||
|
|
d73be88861 | ||
|
|
f46e5198b7 | ||
|
|
be0a0b17b0 | ||
|
|
074d1ca039 | ||
|
|
fcc14dcff7 | ||
|
|
bd3799eb7c | ||
|
|
082ffa3d41 | ||
|
|
09c91313a0 | ||
|
|
1273f93e67 | ||
|
|
74c27f7f11 | ||
|
|
501448ad6f | ||
|
|
cdcf40edc0 | ||
|
|
8747e8be04 | ||
|
|
2be703222a | ||
|
|
95d377eabc | ||
|
|
194f92be3a | ||
|
|
0c4ca8c4db | ||
|
|
2f3d9ca953 | ||
|
|
02efe00fc9 | ||
|
|
4758ab5216 | ||
|
|
b621ed77f2 | ||
|
|
76e1d899d5 | ||
|
|
b016468ab2 | ||
|
|
a527b7fe99 | ||
|
|
8410b2fdc1 | ||
|
|
e73de15f31 | ||
|
|
96174a1ada | ||
|
|
1817e83917 | ||
|
|
fff97052cc | ||
|
|
7ec1e072d9 | ||
|
|
3d4acd72d9 | ||
|
|
bb61097fea | ||
|
|
5ecdce9813 | ||
|
|
508e4f0815 | ||
|
|
70b95bbf6f | ||
|
|
dc83709196 | ||
|
|
09651c1d0c | ||
|
|
eec8a98901 | ||
|
|
e736df9f64 | ||
|
|
12ea7168fb | ||
|
|
90e62c2af0 | ||
|
|
e499f26f76 | ||
|
|
53b904d946 | ||
|
|
7ec587b75b | ||
|
|
0159d06b24 | ||
|
|
51bf7c4a80 | ||
|
|
6e2f5b0708 | ||
|
|
8a7b80c64c | ||
|
|
ced14b133d | ||
|
|
1fe157ae77 | ||
|
|
3cbb6273e0 | ||
|
|
7e011ed4b5 | ||
|
|
e3d93f7e1d | ||
|
|
797b65b3ca | ||
|
|
5b14053e35 | ||
|
|
4de79841b4 | ||
|
|
8d21b84474 | ||
|
|
7561213185 | ||
|
|
1a89a2feab | ||
|
|
060f79063e | ||
|
|
159887612e | ||
|
|
e207c9c0c8 | ||
|
|
be18803032 | ||
|
|
821a3bc063 | ||
|
|
79bd17075e | ||
|
|
30f9916802 | ||
|
|
5170c4f8ea | ||
|
|
09a8974ab7 | ||
|
|
e989db685e | ||
|
|
87cba5d352 | ||
|
|
8f0a652055 | ||
|
|
be11566d95 | ||
|
|
d4877677ab | ||
|
|
98400d1498 | ||
|
|
1bffa9fd44 | ||
|
|
7d78453e8a | ||
|
|
0e601c1463 | ||
|
|
b8ea25e8eb | ||
|
|
16bb613abe | ||
|
|
0ab2eb7f38 | ||
|
|
665514209b | ||
|
|
13f3036479 | ||
|
|
2de98d7b70 | ||
|
|
140c350c5c | ||
|
|
68e473db43 | ||
|
|
64a91f7b56 | ||
|
|
8e278e1145 | ||
|
|
bca8e8ec66 | ||
|
|
db51bd8b98 | ||
|
|
1a29b58111 | ||
|
|
35dacb3f97 | ||
|
|
688631379b | ||
|
|
05f0528552 | ||
|
|
20cd83d204 | ||
|
|
9d6c25d7b2 | ||
|
|
6ed3a7bfc4 | ||
|
|
476653811a | ||
|
|
84ad18c3e8 | ||
|
|
59c8ea100a | ||
|
|
493bdb6580 | ||
|
|
abe80a0e92 | ||
|
|
0dc992837e | ||
|
|
ec2e31079b | ||
|
|
d003040ddc | ||
|
|
b07ef01535 | ||
|
|
b4f1c53713 | ||
|
|
bcd808d203 | ||
|
|
9b80592460 | ||
|
|
8438a30eaa | ||
|
|
da310983fd | ||
|
|
04e4fcb934 | ||
|
|
1c243550e4 | ||
|
|
b71926e6ac | ||
|
|
f9a3f8b5ff | ||
|
|
0c4ebb13c2 | ||
|
|
198e91c64a | ||
|
|
9b77655eb3 | ||
|
|
c9dcc7c1dd | ||
|
|
e5e0c53b0c | ||
|
|
6eab94926c | ||
|
|
a0addfa177 | ||
|
|
cb6ac64ac4 | ||
|
|
e61eb404d2 | ||
|
|
ea7823b72c | ||
|
|
88b4e3d8b6 | ||
|
|
446b1cec52 | ||
|
|
d73cf99666 | ||
|
|
139b4604c5 | ||
|
|
af4360260c | ||
|
|
0050e298a2 | ||
|
|
d051696b4b | ||
|
|
a49aaf581b | ||
|
|
8db9797950 | ||
|
|
497ca6d7e6 | ||
|
|
034c31e089 | ||
|
|
bdec7573df | ||
|
|
f3b2f0d46c | ||
|
|
c2bc22698c | ||
|
|
bd61a3b66b | ||
|
|
fe147c9b21 | ||
|
|
faa724a692 | ||
|
|
dbfd0322c0 | ||
|
|
720c036708 | ||
|
|
2f64568f4c | ||
|
|
18b882dd3f | ||
|
|
4fbef59be1 | ||
|
|
9c28589ad6 | ||
|
|
bd36febbc0 | ||
|
|
2b73a99716 | ||
|
|
be82cd2d05 | ||
|
|
bc696b82cc | ||
|
|
fe3382b879 | ||
|
|
525f1e62fe | ||
|
|
10e1f7fc2d | ||
|
|
f284016fa8 | ||
|
|
93e99de603 | ||
|
|
6a45ff52d0 | ||
|
|
45b64a9739 | ||
|
|
74428d3ec4 | ||
|
|
e6318e7386 | ||
|
|
41d18400ba | ||
|
|
fceb5eebe6 | ||
|
|
f741eec73c | ||
|
|
b1e8da631e | ||
|
|
732d6bbd59 | ||
|
|
5482534db4 | ||
|
|
65904edd76 | ||
|
|
93f2ad2fef | ||
|
|
e92b9acd19 | ||
|
|
03ff6f5d9f | ||
|
|
d30707611d | ||
|
|
d7189ad95c | ||
|
|
34ce040105 | ||
|
|
c174dc7b63 | ||
|
|
2681b8bd2e | ||
|
|
dce8dd7070 | ||
|
|
12bf734658 | ||
|
|
ff6ce09d39 | ||
|
|
9c15693784 | ||
|
|
20eba516a4 |
@@ -1,16 +0,0 @@
|
||||
# https://github.com/browserslist/browserslist#readme
|
||||
# Updated for ES2022 compatibility
|
||||
|
||||
>= 0.5%
|
||||
last 2 major versions
|
||||
not dead
|
||||
Chrome >= 97
|
||||
Firefox >= 104
|
||||
Firefox ESR
|
||||
iOS >= 15.4
|
||||
Safari >= 15.4
|
||||
Edge >= 97
|
||||
not Explorer <= 11
|
||||
not ie 11
|
||||
not android 4.4.3
|
||||
not ios_saf < 15.4
|
||||
@@ -1,28 +0,0 @@
|
||||
{
|
||||
"files": [
|
||||
{
|
||||
"path": "./dist/css/adminlte.css",
|
||||
"maxSize": "46 kB"
|
||||
},
|
||||
{
|
||||
"path": "./dist/css/adminlte.min.css",
|
||||
"maxSize": "42 kB"
|
||||
},
|
||||
{
|
||||
"path": "./dist/css/adminlte.rtl.css",
|
||||
"maxSize": "46 kB"
|
||||
},
|
||||
{
|
||||
"path": "./dist/css/adminlte.rtl.min.css",
|
||||
"maxSize": "42 kB"
|
||||
},
|
||||
{
|
||||
"path": "./dist/js/adminlte.js",
|
||||
"maxSize": "8.5 kB"
|
||||
},
|
||||
{
|
||||
"path": "./dist/js/adminlte.min.js",
|
||||
"maxSize": "5.2 kB"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,14 +0,0 @@
|
||||
# editorconfig.org
|
||||
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
indent_size = 2
|
||||
indent_style = space
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = false
|
||||
@@ -1,7 +0,0 @@
|
||||
**/*.min.js
|
||||
**/plugins/
|
||||
/.temp/
|
||||
/dist/
|
||||
/docs/
|
||||
/docs_html/
|
||||
**/env.d.ts
|
||||
120
.eslintrc.json
120
.eslintrc.json
@@ -1,120 +0,0 @@
|
||||
{
|
||||
"root": true,
|
||||
"extends": [
|
||||
"plugin:import/errors",
|
||||
"plugin:import/warnings",
|
||||
"plugin:unicorn/recommended",
|
||||
"xo",
|
||||
"xo/browser"
|
||||
],
|
||||
"rules": {
|
||||
"arrow-body-style": "off",
|
||||
"capitalized-comments": "off",
|
||||
"comma-dangle": [
|
||||
"error",
|
||||
"never"
|
||||
],
|
||||
"indent": [
|
||||
"error",
|
||||
2,
|
||||
{
|
||||
"MemberExpression": "off",
|
||||
"SwitchCase": 1
|
||||
}
|
||||
],
|
||||
"max-params": [
|
||||
"warn",
|
||||
5
|
||||
],
|
||||
"multiline-ternary": [
|
||||
"error",
|
||||
"always-multiline"
|
||||
],
|
||||
"new-cap": [
|
||||
"error",
|
||||
{
|
||||
"properties": false
|
||||
}
|
||||
],
|
||||
"no-console": "error",
|
||||
"no-negated-condition": "off",
|
||||
"object-curly-spacing": [
|
||||
"error",
|
||||
"always"
|
||||
],
|
||||
"operator-linebreak": [
|
||||
"error",
|
||||
"after"
|
||||
],
|
||||
"semi": [
|
||||
"error",
|
||||
"never"
|
||||
],
|
||||
"unicorn/explicit-length-check": "off",
|
||||
"unicorn/no-array-callback-reference": "off",
|
||||
"unicorn/no-array-for-each": "off",
|
||||
"unicorn/no-array-method-this-argument": "off",
|
||||
"unicorn/no-null": "off",
|
||||
"unicorn/no-unused-properties": "error",
|
||||
"unicorn/prefer-array-flat": "off",
|
||||
"unicorn/prefer-dom-node-dataset": "off",
|
||||
"unicorn/prefer-export-from": "off",
|
||||
"unicorn/prefer-module": "off",
|
||||
"unicorn/prefer-query-selector": "off",
|
||||
"unicorn/prefer-spread": "off",
|
||||
"unicorn/prefer-string-replace-all": "off",
|
||||
"unicorn/prevent-abbreviations": "off"
|
||||
},
|
||||
"overrides": [
|
||||
{
|
||||
"files": ["*.ts", "*.tsx"],
|
||||
"extends": [
|
||||
"plugin:import/typescript",
|
||||
"xo-typescript"
|
||||
],
|
||||
"rules": {
|
||||
"@typescript-eslint/comma-dangle": [
|
||||
"error",
|
||||
"never"
|
||||
],
|
||||
"@typescript-eslint/indent": [
|
||||
"error",
|
||||
2,
|
||||
{
|
||||
"MemberExpression": "off",
|
||||
"SwitchCase": 1
|
||||
}
|
||||
],
|
||||
"@typescript-eslint/naming-convention": [
|
||||
"error",
|
||||
{
|
||||
"selector": "variable",
|
||||
"format": ["camelCase", "StrictPascalCase", "UPPER_CASE"]
|
||||
}
|
||||
],
|
||||
"@typescript-eslint/object-curly-spacing": [
|
||||
"error",
|
||||
"always"
|
||||
],
|
||||
"@typescript-eslint/semi": [
|
||||
"error",
|
||||
"never"
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"files": ["src/config/**"],
|
||||
"env": {
|
||||
"browser": false,
|
||||
"node": true
|
||||
},
|
||||
"parserOptions": {
|
||||
"sourceType": "module"
|
||||
},
|
||||
"rules": {
|
||||
"no-console": "off",
|
||||
"unicorn/prefer-top-level-await": "off"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
7
.gitattributes
vendored
7
.gitattributes
vendored
@@ -1,7 +0,0 @@
|
||||
# Enforce Unix newlines
|
||||
* text=auto eol=lf
|
||||
|
||||
# Ignores for analysis is used to produce the language stats bar which displays the languages percentages
|
||||
plugins/* linguist-vendored=true
|
||||
docs/* linguist-vendored=true
|
||||
src/html/* linguist-vendored=true
|
||||
34
.github/CONTRIBUTING.md
vendored
34
.github/CONTRIBUTING.md
vendored
@@ -1,34 +0,0 @@
|
||||
# Contributing to AdminLTE
|
||||
|
||||
Contributions are always **welcome and recommended**! Here is how for beginner's: [Get started with open source click here](https://youtu.be/GbqSvJs-6W4)
|
||||
|
||||
1. Contribution Requirements :
|
||||
* When you contribute, you agree to give a non-exclusive license to AdminLTE.io to use that contribution in any context as we (AdminLTE.io) see appropriate.
|
||||
* If you use content provided by another party, it must be appropriately licensed using an [open source](https://opensource.org/licenses) license.
|
||||
* Contributions are only accepted through GitHub pull requests.
|
||||
* Finally, contributed code must work in all supported browsers (see above for browser support).
|
||||
2. Installation :
|
||||
* Fork the repository ([here is the guide](https://help.github.com/articles/fork-a-repo/)).
|
||||
* Clone to your machine
|
||||
|
||||
```bash
|
||||
git clone https://github.com/YOUR_USERNAME/AdminLTE.git
|
||||
```
|
||||
* Create a new branch from `master`
|
||||
3. Compile dist files (Development) :
|
||||
* To compile the dist files you need Node.js 18 or higher/npm (node package manager)
|
||||
* `npm install` (install npm deps)
|
||||
* `npm run dev` (developer mode, autocompile with browsersync support for live demo)
|
||||
* Make your changes only in `./src` Folder OR `package.json` in any files which are necessary for contribution
|
||||
* Do not make changes in `./dist/**` Because it contains compiled files and do not include in PR (Pull Request)
|
||||
* `npm run production` (compile css/js files and test all pages are perfectly working fine, before creating a pull request)
|
||||
4. Create a pull request to `master` branch
|
||||
|
||||
## Online one-click setup for contributing
|
||||
|
||||
You can use [Codespace](https://docs.github.com/en/codespaces) an online IDE which is free for Open Source for working on issues or making PRs (Pull Requests). With a single click it will launch a workspace and automatically:
|
||||
|
||||
- clone the `AdminLTE` repo.
|
||||
- Open with [Codespace](https://docs.github.com/en/codespaces) or [](https://gitpod.io/from-referrer/)
|
||||
- install the dependencies.
|
||||
- run `npm run dev` to start the server.
|
||||
2
.github/FUNDING.yml
vendored
2
.github/FUNDING.yml
vendored
@@ -1,2 +0,0 @@
|
||||
github: danny007in
|
||||
custom: ["https://www.paypal.me/daniel007in"]
|
||||
@@ -1,32 +0,0 @@
|
||||
---
|
||||
name: Bug report for AdminLTE v3.x
|
||||
about: Create a report to help us improve AdminLTE v3.x
|
||||
title: "[BUG]"
|
||||
labels: type:bug, version:3.1.x
|
||||
assignees: ''
|
||||
|
||||
---
|
||||
|
||||
**Describe the bug**
|
||||
A clear and concise description of what the bug is.
|
||||
|
||||
**To Reproduce**
|
||||
Steps to reproduce the behavior:
|
||||
1. Go to '...'
|
||||
2. Click on '....'
|
||||
3. Scroll down to '....'
|
||||
4. See error
|
||||
|
||||
**Expected behavior**
|
||||
A clear and concise description of what you expected to happen.
|
||||
|
||||
**Screenshots**
|
||||
If applicable, add screenshots to help explain your problem.
|
||||
|
||||
**Environment (please complete the following information):**
|
||||
- AdminLTE Version: [e.g. v3.0.0]
|
||||
- Operating System: [e.g. macOS Catalina]
|
||||
- Browser (Version): [e.g. Chrome (Latest)]
|
||||
|
||||
**Additional context**
|
||||
Add any other context about the problem here.
|
||||
@@ -1,20 +0,0 @@
|
||||
---
|
||||
name: Feature request for AdminLTE v4.x
|
||||
about: Suggest an idea for this project
|
||||
title: "[FEATURE]"
|
||||
labels: type:enhancement, version:4.x
|
||||
assignees: ''
|
||||
|
||||
---
|
||||
|
||||
**Is your feature request related to a problem? Please describe.**
|
||||
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
|
||||
|
||||
**Describe the solution you'd like**
|
||||
A clear and concise description of what you want to happen.
|
||||
|
||||
**Describe alternatives you've considered**
|
||||
A clear and concise description of any alternative solutions or features you've considered.
|
||||
|
||||
**Additional context**
|
||||
Add any other context or screenshots about the feature request here.
|
||||
4
.github/codeql/codeql-config.yml
vendored
4
.github/codeql/codeql-config.yml
vendored
@@ -1,4 +0,0 @@
|
||||
name: "CodeQL config"
|
||||
|
||||
paths-ignore:
|
||||
- dist
|
||||
35
.github/dependabot.yml
vendored
35
.github/dependabot.yml
vendored
@@ -1,35 +0,0 @@
|
||||
version: 2
|
||||
updates:
|
||||
- package-ecosystem: npm
|
||||
directory: "/"
|
||||
schedule:
|
||||
interval: monthly
|
||||
time: "03:00"
|
||||
groups:
|
||||
eslint:
|
||||
patterns:
|
||||
- "eslint"
|
||||
- "eslint-*"
|
||||
- "@typescript-eslint/*"
|
||||
stylelint:
|
||||
patterns:
|
||||
- "stylelint"
|
||||
- "stylelint-*"
|
||||
prettier:
|
||||
patterns:
|
||||
- "prettier"
|
||||
- "prettier-*"
|
||||
rollup:
|
||||
patterns:
|
||||
- "rollup"
|
||||
- "@rollup/*"
|
||||
postcss:
|
||||
patterns:
|
||||
- "postcss"
|
||||
- "postcss-*"
|
||||
astro:
|
||||
patterns:
|
||||
- "astro"
|
||||
- "@astrojs/*"
|
||||
open-pull-requests-limit: 10
|
||||
versioning-strategy: increase
|
||||
43
.github/workflows/bundlewatch.yml
vendored
43
.github/workflows/bundlewatch.yml
vendored
@@ -1,43 +0,0 @@
|
||||
name: Bundlewatch
|
||||
|
||||
on:
|
||||
push:
|
||||
branches-ignore:
|
||||
- "dependabot/**"
|
||||
pull_request:
|
||||
workflow_dispatch:
|
||||
|
||||
env:
|
||||
FORCE_COLOR: 2
|
||||
NODE: 18
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
bundlewatch:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- name: Clone repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Set up Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: "${{ env.NODE }}"
|
||||
cache: npm
|
||||
|
||||
- name: Install npm dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Run dist
|
||||
run: npm run compile
|
||||
|
||||
- name: Run bundlewatch
|
||||
run: npm run bundlewatch
|
||||
env:
|
||||
BUNDLEWATCH_GITHUB_TOKEN: "${{ secrets.BUNDLEWATCH_GITHUB_TOKEN }}"
|
||||
CI_BRANCH_BASE: master
|
||||
44
.github/workflows/codeql.yml
vendored
44
.github/workflows/codeql.yml
vendored
@@ -1,44 +0,0 @@
|
||||
name: "CodeQL"
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
- "!dependabot/**"
|
||||
pull_request:
|
||||
# The branches below must be a subset of the branches above
|
||||
branches:
|
||||
- master
|
||||
- "!dependabot/**"
|
||||
schedule:
|
||||
- cron: "0 0 * * 0"
|
||||
workflow_dispatch:
|
||||
|
||||
jobs:
|
||||
analyze:
|
||||
name: Analyze
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
security-events: write
|
||||
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
# Initializes the CodeQL tools for scanning.
|
||||
- name: Initialize CodeQL
|
||||
uses: github/codeql-action/init@v2
|
||||
with:
|
||||
languages: "javascript"
|
||||
config-file: ./.github/codeql/codeql-config.yml
|
||||
queries: +security-and-quality
|
||||
|
||||
- name: Autobuild
|
||||
uses: github/codeql-action/autobuild@v2
|
||||
|
||||
- name: Perform CodeQL Analysis
|
||||
uses: github/codeql-action/analyze@v2
|
||||
with:
|
||||
category: "/language:javascript"
|
||||
37
.github/workflows/docs.yml
vendored
37
.github/workflows/docs.yml
vendored
@@ -1,37 +0,0 @@
|
||||
name: Docs
|
||||
|
||||
on:
|
||||
push:
|
||||
branches-ignore:
|
||||
- "dependabot/**"
|
||||
pull_request:
|
||||
workflow_dispatch:
|
||||
|
||||
env:
|
||||
FORCE_COLOR: 2
|
||||
NODE: 18
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
bundlewatch:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- name: Clone repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Set up Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: "${{ env.NODE }}"
|
||||
cache: npm
|
||||
|
||||
- name: Install npm dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Build docs
|
||||
run: npm run docs-compile
|
||||
37
.github/workflows/lint.yml
vendored
37
.github/workflows/lint.yml
vendored
@@ -1,37 +0,0 @@
|
||||
name: Lint
|
||||
|
||||
on:
|
||||
push:
|
||||
branches-ignore:
|
||||
- "dependabot/**"
|
||||
pull_request:
|
||||
workflow_dispatch:
|
||||
|
||||
env:
|
||||
FORCE_COLOR: 2
|
||||
NODE: 18
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
run:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- name: Clone repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Set up Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: "${{ env.NODE }}"
|
||||
cache: npm
|
||||
|
||||
- name: Install npm dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Run lint
|
||||
run: npm run lint
|
||||
54
.github/workflows/node-sass.yml
vendored
54
.github/workflows/node-sass.yml
vendored
@@ -1,54 +0,0 @@
|
||||
name: CSS (node-sass)
|
||||
|
||||
on:
|
||||
push:
|
||||
branches-ignore:
|
||||
- "dependabot/**"
|
||||
pull_request:
|
||||
workflow_dispatch:
|
||||
|
||||
env:
|
||||
FORCE_COLOR: 2
|
||||
NODE: 18
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
css:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- name: Clone repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Set up Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: "${{ env.NODE }}"
|
||||
cache: npm
|
||||
|
||||
- name: Install npm dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Build CSS with node-sass
|
||||
run: |
|
||||
npx --package node-sass@latest node-sass --version
|
||||
npx --package node-sass@latest node-sass --include-path=node_modules --output-style expanded --source-map true --source-map-contents true --precision 6 src/scss/ -o dist-sass/css/
|
||||
ls -Al dist-sass/css
|
||||
|
||||
# Check that there are no Sass variables (`$`)
|
||||
- name: Check built CSS files
|
||||
shell: bash
|
||||
run: |
|
||||
SASS_VARS_FOUND=$(find "dist-sass/css/" -type f -name "*.css" -print0 | xargs -0 --no-run-if-empty grep -F "\$" || true)
|
||||
if [[ -z "$SASS_VARS_FOUND" ]]; then
|
||||
echo "All good, no Sass variables found!"
|
||||
exit 0
|
||||
else
|
||||
echo "Found $(echo "$SASS_VARS_FOUND" | wc -l | bc) Sass variables:"
|
||||
echo "$SASS_VARS_FOUND"
|
||||
exit 1
|
||||
fi
|
||||
50
.github/workflows/release.yml
vendored
50
.github/workflows/release.yml
vendored
@@ -1,50 +0,0 @@
|
||||
name: Release & Publish
|
||||
|
||||
on:
|
||||
push:
|
||||
tags:
|
||||
- '*'
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Clone repository
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
persist-credentials: false
|
||||
|
||||
- name: Set env
|
||||
run: echo "RELEASE_VERSION=${GITHUB_REF#refs/*/}" >> $GITHUB_ENV
|
||||
|
||||
- name: Set up Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: "${{ env.NODE }}"
|
||||
cache: npm
|
||||
|
||||
- name: Install npm dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Build distribution files
|
||||
run: npm run production
|
||||
|
||||
- name: Zip distribution files
|
||||
uses: montudor/action-zip@v1
|
||||
with:
|
||||
args: "zip -qq admin-lte-${{env.RELEASE_VERSION}}.zip -d dist"
|
||||
|
||||
- name: Create changelog text
|
||||
id: changelog
|
||||
uses: endaft/action-changelog@v0.0.5
|
||||
with:
|
||||
token: ${{ secrets.GITHUB_TOKEN }}
|
||||
exclude_types: other,doc,chore
|
||||
|
||||
- name: Release
|
||||
uses: softprops/action-gh-release@v1
|
||||
if: startsWith(github.ref, 'refs/tags/')
|
||||
with:
|
||||
body: ${{ steps.changelog.outputs.changelog }}
|
||||
files: |
|
||||
admin-lte.${{env.RELEASE_VERSION}}.zip
|
||||
41
.gitignore
vendored
41
.gitignore
vendored
@@ -1,41 +1,12 @@
|
||||
# generated types
|
||||
.astro/
|
||||
|
||||
# unwanted types
|
||||
**/env.d.ts
|
||||
|
||||
# System / Log files
|
||||
*.DS_Store
|
||||
*.log
|
||||
|
||||
# Archives
|
||||
*.zip
|
||||
|
||||
# Sass Cache
|
||||
.sass-cache
|
||||
|
||||
# Project files
|
||||
.idea
|
||||
nbproject
|
||||
nbproject/private
|
||||
.vscode/
|
||||
.vs/
|
||||
|
||||
# Node / Bower
|
||||
node_modules/
|
||||
bower_components/
|
||||
|
||||
# Docs
|
||||
/docs/_site/
|
||||
/docs/vendor/
|
||||
/docs/.bundle/
|
||||
/docs_html/
|
||||
.jekyll-cache/
|
||||
.jekyll-metadata
|
||||
|
||||
# ETC
|
||||
.sass-cache/
|
||||
/nbproject/
|
||||
/nbproject/private/
|
||||
/node_modules/
|
||||
/bower_components/
|
||||
ad.js
|
||||
TODO
|
||||
test.html
|
||||
ad.js
|
||||
/.cache/
|
||||
CLAUDE.md
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
tasks:
|
||||
- init: npm install
|
||||
command: npm run dev
|
||||
ports:
|
||||
- port: 3000
|
||||
onOpen: open-preview
|
||||
15
.lgtm.yml
15
.lgtm.yml
@@ -1,15 +0,0 @@
|
||||
# https://lgtm.com/help/lgtm/customizing-file-classification
|
||||
path_classifiers:
|
||||
plugins:
|
||||
- plugins/
|
||||
|
||||
extraction:
|
||||
javascript:
|
||||
# https://lgtm.com/help/lgtm/javascript-extraction#customizing-index
|
||||
# The `index` step extracts information from the files in the codebase.
|
||||
index:
|
||||
# Specify a list of files and folders to exclude from extraction.
|
||||
exclude:
|
||||
- bower_components/
|
||||
- docs/assets/js/plugins/
|
||||
- plugins/
|
||||
41
.npmignore
41
.npmignore
@@ -1,38 +1,3 @@
|
||||
# Ignore IDE and editor configuration files
|
||||
/.astro/
|
||||
/.vscode/
|
||||
/idea/
|
||||
/.temp/
|
||||
/.cache/
|
||||
|
||||
# Ignore documentation files
|
||||
/docs/
|
||||
/docs_html/
|
||||
|
||||
# Ignore plugin files except for specific ones
|
||||
/plugins/*
|
||||
!/plugins/flot-old/
|
||||
|
||||
# Ignore Git and GitHub configuration files
|
||||
/.github/
|
||||
/.lgtm.yml
|
||||
/.gitignore
|
||||
/.gitattributes
|
||||
/.gitpod.yml
|
||||
|
||||
# Ignore configuration files for various tools
|
||||
/.browserlistrc
|
||||
/.bundlewatch.config.json
|
||||
/.editorconfig
|
||||
/.eslintignore
|
||||
/.eslintrc.json
|
||||
/.stylelintignore
|
||||
/.stylelintrc.json
|
||||
/composer.json
|
||||
/tsconfig.json
|
||||
|
||||
# Ignore specific source directories
|
||||
/src/assets/
|
||||
/src/config/
|
||||
/src/html/
|
||||
/src/utils/
|
||||
bower_components/
|
||||
documentation/
|
||||
composer.json
|
||||
@@ -1,6 +0,0 @@
|
||||
{
|
||||
"semi": true,
|
||||
"singleQuote": true,
|
||||
"printWidth": 100,
|
||||
"tabWidth": 2
|
||||
}
|
||||
@@ -1,8 +0,0 @@
|
||||
**/*.html
|
||||
**/*.md
|
||||
**/*.min.css
|
||||
**/.temp/
|
||||
**/dist/
|
||||
**/docs_html/
|
||||
**/plugins/
|
||||
**/.cache/
|
||||
@@ -1,47 +0,0 @@
|
||||
{
|
||||
"extends": [
|
||||
"stylelint-config-twbs-bootstrap"
|
||||
],
|
||||
"reportInvalidScopeDisables": true,
|
||||
"reportNeedlessDisables": true,
|
||||
"overrides": [
|
||||
{
|
||||
"files": ["**/*.scss"],
|
||||
"rules": {
|
||||
"declaration-no-important": null,
|
||||
"declaration-property-value-disallowed-list": {
|
||||
"border": "none",
|
||||
"outline": "none"
|
||||
},
|
||||
"function-disallowed-list": [
|
||||
"calc",
|
||||
"lighten",
|
||||
"darken"
|
||||
],
|
||||
"keyframes-name-pattern": null,
|
||||
"property-disallowed-list": [
|
||||
"border-radius",
|
||||
"border-top-left-radius",
|
||||
"border-top-right-radius",
|
||||
"border-bottom-right-radius",
|
||||
"border-bottom-left-radius",
|
||||
"transition"
|
||||
],
|
||||
"scss/dollar-variable-default": [
|
||||
true,
|
||||
{
|
||||
"ignore": "local"
|
||||
}
|
||||
],
|
||||
"scss/selector-no-union-class-name": true,
|
||||
"selector-max-class": null,
|
||||
"selector-max-combinators": null,
|
||||
"selector-max-compound-selectors": null,
|
||||
"selector-max-id": null,
|
||||
"selector-max-specificity": null,
|
||||
"selector-max-type": null,
|
||||
"selector-no-qualifying-type": null
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,369 +0,0 @@
|
||||
# AdminLTE Accessibility Compliance - WCAG 2.1 AA
|
||||
|
||||
## Overview
|
||||
|
||||
AdminLTE has been enhanced with comprehensive accessibility features to meet **WCAG 2.1 AA** standards. This implementation ensures the template is usable by all users, including those with disabilities who may use assistive technologies like screen readers, keyboard navigation, or voice control software.
|
||||
|
||||
## 🎯 WCAG 2.1 AA Compliance Features
|
||||
|
||||
### **Principle 1: Perceivable**
|
||||
|
||||
#### 1.1 Text Alternatives
|
||||
- ✅ **All decorative icons have `aria-hidden="true"`**
|
||||
- ✅ **Meaningful images have appropriate `alt` text**
|
||||
- ✅ **Icon fonts use screen reader friendly approaches**
|
||||
|
||||
#### 1.3 Adaptable
|
||||
- ✅ **Semantic HTML structure with proper landmarks**
|
||||
- ✅ **Form labels properly associated with inputs**
|
||||
- ✅ **Table headers have correct `scope` attributes**
|
||||
- ✅ **Lists use proper `<ul>`, `<ol>`, `<li>` structure**
|
||||
- ✅ **Heading hierarchy follows logical order (h1 → h2 → h3)**
|
||||
|
||||
#### 1.4 Distinguishable
|
||||
- ✅ **Color contrast ratios meet 4.5:1 minimum for normal text**
|
||||
- ✅ **Color contrast ratios meet 3:1 minimum for large text**
|
||||
- ✅ **Information not conveyed by color alone**
|
||||
- ✅ **Text can be resized up to 200% without loss of functionality**
|
||||
- ✅ **Focus indicators are clearly visible**
|
||||
|
||||
### **Principle 2: Operable**
|
||||
|
||||
#### 2.1 Keyboard Accessible
|
||||
- ✅ **All interactive elements are keyboard accessible**
|
||||
- ✅ **Tab order is logical and predictable**
|
||||
- ✅ **No keyboard traps exist**
|
||||
- ✅ **Skip links to bypass repetitive content**
|
||||
- ✅ **Arrow key navigation for menus**
|
||||
- ✅ **Escape key closes modals and dropdowns**
|
||||
|
||||
#### 2.2 Enough Time
|
||||
- ✅ **No time limits on user interactions**
|
||||
- ✅ **Animations can be paused or disabled**
|
||||
|
||||
#### 2.3 Seizures and Physical Reactions
|
||||
- ✅ **No content flashes more than 3 times per second**
|
||||
- ✅ **Respects `prefers-reduced-motion` user preference**
|
||||
- ✅ **Animation duration can be controlled**
|
||||
|
||||
#### 2.4 Navigable
|
||||
- ✅ **Skip links to main content and navigation**
|
||||
- ✅ **Descriptive page titles**
|
||||
- ✅ **Meaningful link text (no "click here")**
|
||||
- ✅ **Focus order matches visual order**
|
||||
- ✅ **Focus is clearly visible**
|
||||
- ✅ **Multiple ways to navigate (menus, breadcrumbs, search)**
|
||||
|
||||
#### 2.5 Input Modalities
|
||||
- ✅ **Touch targets are at least 44×44 pixels**
|
||||
- ✅ **Drag operations have keyboard alternatives**
|
||||
- ✅ **Touch gestures have alternatives**
|
||||
|
||||
### **Principle 3: Understandable**
|
||||
|
||||
#### 3.1 Readable
|
||||
- ✅ **Language of page is declared (`lang="en"`)**
|
||||
- ✅ **Language changes are marked up**
|
||||
- ✅ **Unusual words have definitions or explanations**
|
||||
|
||||
#### 3.2 Predictable
|
||||
- ✅ **Navigation is consistent across pages**
|
||||
- ✅ **Components behave predictably**
|
||||
- ✅ **Form submission doesn't cause unexpected context changes**
|
||||
|
||||
#### 3.3 Input Assistance
|
||||
- ✅ **Error messages are clearly identified**
|
||||
- ✅ **Form field requirements are indicated**
|
||||
- ✅ **Error suggestions are provided when possible**
|
||||
- ✅ **Form validation messages are announced to screen readers**
|
||||
|
||||
### **Principle 4: Robust**
|
||||
|
||||
#### 4.1 Compatible
|
||||
- ✅ **Valid HTML markup**
|
||||
- ✅ **Proper ARIA attributes and roles**
|
||||
- ✅ **Compatible with assistive technologies**
|
||||
- ✅ **Status messages are announced (`aria-live` regions)**
|
||||
|
||||
## 🛠️ Implementation Details
|
||||
|
||||
### **Skip Links Implementation**
|
||||
```html
|
||||
<!-- Automatically added by accessibility.js -->
|
||||
<div class="skip-links">
|
||||
<a href="#main" class="skip-link">Skip to main content</a>
|
||||
<a href="#navigation" class="skip-link">Skip to navigation</a>
|
||||
</div>
|
||||
```
|
||||
|
||||
### **ARIA Live Regions**
|
||||
```html
|
||||
<!-- Automatically created for status announcements -->
|
||||
<div id="live-region" class="live-region" aria-live="polite" aria-atomic="true" role="status"></div>
|
||||
```
|
||||
|
||||
### **Enhanced Focus Management**
|
||||
- **Modal Focus Trap**: Focus is contained within modals
|
||||
- **Dropdown Navigation**: Arrow keys navigate menu items
|
||||
- **Focus Restoration**: Previous focus restored when modals close
|
||||
- **Escape Key Support**: ESC closes modals and dropdowns
|
||||
|
||||
### **Form Accessibility**
|
||||
```html
|
||||
<!-- Example of accessible form with error handling -->
|
||||
<div class="mb-3">
|
||||
<label for="email" class="form-label">
|
||||
Email address <span class="required-indicator sr-only">(required)</span>
|
||||
</label>
|
||||
<input type="email" class="form-control" id="email" required aria-describedby="email-help email-error">
|
||||
<div id="email-help" class="form-text">We'll never share your email with anyone else.</div>
|
||||
<div id="email-error" class="invalid-feedback" role="alert"></div>
|
||||
</div>
|
||||
```
|
||||
|
||||
### **Table Accessibility**
|
||||
```html
|
||||
<!-- Accessible table structure -->
|
||||
<table class="table table-accessible" role="table">
|
||||
<caption>Monthly Sales Data</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Month</th>
|
||||
<th scope="col">Sales</th>
|
||||
<th scope="col">Growth</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">January</th>
|
||||
<td>$10,000</td>
|
||||
<td>+5%</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
```
|
||||
|
||||
### **Navigation Landmarks**
|
||||
```html
|
||||
<!-- Semantic navigation structure -->
|
||||
<nav role="navigation" aria-label="Main navigation" id="navigation">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a href="#" class="nav-link"
|
||||
role="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#widgets-nav"
|
||||
aria-expanded="false"
|
||||
aria-controls="widgets-nav"
|
||||
aria-label="Toggle widgets menu">
|
||||
<i class="nav-icon bi bi-box-seam" aria-hidden="true"></i>
|
||||
<p>Widgets <i class="nav-arrow bi bi-chevron-right" aria-hidden="true"></i></p>
|
||||
</a>
|
||||
<ul id="widgets-nav" class="nav nav-treeview collapse" role="group" aria-labelledby="widgets-nav">
|
||||
<!-- Submenu items -->
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
```
|
||||
|
||||
## 🎨 Accessible Color Palette
|
||||
|
||||
### **High Contrast Colors (4.5:1 ratio minimum)**
|
||||
- **Primary Accessible**: `#003d82` (4.5:1 on white)
|
||||
- **Success Accessible**: `#0f5132` (4.5:1 on white)
|
||||
- **Danger Accessible**: `#842029` (4.5:1 on white)
|
||||
- **Warning Accessible**: `#664d03` (4.5:1 on white)
|
||||
|
||||
### **Dark Mode Support**
|
||||
```css
|
||||
[data-bs-theme="dark"] {
|
||||
.text-accessible-primary { color: #6ea8fe; }
|
||||
.text-accessible-success { color: #75b798; }
|
||||
.text-accessible-danger { color: #f1aeb5; }
|
||||
.text-accessible-warning { color: #ffda6a; }
|
||||
}
|
||||
```
|
||||
|
||||
## 📱 Responsive & Touch Accessibility
|
||||
|
||||
### **Touch Target Sizes**
|
||||
- **Standard buttons**: Minimum 44×44 pixels
|
||||
- **Icon buttons**: Minimum 44×44 pixels touch area
|
||||
- **Small interactive elements**: Minimum 24×24 pixels (when grouped)
|
||||
|
||||
### **Responsive Considerations**
|
||||
- **Zoom support**: Up to 200% zoom without horizontal scrolling
|
||||
- **Mobile navigation**: Touch-friendly collapsible menus
|
||||
- **Orientation support**: Works in both portrait and landscape
|
||||
|
||||
## 🔧 JavaScript Accessibility API
|
||||
|
||||
### **AccessibilityManager Class**
|
||||
```typescript
|
||||
import { initAccessibility } from './accessibility.js'
|
||||
|
||||
// Initialize with full features
|
||||
const accessibilityManager = initAccessibility({
|
||||
announcements: true,
|
||||
skipLinks: true,
|
||||
focusManagement: true,
|
||||
keyboardNavigation: true,
|
||||
reducedMotion: true
|
||||
})
|
||||
|
||||
// Public API methods
|
||||
accessibilityManager.announce("Form submitted successfully", "polite")
|
||||
accessibilityManager.focusElement("#main-content")
|
||||
accessibilityManager.trapFocus(modalElement)
|
||||
```
|
||||
|
||||
### **Utility Functions**
|
||||
```typescript
|
||||
import { accessibilityUtils } from './accessibility.js'
|
||||
|
||||
// Check color contrast
|
||||
const contrast = accessibilityUtils.checkColorContrast("#000000", "#ffffff")
|
||||
console.log(contrast) // { ratio: 21, passes: true }
|
||||
|
||||
// Generate unique IDs
|
||||
const id = accessibilityUtils.generateId("form-field") // "form-field-abc123def"
|
||||
|
||||
// Check if element is focusable
|
||||
const isFocusable = accessibilityUtils.isFocusable(element) // true/false
|
||||
```
|
||||
|
||||
## 🧪 Testing & Validation
|
||||
|
||||
### **Automated Testing Tools**
|
||||
- **axe-core**: Automated accessibility testing
|
||||
- **WAVE**: Web accessibility evaluation
|
||||
- **Lighthouse**: Accessibility audit included
|
||||
|
||||
### **Manual Testing Checklist**
|
||||
- [ ] Navigate entire interface using only keyboard
|
||||
- [ ] Test with screen reader (NVDA, JAWS, VoiceOver)
|
||||
- [ ] Verify color contrast ratios
|
||||
- [ ] Test with 200% zoom
|
||||
- [ ] Verify reduced motion preferences
|
||||
- [ ] Test touch interactions on mobile
|
||||
|
||||
### **Screen Reader Testing**
|
||||
```bash
|
||||
# Test announcements
|
||||
accessibilityManager.announce("New message received", "assertive")
|
||||
|
||||
# Test form errors
|
||||
<input type="email" required aria-describedby="email-error">
|
||||
<div id="email-error" role="alert">Please enter a valid email address</div>
|
||||
```
|
||||
|
||||
## 📚 Browser Support
|
||||
|
||||
### **Modern Browser Support (ES2022 Compatible)**
|
||||
- **Chrome**: 97+ (97% coverage)
|
||||
- **Firefox**: 104+ (95% coverage)
|
||||
- **Safari**: 15.4+ (92% coverage)
|
||||
- **Edge**: 97+ (94% coverage)
|
||||
|
||||
### **Assistive Technology Support**
|
||||
- **JAWS**: 2020+
|
||||
- **NVDA**: 2020+
|
||||
- **VoiceOver**: macOS 10.15+, iOS 13+
|
||||
- **Dragon NaturallySpeaking**: 15+
|
||||
|
||||
## 🚀 Performance Impact
|
||||
|
||||
### **Bundle Size Impact**
|
||||
- **CSS**: +12KB (compressed)
|
||||
- **JavaScript**: +8KB (compressed)
|
||||
- **Total Impact**: ~20KB additional payload
|
||||
|
||||
### **Runtime Performance**
|
||||
- **Initialization**: ~5ms on modern devices
|
||||
- **Focus Management**: <1ms per interaction
|
||||
- **Announcements**: <1ms per message
|
||||
|
||||
## 📖 Usage Examples
|
||||
|
||||
### **Basic Setup**
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Enhanced accessibility meta tags -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<!-- AdminLTE CSS with accessibility styles -->
|
||||
<link rel="stylesheet" href="dist/css/adminlte.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- Skip links automatically added -->
|
||||
<!-- Main content with proper landmarks -->
|
||||
<main id="main" role="main">
|
||||
<!-- Your content -->
|
||||
</main>
|
||||
|
||||
<!-- AdminLTE JS with accessibility features -->
|
||||
<script src="dist/js/adminlte.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
### **Custom Configuration**
|
||||
```javascript
|
||||
// Initialize with custom settings
|
||||
const accessibility = initAccessibility({
|
||||
announcements: true, // Enable screen reader announcements
|
||||
skipLinks: true, // Add skip navigation links
|
||||
focusManagement: true, // Enhanced focus handling
|
||||
keyboardNavigation: true, // Arrow key navigation
|
||||
reducedMotion: false // Disable if animations are critical
|
||||
})
|
||||
|
||||
// Add custom announcements
|
||||
accessibility.announce("Data saved successfully", "polite")
|
||||
|
||||
// Focus specific elements
|
||||
accessibility.focusElement("#error-summary")
|
||||
```
|
||||
|
||||
## 🔄 Future Enhancements
|
||||
|
||||
### **Roadmap for Additional Features**
|
||||
- [ ] Voice navigation support
|
||||
- [ ] Enhanced keyboard shortcuts
|
||||
- [ ] Customizable contrast themes
|
||||
- [ ] Advanced screen reader optimization
|
||||
- [ ] Internationalization (i18n) support
|
||||
- [ ] Right-to-left (RTL) accessibility improvements
|
||||
|
||||
### **Community Contributions**
|
||||
We welcome contributions to improve accessibility further. Please:
|
||||
1. Follow WCAG 2.1 AA guidelines
|
||||
2. Test with multiple assistive technologies
|
||||
3. Document any new features thoroughly
|
||||
4. Include automated tests where possible
|
||||
|
||||
---
|
||||
|
||||
## 📞 Support & Resources
|
||||
|
||||
### **Documentation**
|
||||
- [WCAG 2.1 Guidelines](https://www.w3.org/WAI/WCAG21/quickref/)
|
||||
- [ARIA Authoring Practices](https://www.w3.org/WAI/ARIA/apg/)
|
||||
- [WebAIM Resources](https://webaim.org/)
|
||||
|
||||
### **Testing Tools**
|
||||
- [axe-core](https://github.com/dequelabs/axe-core)
|
||||
- [WAVE Web Accessibility Evaluator](https://wave.webaim.org/)
|
||||
- [Lighthouse Accessibility](https://developers.google.com/web/tools/lighthouse/)
|
||||
|
||||
### **Screen Readers**
|
||||
- [NVDA (Free)](https://www.nvaccess.org/)
|
||||
- [JAWS (Commercial)](https://www.freedomscientific.com/products/software/jaws/)
|
||||
- [VoiceOver (Built-in on macOS/iOS)](https://support.apple.com/guide/voiceover/)
|
||||
|
||||
---
|
||||
|
||||
**AdminLTE v4.0.0** - Now with comprehensive WCAG 2.1 AA accessibility compliance! 🎉
|
||||
495
CHANGELOG.md
495
CHANGELOG.md
@@ -1,495 +0,0 @@
|
||||
# Changelog
|
||||
|
||||
All notable changes to AdminLTE will be documented in this file.
|
||||
|
||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [Unreleased]
|
||||
|
||||
## [4.0.0-rc4] - 2025-07-10
|
||||
|
||||
### Updated
|
||||
- **Dependencies:** Updated 8 packages to latest versions
|
||||
- @rollup/plugin-typescript: 12.1.3 → 12.1.4
|
||||
- @typescript-eslint/eslint-plugin: 8.35.1 → 8.36.0
|
||||
- @typescript-eslint/parser: 8.35.1 → 8.36.0
|
||||
- astro: 5.10.0 → 5.11.0
|
||||
- eslint: 9.30.0 → 9.30.1
|
||||
- prettier: 3.5.3 → 3.6.2
|
||||
- rollup: 4.44.0 → 4.44.2
|
||||
- stylelint: 16.21.0 → 16.21.1
|
||||
|
||||
### Fixed
|
||||
- **Windows Build Compatibility:** Fixed npm scripts to work cross-platform by replacing Unix-specific shell commands with `shx`
|
||||
- Updated `copy-assets` script to use `shx mkdir` and `shx cp` commands
|
||||
- Updated `flatten-build` script to use `shx cp` and `shx rm` commands
|
||||
- Added `shx` package as dev dependency for cross-platform shell command support
|
||||
- Resolves build failures on Windows systems with "The syntax of the command is incorrect" errors
|
||||
- **TeamViewer Modal Compatibility:** Fixed modal fade animations for remote desktop compatibility
|
||||
- Updated accessibility CSS to use `transition: none` and `opacity: 1` instead of `display: block`
|
||||
- Maintains WCAG 2.1 AA compliance while ensuring modals work properly in TeamViewer sessions
|
||||
- Added specific transform overrides for modal dialogs in reduced motion mode
|
||||
- **Mobile Sidebar Scrolling:** Fixed sidebar closing unexpectedly when scrolling on mobile devices
|
||||
- Updated touch event handling to differentiate between tap and scroll gestures
|
||||
- Added proper overflow properties to sidebar wrapper for mobile viewport
|
||||
- Sidebar now remains open during scroll operations on touch devices
|
||||
- Resolves issue where scrolling in sidebar would immediately close it on mobile browsers
|
||||
- **Image Path Resolution:** Fixed mobile image loading by using relative paths in HTML
|
||||
- **Root Cause:** Absolute paths like `/assets/img/user.jpg` caused 404 errors on mobile
|
||||
- **Solution:** Generate relative image paths in Astro components based on page location
|
||||
- **Result:** Images now load correctly on all devices and deployment scenarios
|
||||
|
||||
## [4.0.0-rc3] - 2025-06-24
|
||||
|
||||
### Production Deployment & Cross-Platform Compatibility
|
||||
|
||||
This release resolves critical production deployment issues and ensures consistent behavior between development and production environments across different deployment scenarios.
|
||||
|
||||
### 🚀 **Production Deployment Fixes**
|
||||
|
||||
#### **Path Resolution System**
|
||||
- **Smart Path Resolution:** Implemented intelligent relative path calculation for all assets
|
||||
- CSS/JS paths automatically adjust based on page depth (e.g., `./css/` for root, `../css/` for sub-pages)
|
||||
- Image paths dynamically corrected at runtime for any deployment structure
|
||||
- Works seamlessly for root deployment, sub-folder deployment, and CDN hosting
|
||||
|
||||
#### **RTL CSS Processing Fix**
|
||||
- **PostCSS Configuration:** Fixed `rtlcss` plugin interference with LTR builds
|
||||
- `rtlcss` now only runs during RTL-specific builds (`NODE_ENV=RTL`)
|
||||
- Prevents automatic left/right property flipping in standard production builds
|
||||
- Maintains separate `.rtl.css` files for right-to-left language support
|
||||
|
||||
#### **Image Loading Resolution**
|
||||
- **Runtime Image Path Fix:** Added intelligent image path correction script
|
||||
- Detects deployment context from working CSS/JS paths
|
||||
- Automatically converts absolute image paths (`/assets/img/...`) to relative paths
|
||||
- Ensures images load correctly regardless of deployment sub-folder structure
|
||||
|
||||
### 🎨 **UI/Navigation Improvements**
|
||||
|
||||
#### **Sidebar Navigation Fixed**
|
||||
- **Badge & Arrow Positioning:** Resolved sidebar layout issues
|
||||
- Fixed nav badges overlapping text elements
|
||||
- Restored chevron arrow indicators for expandable menu items
|
||||
- Corrected spacing and visual hierarchy in sidebar navigation
|
||||
- Added `sidebar-open` class to all layouts for consistent styling
|
||||
|
||||
#### **Cross-Device Consistency**
|
||||
- **Full-Width Navigation Links:** Enhanced clickable areas
|
||||
- Set `.sidebar-menu .nav-link { width: 100%; }` for better UX
|
||||
- Ensures badges and arrows align properly at the far right edge
|
||||
- Maintains proper spacing across all screen sizes and devices
|
||||
|
||||
### 📦 **CDN & Dependencies**
|
||||
|
||||
#### **Updated to Latest Stable Versions**
|
||||
- **Bootstrap:** v5.3.3 → v5.3.7 (latest stable)
|
||||
- **Bootstrap Icons:** v1.11.3 → v1.13.1 (latest with new icons)
|
||||
- **OverlayScrollbars:** v2.10.1 → v2.11.0 (performance improvements)
|
||||
- **PopperJS:** v2.11.8 (confirmed latest - no change needed)
|
||||
|
||||
#### **Integrity Attribute Removal**
|
||||
- **SRI-Free CDN Loading:** Removed `integrity` attributes from all CDN resources
|
||||
- Prevents "Failed to find a valid digest" console errors
|
||||
- Allows CDN providers to update files without breaking existing links
|
||||
- Maintains `crossorigin="anonymous"` for security while removing brittle SRI checks
|
||||
|
||||
### 🛠️ **Build System Enhancements**
|
||||
|
||||
#### **Development vs Production Parity**
|
||||
- **Unified Asset Pipeline:** Both dev and production now use identical asset resolution
|
||||
- Development copies fresh CSS/JS to `src/html/public/` for hot-reloading
|
||||
- Production builds CSS/JS to `dist/css/` and `dist/js/` then flattens structure
|
||||
- Smart path resolution ensures consistent behavior in both environments
|
||||
|
||||
#### **Git Repository Cleanup**
|
||||
- **Production Build Distribution:** Added complete `dist/` folder to repository
|
||||
- Provides ready-to-use production files for immediate deployment
|
||||
- Simplifies distribution and CDN access via jsDelivr
|
||||
- Enables direct download without requiring Node.js build environment
|
||||
|
||||
### 🐛 **Critical Bug Fixes**
|
||||
|
||||
#### **Console Errors Eliminated**
|
||||
- **SortableJS Loading:** Fixed CDN integrity mismatch for SortableJS
|
||||
- **Asset Path Errors:** Resolved 404 errors for images in sub-folder deployments
|
||||
- **ESLint Compliance:** Fixed `prefer-global-this` and `prefer-string-slice` linting issues
|
||||
|
||||
#### **Cross-Browser Compatibility**
|
||||
- **Modern Browser Support:** Updated all CDN references to use stable, versioned URLs
|
||||
- **Legacy Browser Fallbacks:** Maintained compatibility while leveraging modern features
|
||||
- **Touch Device Optimization:** Enhanced touch target sizing and navigation
|
||||
|
||||
### 📊 **Performance & Reliability**
|
||||
|
||||
#### **Bundle Analysis**
|
||||
- **Size Optimization:** All bundle watch checks pass with updated thresholds
|
||||
- **Loading Performance:** Faster initial page load with optimized asset delivery
|
||||
- **Runtime Performance:** Minimal overhead from path resolution scripts (<1ms execution)
|
||||
|
||||
#### **Deployment Versatility**
|
||||
- **FTP Deployment:** Full support for traditional FTP/SFTP deployment workflows
|
||||
- **Static Hosting:** Compatible with GitHub Pages, Netlify, Vercel, Cloudflare Pages
|
||||
- **Sub-folder Deployment:** Works seamlessly when deployed to `/themes/v4/` or similar paths
|
||||
- **CDN Integration:** Ready for integration with content delivery networks
|
||||
|
||||
### 🎯 **Quality Assurance**
|
||||
|
||||
#### **Testing Coverage**
|
||||
- **Development Environment:** `npm run dev` - all features verified working
|
||||
- **Production Build:** `npm run production` - 37 pages built successfully, 0 errors
|
||||
- **Static Serving:** `python3 -m http.server` - full functionality confirmed
|
||||
- **Sub-folder Deployment:** Tested with various deployment paths and structures
|
||||
|
||||
#### **Linting & Standards**
|
||||
- **Zero Linting Errors:** Complete compliance with ESLint and StyleLint rules
|
||||
- **Code Consistency:** Unified code style across all JavaScript and CSS files
|
||||
- **Best Practices:** Modern ES2022+ patterns with proper browser compatibility
|
||||
|
||||
### 🚀 **Deployment Guide**
|
||||
|
||||
#### **Quick Start**
|
||||
```bash
|
||||
# Build for production
|
||||
npm run production
|
||||
|
||||
# Deploy via FTP (upload entire dist/ folder contents)
|
||||
# Or serve locally for testing
|
||||
cd dist && python3 -m http.server 8080
|
||||
```
|
||||
|
||||
#### **Deployment Scenarios**
|
||||
1. **Root Deployment:** Upload `dist/` contents to `public_html/` or equivalent
|
||||
2. **Sub-folder Deployment:** Upload `dist/` contents to `public_html/admin/` or similar
|
||||
3. **Static Host Deployment:** Point build directory to `dist/` in your hosting platform
|
||||
4. **CDN Integration:** Upload assets to CDN and update paths as needed
|
||||
|
||||
### 📋 **Migration Notes**
|
||||
|
||||
#### **From 4.0.0-rc2 to 4.0.0-rc3**
|
||||
|
||||
**Automatic Updates (No Action Required):**
|
||||
- Path resolution works automatically in all deployment scenarios
|
||||
- Image loading is fixed without any HTML changes needed
|
||||
- Sidebar navigation displays correctly with proper spacing and indicators
|
||||
- All CDN resources load without console errors
|
||||
|
||||
**Recommended Actions:**
|
||||
- Remove any manual path fixes you may have implemented
|
||||
- Update your deployment process to use the new `dist/` structure
|
||||
- Verify image loading in your specific deployment environment
|
||||
- Test both development (`npm run dev`) and production builds
|
||||
|
||||
**Breaking Changes:**
|
||||
- None - this release is fully backward compatible with existing HTML and CSS
|
||||
|
||||
---
|
||||
|
||||
## [4.0.0-rc2] - 2025-06-20
|
||||
|
||||
### ES2022 Modernization & Accessibility Compliance
|
||||
|
||||
This release modernizes AdminLTE to ES2022 standards and implements comprehensive WCAG 2.1 AA accessibility compliance, making it one of the most accessible admin templates available.
|
||||
|
||||
### JavaScript & Build System
|
||||
|
||||
#### 🚀 **ES2022 Upgrade**
|
||||
- **TypeScript Target:** Upgraded from ES6 to ES2022
|
||||
- Enables modern JavaScript features: optional chaining, nullish coalescing, class fields
|
||||
- Improved performance with native modern browser optimizations
|
||||
- Better tree-shaking and smaller bundle sizes
|
||||
- **Browser Support:** Updated `.browserslistrc` for ES2022 compatibility
|
||||
- Chrome ≥97, Firefox ≥104, Safari ≥15.4, Edge ≥97
|
||||
- Removed Internet Explorer support (end-of-life)
|
||||
- **Build Configuration:** Enhanced Rollup configuration
|
||||
- Native ES2022 module output
|
||||
- Improved source map generation
|
||||
- TypeScript integration optimization
|
||||
|
||||
### ♿ **Accessibility Features**
|
||||
|
||||
#### **WCAG 2.1 AA Compliance Implementation**
|
||||
- **New Accessibility Module:** Complete `AccessibilityManager` class (`src/ts/accessibility.ts`)
|
||||
- Automatic skip links generation and management
|
||||
- ARIA live regions for dynamic content announcements
|
||||
- Enhanced focus management and keyboard navigation
|
||||
- Screen reader compatibility (JAWS, NVDA, VoiceOver)
|
||||
- Form validation with accessible error handling
|
||||
|
||||
#### **Core Accessibility Features:**
|
||||
- **Skip Navigation:** Automatic skip links to main content, navigation, and key sections
|
||||
- **Focus Management:**
|
||||
- Enhanced focus indicators meeting contrast requirements
|
||||
- Focus trapping for modals and dropdowns
|
||||
- Logical tab order management
|
||||
- **Keyboard Navigation:**
|
||||
- Full keyboard accessibility for all interactive elements
|
||||
- Arrow key navigation for menus and tree views
|
||||
- Escape key handling for closing modals/dropdowns
|
||||
- **Screen Reader Support:**
|
||||
- Proper ARIA labels, roles, and properties
|
||||
- Live region announcements for dynamic content
|
||||
- Semantic HTML structure with landmarks
|
||||
- **Form Accessibility:**
|
||||
- Automatic error identification and announcement
|
||||
- Required field indicators
|
||||
- Proper label associations
|
||||
|
||||
#### **Responsive Design & Preferences:**
|
||||
- **Reduced Motion:** Respects `prefers-reduced-motion` for users with vestibular disorders
|
||||
- **High Contrast:** Enhanced support for high contrast mode
|
||||
- **Touch Targets:** Minimum 44×44 pixel touch targets (WCAG 2.5.8)
|
||||
- **Color Contrast:** All color combinations meet 4.5:1 contrast ratio requirement
|
||||
|
||||
### 🎨 **Accessibility Styles**
|
||||
|
||||
#### **New Stylesheet:** `src/scss/_accessibility.scss`
|
||||
- **Skip Link Styling:** Visually hidden until focused, proper positioning
|
||||
- **Enhanced Focus Indicators:** 3px outline with high contrast colors
|
||||
- **Screen Reader Utilities:** `.sr-only` and `.sr-only-focusable` classes
|
||||
- **Touch Target Sizing:** Utilities for ensuring minimum touch target sizes
|
||||
- **Accessible Color Palette:** Pre-defined colors meeting contrast requirements
|
||||
- **Print Accessibility:** Enhanced print styles with visible URLs and borders
|
||||
|
||||
### 🏗️ **Component Improvements**
|
||||
|
||||
#### **Enhanced Components:**
|
||||
- **Header Component:** Improved meta tags with accessibility features
|
||||
- Color scheme support (`light`/`dark`)
|
||||
- Theme color meta tags for browser UI
|
||||
- Enhanced viewport configuration
|
||||
- Accessibility description updates
|
||||
- **Navigation Components:**
|
||||
- Proper ARIA roles and labels
|
||||
- Semantic navigation landmarks
|
||||
- Keyboard navigation support
|
||||
- Screen reader announcements
|
||||
|
||||
### 📚 **Documentation & Compliance**
|
||||
|
||||
#### **Added:**
|
||||
- **`ACCESSIBILITY-COMPLIANCE.md`:** Comprehensive documentation
|
||||
- Implementation guide for developers
|
||||
- Testing procedures and tools
|
||||
- Browser and assistive technology compatibility
|
||||
- API documentation for accessibility features
|
||||
- Usage examples and best practices
|
||||
|
||||
#### **API Reference:**
|
||||
```javascript
|
||||
// Initialize accessibility features
|
||||
const a11y = initAccessibility({
|
||||
announcements: true, // Enable live announcements
|
||||
skipLinks: true, // Add skip navigation links
|
||||
focusManagement: true, // Enhanced focus handling
|
||||
keyboardNavigation: true, // Full keyboard support
|
||||
reducedMotion: true // Respect motion preferences
|
||||
});
|
||||
|
||||
// Public methods
|
||||
a11y.announce('Content updated', 'polite');
|
||||
a11y.focusElement('#main-content');
|
||||
a11y.trapFocus(modalElement);
|
||||
a11y.addLandmarks();
|
||||
```
|
||||
|
||||
### 🔧 **Technical Improvements**
|
||||
|
||||
#### **Build System:**
|
||||
- **Zero Linting Errors:** All CSS and JavaScript pass strict linting rules
|
||||
- **Bundle Impact:** Minimal size increase (~23KB total for accessibility features)
|
||||
- **Performance:** <5ms initialization time for accessibility features
|
||||
- **Integration:** Seamless integration with existing AdminLTE architecture
|
||||
|
||||
#### **Browser Compatibility:**
|
||||
- **Modern Browsers:** Full ES2022 support in target browsers
|
||||
- **Assistive Technology:** Tested with leading screen readers
|
||||
- **Mobile Support:** Enhanced touch and mobile accessibility
|
||||
- **Legacy Graceful Degradation:** Core functionality maintained for older browsers
|
||||
|
||||
### 🐛 **Bug Fixes**
|
||||
|
||||
#### **Layout Issues:**
|
||||
- **Sidebar Component:** Fixed corrupted navigation structure
|
||||
- **Header Navigation:** Resolved parsing errors in Astro components
|
||||
- **CSS Compilation:** Fixed SASS deprecation warnings and property order issues
|
||||
- **Focus Indicators:** Corrected outline and focus ring implementations
|
||||
|
||||
#### **Linting Compliance:**
|
||||
- **CSS:** Fixed 72+ StyleLint violations in accessibility styles
|
||||
- **JavaScript:** Resolved ESLint violations for numeric separators and function scoping
|
||||
- **TypeScript:** Fixed compilation errors with modern syntax
|
||||
|
||||
### 📊 **Performance Metrics**
|
||||
|
||||
#### **Bundle Sizes:**
|
||||
- **CSS:** ~357KB (includes full accessibility features)
|
||||
- **JavaScript:** ~47KB (includes AccessibilityManager)
|
||||
- **Gzipped Impact:** <10KB additional for complete accessibility suite
|
||||
|
||||
#### **Lighthouse Scores:**
|
||||
- **Accessibility:** 100% (WCAG 2.1 AA compliant)
|
||||
- **Performance:** Maintained existing performance levels
|
||||
- **Best Practices:** Improved with modern JavaScript patterns
|
||||
|
||||
### 🎯 **Standards Compliance**
|
||||
|
||||
#### **WCAG 2.1 AA Requirements Met:**
|
||||
- **1. Perceivable:** Text alternatives, semantic structure, color contrast
|
||||
- **2. Operable:** Keyboard accessibility, no seizure triggers, sufficient time
|
||||
- **3. Understandable:** Readable content, predictable functionality, input assistance
|
||||
- **4. Robust:** Valid markup, assistive technology compatibility
|
||||
|
||||
#### **Additional Standards:**
|
||||
- **Section 508:** US federal accessibility requirements
|
||||
- **EN 301 549:** European accessibility standard
|
||||
- **ADA Compliance:** Americans with Disabilities Act requirements
|
||||
|
||||
### 🚀 **Migration Guide**
|
||||
|
||||
#### **From 4.0.0-rc1 to 4.0.0-rc2:**
|
||||
|
||||
**Automatic Features (No Action Required):**
|
||||
- Accessibility features initialize automatically
|
||||
- Skip links appear automatically for keyboard users
|
||||
- Focus management works out-of-the-box
|
||||
- Screen reader announcements are enabled by default
|
||||
|
||||
**Optional Enhancements:**
|
||||
```html
|
||||
<!-- Add accessibility-enhanced form -->
|
||||
<form class="needs-validation" novalidate>
|
||||
<div class="mb-3">
|
||||
<label for="email" class="form-label">Email <span class="required-indicator">*</span></label>
|
||||
<input type="email" class="form-control" id="email" required>
|
||||
<div class="invalid-feedback" role="alert"></div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- Use accessible color classes -->
|
||||
<div class="alert alert-success text-accessible-success">Success message</div>
|
||||
```
|
||||
|
||||
**For Developers:**
|
||||
- Include accessibility utilities: `import { accessibilityUtils } from './adminlte.js'`
|
||||
- Use new CSS classes: `.sr-only`, `.touch-target`, `.text-accessible-*`
|
||||
- Test with screen readers and keyboard navigation
|
||||
|
||||
---
|
||||
|
||||
## [4.0.0-rc1] - 2025-06-20
|
||||
|
||||
### Major Modernization Release
|
||||
|
||||
This release represents a complete modernization of the AdminLTE codebase, bringing it up to current standards with the latest tooling, dependencies, and best practices.
|
||||
|
||||
### Infrastructure & Tooling
|
||||
|
||||
#### Added
|
||||
- **New npm scripts for better developer experience:**
|
||||
- `npm start` - Quick development server launch
|
||||
- `npm run build` - Convenient build command for development
|
||||
- Enhanced `npm run production` with bundlewatch integration
|
||||
|
||||
#### Changed
|
||||
- **Upgraded to ES Modules:** Added `"type": "module"` to package.json
|
||||
- **ESLint modernization:** Complete upgrade to ESLint v9 with new flat configuration format
|
||||
- Migrated from `.eslintrc.json` to modern `eslint.config.js`
|
||||
- Updated all ESLint plugins to latest versions
|
||||
- Resolved 700+ linting issues through automated fixes
|
||||
- **Astro configuration:** Added `output: 'static'` for proper static site generation
|
||||
- **Build optimizations:** Enhanced Rollup and PostCSS configurations for ES modules
|
||||
|
||||
### Dependencies
|
||||
|
||||
#### Updated
|
||||
- **Major version upgrades:**
|
||||
- `astro`: 4.15.12 → 5.10.0
|
||||
- `eslint`: 8.57.1 → 9.29.0
|
||||
- `@typescript-eslint/eslint-plugin`: 7.18.0 → 8.34.1
|
||||
- `@typescript-eslint/parser`: 7.18.0 → 8.34.1
|
||||
- `eslint-config-xo`: 0.44.0 → 0.47.0
|
||||
- `eslint-config-xo-typescript`: 4.0.0 → 8.0.1
|
||||
- `eslint-plugin-astro`: 0.34.0 → 1.3.1
|
||||
- `eslint-plugin-unicorn`: 52.0.0 → 59.0.1
|
||||
- `stylelint-config-twbs-bootstrap`: 15.1.0 → 16.1.0
|
||||
|
||||
- **Minor/patch updates (50+ packages):**
|
||||
- `bootstrap`: 5.3.3 → 5.3.7
|
||||
- `sass`: 1.78.0 → 1.89.2
|
||||
- `typescript`: 5.6.2 → 5.8.3
|
||||
- `prettier`: 3.3.3 → 3.5.3
|
||||
- And many more...
|
||||
|
||||
### Security & Quality
|
||||
|
||||
#### Fixed
|
||||
- **Resolved all npm security vulnerabilities** (0 vulnerabilities remaining)
|
||||
- **Updated browserslist database** to latest browser compatibility data
|
||||
- **Fixed all deprecation warnings** from SASS and other build tools
|
||||
|
||||
#### Improved
|
||||
- **Code quality:** Zero linting errors across JavaScript, TypeScript, CSS, and Astro files
|
||||
- **Bundle optimization:** All assets pass bundlewatch size thresholds
|
||||
- **Build reliability:** Complete production build pipeline works end-to-end
|
||||
|
||||
### Code Cleanup
|
||||
|
||||
#### Removed
|
||||
- **Technical debt cleanup:**
|
||||
- Removed incomplete TODO comments and dead code
|
||||
- Cleaned up unused variables and imports
|
||||
- Standardized code formatting across all files
|
||||
|
||||
#### Fixed
|
||||
- **ESLint configuration conflicts** between different rule sets
|
||||
- **Module import issues** with JSON imports in ES modules
|
||||
- **Circular dependency warnings** in build tools
|
||||
|
||||
### Development Experience
|
||||
|
||||
#### Enhanced
|
||||
- **Faster development startup** with optimized watch tasks
|
||||
- **Cleaner build output** with suppressed non-critical warnings
|
||||
- **Better error reporting** with modern linting tools
|
||||
- **Improved script organization** with consistent naming conventions
|
||||
|
||||
### Browser & Platform Support
|
||||
|
||||
#### Maintained
|
||||
- **Full Bootstrap 5.3.7 compatibility**
|
||||
- **Modern browser support** with updated browserslist
|
||||
- **Static site generation** with Astro 5.x
|
||||
- **RTL (Right-to-Left) language support**
|
||||
|
||||
---
|
||||
|
||||
## Previous Versions
|
||||
|
||||
### [4.0.0-beta3] and earlier
|
||||
- Legacy versions with previous dependency sets
|
||||
- See git history for detailed changes in earlier versions
|
||||
|
||||
---
|
||||
|
||||
## Migration Guide
|
||||
|
||||
### From 4.0.0-beta3 to 4.0.0-rc1
|
||||
|
||||
**For Users:**
|
||||
- No breaking changes in the compiled CSS/JS output
|
||||
- All existing HTML templates remain fully compatible
|
||||
- CDN links and package imports work as before
|
||||
|
||||
**For Developers:**
|
||||
- Update your npm scripts if you were using custom ones
|
||||
- The new `npm start` command replaces manual `npm run dev`
|
||||
- ESLint configuration is now in `eslint.config.js` (old `.eslintrc.json` removed)
|
||||
- Build process now requires Node.js ES modules support
|
||||
|
||||
**Recommended Actions:**
|
||||
1. Run `npm install` to get latest dependencies
|
||||
2. Use `npm start` for development
|
||||
3. Use `npm run production` for production builds
|
||||
4. Review any custom ESLint configurations for compatibility
|
||||
@@ -1,43 +0,0 @@
|
||||
# Contributor Covenant Code of Conduct
|
||||
|
||||
## Our Pledge
|
||||
|
||||
In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
|
||||
|
||||
## Our Standards
|
||||
|
||||
Examples of behavior that contributes to creating a positive environment include:
|
||||
|
||||
- Using welcoming and inclusive language
|
||||
- Being respectful of differing viewpoints and experiences
|
||||
- Gracefully accepting constructive criticism
|
||||
- Focusing on what is best for the community
|
||||
- Showing empathy towards other community members
|
||||
|
||||
Examples of unacceptable behavior by participants include:
|
||||
|
||||
- The use of sexualized language or imagery and unwelcome sexual attention or advances
|
||||
- Trolling, insulting/derogatory comments, and personal or political attacks
|
||||
- Public or private harassment
|
||||
- Publishing others' private information, such as a physical or electronic address, without explicit permission
|
||||
- Other conduct which could reasonably be considered inappropriate in a professional setting
|
||||
|
||||
## Our Responsibilities
|
||||
|
||||
Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
|
||||
|
||||
Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
|
||||
|
||||
## Scope
|
||||
|
||||
This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
|
||||
|
||||
## Enforcement
|
||||
|
||||
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at https://colorlib.com/wp/contact-us/. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
|
||||
|
||||
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
|
||||
|
||||
## Attribution
|
||||
|
||||
This Code of Conduct is adapted from the [Contributor Covenant](https://www.contributor-covenant.org/), version 1.4, available at <https://www.contributor-covenant.org/version/1/4/code-of-conduct/>
|
||||
281
Gruntfile.js
Normal file
281
Gruntfile.js
Normal file
@@ -0,0 +1,281 @@
|
||||
// AdminLTE Gruntfile
|
||||
module.exports = function (grunt) { // jshint ignore:line
|
||||
|
||||
'use strict'
|
||||
|
||||
grunt.initConfig({
|
||||
pkg : grunt.file.readJSON('package.json'),
|
||||
watch : {
|
||||
less : {
|
||||
// Compiles less files upon saving
|
||||
files: ['build/less/*.less'],
|
||||
tasks: ['less:development', 'less:production']
|
||||
},
|
||||
js : {
|
||||
// Compile js files upon saving
|
||||
files: ['build/js/*.js', 'dist/js/app.js'],
|
||||
tasks: ['js']
|
||||
},
|
||||
skins: {
|
||||
// Compile any skin less files upon saving
|
||||
files: ['build/less/skins/*.less'],
|
||||
tasks: ['less:skins', 'less:minifiedSkins']
|
||||
}
|
||||
},
|
||||
notify: {
|
||||
less : {
|
||||
title : 'LESS Compiler',
|
||||
message: 'LESS finished running'
|
||||
},
|
||||
uglify: {
|
||||
options: {
|
||||
title : 'JS Compiler',
|
||||
message: 'JS bundler finished running'
|
||||
}
|
||||
}
|
||||
},
|
||||
// 'less'-task configuration
|
||||
// This task will compile all less files upon saving to create both AdminLTE.css and AdminLTE.min.css
|
||||
less : {
|
||||
// Development not compressed
|
||||
development : {
|
||||
files: {
|
||||
// compilation.css : source.less
|
||||
'dist/css/AdminLTE.css' : 'build/less/AdminLTE.less',
|
||||
// AdminLTE without plugins
|
||||
'dist/css/alt/AdminLTE-without-plugins.css' : 'build/less/AdminLTE-without-plugins.less',
|
||||
// Separate plugins
|
||||
'dist/css/alt/AdminLTE-select2.css' : 'build/less/select2.less',
|
||||
'dist/css/alt/AdminLTE-fullcalendar.css' : 'build/less/fullcalendar.less',
|
||||
'dist/css/alt/AdminLTE-bootstrap-social.css': 'build/less/bootstrap-social.less'
|
||||
}
|
||||
},
|
||||
// Production compressed version
|
||||
production : {
|
||||
options: {
|
||||
compress: true
|
||||
},
|
||||
files : {
|
||||
// compilation.css : source.less
|
||||
'dist/css/AdminLTE.min.css' : 'build/less/AdminLTE.less',
|
||||
// AdminLTE without plugins
|
||||
'dist/css/alt/AdminLTE-without-plugins.min.css' : 'build/less/AdminLTE-without-plugins.less',
|
||||
// Separate plugins
|
||||
'dist/css/alt/AdminLTE-select2.min.css' : 'build/less/select2.less',
|
||||
'dist/css/alt/AdminLTE-fullcalendar.min.css' : 'build/less/fullcalendar.less',
|
||||
'dist/css/alt/AdminLTE-bootstrap-social.min.css': 'build/less/bootstrap-social.less'
|
||||
}
|
||||
},
|
||||
// Non minified skin files
|
||||
skins : {
|
||||
files: {
|
||||
'dist/css/skins/skin-blue.css' : 'build/less/skins/skin-blue.less',
|
||||
'dist/css/skins/skin-black.css' : 'build/less/skins/skin-black.less',
|
||||
'dist/css/skins/skin-yellow.css' : 'build/less/skins/skin-yellow.less',
|
||||
'dist/css/skins/skin-green.css' : 'build/less/skins/skin-green.less',
|
||||
'dist/css/skins/skin-red.css' : 'build/less/skins/skin-red.less',
|
||||
'dist/css/skins/skin-purple.css' : 'build/less/skins/skin-purple.less',
|
||||
'dist/css/skins/skin-blue-light.css' : 'build/less/skins/skin-blue-light.less',
|
||||
'dist/css/skins/skin-black-light.css' : 'build/less/skins/skin-black-light.less',
|
||||
'dist/css/skins/skin-yellow-light.css': 'build/less/skins/skin-yellow-light.less',
|
||||
'dist/css/skins/skin-green-light.css' : 'build/less/skins/skin-green-light.less',
|
||||
'dist/css/skins/skin-red-light.css' : 'build/less/skins/skin-red-light.less',
|
||||
'dist/css/skins/skin-purple-light.css': 'build/less/skins/skin-purple-light.less',
|
||||
'dist/css/skins/_all-skins.css' : 'build/less/skins/_all-skins.less'
|
||||
}
|
||||
},
|
||||
// Skins minified
|
||||
minifiedSkins: {
|
||||
options: {
|
||||
compress: true
|
||||
},
|
||||
files : {
|
||||
'dist/css/skins/skin-blue.min.css' : 'build/less/skins/skin-blue.less',
|
||||
'dist/css/skins/skin-black.min.css' : 'build/less/skins/skin-black.less',
|
||||
'dist/css/skins/skin-yellow.min.css' : 'build/less/skins/skin-yellow.less',
|
||||
'dist/css/skins/skin-green.min.css' : 'build/less/skins/skin-green.less',
|
||||
'dist/css/skins/skin-red.min.css' : 'build/less/skins/skin-red.less',
|
||||
'dist/css/skins/skin-purple.min.css' : 'build/less/skins/skin-purple.less',
|
||||
'dist/css/skins/skin-blue-light.min.css' : 'build/less/skins/skin-blue-light.less',
|
||||
'dist/css/skins/skin-black-light.min.css' : 'build/less/skins/skin-black-light.less',
|
||||
'dist/css/skins/skin-yellow-light.min.css': 'build/less/skins/skin-yellow-light.less',
|
||||
'dist/css/skins/skin-green-light.min.css' : 'build/less/skins/skin-green-light.less',
|
||||
'dist/css/skins/skin-red-light.min.css' : 'build/less/skins/skin-red-light.less',
|
||||
'dist/css/skins/skin-purple-light.min.css': 'build/less/skins/skin-purple-light.less',
|
||||
'dist/css/skins/_all-skins.min.css' : 'build/less/skins/_all-skins.less'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Uglify task info. Compress the js files.
|
||||
uglify: {
|
||||
options : {
|
||||
mangle : true,
|
||||
preserveComments: 'some'
|
||||
},
|
||||
production: {
|
||||
files: {
|
||||
'dist/js/app.min.js' : ['dist/js/app.js'],
|
||||
'dist/js/adminlte.min.js': ['dist/js/adminlte.js']
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Concatenate JS Files
|
||||
concat: {
|
||||
options: {
|
||||
separator: '\n\n',
|
||||
banner : '/*! AdminLTE app.js\n'
|
||||
+ '* ================\n'
|
||||
+ '* Main JS application file for AdminLTE v2. This file\n'
|
||||
+ '* should be included in all pages. It controls some layout\n'
|
||||
+ '* options and implements exclusive AdminLTE plugins.\n'
|
||||
+ '*\n'
|
||||
+ '* @Author Almsaeed Studio\n'
|
||||
+ '* @Support <https://www.almsaeedstudio.com>\n'
|
||||
+ '* @Email <abdullah@almsaeedstudio.com>\n'
|
||||
+ '* @version <%= pkg.version %>\n'
|
||||
+ '* @repository <%= pkg.repository.url %>\n'
|
||||
+ '* @license MIT <http://opensource.org/licenses/MIT>\n'
|
||||
+ '*/\n\n'
|
||||
+ '// Make sure jQuery has been loaded\n'
|
||||
+ 'if (typeof jQuery === \'undefined\') {\n'
|
||||
+ 'throw new Error(\'AdminLTE requires jQuery\')\n'
|
||||
+ '}\n\n'
|
||||
},
|
||||
dist : {
|
||||
src : [
|
||||
'build/js/Layout.js',
|
||||
'build/js/PushMenu.js',
|
||||
'build/js/Tree.js',
|
||||
'build/js/ControlSidebar.js',
|
||||
'build/js/BoxWidget.js',
|
||||
'build/js/TodoList.js',
|
||||
'build/js/DirectChat.js'
|
||||
],
|
||||
dest: 'dist/js/adminlte.js'
|
||||
}
|
||||
},
|
||||
|
||||
// Build the documentation files
|
||||
includes: {
|
||||
build: {
|
||||
src : ['*.html'], // Source files
|
||||
dest : 'documentation/', // Destination directory
|
||||
flatten: true,
|
||||
cwd : 'documentation/build',
|
||||
options: {
|
||||
silent : true,
|
||||
includePath: 'documentation/build/include'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Optimize images
|
||||
image: {
|
||||
dynamic: {
|
||||
files: [
|
||||
{
|
||||
expand: true,
|
||||
cwd : 'build/img/',
|
||||
src : ['**/*.{png,jpg,gif,svg,jpeg}'],
|
||||
dest : 'dist/img/'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
// Validate JS code
|
||||
jshint: {
|
||||
options: {
|
||||
jshintrc: 'build/js/.jshintrc'
|
||||
},
|
||||
grunt : {
|
||||
options: {
|
||||
jshintrc: 'build/grunt/.jshintrc'
|
||||
},
|
||||
src : 'Gruntfile.js'
|
||||
},
|
||||
core : {
|
||||
src: 'build/js/*.js'
|
||||
},
|
||||
demo : {
|
||||
src: 'dist/js/demo.js'
|
||||
},
|
||||
pages : {
|
||||
src: 'dist/js/pages/*.js'
|
||||
}
|
||||
},
|
||||
|
||||
jscs: {
|
||||
options: {
|
||||
config: 'build/js/.jscsrc'
|
||||
},
|
||||
core : {
|
||||
src: '<%= jshint.core.src %>'
|
||||
},
|
||||
pages : {
|
||||
src: '<%= jshint.pages.src %>'
|
||||
}
|
||||
},
|
||||
|
||||
// Validate CSS files
|
||||
csslint: {
|
||||
options: {
|
||||
csslintrc: 'build/less/.csslintrc'
|
||||
},
|
||||
dist : [
|
||||
'dist/css/AdminLTE.css'
|
||||
]
|
||||
},
|
||||
|
||||
// Validate Bootstrap HTML
|
||||
bootlint: {
|
||||
options: {
|
||||
relaxerror: ['W005']
|
||||
},
|
||||
files : ['pages/**/*.html', '*.html']
|
||||
},
|
||||
|
||||
// Delete images in build directory
|
||||
// After compressing the images in the build/img dir, there is no need
|
||||
// for them
|
||||
clean: {
|
||||
build: ['build/img/*']
|
||||
}
|
||||
})
|
||||
|
||||
// Load all grunt tasks
|
||||
|
||||
// LESS Compiler
|
||||
grunt.loadNpmTasks('grunt-contrib-less')
|
||||
// Watch File Changes
|
||||
grunt.loadNpmTasks('grunt-contrib-watch')
|
||||
// Compress JS Files
|
||||
grunt.loadNpmTasks('grunt-contrib-uglify')
|
||||
// Include Files Within HTML
|
||||
grunt.loadNpmTasks('grunt-includes')
|
||||
// Optimize images
|
||||
grunt.loadNpmTasks('grunt-image')
|
||||
// Validate JS code
|
||||
grunt.loadNpmTasks('grunt-contrib-jshint')
|
||||
grunt.loadNpmTasks('grunt-jscs')
|
||||
// Delete not needed files
|
||||
grunt.loadNpmTasks('grunt-contrib-clean')
|
||||
// Lint CSS
|
||||
grunt.loadNpmTasks('grunt-contrib-csslint')
|
||||
// Lint Bootstrap
|
||||
grunt.loadNpmTasks('grunt-bootlint')
|
||||
// Concatenate JS files
|
||||
grunt.loadNpmTasks('grunt-contrib-concat')
|
||||
// Notify
|
||||
grunt.loadNpmTasks('grunt-notify')
|
||||
|
||||
// Linting task
|
||||
grunt.registerTask('lint', ['jshint', 'csslint', 'bootlint'])
|
||||
// JS task
|
||||
grunt.registerTask('js', ['concat', 'uglify'])
|
||||
|
||||
// The default task (running 'grunt' in console) is 'watch'
|
||||
grunt.registerTask('default', ['watch'])
|
||||
}
|
||||
2
LICENSE
2
LICENSE
@@ -1,6 +1,6 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014-2023 ColorlibHQ
|
||||
Copyright (c) 2014-2017 Abdullah Almsaeed
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
|
||||
106
README 2.md
106
README 2.md
@@ -1,106 +0,0 @@
|
||||
# [AdminLTE - Bootstrap 5 Admin Dashboard](https://adminlte.io)
|
||||
|
||||
[](https://www.npmjs.com/package/admin-lte)
|
||||
[](https://packagist.org/packages/almasaeed2010/adminlte)
|
||||
[](https://www.jsdelivr.com/package/npm/admin-lte)
|
||||
[](https://discord.gg/jfdvjwFqfz)
|
||||
[](https://app.netlify.com/sites/adminlte-v4/deploys)
|
||||
|
||||
**AdminLTE** is a fully responsive administration template. Based on **[Bootstrap 5](https://getbootstrap.com/)** framework and also the JavaScript plugins.
|
||||
Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops.
|
||||
|
||||
## What's New in v4.0.0-rc3
|
||||
|
||||
**Production Deployment & Cross-Platform Compatibility** - This release resolves critical production deployment issues:
|
||||
|
||||
- **Fixed Production Builds** - Resolved CSS/JS path issues, sidebar navigation, and image loading in all deployment scenarios
|
||||
- **Smart Path Resolution** - Automatic relative path calculation works for root deployment, sub-folders, and CDN hosting
|
||||
- **RTL CSS Fix** - Eliminated rtlcss interference with standard LTR production builds
|
||||
- **Updated Dependencies** - Bootstrap 5.3.7, Bootstrap Icons 1.13.1, OverlayScrollbars 2.11.0
|
||||
- **Zero Console Errors** - Fixed all CDN integrity mismatches and runtime issues
|
||||
- **FTP/Static Host Ready** - Perfect compatibility with traditional hosting and modern static platforms
|
||||
|
||||
**Key Improvements:**
|
||||
- ✅ Development and production environments now behave identically
|
||||
- ✅ Images, CSS, and JavaScript load correctly in any deployment structure
|
||||
- ✅ Sidebar navigation displays properly with badges and arrow indicators
|
||||
- ✅ All CDN resources load without console errors
|
||||
- ✅ Complete production build included in repository for easy deployment
|
||||
|
||||
See the [CHANGELOG.md](CHANGELOG.md) for complete details.
|
||||
|
||||
## Looking for Premium Templates?
|
||||
|
||||
AdminLTE.io just opened a new premium templates page. Hand picked to ensure the best quality and the most affordable
|
||||
prices. Visit <https://adminlte.io/premium> for more information.
|
||||
|
||||

|
||||
|
||||
**AdminLTE** has been carefully coded with clear comments in all of its JS, SCSS and HTML files.
|
||||
SCSS has been used to increase code customizability.
|
||||
|
||||
## Quick start
|
||||
|
||||
### Development
|
||||
|
||||
To start developing with AdminLTE:
|
||||
|
||||
1. **Install dependencies:** `npm install`
|
||||
2. **Start development server:** `npm start` *(opens browser at http://localhost:3000)*
|
||||
3. **Start coding!** Files auto-compile and refresh on changes
|
||||
|
||||
### Production Build
|
||||
|
||||
To build for production:
|
||||
|
||||
1. **Full production build:** `npm run production` *(includes linting and optimization)*
|
||||
2. **Quick build:** `npm run build` *(faster for development/testing)*
|
||||
|
||||
### Available Scripts
|
||||
|
||||
- `npm start` - Start development server with file watching
|
||||
- `npm run build` - Build all assets for development
|
||||
- `npm run production` - Full production build with linting and bundlewatch
|
||||
- `npm run lint` - Run all linters (JS, CSS, docs, lockfile)
|
||||
- `npm run css` - Build CSS only
|
||||
- `npm run js` - Build JavaScript only
|
||||
|
||||
## Browser Support
|
||||
|
||||
AdminLTE supports all modern browsers with the latest Bootstrap 5.3.7:
|
||||
- Chrome (latest)
|
||||
- Firefox (latest)
|
||||
- Safari (latest)
|
||||
- Edge (latest)
|
||||
|
||||
## Contributing
|
||||
|
||||
- Highly welcome.
|
||||
- For your extra reference check [AdminLTE v4 Contribution Guide](https://github.com/ColorlibHQ/AdminLTE#contributing)
|
||||
- First thing first, you should have bit knowledge about NodeJS.
|
||||
- Github Knowledge.
|
||||
- Install NodeJS LTS version.
|
||||
- Clone this Repository to your machine and change to `master` branch.
|
||||
- Go to Cloned Folder.
|
||||
- In cli/bash run `npm install` it will install dependency from `package.json`.
|
||||
- After installation completes, run `npm start`
|
||||
- Cool, Send your changes in PR to `master` branch.
|
||||
|
||||
## Sponsorship
|
||||
|
||||
Support AdminLTE development by becoming a sponsor.
|
||||
[Github Sponsors](https://github.com/sponsors/danny007in) or
|
||||
[PayPal](https://www.paypal.me/daniel007in)
|
||||
|
||||
## License
|
||||
|
||||
AdminLTE is an open source project by [AdminLTE.io](https://adminlte.io) that is licensed under [MIT](https://opensource.org/licenses/MIT).
|
||||
AdminLTE.io reserves the right to change the license of future releases.
|
||||
|
||||
## Image Credits
|
||||
|
||||
- [Pixeden](http://www.pixeden.com/psd-web-elements/flat-responsive-showcase-psd)
|
||||
- [Graphicsfuel](https://www.graphicsfuel.com/2013/02/13-high-resolution-blur-backgrounds/)
|
||||
- [Pickaface](https://pickaface.net/)
|
||||
- [Unsplash](https://unsplash.com/)
|
||||
- [Uifaces](http://uifaces.com/)
|
||||
166
README.md
166
README.md
@@ -1,145 +1,57 @@
|
||||
# [AdminLTE - Bootstrap 5 Admin Dashboard](https://adminlte.io)
|
||||
Introduction
|
||||
============
|
||||
|
||||
[](https://www.npmjs.com/package/admin-lte)
|
||||

|
||||
[](https://www.npmjs.com/package/admin-lte)
|
||||
[](https://packagist.org/packages/almasaeed2010/adminlte)
|
||||
[](https://www.jsdelivr.com/package/npm/admin-lte)
|
||||
[](https://discord.gg/jfdvjwFqfz)
|
||||
[](https://app.netlify.com/sites/adminlte-v4/deploys)
|
||||
[](https://cdnjs.com/libraries/admin-lte)
|
||||
|
||||
**AdminLTE** is a fully responsive administration template. Based on **[Bootstrap 5](https://getbootstrap.com/)** framework and also the JavaScript plugins.
|
||||
Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops.
|
||||
**AdminLTE** -- is a fully responsive admin template. Based on **[Bootstrap 3](https://github.com/twbs/bootstrap)** framework. Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops. Check out the live preview now and see for yourself.
|
||||
|
||||
## What's New in v4.0.0-rc4
|
||||
**Download & Preview on [AdminLTE.IO](https://adminlte.io)**
|
||||
|
||||
**Latest Release with Enhanced Performance & Updated Dependencies** - Fresh improvements for better development experience:
|
||||
### Looking for Premium Templates?
|
||||
**AdminLTE.IO just opened a new premium templates website. Hand picked to ensure the best quality and the most affordable prices. Visit https://themequarry.com for more information.**
|
||||
|
||||
- **Updated Dependencies** - 8 npm packages updated to latest versions for improved security and performance
|
||||
- **Refined Mobile Image Loading** - Streamlined path resolution by removing JavaScript runtime fixes
|
||||
- **Better Performance** - Images now load faster with build-time path generation instead of runtime corrections
|
||||
- **Latest Tooling** - Updated TypeScript, ESLint, Prettier, Astro, and build tools
|
||||
- **Zero Runtime Errors** - Eliminated console errors from JavaScript path corrections
|
||||
## Documentation & Installation Guide
|
||||
Visit the [online documentation](https://adminlte.io/docs) for the most
|
||||
updated guide.
|
||||
|
||||
**Key Improvements:**
|
||||
- ✅ All images use relative paths generated at build time
|
||||
- ✅ No more JavaScript runtime path fixes causing console errors
|
||||
- ✅ Faster image loading with optimal path resolution
|
||||
- ✅ Latest development tools and security updates
|
||||
- ✅ Production-ready with enhanced stability
|
||||

|
||||
|
||||
**Install the latest:**
|
||||
```bash
|
||||
npm install admin-lte@4.0.0-rc4
|
||||
```
|
||||
### Contribution
|
||||
Contribution are always **welcome and recommended**! Here is how:
|
||||
|
||||
See the [CHANGELOG.md](CHANGELOG.md) for complete details.
|
||||
- Fork the repository ([here is the guide](https://help.github.com/articles/fork-a-repo/)).
|
||||
- Clone to your machine ```git clone https://github.com/YOUR_USERNAME/AdminLTE.git```
|
||||
- Make your changes
|
||||
- Create a pull request
|
||||
|
||||
## Looking for Premium Templates?
|
||||
#### Contribution Requirements:
|
||||
|
||||
AdminLTE.io just opened a new premium templates page. Hand picked to ensure the best quality and the most affordable
|
||||
prices. Visit <https://adminlte.io/premium> for more information.
|
||||
- When you contribute, you agree to give a non-exclusive license to AdminLTE.IO to use that contribution in any context as we (AdminLTE.IO) see appropriate.
|
||||
- If you use content provided by another party, it must be appropriately licensed using an [open source](http://opensource.org/licenses) license.
|
||||
- Contributions are only accepted through Github pull requests.
|
||||
- Finally, contributed code must work in all supported browsers (see above for browser support).
|
||||
|
||||

|
||||
### License
|
||||
AdminLTE is an open source project by [AdminLTE.IO](https://adminlte.io) that is licensed under [MIT](http://opensource.org/licenses/MIT). AdminLTE.IO
|
||||
reserves the right to change the license of future releases. Wondering what you can or can't do? View the [license guide](https://adminlte.io/docs/license).
|
||||
|
||||
**AdminLTE** has been carefully coded with clear comments in all of its JS, SCSS and HTML files.
|
||||
SCSS has been used to increase code customizability.
|
||||
### Legacy Releases
|
||||
AdminLTE 1.x can be easily upgraded to 2.x using [this guide](https://adminlte.io/themes/AdminLTE/documentation/index.html#upgrade), but if you intend to keep using AdminLTE 1.x, you can download the latest release from the [releases](https://github.com/almasaeed2010/AdminLTE/releases) section above.
|
||||
|
||||
## Quick start
|
||||
|
||||
### Development
|
||||
|
||||
To start developing with AdminLTE:
|
||||
|
||||
1. **Install dependencies:** `npm install`
|
||||
2. **Start development server:** `npm start` *(opens browser at http://localhost:3000)*
|
||||
3. **Start coding!** Files auto-compile and refresh on changes
|
||||
|
||||
### Production Build
|
||||
|
||||
To build for production:
|
||||
|
||||
1. **Full production build:** `npm run production` *(includes linting and optimization)*
|
||||
2. **Quick build:** `npm run build` *(faster for development/testing)*
|
||||
|
||||
### Available Scripts
|
||||
|
||||
- `npm start` - Start development server with file watching
|
||||
- `npm run build` - Build all assets for development
|
||||
- `npm run production` - Full production build with linting and bundlewatch
|
||||
- `npm run lint` - Run all linters (JS, CSS, docs, lockfile)
|
||||
- `npm run css` - Build CSS only
|
||||
- `npm run js` - Build JavaScript only
|
||||
|
||||
## Browser Support
|
||||
|
||||
AdminLTE supports all modern browsers with the latest Bootstrap 5.3.7:
|
||||
- Chrome (latest)
|
||||
- Firefox (latest)
|
||||
- Safari (latest)
|
||||
- Edge (latest)
|
||||
|
||||
## Platform Support
|
||||
|
||||
AdminLTE v4 build scripts work cross-platform:
|
||||
- **Windows** - Command Prompt, PowerShell, Git Bash
|
||||
- **macOS** - Terminal, iTerm2
|
||||
- **Linux** - Bash, Zsh, and other Unix shells
|
||||
|
||||
All npm scripts use cross-platform utilities to ensure consistent behavior across different operating systems.
|
||||
|
||||
## Sponsorship
|
||||
|
||||
Support AdminLTE development by becoming a sponsor or donor.
|
||||
|
||||
<p align="center">
|
||||
<a href="https://github.com/sponsors/danny007in">
|
||||
<img src="https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%A4&logo=GitHub&color=%23fe8e86" alt="Sponsor on GitHub" />
|
||||
</a>
|
||||
|
||||
<a href="https://www.paypal.me/daniel007in">
|
||||
<img src="https://img.shields.io/static/v1?label=Donate&message=%E2%9D%A4&logo=PayPal&color=%2300457C" alt="Donate via PayPal" />
|
||||
</a>
|
||||
</p>
|
||||
|
||||
## Our Sponsors
|
||||
|
||||
<p align="center">
|
||||
<a href="https://github.com/spizzo14"><img src="https://unavatar.io/github/spizzo14?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: spizzo14" loading="lazy" /></a>
|
||||
<a href="https://github.com/tomhappyblock"><img src="https://unavatar.io/github/tomhappyblock?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: tomhappyblock" loading="lazy" /></a>
|
||||
<a href="https://github.com/stefanmorderca"><img src="https://unavatar.io/github/stefanmorderca?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: stefanmorderca" loading="lazy" /></a>
|
||||
<a href="https://github.com/tito10047"><img src="https://unavatar.io/github/tito10047?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: tito10047" loading="lazy" /></a>
|
||||
<a href="https://github.com/sitchi"><img src="https://unavatar.io/github/sitchi?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: sitchi" loading="lazy" /></a>
|
||||
<a href="https://github.com/npreee"><img src="https://unavatar.io/github/npreee?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: npreee" loading="lazy" /></a>
|
||||
<a href="https://github.com/isaacmorais"><img src="https://unavatar.io/github/isaacmorais?fallback=https%3A%2F%2Fraw.githubusercontent.com%2FJamesIves%2Fgithub-sponsors-readme-action%2Fdev%2F.github%2Fassets%2Fplaceholder.png" width="50" height="50" alt="User avatar: isaacmorais" loading="lazy" /></a>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://github.com/sponsors/danny007in">Your avatar here? Become a sponsor</a>
|
||||
</p>
|
||||
|
||||
## Contributing
|
||||
|
||||
- Highly welcome.
|
||||
- For your extra reference check [AdminLTE v4 Contribution Guide](https://github.com/ColorlibHQ/AdminLTE#contributing)
|
||||
- First thing first, you should have bit knowledge about NodeJS.
|
||||
- Github Knowledge.
|
||||
- Install NodeJS LTS version.
|
||||
- Clone this Repository to your machine and change to `master` branch.
|
||||
- Go to Cloned Folder.
|
||||
- In cli/bash run `npm install` it will install dependency from `package.json`.
|
||||
- After installation completes, run `npm start`
|
||||
- Cool, Send your changes in PR to `master` branch.
|
||||
|
||||
|
||||
## License
|
||||
|
||||
AdminLTE is an open source project by [AdminLTE.io](https://adminlte.io) that is licensed under [MIT](https://opensource.org/licenses/MIT).
|
||||
AdminLTE.io reserves the right to change the license of future releases.
|
||||
|
||||
## Image Credits
|
||||
### Change log
|
||||
**For the most recent change log, visit the [releases page](https://github.com/almasaeed2010/AdminLTE/releases) or the [changelog file](https://github.com/almasaeed2010/AdminLTE/blob/master/changelog.md).** We will add a detailed release notes to each new release.
|
||||
|
||||
### Image Credits
|
||||
- [Pixeden](http://www.pixeden.com/psd-web-elements/flat-responsive-showcase-psd)
|
||||
- [Graphicsfuel](https://www.graphicsfuel.com/2013/02/13-high-resolution-blur-backgrounds/)
|
||||
- [Pickaface](https://pickaface.net/)
|
||||
- [Graphicsfuel](http://www.graphicsfuel.com/2013/02/13-high-resolution-blur-backgrounds/)
|
||||
- [Pickaface](http://pickaface.net/)
|
||||
- [Unsplash](https://unsplash.com/)
|
||||
- [Uifaces](http://uifaces.com/)
|
||||
- [Unavatar](https://unavatar.io/)
|
||||
|
||||
### Donations
|
||||
Donations are **greatly appreciated!**
|
||||
|
||||
[](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=629XCUSXBHCBC "Donate")
|
||||
|
||||
61
bower.json
Normal file
61
bower.json
Normal file
@@ -0,0 +1,61 @@
|
||||
{
|
||||
"name": "admin-lte",
|
||||
"homepage": "https://adminlte.io",
|
||||
"authors": [
|
||||
"Abdullah Almsaeed <abdullah@almsaeedstudio.com>"
|
||||
],
|
||||
"description": "Admin dashboard and control panel template",
|
||||
"main": [
|
||||
"index2.html",
|
||||
"dist/css/AdminLTE.css",
|
||||
"dist/js/app.js",
|
||||
"build/less/AdminLTE.less"
|
||||
],
|
||||
"keywords": [
|
||||
"css",
|
||||
"js",
|
||||
"html",
|
||||
"template",
|
||||
"admin",
|
||||
"bootstrap",
|
||||
"theme",
|
||||
"backend",
|
||||
"responsive"
|
||||
],
|
||||
"license": "MIT",
|
||||
"ignore": [
|
||||
"/.*",
|
||||
"node_modules",
|
||||
"bower_components",
|
||||
"composer.json",
|
||||
"documentation"
|
||||
],
|
||||
"dependencies": {
|
||||
"bootstrap-slider": "*",
|
||||
"chart.js": "^1.0.*",
|
||||
"ckeditor": "^4.7.0",
|
||||
"bootstrap-colorpicker": "^2.5.1",
|
||||
"bootstrap": "^3.3.7",
|
||||
"jquery": "^3.2.1",
|
||||
"datatables.net": "^1.10.15",
|
||||
"datatables.net-bs": "^2.1.1",
|
||||
"bootstrap-datepicker": "^1.7.0",
|
||||
"bootstrap-daterangepicker": "^2.1.25",
|
||||
"moment": "^2.18.1",
|
||||
"fastclick": "^1.0.6",
|
||||
"Flot": "flot#^0.8.3",
|
||||
"fullcalendar": "^3.4.0",
|
||||
"inputmask": "jquery.inputmask#^3.3.7",
|
||||
"ion.rangeSlider": "ionrangeslider#^2.2.0",
|
||||
"jvectormap": "^2.0.4",
|
||||
"jquery-knob": "^1.2.13",
|
||||
"morris.js": "^0.5.1",
|
||||
"PACE": "pace#^1.0.2",
|
||||
"select2": "^4.0.3",
|
||||
"jquery-slimscroll": "slimscroll#^1.3.8",
|
||||
"bootstrap-timepicker": "^0.5.2",
|
||||
"jquery-sparkline": "^2.1.3",
|
||||
"font-awesome": "^4.7.0",
|
||||
"Ionicons": "ionicons#^2.0.1"
|
||||
}
|
||||
}
|
||||
7
build/grunt/.jshintrc
Normal file
7
build/grunt/.jshintrc
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"extends" : "../js/.jshintrc",
|
||||
"asi" : false,
|
||||
"browser" : false,
|
||||
"es3" : false,
|
||||
"node" : true
|
||||
}
|
||||
42
build/js/.jscsrc
Normal file
42
build/js/.jscsrc
Normal file
@@ -0,0 +1,42 @@
|
||||
{
|
||||
"disallowEmptyBlocks": true,
|
||||
"disallowKeywords": ["with"],
|
||||
"disallowMixedSpacesAndTabs": true,
|
||||
"disallowMultipleLineStrings": true,
|
||||
"disallowMultipleVarDecl": true,
|
||||
"disallowSpaceAfterPrefixUnaryOperators": ["++", "--", "+", "-", "~", "!"],
|
||||
"disallowSpaceBeforeBinaryOperators": [","],
|
||||
"disallowSpaceBeforePostfixUnaryOperators": ["++", "--"],
|
||||
"disallowSpacesInFunctionDeclaration": { "beforeOpeningRoundBrace": true },
|
||||
"disallowSpacesInNamedFunctionExpression": { "beforeOpeningRoundBrace": true },
|
||||
"disallowSpacesInsideArrayBrackets": true,
|
||||
"disallowSpacesInsideParentheses": true,
|
||||
"disallowTrailingComma": true,
|
||||
"disallowTrailingWhitespace": true,
|
||||
"requireCamelCaseOrUpperCaseIdentifiers": true,
|
||||
"requireCapitalizedConstructors": true,
|
||||
"requireCommaBeforeLineBreak": true,
|
||||
"requireDollarBeforejQueryAssignment": true,
|
||||
"requireDotNotation": true,
|
||||
"requireLineFeedAtFileEnd": true,
|
||||
"requirePaddingNewLinesAfterUseStrict": true,
|
||||
"requirePaddingNewLinesBeforeExport": true,
|
||||
"requireSpaceAfterBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!==", ">", "<", ">=", "<="],
|
||||
"requireSpaceAfterKeywords": ["if", "else", "for", "while", "do", "switch", "return", "try", "catch"],
|
||||
"requireSpaceAfterLineComment": true,
|
||||
"requireSpaceBeforeBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!==", ">", "<", ">=", "<="],
|
||||
"requireSpaceBetweenArguments": true,
|
||||
"requireSpacesInAnonymousFunctionExpression": { "beforeOpeningCurlyBrace": true, "beforeOpeningRoundBrace": true },
|
||||
"requireSpacesInConditionalExpression": true,
|
||||
"requireSpacesInForStatement": true,
|
||||
"requireSpacesInFunctionDeclaration": { "beforeOpeningCurlyBrace": true },
|
||||
"requireSpacesInFunctionExpression": { "beforeOpeningCurlyBrace": true },
|
||||
"requireSpacesInNamedFunctionExpression": { "beforeOpeningCurlyBrace": true },
|
||||
"requireSpacesInsideObjectBrackets": "allButNested",
|
||||
"validateAlignedFunctionParameters": true,
|
||||
"validateIndentation": 2,
|
||||
"validateLineBreaks": "LF",
|
||||
"validateNewlineAfterArrayElements": true,
|
||||
"validateQuoteMarks": "'",
|
||||
"maxErrors": "3000"
|
||||
}
|
||||
17
build/js/.jshintrc
Normal file
17
build/js/.jshintrc
Normal file
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"asi" : true,
|
||||
"browser" : true,
|
||||
"eqeqeq" : false,
|
||||
"eqnull" : true,
|
||||
"es3" : true,
|
||||
"expr" : true,
|
||||
"jquery" : true,
|
||||
"latedef" : true,
|
||||
"laxbreak" : true,
|
||||
"nonbsp" : true,
|
||||
"strict" : true,
|
||||
"undef" : true,
|
||||
"unused" : true,
|
||||
// External variabls and plugins
|
||||
"predef": [ "AdminLTEOptions", "FastClick", "moment", "Morris", "Chart" ]
|
||||
}
|
||||
119
build/js/BoxRefresh.js
Normal file
119
build/js/BoxRefresh.js
Normal file
@@ -0,0 +1,119 @@
|
||||
/* BoxRefresh()
|
||||
* =========
|
||||
* Adds AJAX content control to a box.
|
||||
*
|
||||
* @Usage: $('#my-box').boxRefresh(options)
|
||||
* or add [data-widget="box-refresh"] to the box element
|
||||
* Pass any option as data-option="value"
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.boxrefresh'
|
||||
|
||||
var Default = {
|
||||
source : '',
|
||||
params : {},
|
||||
trigger : '.refresh-btn',
|
||||
content : '.box-body',
|
||||
loadInContent : true,
|
||||
responseType : '',
|
||||
overlayTemplate: '<div class="overlay"><div class="fa fa-refresh fa-spin"></div></div>',
|
||||
onLoadStart : function () {
|
||||
},
|
||||
onLoadDone : function (response) {
|
||||
return response
|
||||
}
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
data: '[data-widget="box-refresh"]'
|
||||
}
|
||||
|
||||
// BoxRefresh Class Definition
|
||||
// =========================
|
||||
var BoxRefresh = function (element, options) {
|
||||
this.element = element
|
||||
this.options = options
|
||||
this.$overlay = $(options.overlay)
|
||||
|
||||
if (options.source === '') {
|
||||
throw new Error('Source url was not defined. Please specify a url in your BoxRefresh source option.')
|
||||
}
|
||||
|
||||
this._setUpListeners()
|
||||
this.load()
|
||||
}
|
||||
|
||||
BoxRefresh.prototype.load = function () {
|
||||
this._addOverlay()
|
||||
this.options.onLoadStart.call($(this))
|
||||
|
||||
$.get(this.options.source, this.options.params, function (response) {
|
||||
if (this.options.loadInContent) {
|
||||
$(this.options.content).html(response)
|
||||
}
|
||||
this.options.onLoadDone.call($(this), response)
|
||||
this._removeOverlay()
|
||||
}.bind(this), this.options.responseType !== '' && this.options.responseType)
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
BoxRefresh.prototype._setUpListeners = function () {
|
||||
$(this.element).on('click', Selector.trigger, function (event) {
|
||||
if (event) event.preventDefault()
|
||||
this.load()
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
BoxRefresh.prototype._addOverlay = function () {
|
||||
$(this.element).append(this.$overlay)
|
||||
}
|
||||
|
||||
BoxRefresh.prototype._removeOverlay = function () {
|
||||
$(this.element).remove(this.$overlay)
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option)
|
||||
$this.data(DataKey, (data = new BoxRefresh($this, options)))
|
||||
}
|
||||
|
||||
if (typeof data == 'string') {
|
||||
if (typeof data[option] == 'undefined') {
|
||||
throw new Error('No method named ' + option)
|
||||
}
|
||||
data[option]()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.boxRefresh
|
||||
|
||||
$.fn.boxRefresh = Plugin
|
||||
$.fn.boxRefresh.Constructor = BoxRefresh
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.boxRefresh.noConflict = function () {
|
||||
$.fn.boxRefresh = old
|
||||
return this
|
||||
}
|
||||
|
||||
// BoxRefresh Data API
|
||||
// =================
|
||||
$(window).on('load', function () {
|
||||
$(Selector.data).each(function () {
|
||||
Plugin.call($(this))
|
||||
})
|
||||
})
|
||||
|
||||
}(jQuery)
|
||||
161
build/js/BoxWidget.js
Normal file
161
build/js/BoxWidget.js
Normal file
@@ -0,0 +1,161 @@
|
||||
/* BoxWidget()
|
||||
* ======
|
||||
* Adds box widget functions to boxes.
|
||||
*
|
||||
* @Usage: $('.my-box').boxWidget(options)
|
||||
* or add [data-widget="box-widget"] to the ul element
|
||||
* Pass any option as data-option="value"
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.boxwidget'
|
||||
|
||||
var Default = {
|
||||
animationSpeed : 500,
|
||||
collapseTrigger: '[data-widget="collapse"]',
|
||||
removeTrigger : '[data-widget="remove"]',
|
||||
collapseIcon : 'fa-minus',
|
||||
expandIcon : 'fa-plus',
|
||||
removeIcon : 'fa-times'
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
data : '.box',
|
||||
collapsed: '.collapsed-box',
|
||||
body : '.box-body',
|
||||
footer : '.box-footer',
|
||||
tools : '.box-tools'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
collapsed: 'collapsed-box'
|
||||
}
|
||||
|
||||
var Event = {
|
||||
collapsed: 'collapsed.boxwidget',
|
||||
expanded : 'expanded.boxwidget',
|
||||
removed : 'removed.boxwidget'
|
||||
}
|
||||
|
||||
// BoxWidget Class Definition
|
||||
// =====================
|
||||
var BoxWidget = function (element, options) {
|
||||
this.element = element
|
||||
this.options = options
|
||||
|
||||
this._setUpListeners()
|
||||
}
|
||||
|
||||
BoxWidget.prototype.toggle = function () {
|
||||
var isOpen = !$(this.element).is(Selector.collapsed)
|
||||
|
||||
if (isOpen) {
|
||||
this.collapse()
|
||||
} else {
|
||||
this.expand()
|
||||
}
|
||||
}
|
||||
|
||||
BoxWidget.prototype.expand = function () {
|
||||
var expandedEvent = $.Event(Event.expanded)
|
||||
var collapseIcon = this.options.collapseIcon
|
||||
var expandIcon = this.options.expandIcon
|
||||
|
||||
$(this.element).removeClass(ClassName.collapsed)
|
||||
|
||||
$(Selector.tools)
|
||||
.find('.' + expandIcon)
|
||||
.removeClass(expandIcon)
|
||||
.addClass(collapseIcon)
|
||||
|
||||
$(this.element).find(Selector.body + ', ' + Selector.footer)
|
||||
.slideDown(this.options.animationSpeed, function () {
|
||||
$(this.element).trigger(expandedEvent)
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
BoxWidget.prototype.collapse = function () {
|
||||
var collapsedEvent = $.Event(Event.collapsed)
|
||||
var collapseIcon = this.options.collapseIcon
|
||||
var expandIcon = this.options.expandIcon
|
||||
|
||||
$(Selector.tools)
|
||||
.find('.' + collapseIcon)
|
||||
.removeClass(collapseIcon)
|
||||
.addClass(expandIcon)
|
||||
|
||||
$(this.element).find(Selector.body + ', ' + Selector.footer)
|
||||
.slideUp(this.options.animationSpeed, function () {
|
||||
$(this.element).addClass(ClassName.collapsed)
|
||||
$(this.element).trigger(collapsedEvent)
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
BoxWidget.prototype.remove = function () {
|
||||
var removedEvent = $.Event(Event.removed)
|
||||
|
||||
$(this.element).slideUp(this.options.animationSpeed, function () {
|
||||
$(this.element).trigger(removedEvent)
|
||||
$(this.element).remove()
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
BoxWidget.prototype._setUpListeners = function () {
|
||||
var that = this
|
||||
|
||||
$(this.element).on('click', this.options.collapseTrigger, function (event) {
|
||||
if (event) event.preventDefault()
|
||||
that.toggle($(this))
|
||||
})
|
||||
|
||||
$(this.element).on('click', this.options.removeTrigger, function (event) {
|
||||
if (event) event.preventDefault()
|
||||
that.remove($(this))
|
||||
})
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option)
|
||||
$this.data(DataKey, (data = new BoxWidget($this, options)))
|
||||
}
|
||||
|
||||
if (typeof option == 'string') {
|
||||
if (typeof data[option] == 'undefined') {
|
||||
throw new Error('No method named ' + option)
|
||||
}
|
||||
data[option]()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.boxWidget
|
||||
|
||||
$.fn.boxWidget = Plugin
|
||||
$.fn.boxWidget.Constructor = BoxWidget
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.boxWidget.noConflict = function () {
|
||||
$.fn.boxWidget = old
|
||||
return this
|
||||
}
|
||||
|
||||
// BoxWidget Data API
|
||||
// ==================
|
||||
$(window).on('load', function () {
|
||||
$(Selector.data).each(function () {
|
||||
Plugin.call($(this))
|
||||
})
|
||||
})
|
||||
|
||||
}(jQuery)
|
||||
138
build/js/ControlSidebar.js
Normal file
138
build/js/ControlSidebar.js
Normal file
@@ -0,0 +1,138 @@
|
||||
/* ControlSidebar()
|
||||
* ===============
|
||||
* Toggles the state of the control sidebar
|
||||
*
|
||||
* @Usage: $('#control-sidebar-trigger').controlSidebar(options)
|
||||
* or add [data-toggle="control-sidebar"] to the trigger
|
||||
* Pass any option as data-option="value"
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.controlsidebar'
|
||||
|
||||
var Default = {
|
||||
slide: true
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
sidebar: '.control-sidebar',
|
||||
data : '[data-toggle="control-sidebar"]',
|
||||
open : '.control-sidebar-open',
|
||||
bg : '.control-sidebar-bg',
|
||||
wrapper: '.wrapper',
|
||||
content: '.content-wrapper',
|
||||
boxed : '.layout-boxed'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
open : 'control-sidebar-open',
|
||||
fixed: 'fixed'
|
||||
}
|
||||
|
||||
var Event = {
|
||||
collapsed: 'collapsed.controlsidebar',
|
||||
expanded : 'expanded.controlsidebar'
|
||||
}
|
||||
|
||||
// ControlSidebar Class Definition
|
||||
// ===============================
|
||||
var ControlSidebar = function (element, options) {
|
||||
this.element = element
|
||||
this.options = options
|
||||
this.hasBindedResize = false
|
||||
|
||||
this.init()
|
||||
}
|
||||
|
||||
ControlSidebar.prototype.init = function () {
|
||||
// Add click listener if the element hasn't been
|
||||
// initialized using the data API
|
||||
if (!$(this.element).is(Selector.data)) {
|
||||
$(this).on('click', this.toggle)
|
||||
}
|
||||
|
||||
this.fix()
|
||||
$(window).resize(function () {
|
||||
this.fix()
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
ControlSidebar.prototype.toggle = function (event) {
|
||||
if (event) event.preventDefault()
|
||||
|
||||
this.fix()
|
||||
|
||||
if (!$(Selector.sidebar).is(Selector.open) && !$('body').is(Selector.open)) {
|
||||
this.expand()
|
||||
} else {
|
||||
this.collapse()
|
||||
}
|
||||
}
|
||||
|
||||
ControlSidebar.prototype.expand = function () {
|
||||
if (!this.options.slide) {
|
||||
$('body').addClass(ClassName.open)
|
||||
} else {
|
||||
$(Selector.sidebar).addClass(ClassName.open)
|
||||
}
|
||||
|
||||
$(this.element).trigger($.Event(Event.expanded))
|
||||
}
|
||||
|
||||
ControlSidebar.prototype.collapse = function () {
|
||||
$('body, ' + Selector.sidebar).removeClass(ClassName.open)
|
||||
$(this.element).trigger($.Event(Event.collapsed))
|
||||
}
|
||||
|
||||
ControlSidebar.prototype.fix = function () {
|
||||
if ($('body').is(Selector.boxed)) {
|
||||
this._fixForBoxed($(Selector.bg))
|
||||
}
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
ControlSidebar.prototype._fixForBoxed = function (bg) {
|
||||
bg.css({
|
||||
position: 'absolute',
|
||||
height : $(Selector.wrapper).height()
|
||||
})
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option)
|
||||
$this.data(DataKey, (data = new ControlSidebar($this, options)))
|
||||
}
|
||||
|
||||
if (typeof option == 'string') data.toggle()
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.controlSidebar
|
||||
|
||||
$.fn.controlSidebar = Plugin
|
||||
$.fn.controlSidebar.Constructor = ControlSidebar
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.controlSidebar.noConflict = function () {
|
||||
$.fn.controlSidebar = old
|
||||
return this
|
||||
}
|
||||
|
||||
// ControlSidebar Data API
|
||||
// =======================
|
||||
$(document).on('click', Selector.data, function (event) {
|
||||
if (event) event.preventDefault()
|
||||
Plugin.call($(this), 'toggle')
|
||||
})
|
||||
|
||||
}(jQuery)
|
||||
66
build/js/DirectChat.js
Normal file
66
build/js/DirectChat.js
Normal file
@@ -0,0 +1,66 @@
|
||||
/* DirectChat()
|
||||
* ===============
|
||||
* Toggles the state of the control sidebar
|
||||
*
|
||||
* @Usage: $('#my-chat-box').directChat()
|
||||
* or add [data-widget="direct-chat"] to the trigger
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.directchat'
|
||||
|
||||
var Selector = {
|
||||
data: '[data-widget="chat-pane-toggle"]',
|
||||
box : '.direct-chat'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
open: 'direct-chat-contacts-open'
|
||||
}
|
||||
|
||||
// DirectChat Class Definition
|
||||
// ===========================
|
||||
var DirectChat = function (element) {
|
||||
this.element = element
|
||||
}
|
||||
|
||||
DirectChat.prototype.toggle = function ($trigger) {
|
||||
$trigger.parents(Selector.box).first().toggleClass(ClassName.open)
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
$this.data(DataKey, (data = new DirectChat($this)))
|
||||
}
|
||||
|
||||
if (typeof option == 'string') data.toggle($this)
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.directChat
|
||||
|
||||
$.fn.directChat = Plugin
|
||||
$.fn.directChat.Constructor = DirectChat
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.directChat.noConflict = function () {
|
||||
$.fn.directChat = old
|
||||
return this
|
||||
}
|
||||
|
||||
// DirectChat Data API
|
||||
// ===================
|
||||
$(document).on('click', Selector.data, function (event) {
|
||||
if (event) event.preventDefault()
|
||||
Plugin.call($(this), 'toggle')
|
||||
})
|
||||
|
||||
}(jQuery)
|
||||
179
build/js/Layout.js
Normal file
179
build/js/Layout.js
Normal file
@@ -0,0 +1,179 @@
|
||||
/* Layout()
|
||||
* ========
|
||||
* Implements AdminLTE layout.
|
||||
* Fixes the layout height in case min-height fails.
|
||||
*
|
||||
* @usage activated automatically upon window load.
|
||||
* Configure any options by passing data-option="value"
|
||||
* to the body tag.
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.layout'
|
||||
|
||||
var Default = {
|
||||
slimscroll : true,
|
||||
resetHeight: true
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
wrapper : '.wrapper',
|
||||
contentWrapper: '.content-wrapper',
|
||||
layoutBoxed : '.layout-boxed',
|
||||
mainFooter : '.main-footer',
|
||||
mainHeader : '.main-header',
|
||||
sidebar : '.sidebar',
|
||||
controlSidebar: '.control-sidebar',
|
||||
fixed : '.fixed',
|
||||
sidebarMenu : '.sidebar-menu',
|
||||
logo : '.main-header .logo'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
fixed : 'fixed',
|
||||
holdTransition: 'hold-transition'
|
||||
}
|
||||
|
||||
var Layout = function (options) {
|
||||
this.options = options
|
||||
this.bindedResize = false
|
||||
this.activate()
|
||||
}
|
||||
|
||||
Layout.prototype.activate = function () {
|
||||
this.fix()
|
||||
this.fixSidebar()
|
||||
|
||||
$('body').removeClass(ClassName.holdTransition)
|
||||
|
||||
if (this.options.resetHeight) {
|
||||
$('body, html, ' + Selector.wrapper).css({
|
||||
'height' : 'auto',
|
||||
'min-height': '100%'
|
||||
})
|
||||
}
|
||||
|
||||
if (!this.bindedResize) {
|
||||
$(window).resize(function () {
|
||||
this.fix()
|
||||
this.fixSidebar()
|
||||
|
||||
$(Selector.logo + ', ' + Selector.sidebar).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function () {
|
||||
this.fix()
|
||||
this.fixSidebar()
|
||||
}.bind(this))
|
||||
}.bind(this))
|
||||
|
||||
this.bindedResize = true
|
||||
}
|
||||
|
||||
$(Selector.sidebarMenu).on('expanded.tree', function () {
|
||||
this.fix()
|
||||
this.fixSidebar()
|
||||
}.bind(this))
|
||||
|
||||
$(Selector.sidebarMenu).on('collapsed.tree', function () {
|
||||
this.fix()
|
||||
this.fixSidebar()
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
Layout.prototype.fix = function () {
|
||||
// Remove overflow from .wrapper if layout-boxed exists
|
||||
$(Selector.layoutBoxed + ' > ' + Selector.wrapper).css('overflow', 'hidden')
|
||||
|
||||
// Get window height and the wrapper height
|
||||
var footerHeight = $(Selector.mainFooter).outerHeight() || 0
|
||||
var neg = $(Selector.mainHeader).outerHeight() + footerHeight
|
||||
var windowHeight = $(window).height()
|
||||
var sidebarHeight = $(Selector.sidebar).height() || 0
|
||||
|
||||
// Set the min-height of the content and sidebar based on
|
||||
// the height of the document.
|
||||
if ($('body').hasClass(ClassName.fixed)) {
|
||||
$(Selector.contentWrapper).css('min-height', windowHeight - footerHeight)
|
||||
} else {
|
||||
var postSetHeight
|
||||
|
||||
if (windowHeight >= sidebarHeight) {
|
||||
$(Selector.contentWrapper).css('min-height', windowHeight - neg)
|
||||
postSetHeight = windowHeight - neg
|
||||
} else {
|
||||
$(Selector.contentWrapper).css('min-height', sidebarHeight)
|
||||
postSetHeight = sidebarHeight
|
||||
}
|
||||
|
||||
// Fix for the control sidebar height
|
||||
var $controlSidebar = $(Selector.controlSidebar)
|
||||
if (typeof $controlSidebar !== 'undefined') {
|
||||
if ($controlSidebar.height() > postSetHeight)
|
||||
$(Selector.contentWrapper).css('min-height', $controlSidebar.height())
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Layout.prototype.fixSidebar = function () {
|
||||
// Make sure the body tag has the .fixed class
|
||||
if (!$('body').hasClass(ClassName.fixed)) {
|
||||
if (typeof $.fn.slimScroll !== 'undefined') {
|
||||
$(Selector.sidebar).slimScroll({ destroy: true }).height('auto')
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
// Enable slimscroll for fixed layout
|
||||
if (this.options.slimscroll) {
|
||||
if (typeof $.fn.slimScroll !== 'undefined') {
|
||||
// Destroy if it exists
|
||||
$(Selector.sidebar).slimScroll({ destroy: true }).height('auto')
|
||||
|
||||
// Add slimscroll
|
||||
$(Selector.sidebar).slimScroll({
|
||||
height: ($(window).height() - $(Selector.mainHeader).height()) + 'px',
|
||||
color : 'rgba(0,0,0,0.2)',
|
||||
size : '3px'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option === 'object' && option)
|
||||
$this.data(DataKey, (data = new Layout(options)))
|
||||
}
|
||||
|
||||
if (typeof option === 'string') {
|
||||
if (typeof data[option] === 'undefined') {
|
||||
throw new Error('No method named ' + option)
|
||||
}
|
||||
data[option]()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.layout
|
||||
|
||||
$.fn.layout = Plugin
|
||||
$.fn.layout.Constuctor = Layout
|
||||
|
||||
// No conflict mode
|
||||
// ================
|
||||
$.fn.layout.noConflict = function () {
|
||||
$.fn.layout = old
|
||||
return this
|
||||
}
|
||||
|
||||
// Layout DATA-API
|
||||
// ===============
|
||||
$(window).on('load', function () {
|
||||
Plugin.call($('body'))
|
||||
})
|
||||
}(jQuery)
|
||||
176
build/js/PushMenu.js
Normal file
176
build/js/PushMenu.js
Normal file
@@ -0,0 +1,176 @@
|
||||
/* PushMenu()
|
||||
* ==========
|
||||
* Adds the push menu functionality to the sidebar.
|
||||
*
|
||||
* @usage: $('.btn').pushMenu(options)
|
||||
* or add [data-toggle="push-menu"] to any toggle button
|
||||
* Pass any option as data-option="value"
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.pushmenu'
|
||||
|
||||
var Default = {
|
||||
collapseScreenSize : 767,
|
||||
expandOnHover : false,
|
||||
expandTransitionDelay: 200
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
collapsed : '.sidebar-collapse',
|
||||
open : '.sidebar-open',
|
||||
mainSidebar : '.main-sidebar',
|
||||
contentWrapper: '.content-wrapper',
|
||||
searchInput : '.sidebar-form .form-control',
|
||||
button : '[data-toggle="push-menu"]',
|
||||
mini : '.sidebar-mini',
|
||||
expanded : '.sidebar-expanded-on-hover',
|
||||
layoutFixed : '.fixed'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
collapsed : 'sidebar-collapse',
|
||||
open : 'sidebar-open',
|
||||
mini : 'sidebar-mini',
|
||||
expanded : 'sidebar-expanded-on-hover',
|
||||
expandFeature: 'sidebar-mini-expand-feature',
|
||||
layoutFixed : 'fixed'
|
||||
}
|
||||
|
||||
var Event = {
|
||||
expanded : 'expanded.pushMenu',
|
||||
collapsed: 'collapsed.pushMenu'
|
||||
}
|
||||
|
||||
// PushMenu Class Definition
|
||||
// =========================
|
||||
var PushMenu = function (options) {
|
||||
this.options = options
|
||||
this.init()
|
||||
}
|
||||
|
||||
PushMenu.prototype.init = function () {
|
||||
if (this.options.expandOnHover
|
||||
|| ($('body').is(Selector.mini + Selector.layoutFixed))) {
|
||||
this.expandOnHover()
|
||||
$('body').addClass(ClassName.expandFeature)
|
||||
}
|
||||
|
||||
$(Selector.contentWrapper).click(function () {
|
||||
// Enable hide menu when clicking on the content-wrapper on small screens
|
||||
if ($(window).width() <= this.options.collapseScreenSize && $('body').hasClass(ClassName.open)) {
|
||||
this.close()
|
||||
}
|
||||
}.bind(this))
|
||||
|
||||
// __Fix for android devices
|
||||
$(Selector.searchInput).click(function (e) {
|
||||
e.stopPropagation()
|
||||
})
|
||||
}
|
||||
|
||||
PushMenu.prototype.toggle = function () {
|
||||
var windowWidth = $(window).width()
|
||||
var isOpen = !$('body').hasClass(ClassName.collapsed)
|
||||
|
||||
if (windowWidth <= this.options.collapseScreenSize) {
|
||||
isOpen = $('body').hasClass(ClassName.open)
|
||||
}
|
||||
|
||||
if (!isOpen) {
|
||||
this.open()
|
||||
} else {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
|
||||
PushMenu.prototype.open = function () {
|
||||
var windowWidth = $(window).width()
|
||||
|
||||
if (windowWidth > this.options.collapseScreenSize) {
|
||||
$('body').removeClass(ClassName.collapsed)
|
||||
.trigger($.Event(Event.expanded))
|
||||
}
|
||||
else {
|
||||
$('body').addClass(ClassName.open)
|
||||
.trigger($.Event(Event.expanded))
|
||||
}
|
||||
}
|
||||
|
||||
PushMenu.prototype.close = function () {
|
||||
var windowWidth = $(window).width()
|
||||
if (windowWidth > this.options.collapseScreenSize) {
|
||||
$('body').addClass(ClassName.collapsed)
|
||||
.trigger($.Event(Event.collapsed))
|
||||
} else {
|
||||
$('body').removeClass(ClassName.open + ' ' + ClassName.collapsed)
|
||||
.trigger($.Event(Event.collapsed))
|
||||
}
|
||||
}
|
||||
|
||||
PushMenu.prototype.expandOnHover = function () {
|
||||
$(Selector.mainSidebar).hover(function () {
|
||||
if ($('body').is(Selector.mini + Selector.collapsed)
|
||||
&& $(window).width() > this.options.collapseScreenSize) {
|
||||
this.expand()
|
||||
}
|
||||
}.bind(this), function () {
|
||||
if ($('body').is(Selector.expanded)) {
|
||||
this.collapse()
|
||||
}
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
PushMenu.prototype.expand = function () {
|
||||
setTimeout(function () {
|
||||
$('body').removeClass(ClassName.collapsed)
|
||||
.addClass(ClassName.expanded)
|
||||
}, this.options.expandTransitionDelay)
|
||||
}
|
||||
|
||||
PushMenu.prototype.collapse = function () {
|
||||
setTimeout(function () {
|
||||
$('body').removeClass(ClassName.expanded)
|
||||
.addClass(ClassName.collapsed)
|
||||
}, this.options.expandTransitionDelay)
|
||||
}
|
||||
|
||||
// PushMenu Plugin Definition
|
||||
// ==========================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option)
|
||||
$this.data(DataKey, (data = new PushMenu(options)))
|
||||
}
|
||||
|
||||
if (option == 'toggle') data.toggle()
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.pushMenu
|
||||
|
||||
$.fn.pushMenu = Plugin
|
||||
$.fn.pushMenu.Constructor = PushMenu
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.pushMenu.noConflict = function () {
|
||||
$.fn.pushMenu = old
|
||||
return this
|
||||
}
|
||||
|
||||
// Data API
|
||||
// ========
|
||||
$(document).on('click', Selector.button, function (e) {
|
||||
e.preventDefault()
|
||||
Plugin.call($(this), 'toggle')
|
||||
})
|
||||
$(window).on('load', function () {
|
||||
Plugin.call($(Selector.button))
|
||||
})
|
||||
}(jQuery)
|
||||
107
build/js/TodoList.js
Normal file
107
build/js/TodoList.js
Normal file
@@ -0,0 +1,107 @@
|
||||
/* TodoList()
|
||||
* =========
|
||||
* Converts a list into a todoList.
|
||||
*
|
||||
* @Usage: $('.my-list').todoList(options)
|
||||
* or add [data-widget="todo-list"] to the ul element
|
||||
* Pass any option as data-option="value"
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.todolist'
|
||||
|
||||
var Default = {
|
||||
iCheck : false,
|
||||
onCheck : function () {
|
||||
},
|
||||
onUnCheck: function () {
|
||||
}
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
data: '[data-widget="todo-list"]'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
done: 'done'
|
||||
}
|
||||
|
||||
// TodoList Class Definition
|
||||
// =========================
|
||||
var TodoList = function (element, options) {
|
||||
this.element = element
|
||||
this.options = options
|
||||
|
||||
this._setUpListeners()
|
||||
}
|
||||
|
||||
TodoList.prototype.toggle = function (item) {
|
||||
item.parents(Selector.li).first().toggleClass(ClassName.done)
|
||||
if (!item.prop('checked')) {
|
||||
this.unCheck(item)
|
||||
return
|
||||
}
|
||||
|
||||
this.check(item)
|
||||
}
|
||||
|
||||
TodoList.prototype.check = function (item) {
|
||||
this.options.onCheck.call(item)
|
||||
}
|
||||
|
||||
TodoList.prototype.unCheck = function (item) {
|
||||
this.options.onUnCheck.call(item)
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
TodoList.prototype._setUpListeners = function () {
|
||||
var that = this
|
||||
$(this.element).on('change ifChanged', 'input:checkbox', function () {
|
||||
that.toggle($(this))
|
||||
})
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option)
|
||||
$this.data(DataKey, (data = new TodoList($this, options)))
|
||||
}
|
||||
|
||||
if (typeof data == 'string') {
|
||||
if (typeof data[option] == 'undefined') {
|
||||
throw new Error('No method named ' + option)
|
||||
}
|
||||
data[option]()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.todoList
|
||||
|
||||
$.fn.todoList = Plugin
|
||||
$.fn.todoList.Constructor = TodoList
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.todoList.noConflict = function () {
|
||||
$.fn.todoList = old
|
||||
return this
|
||||
}
|
||||
|
||||
// TodoList Data API
|
||||
// =================
|
||||
$(window).on('load', function () {
|
||||
$(Selector.data).each(function () {
|
||||
Plugin.call($(this))
|
||||
})
|
||||
})
|
||||
|
||||
}(jQuery)
|
||||
145
build/js/Tree.js
Normal file
145
build/js/Tree.js
Normal file
@@ -0,0 +1,145 @@
|
||||
/* Tree()
|
||||
* ======
|
||||
* Converts a nested list into a multilevel
|
||||
* tree view menu.
|
||||
*
|
||||
* @Usage: $('.my-menu').tree(options)
|
||||
* or add [data-widget="tree"] to the ul element
|
||||
* Pass any option as data-option="value"
|
||||
*/
|
||||
+function ($) {
|
||||
'use strict'
|
||||
|
||||
var DataKey = 'lte.tree'
|
||||
|
||||
var Default = {
|
||||
animationSpeed: 500,
|
||||
accordion : true,
|
||||
followLink : false,
|
||||
trigger : '.treeview a'
|
||||
}
|
||||
|
||||
var Selector = {
|
||||
tree : '.tree',
|
||||
treeview : '.treeview',
|
||||
treeviewMenu: '.treeview-menu',
|
||||
open : '.menu-open, .active',
|
||||
li : 'li',
|
||||
data : '[data-widget="tree"]',
|
||||
active : '.active'
|
||||
}
|
||||
|
||||
var ClassName = {
|
||||
open: 'menu-open',
|
||||
tree: 'tree'
|
||||
}
|
||||
|
||||
var Event = {
|
||||
collapsed: 'collapsed.tree',
|
||||
expanded : 'expanded.tree'
|
||||
}
|
||||
|
||||
// Tree Class Definition
|
||||
// =====================
|
||||
var Tree = function (element, options) {
|
||||
this.element = element
|
||||
this.options = options
|
||||
|
||||
$(this.element).addClass(ClassName.tree)
|
||||
|
||||
$(Selector.treeview + Selector.active, this.element).addClass(ClassName.open)
|
||||
|
||||
this._setUpListeners()
|
||||
}
|
||||
|
||||
Tree.prototype.toggle = function (link, event) {
|
||||
var treeviewMenu = link.next(Selector.treeviewMenu)
|
||||
var parentLi = link.parent()
|
||||
var isOpen = parentLi.hasClass(ClassName.open)
|
||||
|
||||
if (!parentLi.is(Selector.treeview)) {
|
||||
return
|
||||
}
|
||||
|
||||
if (!this.options.followLink || link.attr('href') == '#') {
|
||||
event.preventDefault()
|
||||
}
|
||||
|
||||
if (isOpen) {
|
||||
this.collapse(treeviewMenu, parentLi)
|
||||
} else {
|
||||
this.expand(treeviewMenu, parentLi)
|
||||
}
|
||||
}
|
||||
|
||||
Tree.prototype.expand = function (tree, parent) {
|
||||
var expandedEvent = $.Event(Event.expanded)
|
||||
|
||||
if (this.options.accordion) {
|
||||
var openMenuLi = parent.siblings(Selector.open)
|
||||
var openTree = openMenuLi.children(Selector.treeviewMenu)
|
||||
this.collapse(openTree, openMenuLi)
|
||||
}
|
||||
|
||||
parent.addClass(ClassName.open)
|
||||
tree.slideDown(this.options.animationSpeed, function () {
|
||||
$(this.element).trigger(expandedEvent)
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
Tree.prototype.collapse = function (tree, parentLi) {
|
||||
var collapsedEvent = $.Event(Event.collapsed)
|
||||
|
||||
tree.find(Selector.open).removeClass(ClassName.open)
|
||||
parentLi.removeClass(ClassName.open)
|
||||
tree.slideUp(this.options.animationSpeed, function () {
|
||||
tree.find(Selector.open + ' > ' + Selector.treeview).slideUp()
|
||||
$(this.element).trigger(collapsedEvent)
|
||||
}.bind(this))
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
Tree.prototype._setUpListeners = function () {
|
||||
var that = this
|
||||
|
||||
$(this.element).on('click', this.options.trigger, function (event) {
|
||||
that.toggle($(this), event)
|
||||
})
|
||||
}
|
||||
|
||||
// Plugin Definition
|
||||
// =================
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data(DataKey)
|
||||
|
||||
if (!data) {
|
||||
var options = $.extend({}, Default, $this.data(), typeof option == 'object' && option)
|
||||
$this.data(DataKey, new Tree($this, options))
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.tree
|
||||
|
||||
$.fn.tree = Plugin
|
||||
$.fn.tree.Constructor = Tree
|
||||
|
||||
// No Conflict Mode
|
||||
// ================
|
||||
$.fn.tree.noConflict = function () {
|
||||
$.fn.tree = old
|
||||
return this
|
||||
}
|
||||
|
||||
// Tree Data API
|
||||
// =============
|
||||
$(window).on('load', function () {
|
||||
$(Selector.data).each(function () {
|
||||
Plugin.call($(this))
|
||||
})
|
||||
})
|
||||
|
||||
}(jQuery)
|
||||
23
build/less/.csslintrc
Normal file
23
build/less/.csslintrc
Normal file
@@ -0,0 +1,23 @@
|
||||
{
|
||||
"adjoining-classes": false,
|
||||
"box-sizing": false,
|
||||
"box-model": false,
|
||||
"compatible-vendor-prefixes": false,
|
||||
"floats": false,
|
||||
"font-sizes": false,
|
||||
"gradients": false,
|
||||
"important": false,
|
||||
"known-properties": false,
|
||||
"outline-none": false,
|
||||
"qualified-headings": false,
|
||||
"regex-selectors": false,
|
||||
"shorthand": false,
|
||||
"text-indent": false,
|
||||
"unique-headings": false,
|
||||
"universal-selector": false,
|
||||
"unqualified-attributes": false,
|
||||
"ids": false,
|
||||
"fallback-colors": false,
|
||||
"vendor-prefix": false,
|
||||
"import": false
|
||||
}
|
||||
36
build/less/404_500_errors.less
Normal file
36
build/less/404_500_errors.less
Normal file
@@ -0,0 +1,36 @@
|
||||
/*
|
||||
* Page: 400 and 500 error pages
|
||||
* ------------------------------
|
||||
*/
|
||||
.error-page {
|
||||
width: 600px;
|
||||
margin: 20px auto 0 auto;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
width: 100%;
|
||||
}
|
||||
//For the error number e.g: 404
|
||||
> .headline {
|
||||
float: left;
|
||||
font-size: 100px;
|
||||
font-weight: 300;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
float: none;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
//For the message
|
||||
> .error-content {
|
||||
margin-left: 190px;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
margin-left: 0;
|
||||
}
|
||||
> h3 {
|
||||
font-weight: 300;
|
||||
font-size: 25px;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
55
build/less/AdminLTE-without-plugins.less
Normal file
55
build/less/AdminLTE-without-plugins.less
Normal file
@@ -0,0 +1,55 @@
|
||||
/*!
|
||||
* AdminLTE v2.4.0 Without Third-Party Plugins
|
||||
* Author: Almsaeed Studio
|
||||
* Website: Almsaeed Studio <https://adminlte.io>
|
||||
* License: Open source - MIT
|
||||
* Please visit http://opensource.org/licenses/MIT for more information
|
||||
!*/
|
||||
//Bootstrap Variables & Mixins
|
||||
//The core bootstrap code have not been modified. These files
|
||||
//are included only for reference.
|
||||
@import (reference) "../../bower_components/bootstrap/less/mixins";
|
||||
@import (reference) "../../bower_components/bootstrap/less/variables";
|
||||
//MISC
|
||||
//----
|
||||
@import "core";
|
||||
@import "variables";
|
||||
@import "mixins";
|
||||
//COMPONENTS
|
||||
//-----------
|
||||
@import "header";
|
||||
@import "sidebar";
|
||||
@import "sidebar-mini";
|
||||
@import "control-sidebar";
|
||||
@import "dropdown";
|
||||
@import "forms";
|
||||
@import "progress-bars";
|
||||
@import "small-box";
|
||||
@import "boxes";
|
||||
@import "info-box";
|
||||
@import "timeline";
|
||||
@import "buttons";
|
||||
@import "callout";
|
||||
@import "alerts";
|
||||
@import "navs";
|
||||
@import "products";
|
||||
@import "table";
|
||||
@import "labels";
|
||||
@import "direct-chat";
|
||||
@import "users-list";
|
||||
@import "carousel";
|
||||
@import "modal";
|
||||
@import "social-widgets";
|
||||
@import "treeview";
|
||||
//PAGES
|
||||
//------
|
||||
@import "mailbox";
|
||||
@import "lockscreen";
|
||||
@import "login_and_register";
|
||||
@import "404_500_errors";
|
||||
@import "invoice";
|
||||
@import "profile";
|
||||
//Miscellaneous
|
||||
//-------------
|
||||
@import "miscellaneous";
|
||||
@import "print";
|
||||
62
build/less/AdminLTE.less
Normal file
62
build/less/AdminLTE.less
Normal file
@@ -0,0 +1,62 @@
|
||||
/*!
|
||||
* AdminLTE v2.4.0
|
||||
* Author: Almsaeed Studio
|
||||
* Website: Almsaeed Studio <https://adminlte.io>
|
||||
* License: Open source - MIT
|
||||
* Please visit http://opensource.org/licenses/MIT for more information
|
||||
*/
|
||||
// Bootstrap
|
||||
//--------------------------------------------------------
|
||||
@import (reference) "../../bower_components/bootstrap/less/mixins";
|
||||
@import (reference) "../../bower_components/bootstrap/less/variables";
|
||||
|
||||
// MISC
|
||||
//--------------------------------------------------------
|
||||
@import "core";
|
||||
@import "variables";
|
||||
@import "mixins";
|
||||
|
||||
// COMPONENTS
|
||||
//--------------------------------------------------------
|
||||
@import "header";
|
||||
@import "sidebar";
|
||||
@import "sidebar-mini";
|
||||
@import "control-sidebar";
|
||||
@import "dropdown";
|
||||
@import "forms";
|
||||
@import "progress-bars";
|
||||
@import "small-box";
|
||||
@import "boxes";
|
||||
@import "info-box";
|
||||
@import "timeline";
|
||||
@import "buttons";
|
||||
@import "callout";
|
||||
@import "alerts";
|
||||
@import "navs";
|
||||
@import "products";
|
||||
@import "table";
|
||||
@import "labels";
|
||||
@import "direct-chat";
|
||||
@import "users-list";
|
||||
@import "carousel";
|
||||
@import "modal";
|
||||
@import "social-widgets";
|
||||
@import "treeview";
|
||||
|
||||
// PAGES
|
||||
//--------------------------------------------------------
|
||||
@import "mailbox";
|
||||
@import "lockscreen";
|
||||
@import "login_and_register";
|
||||
@import "404_500_errors";
|
||||
@import "invoice";
|
||||
@import "profile";
|
||||
|
||||
// Plugins
|
||||
//--------------------------------------------------------
|
||||
@import "plugins";
|
||||
|
||||
// Miscellaneous
|
||||
//--------------------------------------------------------
|
||||
@import "miscellaneous";
|
||||
@import "print";
|
||||
47
build/less/alerts.less
Normal file
47
build/less/alerts.less
Normal file
@@ -0,0 +1,47 @@
|
||||
/*
|
||||
* Component: alert
|
||||
* ----------------
|
||||
*/
|
||||
|
||||
.alert {
|
||||
.border-radius(3px);
|
||||
h4 {
|
||||
font-weight: 600;
|
||||
}
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.close {
|
||||
color: #000;
|
||||
.opacity(.2);
|
||||
&:hover {
|
||||
.opacity(.5);
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
//Alert Variants
|
||||
.alert-success {
|
||||
&:extend(.bg-green);
|
||||
border-color: darken(@green, 5%);
|
||||
}
|
||||
|
||||
.alert-danger,
|
||||
.alert-error {
|
||||
&:extend(.bg-red);
|
||||
border-color: darken(@red, 5%);
|
||||
}
|
||||
|
||||
.alert-warning {
|
||||
&:extend(.bg-yellow);
|
||||
border-color: darken(@yellow, 5%);
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
&:extend(.bg-aqua);
|
||||
border-color: darken(@aqua, 5%);
|
||||
}
|
||||
178
build/less/bootstrap-social.less
vendored
Normal file
178
build/less/bootstrap-social.less
vendored
Normal file
@@ -0,0 +1,178 @@
|
||||
/*
|
||||
* Social Buttons for Bootstrap
|
||||
*
|
||||
* Copyright 2013-2015 Panayiotis Lipiridis
|
||||
* Licensed under the MIT License
|
||||
*
|
||||
* https://github.com/lipis/bootstrap-social
|
||||
*/
|
||||
|
||||
// Import variables and mixins as a reference for separate plugins version
|
||||
@import (reference) "../../bower_components/bootstrap/less/mixins";
|
||||
@import (reference) "../../bower_components/bootstrap/less/variables";
|
||||
@import (reference) "variables";
|
||||
@import (reference) "mixins";
|
||||
|
||||
@bs-height-base: (@line-height-computed + @padding-base-vertical * 2);
|
||||
@bs-height-lg: (floor(@font-size-large * @line-height-base) + @padding-large-vertical * 2);
|
||||
@bs-height-sm: (floor(@font-size-small * 1.5) + @padding-small-vertical * 2);
|
||||
@bs-height-xs: (floor(@font-size-small * 1.2) + @padding-small-vertical + 1);
|
||||
|
||||
.btn-social {
|
||||
position: relative;
|
||||
padding-left: (@bs-height-base + @padding-base-horizontal);
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
> :first-child {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: @bs-height-base;
|
||||
line-height: (@bs-height-base + 2);
|
||||
font-size: 1.6em;
|
||||
text-align: center;
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
&.btn-lg {
|
||||
padding-left: (@bs-height-lg + @padding-large-horizontal);
|
||||
> :first-child {
|
||||
line-height: @bs-height-lg;
|
||||
width: @bs-height-lg;
|
||||
font-size: 1.8em;
|
||||
}
|
||||
}
|
||||
&.btn-sm {
|
||||
padding-left: (@bs-height-sm + @padding-small-horizontal);
|
||||
> :first-child {
|
||||
line-height: @bs-height-sm;
|
||||
width: @bs-height-sm;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
}
|
||||
&.btn-xs {
|
||||
padding-left: (@bs-height-xs + @padding-small-horizontal);
|
||||
> :first-child {
|
||||
line-height: @bs-height-xs;
|
||||
width: @bs-height-xs;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-social-icon {
|
||||
.btn-social;
|
||||
height: (@bs-height-base + 2);
|
||||
width: (@bs-height-base + 2);
|
||||
padding: 0;
|
||||
> :first-child {
|
||||
border: none;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
&.btn-lg {
|
||||
height: @bs-height-lg;
|
||||
width: @bs-height-lg;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
&.btn-sm {
|
||||
height: (@bs-height-sm + 2);
|
||||
width: (@bs-height-sm + 2);
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
&.btn-xs {
|
||||
height: (@bs-height-xs + 2);
|
||||
width: (@bs-height-xs + 2);
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-social(@color-bg, @color: #fff) {
|
||||
background-color: @color-bg;
|
||||
.button-variant(@color, @color-bg, rgba(0, 0, 0, .2));
|
||||
}
|
||||
|
||||
.btn-adn {
|
||||
.btn-social(#d87a68);
|
||||
}
|
||||
|
||||
.btn-bitbucket {
|
||||
.btn-social(#205081);
|
||||
}
|
||||
|
||||
.btn-dropbox {
|
||||
.btn-social(#1087dd);
|
||||
}
|
||||
|
||||
.btn-facebook {
|
||||
.btn-social(#3b5998);
|
||||
}
|
||||
|
||||
.btn-flickr {
|
||||
.btn-social(#ff0084);
|
||||
}
|
||||
|
||||
.btn-foursquare {
|
||||
.btn-social(#f94877);
|
||||
}
|
||||
|
||||
.btn-github {
|
||||
.btn-social(#444444);
|
||||
}
|
||||
|
||||
.btn-google {
|
||||
.btn-social(#dd4b39);
|
||||
}
|
||||
|
||||
.btn-instagram {
|
||||
.btn-social(#3f729b);
|
||||
}
|
||||
|
||||
.btn-linkedin {
|
||||
.btn-social(#007bb6);
|
||||
}
|
||||
|
||||
.btn-microsoft {
|
||||
.btn-social(#2672ec);
|
||||
}
|
||||
|
||||
.btn-openid {
|
||||
.btn-social(#f7931e);
|
||||
}
|
||||
|
||||
.btn-pinterest {
|
||||
.btn-social(#cb2027);
|
||||
}
|
||||
|
||||
.btn-reddit {
|
||||
.btn-social(#eff7ff, #000);
|
||||
}
|
||||
|
||||
.btn-soundcloud {
|
||||
.btn-social(#ff5500);
|
||||
}
|
||||
|
||||
.btn-tumblr {
|
||||
.btn-social(#2c4762);
|
||||
}
|
||||
|
||||
.btn-twitter {
|
||||
.btn-social(#55acee);
|
||||
}
|
||||
|
||||
.btn-vimeo {
|
||||
.btn-social(#1ab7ea);
|
||||
}
|
||||
|
||||
.btn-vk {
|
||||
.btn-social(#587ea3);
|
||||
}
|
||||
|
||||
.btn-yahoo {
|
||||
.btn-social(#720e9e);
|
||||
}
|
||||
489
build/less/boxes.less
Normal file
489
build/less/boxes.less
Normal file
@@ -0,0 +1,489 @@
|
||||
/*
|
||||
* Component: Box
|
||||
* --------------
|
||||
*/
|
||||
.box {
|
||||
position: relative;
|
||||
.border-radius(@box-border-radius);
|
||||
background: #ffffff;
|
||||
border-top: 3px solid @box-default-border-top-color;
|
||||
margin-bottom: 20px;
|
||||
width: 100%;
|
||||
box-shadow: @box-boxshadow;
|
||||
|
||||
// Box color variations
|
||||
&.box-primary {
|
||||
border-top-color: @light-blue;
|
||||
}
|
||||
&.box-info {
|
||||
border-top-color: @aqua;
|
||||
}
|
||||
&.box-danger {
|
||||
border-top-color: @red;
|
||||
}
|
||||
&.box-warning {
|
||||
border-top-color: @yellow;
|
||||
}
|
||||
&.box-success {
|
||||
border-top-color: @green;
|
||||
}
|
||||
&.box-default {
|
||||
border-top-color: @gray-lte;
|
||||
}
|
||||
|
||||
// collapsed mode
|
||||
&.collapsed-box {
|
||||
.box-body,
|
||||
.box-footer {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-stacked {
|
||||
> li {
|
||||
border-bottom: 1px solid @box-border-color;
|
||||
margin: 0;
|
||||
&:last-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// fixed height to 300px
|
||||
&.height-control {
|
||||
.box-body {
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.border-right {
|
||||
border-right: 1px solid @box-border-color;
|
||||
}
|
||||
.border-left {
|
||||
border-left: 1px solid @box-border-color;
|
||||
}
|
||||
|
||||
//SOLID BOX
|
||||
//---------
|
||||
//use this class to get a colored header and borders
|
||||
|
||||
&.box-solid {
|
||||
border-top: 0;
|
||||
> .box-header {
|
||||
.btn.btn-default {
|
||||
background: transparent;
|
||||
}
|
||||
.btn,
|
||||
a {
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Box color variations
|
||||
&.box-default {
|
||||
.box-solid-variant(@gray-lte, #444);
|
||||
}
|
||||
&.box-primary {
|
||||
.box-solid-variant(@light-blue);
|
||||
}
|
||||
&.box-info {
|
||||
.box-solid-variant(@aqua);
|
||||
}
|
||||
&.box-danger {
|
||||
.box-solid-variant(@red);
|
||||
}
|
||||
&.box-warning {
|
||||
.box-solid-variant(@yellow);
|
||||
}
|
||||
&.box-success {
|
||||
.box-solid-variant(@green);
|
||||
}
|
||||
|
||||
> .box-header > .box-tools .btn {
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
// Fix font color for tiles
|
||||
&[class*='bg'] {
|
||||
> .box-header {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//BOX GROUP
|
||||
.box-group {
|
||||
> .box {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
// jQuery Knob in a box
|
||||
.knob-label {
|
||||
text-align: center;
|
||||
color: #333;
|
||||
font-weight: 100;
|
||||
font-size: 12px;
|
||||
margin-bottom: 0.3em;
|
||||
}
|
||||
}
|
||||
|
||||
.box,
|
||||
.overlay-wrapper {
|
||||
// Box overlay for LOADING STATE effect
|
||||
> .overlay,
|
||||
> .loading-img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.overlay {
|
||||
z-index: 50;
|
||||
background: rgba(255, 255, 255, 0.7);
|
||||
.border-radius(@box-border-radius);
|
||||
> .fa {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -15px;
|
||||
margin-top: -15px;
|
||||
color: #000;
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.overlay.dark {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
//Add clearfix to header, body and footer
|
||||
.box-header,
|
||||
.box-body,
|
||||
.box-footer {
|
||||
.clearfix();
|
||||
}
|
||||
|
||||
//Box header
|
||||
.box-header {
|
||||
color: #444;
|
||||
display: block;
|
||||
padding: @box-padding;
|
||||
position: relative;
|
||||
|
||||
//Add bottom border
|
||||
&.with-border {
|
||||
border-bottom: 1px solid @box-border-color;
|
||||
.collapsed-box & {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
//Icons and box title
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion,
|
||||
.box-title {
|
||||
display: inline-block;
|
||||
font-size: 18px;
|
||||
margin: 0;
|
||||
line-height: 1;
|
||||
}
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
margin-right: 5px;
|
||||
}
|
||||
> .box-tools {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 5px;
|
||||
[data-toggle="tooltip"] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&.pull-right {
|
||||
.dropdown-menu {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu > li > a {
|
||||
color: #444!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Box Tools Buttons
|
||||
.btn-box-tool {
|
||||
padding: 5px;
|
||||
font-size: 12px;
|
||||
background: transparent;
|
||||
color: darken(@box-default-border-top-color, 20%);
|
||||
.open &,
|
||||
&:hover {
|
||||
color: darken(@box-default-border-top-color, 40%);
|
||||
}
|
||||
&.btn:active {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
//Box Body
|
||||
.box-body {
|
||||
.border-radius(0; 0; @box-border-radius; @box-border-radius);
|
||||
padding: @box-padding;
|
||||
.no-header & {
|
||||
.border-top-radius(@box-border-radius);
|
||||
}
|
||||
// Tables within the box body
|
||||
> .table {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Calendar within the box body
|
||||
.fc {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.full-width-chart {
|
||||
margin: -19px;
|
||||
}
|
||||
&.no-padding .full-width-chart {
|
||||
margin: -9px;
|
||||
}
|
||||
|
||||
.box-pane {
|
||||
.border-radius(0; 0; @box-border-radius; 0);
|
||||
}
|
||||
.box-pane-right {
|
||||
.border-radius(0; 0; 0; @box-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
//Box footer
|
||||
.box-footer {
|
||||
.border-radius(0; 0; @box-border-radius; @box-border-radius);
|
||||
border-top: 1px solid @box-border-color;
|
||||
padding: @box-padding;
|
||||
background-color: @box-footer-bg;
|
||||
}
|
||||
|
||||
.chart-legend {
|
||||
&:extend(.list-unstyled);
|
||||
margin: 10px 0;
|
||||
> li {
|
||||
@media (max-width: @screen-sm-max) {
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Comment Box
|
||||
.box-comments {
|
||||
background: #f7f7f7;
|
||||
.box-comment {
|
||||
.clearfix();
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
&:last-of-type {
|
||||
border-bottom: 0;
|
||||
}
|
||||
&:first-of-type {
|
||||
padding-top: 0;
|
||||
}
|
||||
img {
|
||||
&:extend(.img-sm);
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.comment-text {
|
||||
margin-left: 40px;
|
||||
color: #555;
|
||||
}
|
||||
.username {
|
||||
color: #444;
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
}
|
||||
.text-muted {
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
//Widgets
|
||||
//-----------
|
||||
|
||||
/* Widget: TODO LIST */
|
||||
|
||||
.todo-list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
overflow: auto;
|
||||
// Todo list element
|
||||
> li {
|
||||
.border-radius(2px);
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
margin-bottom: 2px;
|
||||
border-left: 2px solid #e6e7e8;
|
||||
color: #444;
|
||||
&:last-of-type {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
> input[type='checkbox'] {
|
||||
margin: 0 10px 0 5px;
|
||||
}
|
||||
|
||||
.text {
|
||||
display: inline-block;
|
||||
margin-left: 5px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
// Time labels
|
||||
.label {
|
||||
margin-left: 10px;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
// Tools and options box
|
||||
.tools {
|
||||
display: none;
|
||||
float: right;
|
||||
color: @red;
|
||||
// icons
|
||||
> .fa, > .glyphicon, > .ion {
|
||||
margin-right: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
}
|
||||
&:hover .tools {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
&.done {
|
||||
color: #999;
|
||||
.text {
|
||||
text-decoration: line-through;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.label {
|
||||
background: @gray-lte !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Color varaity
|
||||
.danger {
|
||||
border-left-color: @red;
|
||||
}
|
||||
.warning {
|
||||
border-left-color: @yellow;
|
||||
}
|
||||
.info {
|
||||
border-left-color: @aqua;
|
||||
}
|
||||
.success {
|
||||
border-left-color: @green;
|
||||
}
|
||||
.primary {
|
||||
border-left-color: @light-blue;
|
||||
}
|
||||
|
||||
.handle {
|
||||
display: inline-block;
|
||||
cursor: move;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// END TODO WIDGET
|
||||
|
||||
/* Chat widget (DEPRECATED - this will be removed in the next major release. Use Direct Chat instead)*/
|
||||
.chat {
|
||||
padding: 5px 20px 5px 10px;
|
||||
|
||||
.item {
|
||||
.clearfix();
|
||||
margin-bottom: 10px;
|
||||
// The image
|
||||
> img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 2px solid transparent;
|
||||
.border-radius(50%);
|
||||
}
|
||||
|
||||
> .online {
|
||||
border: 2px solid @green;
|
||||
}
|
||||
> .offline {
|
||||
border: 2px solid @red;
|
||||
}
|
||||
|
||||
// The message body
|
||||
> .message {
|
||||
margin-left: 55px;
|
||||
margin-top: -40px;
|
||||
> .name {
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
// The attachment
|
||||
> .attachment {
|
||||
.border-radius(@attachment-border-radius);
|
||||
background: #f4f4f4;
|
||||
margin-left: 65px;
|
||||
margin-right: 15px;
|
||||
padding: 10px;
|
||||
> h4 {
|
||||
margin: 0 0 5px 0;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
}
|
||||
> p, > .filename {
|
||||
font-weight: 600;
|
||||
font-size: 13px;
|
||||
font-style: italic;
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
.clearfix();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//END CHAT WIDGET
|
||||
|
||||
//Input in box
|
||||
.box-input {
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
//A fix for panels body text color when placed within
|
||||
// a modal
|
||||
.modal {
|
||||
.panel-body {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
168
build/less/buttons.less
Normal file
168
build/less/buttons.less
Normal file
@@ -0,0 +1,168 @@
|
||||
/*
|
||||
* Component: Button
|
||||
* -----------------
|
||||
*/
|
||||
|
||||
.btn {
|
||||
.border-radius(@btn-border-radius);
|
||||
.box-shadow(@btn-boxshadow);
|
||||
border: 1px solid transparent;
|
||||
|
||||
&.uppercase {
|
||||
text-transform: uppercase
|
||||
}
|
||||
|
||||
// Flat buttons
|
||||
&.btn-flat {
|
||||
.border-radius(0);
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
// Active state
|
||||
&:active {
|
||||
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
-moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
// input file btn
|
||||
&.btn-file {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
> input[type='file'] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
font-size: 100px;
|
||||
text-align: right;
|
||||
.opacity(0);
|
||||
outline: none;
|
||||
background: white;
|
||||
cursor: inherit;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Button color variations
|
||||
.btn-default {
|
||||
background-color: #f4f4f4;
|
||||
color: #444;
|
||||
border-color: #ddd;
|
||||
&:hover,
|
||||
&:active,
|
||||
&.hover {
|
||||
background-color: darken(#f4f4f4, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: @light-blue;
|
||||
border-color: darken(@light-blue, 5%);
|
||||
&:hover, &:active, &.hover {
|
||||
background-color: darken(@light-blue, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
background-color: @green;
|
||||
border-color: darken(@green, 5%);
|
||||
&:hover, &:active, &.hover {
|
||||
background-color: darken(@green, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
background-color: @aqua;
|
||||
border-color: darken(@aqua, 5%);
|
||||
&:hover, &:active, &.hover {
|
||||
background-color: darken(@aqua, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background-color: @red;
|
||||
border-color: darken(@red, 5%);
|
||||
&:hover, &:active, &.hover {
|
||||
background-color: darken(@red, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
background-color: @yellow;
|
||||
border-color: darken(@yellow, 5%);
|
||||
&:hover, &:active, &.hover {
|
||||
background-color: darken(@yellow, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
border: 1px solid #fff;
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: rgba(255, 255, 255, .7);
|
||||
border-color: rgba(255, 255, 255, .7);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
.box-shadow(none);
|
||||
}
|
||||
|
||||
//General .btn with bg class
|
||||
.btn[class*='bg-']:hover {
|
||||
.box-shadow(inset 0 0 100px rgba(0, 0, 0, 0.2));
|
||||
}
|
||||
|
||||
// Application buttons
|
||||
.btn-app {
|
||||
.border-radius(3px);
|
||||
position: relative;
|
||||
padding: 15px 5px;
|
||||
margin: 0 0 10px 10px;
|
||||
min-width: 80px;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
color: #666;
|
||||
border: 1px solid #ddd;
|
||||
background-color: #f4f4f4;
|
||||
font-size: 12px;
|
||||
//Icons within the btn
|
||||
> .fa, > .glyphicon, > .ion {
|
||||
font-size: 20px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: #f4f4f4;
|
||||
color: #444;
|
||||
border-color: #aaa;
|
||||
}
|
||||
|
||||
&:active, &:focus {
|
||||
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
-moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
|
||||
}
|
||||
|
||||
//The badge
|
||||
> .badge {
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
right: -10px;
|
||||
font-size: 10px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
48
build/less/callout.less
Normal file
48
build/less/callout.less
Normal file
@@ -0,0 +1,48 @@
|
||||
/*
|
||||
* Component: Callout
|
||||
* ------------------
|
||||
*/
|
||||
|
||||
// Base styles (regardless of theme)
|
||||
.callout {
|
||||
.border-radius(3px);
|
||||
margin: 0 0 20px 0;
|
||||
padding: 15px 30px 15px 15px;
|
||||
border-left: 5px solid #eee;
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: underline;
|
||||
&:hover {
|
||||
color: #eee;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
code,
|
||||
.highlight {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
// Themes for different contexts
|
||||
&.callout-danger {
|
||||
&:extend(.bg-red);
|
||||
border-color: darken(@red, 10%);
|
||||
}
|
||||
&.callout-warning {
|
||||
&:extend(.bg-yellow);
|
||||
border-color: darken(@yellow, 10%);
|
||||
}
|
||||
&.callout-info {
|
||||
&:extend(.bg-aqua);
|
||||
border-color: darken(@aqua, 10%);
|
||||
}
|
||||
&.callout-success {
|
||||
&:extend(.bg-green);
|
||||
border-color: darken(@green, 10%);
|
||||
}
|
||||
}
|
||||
18
build/less/carousel.less
Normal file
18
build/less/carousel.less
Normal file
@@ -0,0 +1,18 @@
|
||||
/*
|
||||
* Component: Carousel
|
||||
* -------------------
|
||||
*/
|
||||
.carousel-control {
|
||||
&.left,
|
||||
&.right {
|
||||
background-image: none;
|
||||
}
|
||||
> .fa {
|
||||
font-size: 40px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
z-index: 5;
|
||||
display: inline-block;
|
||||
margin-top: -20px;
|
||||
}
|
||||
}
|
||||
299
build/less/control-sidebar.less
Normal file
299
build/less/control-sidebar.less
Normal file
@@ -0,0 +1,299 @@
|
||||
/*
|
||||
* Component: Control sidebar. By default, this is the right sidebar.
|
||||
*/
|
||||
// The sidebar's background control class
|
||||
// This is a hack to make the background visible while scrolling
|
||||
.control-sidebar-bg {
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
// Transitions
|
||||
.control-sidebar-bg,
|
||||
.control-sidebar {
|
||||
top: 0;
|
||||
right: -@control-sidebar-width;
|
||||
width: @control-sidebar-width;
|
||||
.transition(right @transition-speed ease-in-out);
|
||||
}
|
||||
|
||||
// The sidebar
|
||||
.control-sidebar {
|
||||
position: absolute;
|
||||
padding-top: @navbar-height;
|
||||
z-index: 1010;
|
||||
// Fix position after header collapse
|
||||
@media (max-width: @screen-sm) {
|
||||
padding-top: @navbar-height + 50;
|
||||
}
|
||||
// Tab panes
|
||||
> .tab-content {
|
||||
padding: 10px 15px;
|
||||
}
|
||||
// Open state with slide over content effect
|
||||
&.control-sidebar-open {
|
||||
&,
|
||||
+ .control-sidebar-bg {
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Open without slide over content
|
||||
.control-sidebar-open {
|
||||
.control-sidebar-bg,
|
||||
.control-sidebar {
|
||||
right: 0;
|
||||
}
|
||||
@media (min-width: @screen-sm) {
|
||||
.content-wrapper,
|
||||
.right-side,
|
||||
.main-footer {
|
||||
margin-right: @control-sidebar-width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Fixed Layout
|
||||
.fixed {
|
||||
.control-sidebar {
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
// Control sidebar tabs
|
||||
.nav-tabs.control-sidebar-tabs {
|
||||
> li {
|
||||
&:first-of-type > a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-left-width: 0;
|
||||
}
|
||||
}
|
||||
> a {
|
||||
.border-radius(0);
|
||||
|
||||
// Hover and active states
|
||||
&,
|
||||
&:hover {
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
border-left: 1px solid transparent;
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
.icon {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
// Active state
|
||||
&.active {
|
||||
> a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
border-top: none;
|
||||
border-right: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Remove responsiveness on small screens
|
||||
@media (max-width: @screen-sm) {
|
||||
display: table;
|
||||
> li {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Headings in the sidebar content
|
||||
.control-sidebar-heading {
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
padding: 10px 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
// Subheadings
|
||||
.control-sidebar-subheading {
|
||||
display: block;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
// Control Sidebar Menu
|
||||
.control-sidebar-menu {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0 -15px;
|
||||
> li > a {
|
||||
.clearfix();
|
||||
display: block;
|
||||
padding: 10px 15px;
|
||||
> .control-sidebar-subheading {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
.menu-icon {
|
||||
float: left;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
line-height: 35px;
|
||||
}
|
||||
.menu-info {
|
||||
margin-left: 45px;
|
||||
margin-top: 3px;
|
||||
> .control-sidebar-subheading {
|
||||
margin: 0;
|
||||
}
|
||||
> p {
|
||||
margin: 0;
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
.progress {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Dark skin
|
||||
.control-sidebar-dark {
|
||||
color: @sidebar-dark-color;
|
||||
// Background
|
||||
&,
|
||||
+ .control-sidebar-bg {
|
||||
background: @sidebar-dark-bg;
|
||||
}
|
||||
// Sidebar tabs
|
||||
.nav-tabs.control-sidebar-tabs {
|
||||
border-bottom: darken(@sidebar-dark-bg, 3%);
|
||||
> li {
|
||||
> a {
|
||||
background: darken(@sidebar-dark-bg, 5%);
|
||||
color: @sidebar-dark-color;
|
||||
// Hover and active states
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-left-color: darken(@sidebar-dark-bg, 7%);
|
||||
border-bottom-color: darken(@sidebar-dark-bg, 7%);
|
||||
}
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: darken(@sidebar-dark-bg, 3%);
|
||||
}
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
// Active state
|
||||
&.active {
|
||||
> a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: @sidebar-dark-bg;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Heading & subheading
|
||||
.control-sidebar-heading,
|
||||
.control-sidebar-subheading {
|
||||
color: #fff;
|
||||
}
|
||||
// Sidebar list
|
||||
.control-sidebar-menu {
|
||||
> li {
|
||||
> a {
|
||||
&:hover {
|
||||
background: @sidebar-dark-hover-bg;
|
||||
}
|
||||
.menu-info {
|
||||
> p {
|
||||
color: @sidebar-dark-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Light skin
|
||||
.control-sidebar-light {
|
||||
color: lighten(@sidebar-light-color, 10%);
|
||||
// Background
|
||||
&,
|
||||
+ .control-sidebar-bg {
|
||||
background: @sidebar-light-bg;
|
||||
border-left: 1px solid @gray-lte;
|
||||
}
|
||||
// Sidebar tabs
|
||||
.nav-tabs.control-sidebar-tabs {
|
||||
border-bottom: @gray-lte;
|
||||
> li {
|
||||
> a {
|
||||
background: darken(@sidebar-light-bg, 5%);
|
||||
color: @sidebar-light-color;
|
||||
// Hover and active states
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-left-color: @gray-lte;
|
||||
border-bottom-color: @gray-lte;
|
||||
}
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: darken(@sidebar-light-bg, 3%);
|
||||
}
|
||||
}
|
||||
// Active state
|
||||
&.active {
|
||||
> a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: @sidebar-light-bg;
|
||||
color: #111;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Heading & subheading
|
||||
.control-sidebar-heading,
|
||||
.control-sidebar-subheading {
|
||||
color: #111;
|
||||
}
|
||||
// Sidebar list
|
||||
.control-sidebar-menu {
|
||||
margin-left: -14px;
|
||||
> li {
|
||||
> a {
|
||||
&:hover {
|
||||
background: @sidebar-light-hover-bg;
|
||||
}
|
||||
.menu-info {
|
||||
> p {
|
||||
color: lighten(@sidebar-light-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
174
build/less/core.less
Normal file
174
build/less/core.less
Normal file
@@ -0,0 +1,174 @@
|
||||
/*
|
||||
* Core: General Layout Style
|
||||
* -------------------------
|
||||
*/
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
.layout-boxed & {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
font-weight: 400;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* Layout */
|
||||
.wrapper {
|
||||
.clearfix();
|
||||
height: 100%;
|
||||
position: relative;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
.layout-boxed & {
|
||||
max-width: 1250px;
|
||||
margin: 0 auto;
|
||||
min-height: 100%;
|
||||
box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-boxed {
|
||||
background: url('@{boxed-layout-bg-image-path}') repeat fixed;
|
||||
}
|
||||
|
||||
/*
|
||||
* Content Wrapper - contains the main content
|
||||
*/
|
||||
.content-wrapper,
|
||||
.main-footer {
|
||||
// Using disposable variable to join statements with a comma
|
||||
@transition-rule: @transition-speed @transition-fn,
|
||||
margin @transition-speed @transition-fn;
|
||||
.transition-transform(@transition-rule);
|
||||
margin-left: @sidebar-width;
|
||||
z-index: 820;
|
||||
// Top nav layout
|
||||
.layout-top-nav & {
|
||||
margin-left: 0;
|
||||
}
|
||||
@media (max-width: @screen-xs-max) {
|
||||
margin-left: 0;
|
||||
}
|
||||
// When opening the sidebar on large screens
|
||||
.sidebar-collapse & {
|
||||
@media (min-width: @screen-sm) {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
// When opening the sidebar on small screens
|
||||
.sidebar-open & {
|
||||
@media (max-width: @screen-xs-max) {
|
||||
.translate(@sidebar-width, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-wrapper {
|
||||
min-height: 100%;
|
||||
background-color: @body-bg;
|
||||
z-index: 800;
|
||||
}
|
||||
|
||||
.main-footer {
|
||||
background: #fff;
|
||||
padding: 15px;
|
||||
color: #444;
|
||||
border-top: 1px solid @gray-lte;
|
||||
}
|
||||
|
||||
/* Fixed layout */
|
||||
.fixed {
|
||||
.main-header,
|
||||
.main-sidebar,
|
||||
.left-side {
|
||||
position: fixed;
|
||||
}
|
||||
.main-header {
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
}
|
||||
.content-wrapper,
|
||||
.right-side {
|
||||
padding-top: 50px;
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
padding-top: 100px;
|
||||
}
|
||||
}
|
||||
&.layout-boxed {
|
||||
.wrapper {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
.wrapper {
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.hold-transition {
|
||||
.content-wrapper,
|
||||
.right-side,
|
||||
.main-footer,
|
||||
.main-sidebar,
|
||||
.left-side,
|
||||
.main-header .navbar,
|
||||
.main-header .logo,
|
||||
.menu-open .fa-angle-left {
|
||||
/* Fix for IE */
|
||||
.transition(none);
|
||||
}
|
||||
}
|
||||
|
||||
/* Content */
|
||||
.content {
|
||||
min-height: 250px;
|
||||
padding: 15px;
|
||||
.container-fixed(@grid-gutter-width);
|
||||
}
|
||||
|
||||
/* H1 - H6 font */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6 {
|
||||
font-family: 'Source Sans Pro', sans-serif;
|
||||
}
|
||||
|
||||
/* General Links */
|
||||
a {
|
||||
color: @link-color;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:active,
|
||||
a:focus {
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
color: @link-hover-color;
|
||||
}
|
||||
|
||||
/* Page Header */
|
||||
.page-header {
|
||||
margin: 10px 0 20px 0;
|
||||
font-size: 22px;
|
||||
|
||||
> small {
|
||||
color: #666;
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
22
build/less/datepicker.less
Normal file
22
build/less/datepicker.less
Normal file
@@ -0,0 +1,22 @@
|
||||
.box {
|
||||
.datepicker-inline {
|
||||
&,
|
||||
.datepicker-days {
|
||||
&,
|
||||
> table {
|
||||
width: 100%;
|
||||
td {
|
||||
&:hover {
|
||||
background-color: rgba(255, 255, 255, .3);
|
||||
}
|
||||
&.day {
|
||||
&.old,
|
||||
&.new {
|
||||
color: #777;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
194
build/less/direct-chat.less
Normal file
194
build/less/direct-chat.less
Normal file
@@ -0,0 +1,194 @@
|
||||
/*
|
||||
* Component: Direct Chat
|
||||
* ----------------------
|
||||
*/
|
||||
.direct-chat {
|
||||
.box-body {
|
||||
.border-bottom-radius(0);
|
||||
position: relative;
|
||||
overflow-x: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
&.chat-pane-open {
|
||||
.direct-chat-contacts {
|
||||
.translate(0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.direct-chat-messages {
|
||||
.translate(0, 0);
|
||||
padding: 10px;
|
||||
height: 250px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.direct-chat-msg,
|
||||
.direct-chat-text {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.direct-chat-msg {
|
||||
.clearfix();
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.direct-chat-messages,
|
||||
.direct-chat-contacts {
|
||||
.transition-transform(.5s ease-in-out);
|
||||
}
|
||||
|
||||
.direct-chat-text {
|
||||
.border-radius(5px);
|
||||
position: relative;
|
||||
padding: 5px 10px;
|
||||
background: @direct-chat-default-msg-bg;
|
||||
border: 1px solid @direct-chat-default-msg-border-color;
|
||||
margin: 5px 0 0 50px;
|
||||
color: @direct-chat-default-font-color;
|
||||
|
||||
//Create the arrow
|
||||
&:after,
|
||||
&:before {
|
||||
position: absolute;
|
||||
right: 100%;
|
||||
top: 15px;
|
||||
border: solid transparent;
|
||||
border-right-color: @direct-chat-default-msg-border-color;
|
||||
content: ' ';
|
||||
height: 0;
|
||||
width: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&:after {
|
||||
border-width: 5px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
&:before {
|
||||
border-width: 6px;
|
||||
margin-top: -6px;
|
||||
}
|
||||
.right & {
|
||||
margin-right: 50px;
|
||||
margin-left: 0;
|
||||
&:after,
|
||||
&:before {
|
||||
right: auto;
|
||||
left: 100%;
|
||||
border-right-color: transparent;
|
||||
border-left-color: @direct-chat-default-msg-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.direct-chat-img {
|
||||
.border-radius(50%);
|
||||
float: left;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
.right & {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.direct-chat-info {
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.direct-chat-name {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.direct-chat-timestamp {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
//Direct chat contacts pane
|
||||
.direct-chat-contacts-open {
|
||||
.direct-chat-contacts {
|
||||
.translate(0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.direct-chat-contacts {
|
||||
.translate(101%, 0);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
height: 250px;
|
||||
width: 100%;
|
||||
background: #222d32;
|
||||
color: #fff;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
//Contacts list -- for displaying contacts in direct chat contacts pane
|
||||
.contacts-list {
|
||||
&:extend(.list-unstyled);
|
||||
> li {
|
||||
.clearfix();
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
||||
padding: 10px;
|
||||
margin: 0;
|
||||
&:last-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contacts-list-img {
|
||||
.border-radius(50%);
|
||||
width: 40px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.contacts-list-info {
|
||||
margin-left: 45px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.contacts-list-name,
|
||||
.contacts-list-status {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.contacts-list-name {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.contacts-list-status {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.contacts-list-date {
|
||||
color: #aaa;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.contacts-list-msg {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
//Direct Chat Variants
|
||||
.direct-chat-danger {
|
||||
.direct-chat-variant(@red);
|
||||
}
|
||||
|
||||
.direct-chat-primary {
|
||||
.direct-chat-variant(@light-blue);
|
||||
}
|
||||
|
||||
.direct-chat-warning {
|
||||
.direct-chat-variant(@yellow);
|
||||
}
|
||||
|
||||
.direct-chat-info {
|
||||
.direct-chat-variant(@aqua);
|
||||
}
|
||||
|
||||
.direct-chat-success {
|
||||
.direct-chat-variant(@green);
|
||||
}
|
||||
350
build/less/dropdown.less
Normal file
350
build/less/dropdown.less
Normal file
@@ -0,0 +1,350 @@
|
||||
/*
|
||||
* Component: Dropdown menus
|
||||
* -------------------------
|
||||
*/
|
||||
|
||||
/*Dropdowns in general*/
|
||||
.dropdown-menu {
|
||||
box-shadow: none;
|
||||
border-color: #eee;
|
||||
> li > a {
|
||||
color: #777;
|
||||
}
|
||||
> li > a > .glyphicon,
|
||||
> li > a > .fa,
|
||||
> li > a > .ion {
|
||||
margin-right: 10px;
|
||||
}
|
||||
> li > a:hover {
|
||||
background-color: lighten(@gray-lte, 5%);
|
||||
color: #333;
|
||||
}
|
||||
> .divider {
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
|
||||
//Navbar custom dropdown menu
|
||||
.navbar-nav > .notifications-menu,
|
||||
.navbar-nav > .messages-menu,
|
||||
.navbar-nav > .tasks-menu {
|
||||
//fix width and padding
|
||||
> .dropdown-menu {
|
||||
> li {
|
||||
position: relative;
|
||||
}
|
||||
width: 280px;
|
||||
//Remove padding and margins
|
||||
padding: 0 0 0 0;
|
||||
margin: 0;
|
||||
top: 100%;
|
||||
}
|
||||
//Define header class
|
||||
> .dropdown-menu > li.header {
|
||||
.border-radius(4px; 4px; 0; 0);
|
||||
background-color: #ffffff;
|
||||
padding: 7px 10px;
|
||||
border-bottom: 1px solid #f4f4f4;
|
||||
color: #444444;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
//Define footer class
|
||||
> .dropdown-menu > li.footer > a {
|
||||
.border-radius(0; 0; 4px; 4px);
|
||||
font-size: 12px;
|
||||
background-color: #fff;
|
||||
padding: 7px 10px;
|
||||
border-bottom: 1px solid #eeeeee;
|
||||
color: #444 !important;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
background: #fff !important;
|
||||
color: #444 !important;
|
||||
}
|
||||
text-align: center;
|
||||
//Hover state
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
//Clear inner menu padding and margins
|
||||
> .dropdown-menu > li .menu {
|
||||
max-height: 200px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
overflow-x: hidden;
|
||||
> li > a {
|
||||
display: block;
|
||||
white-space: nowrap; /* Prevent text from breaking */
|
||||
border-bottom: 1px solid #f4f4f4;
|
||||
// Hove state
|
||||
&:hover {
|
||||
background: #f4f4f4;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Notifications menu
|
||||
.navbar-nav > .notifications-menu {
|
||||
> .dropdown-menu > li .menu {
|
||||
// Links inside the menu
|
||||
> li > a {
|
||||
color: #444444;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding: 10px;
|
||||
// Icons inside the menu
|
||||
> .glyphicon,
|
||||
> .fa,
|
||||
> .ion {
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//Messages menu
|
||||
.navbar-nav > .messages-menu {
|
||||
//Inner menu
|
||||
> .dropdown-menu > li .menu {
|
||||
// Messages menu item
|
||||
> li > a {
|
||||
margin: 0;
|
||||
//line-height: 20px;
|
||||
padding: 10px 10px;
|
||||
// User image
|
||||
> div > img {
|
||||
margin: auto 10px auto auto;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
// Message heading
|
||||
> h4 {
|
||||
padding: 0;
|
||||
margin: 0 0 0 45px;
|
||||
color: #444444;
|
||||
font-size: 15px;
|
||||
position: relative;
|
||||
// Small for message time display
|
||||
> small {
|
||||
color: #999999;
|
||||
font-size: 10px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
> p {
|
||||
margin: 0 0 0 45px;
|
||||
font-size: 12px;
|
||||
color: #888888;
|
||||
}
|
||||
|
||||
.clearfix();
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//Tasks menu
|
||||
.navbar-nav > .tasks-menu {
|
||||
> .dropdown-menu > li .menu {
|
||||
> li > a {
|
||||
padding: 10px;
|
||||
|
||||
> h3 {
|
||||
font-size: 14px;
|
||||
padding: 0;
|
||||
margin: 0 0 10px 0;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
> .progress {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//User menu
|
||||
.navbar-nav > .user-menu {
|
||||
> .dropdown-menu {
|
||||
.border-top-radius(0);
|
||||
padding: 1px 0 0 0;
|
||||
border-top-width: 0;
|
||||
width: 280px;
|
||||
|
||||
&,
|
||||
> .user-body {
|
||||
.border-bottom-radius(4px);
|
||||
}
|
||||
// Header menu
|
||||
> li.user-header {
|
||||
height: 175px;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
// User image
|
||||
> img {
|
||||
z-index: 5;
|
||||
height: 90px;
|
||||
width: 90px;
|
||||
border: 3px solid;
|
||||
border-color: transparent;
|
||||
border-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
> p {
|
||||
z-index: 5;
|
||||
color: #fff;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 17px;
|
||||
//text-shadow: 2px 2px 3px #333333;
|
||||
margin-top: 10px;
|
||||
> small {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Menu Body
|
||||
> .user-body {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #f4f4f4;
|
||||
border-top: 1px solid #dddddd;
|
||||
.clearfix();
|
||||
a {
|
||||
color: #444 !important;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
background: #fff !important;
|
||||
color: #444 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Menu Footer
|
||||
> .user-footer {
|
||||
background-color: #f9f9f9;
|
||||
padding: 10px;
|
||||
.clearfix();
|
||||
.btn-default {
|
||||
color: #666666;
|
||||
&:hover {
|
||||
@media (max-width: @screen-sm-max) {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.user-image {
|
||||
float: left;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
margin-top: -2px;
|
||||
@media (max-width: @screen-xs-max) {
|
||||
float: none;
|
||||
margin-right: 0;
|
||||
margin-top: -8px;
|
||||
line-height: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Add fade animation to dropdown menus by appending
|
||||
the class .animated-dropdown-menu to the .dropdown-menu ul (or ol)*/
|
||||
.open:not(.dropup) > .animated-dropdown-menu {
|
||||
backface-visibility: visible !important;
|
||||
.animation(flipInX .7s both);
|
||||
|
||||
}
|
||||
|
||||
@keyframes flipInX {
|
||||
0% {
|
||||
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
||||
transition-timing-function: ease-in;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
40% {
|
||||
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
||||
transition-timing-function: ease-in;
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
80% {
|
||||
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: perspective(400px);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes flipInX {
|
||||
0% {
|
||||
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
||||
-webkit-transition-timing-function: ease-in;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
40% {
|
||||
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
||||
-webkit-transition-timing-function: ease-in;
|
||||
}
|
||||
|
||||
60% {
|
||||
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
80% {
|
||||
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: perspective(400px);
|
||||
}
|
||||
}
|
||||
|
||||
/* Fix dropdown menu in navbars */
|
||||
.navbar-custom-menu > .navbar-nav {
|
||||
> li {
|
||||
position: relative;
|
||||
> .dropdown-menu {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-sm-max) {
|
||||
.navbar-custom-menu > .navbar-nav {
|
||||
float: right;
|
||||
> li {
|
||||
position: static;
|
||||
> .dropdown-menu {
|
||||
position: absolute;
|
||||
right: 5%;
|
||||
left: auto;
|
||||
border: 1px solid #ddd;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
108
build/less/forms.less
Normal file
108
build/less/forms.less
Normal file
@@ -0,0 +1,108 @@
|
||||
/*
|
||||
* Component: Form
|
||||
* ---------------
|
||||
*/
|
||||
.form-control {
|
||||
.border-radius(@input-radius);
|
||||
box-shadow: none;
|
||||
border-color: @gray-lte;
|
||||
&:focus {
|
||||
border-color: @light-blue;
|
||||
box-shadow: none;
|
||||
}
|
||||
&::-moz-placeholder,
|
||||
&:-ms-input-placeholder,
|
||||
&::-webkit-input-placeholder {
|
||||
color: #bbb;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&:not(select) {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
}
|
||||
|
||||
.form-group {
|
||||
&.has-success {
|
||||
label {
|
||||
color: @green;
|
||||
}
|
||||
.form-control,
|
||||
.input-group-addon {
|
||||
border-color: @green;
|
||||
box-shadow: none;
|
||||
}
|
||||
.help-block {
|
||||
color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
&.has-warning {
|
||||
label {
|
||||
color: @yellow;
|
||||
}
|
||||
.form-control,
|
||||
.input-group-addon {
|
||||
border-color: @yellow;
|
||||
box-shadow: none;
|
||||
}
|
||||
.help-block {
|
||||
color: @yellow;
|
||||
}
|
||||
}
|
||||
|
||||
&.has-error {
|
||||
label {
|
||||
color: @red;
|
||||
}
|
||||
.form-control,
|
||||
.input-group-addon {
|
||||
border-color: @red;
|
||||
box-shadow: none;
|
||||
}
|
||||
.help-block {
|
||||
color: @red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Input group */
|
||||
.input-group {
|
||||
.input-group-addon {
|
||||
.border-radius(@input-radius);
|
||||
border-color: @gray-lte;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
/* button groups */
|
||||
.btn-group-vertical {
|
||||
.btn {
|
||||
&.btn-flat:first-of-type, &.btn-flat:last-of-type {
|
||||
.border-radius(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icheck > label {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
/* support Font Awesome icons in form-control */
|
||||
.form-control-feedback.fa {
|
||||
line-height: @input-height-base;
|
||||
}
|
||||
|
||||
.input-lg + .form-control-feedback.fa,
|
||||
.input-group-lg + .form-control-feedback.fa,
|
||||
.form-group-lg .form-control + .form-control-feedback.fa {
|
||||
line-height: @input-height-large;
|
||||
}
|
||||
|
||||
.input-sm + .form-control-feedback.fa,
|
||||
.input-group-sm + .form-control-feedback.fa,
|
||||
.form-group-sm .form-control + .form-control-feedback.fa {
|
||||
line-height: @input-height-small;
|
||||
}
|
||||
106
build/less/fullcalendar.less
Normal file
106
build/less/fullcalendar.less
Normal file
@@ -0,0 +1,106 @@
|
||||
/*
|
||||
* Plugin: Full Calendar
|
||||
* ---------------------
|
||||
*/
|
||||
// Import variables and mixins as a reference for separate plugins version
|
||||
@import (reference) "../../bower_components/bootstrap/less/mixins";
|
||||
@import (reference) "../../bower_components/bootstrap/less/variables";
|
||||
@import (reference) "variables";
|
||||
@import (reference) "mixins";
|
||||
|
||||
// Fullcalendar buttons
|
||||
.fc-button {
|
||||
background: #f4f4f4;
|
||||
background-image: none;
|
||||
color: #444;
|
||||
border-color: #ddd;
|
||||
border-bottom-color: #ddd;
|
||||
&:hover,
|
||||
&:active,
|
||||
&.hover {
|
||||
background-color: #e9e9e9;
|
||||
}
|
||||
}
|
||||
|
||||
// Calendar title
|
||||
.fc-header-title h2 {
|
||||
font-size: 15px;
|
||||
line-height: 1.6em;
|
||||
color: #666;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.fc-header-right {
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.fc-header-left {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
// Calendar table header cells
|
||||
.fc-widget-header {
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.fc-grid {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.fc-widget-header:first-of-type,
|
||||
.fc-widget-content:first-of-type {
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.fc-widget-header:last-of-type,
|
||||
.fc-widget-content:last-of-type {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
padding: @box-padding;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.fc-day-number {
|
||||
font-size: 20px;
|
||||
font-weight: 300;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.fc-color-picker {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
> li {
|
||||
float: left;
|
||||
font-size: 30px;
|
||||
margin-right: 5px;
|
||||
line-height: 30px;
|
||||
.fa {
|
||||
.transition-transform(linear .3s);
|
||||
&:hover {
|
||||
.rotate(30deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#add-new-event {
|
||||
.transition(all linear .3s);
|
||||
}
|
||||
|
||||
.external-event {
|
||||
padding: 5px 10px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
box-shadow: @box-boxshadow;
|
||||
text-shadow: @box-boxshadow;
|
||||
border-radius: @box-border-radius;
|
||||
cursor: move;
|
||||
&:hover {
|
||||
box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
248
build/less/header.less
Normal file
248
build/less/header.less
Normal file
@@ -0,0 +1,248 @@
|
||||
/*
|
||||
* Component: Main Header
|
||||
* ----------------------
|
||||
*/
|
||||
|
||||
.main-header {
|
||||
position: relative;
|
||||
max-height: 100px;
|
||||
z-index: 1030;
|
||||
//Navbar
|
||||
.navbar {
|
||||
.transition(margin-left @transition-speed @transition-fn);
|
||||
margin-bottom: 0;
|
||||
margin-left: @sidebar-width;
|
||||
border: none;
|
||||
min-height: @navbar-height;
|
||||
border-radius: 0;
|
||||
.layout-top-nav & {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
//Navbar search text input
|
||||
#navbar-search-input.form-control {
|
||||
background: rgba(255, 255, 255, .2);
|
||||
border-color: transparent;
|
||||
&:focus,
|
||||
&:active {
|
||||
border-color: rgba(0, 0, 0, .1);
|
||||
background: rgba(255, 255, 255, .9);
|
||||
}
|
||||
&::-moz-placeholder {
|
||||
color: #ccc;
|
||||
opacity: 1;
|
||||
}
|
||||
&:-ms-input-placeholder {
|
||||
color: #ccc;
|
||||
}
|
||||
&::-webkit-input-placeholder {
|
||||
color: #ccc;
|
||||
}
|
||||
}
|
||||
//Navbar Right Menu
|
||||
.navbar-custom-menu,
|
||||
.navbar-right {
|
||||
float: right;
|
||||
@media (max-width: @screen-sm-max) {
|
||||
a {
|
||||
color: inherit;
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.navbar-right {
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
float: none;
|
||||
.navbar-collapse & {
|
||||
margin: 7.5px -15px;
|
||||
}
|
||||
|
||||
> li {
|
||||
color: inherit;
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
//Navbar toggle button
|
||||
.sidebar-toggle {
|
||||
float: left;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
padding: @navbar-padding-vertical @navbar-padding-horizontal;
|
||||
//Add the fontawesome bars icon
|
||||
font-family: fontAwesome;
|
||||
&:before {
|
||||
content: "\f0c9";
|
||||
}
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
&:focus,
|
||||
&:active {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
.sidebar-toggle .icon-bar {
|
||||
display: none;
|
||||
}
|
||||
//Navbar User Menu
|
||||
.navbar .nav > li.user > a {
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
//Labels in navbar
|
||||
.navbar .nav > li > a > .label {
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
right: 7px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
padding: 2px 3px;
|
||||
line-height: .9;
|
||||
}
|
||||
|
||||
//Logo bar
|
||||
.logo {
|
||||
.transition(width @transition-speed @transition-fn);
|
||||
display: block;
|
||||
float: left;
|
||||
height: @navbar-height;
|
||||
font-size: 20px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
width: @sidebar-width;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
padding: 0 15px;
|
||||
font-weight: 300;
|
||||
overflow: hidden;
|
||||
//Add support to sidebar mini by allowing the user to create
|
||||
//2 logo designs. mini and lg
|
||||
.logo-lg {
|
||||
//should be visibile when sidebar isn't collapsed
|
||||
display: block;
|
||||
}
|
||||
.logo-mini {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
//Navbar Brand. Alternative logo with layout-top-nav
|
||||
.navbar-brand {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
// Content Header
|
||||
.content-header {
|
||||
position: relative;
|
||||
padding: 15px 15px 0 15px;
|
||||
// Header Text
|
||||
> h1 {
|
||||
margin: 0;
|
||||
font-size: 24px;
|
||||
> small {
|
||||
font-size: 15px;
|
||||
display: inline-block;
|
||||
padding-left: 4px;
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
> .breadcrumb {
|
||||
float: right;
|
||||
background: transparent;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
padding: 7px 5px;
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 10px;
|
||||
.border-radius(2px);
|
||||
> li > a {
|
||||
color: #444;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
> .fa, > .glyphicon, > .ion {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
> li + li:before {
|
||||
content: '>\00a0';
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-sm-max) {
|
||||
> .breadcrumb {
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
top: 0;
|
||||
right: 0;
|
||||
float: none;
|
||||
background: @gray-lte;
|
||||
padding-left: 10px;
|
||||
li:before {
|
||||
color: darken(@gray-lte, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-toggle {
|
||||
color: #fff;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: @navbar-padding-vertical @navbar-padding-horizontal;
|
||||
}
|
||||
|
||||
//Control navbar scaffolding on x-small screens
|
||||
@media (max-width: @screen-sm-max) {
|
||||
.navbar-custom-menu .navbar-nav > li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
//Dont't let links get full width
|
||||
.navbar-custom-menu .navbar-nav {
|
||||
margin: 0;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.navbar-custom-menu .navbar-nav > li > a {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
// Collapse header
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.main-header {
|
||||
position: relative;
|
||||
.logo,
|
||||
.navbar {
|
||||
width: 100%;
|
||||
float: none;
|
||||
}
|
||||
.navbar {
|
||||
margin: 0;
|
||||
}
|
||||
.navbar-custom-menu {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-collapse.pull-left {
|
||||
@media (max-width: @screen-sm-max) {
|
||||
float: none !important;
|
||||
+ .navbar-custom-menu {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
75
build/less/info-box.less
Normal file
75
build/less/info-box.less
Normal file
@@ -0,0 +1,75 @@
|
||||
/*
|
||||
* Component: Info Box
|
||||
* -------------------
|
||||
*/
|
||||
.info-box {
|
||||
display: block;
|
||||
min-height: 90px;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
box-shadow: @box-boxshadow;
|
||||
.border-radius(2px);
|
||||
margin-bottom: 15px;
|
||||
small {
|
||||
font-size: 14px;
|
||||
}
|
||||
.progress {
|
||||
background: rgba(0, 0, 0, .2);
|
||||
margin: 5px -10px 5px -10px;
|
||||
height: 2px;
|
||||
&,
|
||||
& .progress-bar {
|
||||
.border-radius(0);
|
||||
}
|
||||
.progress-bar {
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.info-box-icon {
|
||||
.border-radius(2px; 0; 2px; 0);
|
||||
display: block;
|
||||
float: left;
|
||||
height: 90px;
|
||||
width: 90px;
|
||||
text-align: center;
|
||||
font-size: 45px;
|
||||
line-height: 90px;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
> img {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.info-box-content {
|
||||
padding: 5px 10px;
|
||||
margin-left: 90px;
|
||||
}
|
||||
|
||||
.info-box-number {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.progress-description,
|
||||
.info-box-text {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.info-box-text {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.info-box-more {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.progress-description {
|
||||
margin: 0;
|
||||
}
|
||||
16
build/less/invoice.less
Normal file
16
build/less/invoice.less
Normal file
@@ -0,0 +1,16 @@
|
||||
/*
|
||||
* Page: Invoice
|
||||
* -------------
|
||||
*/
|
||||
|
||||
.invoice {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
border: 1px solid #f4f4f4;
|
||||
padding: 20px;
|
||||
margin: 10px 25px;
|
||||
}
|
||||
|
||||
.invoice-title {
|
||||
margin-top: 0;
|
||||
}
|
||||
28
build/less/labels.less
Normal file
28
build/less/labels.less
Normal file
@@ -0,0 +1,28 @@
|
||||
/*
|
||||
* Component: Label
|
||||
* ----------------
|
||||
*/
|
||||
.label-default {
|
||||
background-color: @gray-lte;
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.label-danger {
|
||||
&:extend(.bg-red);
|
||||
}
|
||||
|
||||
.label-info {
|
||||
&:extend(.bg-aqua);
|
||||
}
|
||||
|
||||
.label-warning {
|
||||
&:extend(.bg-yellow);
|
||||
}
|
||||
|
||||
.label-primary {
|
||||
&:extend(.bg-light-blue);
|
||||
}
|
||||
|
||||
.label-success {
|
||||
&:extend(.bg-green);
|
||||
}
|
||||
73
build/less/lockscreen.less
Normal file
73
build/less/lockscreen.less
Normal file
@@ -0,0 +1,73 @@
|
||||
/*
|
||||
* Page: Lock Screen
|
||||
* -----------------
|
||||
*/
|
||||
/* ADD THIS CLASS TO THE <BODY> TAG */
|
||||
.lockscreen {
|
||||
background: @gray-lte;
|
||||
}
|
||||
|
||||
.lockscreen-logo {
|
||||
font-size: 35px;
|
||||
text-align: center;
|
||||
margin-bottom: 25px;
|
||||
font-weight: 300;
|
||||
a {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
|
||||
.lockscreen-wrapper {
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
margin-top: 10%;
|
||||
}
|
||||
|
||||
/* User name [optional] */
|
||||
.lockscreen .lockscreen-name {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Will contain the image and the sign in form */
|
||||
.lockscreen-item {
|
||||
.border-radius(4px);
|
||||
padding: 0;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
margin: 10px auto 30px auto;
|
||||
width: 290px;
|
||||
}
|
||||
|
||||
/* User image */
|
||||
.lockscreen-image {
|
||||
.border-radius(50%);
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: -25px;
|
||||
background: #fff;
|
||||
padding: 5px;
|
||||
z-index: 10;
|
||||
> img {
|
||||
.border-radius(50%);
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Contains the password input and the login button */
|
||||
.lockscreen-credentials {
|
||||
margin-left: 70px;
|
||||
.form-control {
|
||||
border: 0;
|
||||
}
|
||||
.btn {
|
||||
background-color: #fff;
|
||||
border: 0;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.lockscreen-footer {
|
||||
margin-top: 10px;
|
||||
}
|
||||
52
build/less/login_and_register.less
Normal file
52
build/less/login_and_register.less
Normal file
@@ -0,0 +1,52 @@
|
||||
/*
|
||||
* Page: Login & Register
|
||||
* ----------------------
|
||||
*/
|
||||
|
||||
.login-logo,
|
||||
.register-logo {
|
||||
font-size: 35px;
|
||||
text-align: center;
|
||||
margin-bottom: 25px;
|
||||
font-weight: 300;
|
||||
a {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
|
||||
.login-page,
|
||||
.register-page {
|
||||
background: @gray-lte;
|
||||
}
|
||||
|
||||
.login-box,
|
||||
.register-box {
|
||||
width: 360px;
|
||||
margin: 7% auto;
|
||||
@media (max-width: @screen-sm) {
|
||||
width: 90%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-box-body,
|
||||
.register-box-body {
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
border-top: 0;
|
||||
color: #666;
|
||||
.form-control-feedback {
|
||||
color: #777;
|
||||
}
|
||||
}
|
||||
|
||||
.login-box-msg,
|
||||
.register-box-msg {
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
padding: 0 20px 20px 20px;
|
||||
}
|
||||
|
||||
.social-auth-links {
|
||||
margin: 10px 0;
|
||||
}
|
||||
88
build/less/mailbox.less
Normal file
88
build/less/mailbox.less
Normal file
@@ -0,0 +1,88 @@
|
||||
/*
|
||||
* Page: Mailbox
|
||||
* -------------
|
||||
*/
|
||||
.mailbox-messages {
|
||||
> .table {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mailbox-controls {
|
||||
padding: 5px;
|
||||
&.with-border {
|
||||
border-bottom: 1px solid @box-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mailbox-read-info {
|
||||
border-bottom: 1px solid @box-border-color;
|
||||
padding: 10px;
|
||||
h3 {
|
||||
font-size: 20px;
|
||||
margin: 0;
|
||||
}
|
||||
h5 {
|
||||
margin: 0;
|
||||
padding: 5px 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mailbox-read-time {
|
||||
color: #999;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.mailbox-read-message {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.mailbox-attachments {
|
||||
&:extend(.list-unstyled);
|
||||
li {
|
||||
float: left;
|
||||
width: 200px;
|
||||
border: 1px solid #eee;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.mailbox-attachment-name {
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.mailbox-attachment-icon,
|
||||
.mailbox-attachment-info,
|
||||
.mailbox-attachment-size {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.mailbox-attachment-info {
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
.mailbox-attachment-size {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.mailbox-attachment-icon {
|
||||
text-align: center;
|
||||
font-size: 65px;
|
||||
color: #666;
|
||||
padding: 20px 10px;
|
||||
&.has-img {
|
||||
padding: 0;
|
||||
> img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mailbox-attachment-close {
|
||||
&:extend(.close);
|
||||
}
|
||||
606
build/less/miscellaneous.less
Normal file
606
build/less/miscellaneous.less
Normal file
@@ -0,0 +1,606 @@
|
||||
/*
|
||||
* General: Miscellaneous
|
||||
* ----------------------
|
||||
*/
|
||||
// 10px padding and margins
|
||||
.pad {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.margin {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.margin-bottom {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.margin-bottom-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.margin-r-5 {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
// Display inline
|
||||
.inline {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
// Description Blocks
|
||||
.description-block {
|
||||
display: block;
|
||||
margin: 10px 0;
|
||||
text-align: center;
|
||||
&.margin-bottom {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
> .description-header {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
}
|
||||
> .description-text {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
// Background colors
|
||||
.bg-red,
|
||||
.bg-yellow,
|
||||
.bg-aqua,
|
||||
.bg-blue,
|
||||
.bg-light-blue,
|
||||
.bg-green,
|
||||
.bg-navy,
|
||||
.bg-teal,
|
||||
.bg-olive,
|
||||
.bg-lime,
|
||||
.bg-orange,
|
||||
.bg-fuchsia,
|
||||
.bg-purple,
|
||||
.bg-maroon,
|
||||
.bg-black,
|
||||
.bg-red-active,
|
||||
.bg-yellow-active,
|
||||
.bg-aqua-active,
|
||||
.bg-blue-active,
|
||||
.bg-light-blue-active,
|
||||
.bg-green-active,
|
||||
.bg-navy-active,
|
||||
.bg-teal-active,
|
||||
.bg-olive-active,
|
||||
.bg-lime-active,
|
||||
.bg-orange-active,
|
||||
.bg-fuchsia-active,
|
||||
.bg-purple-active,
|
||||
.bg-maroon-active,
|
||||
.bg-black-active {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.bg-gray {
|
||||
color: #000;
|
||||
background-color: @gray-lte !important;
|
||||
}
|
||||
|
||||
.bg-gray-light {
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
.bg-black {
|
||||
background-color: @black !important;
|
||||
}
|
||||
|
||||
.bg-red {
|
||||
background-color: @red !important;
|
||||
}
|
||||
|
||||
.bg-yellow {
|
||||
background-color: @yellow !important;
|
||||
}
|
||||
|
||||
.bg-aqua {
|
||||
background-color: @aqua !important;
|
||||
}
|
||||
|
||||
.bg-blue {
|
||||
background-color: @blue !important;
|
||||
}
|
||||
|
||||
.bg-light-blue {
|
||||
background-color: @light-blue !important;
|
||||
}
|
||||
|
||||
.bg-green {
|
||||
background-color: @green !important;
|
||||
}
|
||||
|
||||
.bg-navy {
|
||||
background-color: @navy !important;
|
||||
}
|
||||
|
||||
.bg-teal {
|
||||
background-color: @teal !important;
|
||||
}
|
||||
|
||||
.bg-olive {
|
||||
background-color: @olive !important;
|
||||
}
|
||||
|
||||
.bg-lime {
|
||||
background-color: @lime !important;
|
||||
}
|
||||
|
||||
.bg-orange {
|
||||
background-color: @orange !important;
|
||||
}
|
||||
|
||||
.bg-fuchsia {
|
||||
background-color: @fuchsia !important;
|
||||
}
|
||||
|
||||
.bg-purple {
|
||||
background-color: @purple !important;
|
||||
}
|
||||
|
||||
.bg-maroon {
|
||||
background-color: @maroon !important;
|
||||
}
|
||||
|
||||
//Set of Active Background Colors
|
||||
.bg-gray-active {
|
||||
color: #000;
|
||||
background-color: darken(@gray-lte, 10%) !important;
|
||||
}
|
||||
|
||||
.bg-black-active {
|
||||
background-color: darken(@black, 10%) !important;
|
||||
}
|
||||
|
||||
.bg-red-active {
|
||||
background-color: darken(@red , 6%) !important;
|
||||
}
|
||||
|
||||
.bg-yellow-active {
|
||||
background-color: darken(@yellow , 6%) !important;
|
||||
}
|
||||
|
||||
.bg-aqua-active {
|
||||
background-color: darken(@aqua , 6%) !important;
|
||||
}
|
||||
|
||||
.bg-blue-active {
|
||||
background-color: darken(@blue , 10%) !important;
|
||||
}
|
||||
|
||||
.bg-light-blue-active {
|
||||
background-color: darken(@light-blue , 6%) !important;
|
||||
}
|
||||
|
||||
.bg-green-active {
|
||||
background-color: darken(@green , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-navy-active {
|
||||
background-color: darken(@navy , 2%) !important;
|
||||
}
|
||||
|
||||
.bg-teal-active {
|
||||
background-color: darken(@teal , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-olive-active {
|
||||
background-color: darken(@olive , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-lime-active {
|
||||
background-color: darken(@lime , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-orange-active {
|
||||
background-color: darken(@orange , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-fuchsia-active {
|
||||
background-color: darken(@fuchsia , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-purple-active {
|
||||
background-color: darken(@purple , 5%) !important;
|
||||
}
|
||||
|
||||
.bg-maroon-active {
|
||||
background-color: darken(@maroon , 3%) !important;
|
||||
}
|
||||
|
||||
//Disabled!
|
||||
[class^="bg-"].disabled {
|
||||
.opacity(.65);
|
||||
}
|
||||
|
||||
// Text colors
|
||||
.text-red {
|
||||
color: @red !important;
|
||||
}
|
||||
|
||||
.text-yellow {
|
||||
color: @yellow !important;
|
||||
}
|
||||
|
||||
.text-aqua {
|
||||
color: @aqua !important;
|
||||
}
|
||||
|
||||
.text-blue {
|
||||
color: @blue !important;
|
||||
}
|
||||
|
||||
.text-black {
|
||||
color: @black !important;
|
||||
}
|
||||
|
||||
.text-light-blue {
|
||||
color: @light-blue !important;
|
||||
}
|
||||
|
||||
.text-green {
|
||||
color: @green !important;
|
||||
}
|
||||
|
||||
.text-gray {
|
||||
color: @gray-lte !important;
|
||||
}
|
||||
|
||||
.text-navy {
|
||||
color: @navy !important;
|
||||
}
|
||||
|
||||
.text-teal {
|
||||
color: @teal !important;
|
||||
}
|
||||
|
||||
.text-olive {
|
||||
color: @olive !important;
|
||||
}
|
||||
|
||||
.text-lime {
|
||||
color: @lime !important;
|
||||
}
|
||||
|
||||
.text-orange {
|
||||
color: @orange !important;
|
||||
}
|
||||
|
||||
.text-fuchsia {
|
||||
color: @fuchsia !important;
|
||||
}
|
||||
|
||||
.text-purple {
|
||||
color: @purple !important;
|
||||
}
|
||||
|
||||
.text-maroon {
|
||||
color: @maroon !important;
|
||||
}
|
||||
|
||||
.link-muted {
|
||||
color: darken(@gray-lte, 30%);
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: darken(@gray-lte, 40%);
|
||||
}
|
||||
}
|
||||
|
||||
.link-black {
|
||||
color: #666;
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
// Hide elements by display none only
|
||||
.hide {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
// Remove borders
|
||||
.no-border {
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
// Remove padding
|
||||
.no-padding {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
// Remove margins
|
||||
.no-margin {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
// Remove box shadow
|
||||
.no-shadow {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
// Unstyled List
|
||||
.list-unstyled {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.list-group-unbordered {
|
||||
> .list-group-item {
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-radius: 0;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Remove border radius
|
||||
.flat {
|
||||
.border-radius(0) !important;
|
||||
}
|
||||
|
||||
.text-bold {
|
||||
&, &.table td, &.table th {
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.text-sm {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
// _fix for sparkline tooltip
|
||||
.jqstooltip {
|
||||
padding: 5px !important;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
// Gradient Background colors
|
||||
.bg-teal-gradient {
|
||||
.gradient(@teal; @teal; lighten(@teal, 16%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-light-blue-gradient {
|
||||
.gradient(@light-blue; @light-blue; lighten(@light-blue, 12%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-blue-gradient {
|
||||
.gradient(@blue; @blue; lighten(@blue, 7%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-aqua-gradient {
|
||||
.gradient(@aqua; @aqua; lighten(@aqua, 7%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-yellow-gradient {
|
||||
.gradient(@yellow; @yellow; lighten(@yellow, 16%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-purple-gradient {
|
||||
.gradient(@purple; @purple; lighten(@purple, 16%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-green-gradient {
|
||||
.gradient(@green; @green; lighten(@green, 7%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-red-gradient {
|
||||
.gradient(@red; @red; lighten(@red, 10%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-black-gradient {
|
||||
.gradient(@black; @black; lighten(@black, 10%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bg-maroon-gradient {
|
||||
.gradient(@maroon; @maroon; lighten(@maroon, 10%)) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
//Description Block Extension
|
||||
.description-block {
|
||||
.description-icon {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
//Remove top padding
|
||||
.no-pad-top {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
//Make position static
|
||||
.position-static {
|
||||
position: static !important;
|
||||
}
|
||||
|
||||
//List utility classes
|
||||
.list-header {
|
||||
font-size: 15px;
|
||||
padding: 10px 4px;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.list-seperator {
|
||||
height: 1px;
|
||||
background: @box-border-color;
|
||||
margin: 15px 0 9px 0;
|
||||
}
|
||||
|
||||
.list-link {
|
||||
> a {
|
||||
padding: 4px;
|
||||
color: #777;
|
||||
&:hover {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Light font weight
|
||||
.font-light {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
//User block
|
||||
.user-block {
|
||||
.clearfix();
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
float: left;
|
||||
}
|
||||
.username,
|
||||
.description,
|
||||
.comment {
|
||||
display: block;
|
||||
margin-left: 50px;
|
||||
}
|
||||
.username {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.description {
|
||||
color: #999;
|
||||
font-size: 13px;
|
||||
}
|
||||
&.user-block-sm {
|
||||
img {
|
||||
&:extend(.img-sm);
|
||||
}
|
||||
.username,
|
||||
.description,
|
||||
.comment {
|
||||
margin-left: 40px;
|
||||
}
|
||||
.username {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Image sizes
|
||||
.img-sm,
|
||||
.img-md,
|
||||
.img-lg {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.img-sm {
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
+ .img-push {
|
||||
margin-left: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.img-md {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
+ .img-push {
|
||||
margin-left: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
.img-lg {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
+ .img-push {
|
||||
margin-left: 110px;
|
||||
}
|
||||
}
|
||||
|
||||
// Image bordered
|
||||
.img-bordered {
|
||||
border: 3px solid @gray-lte;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.img-bordered-sm {
|
||||
border: 2px solid @gray-lte;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
//General attachemnt block
|
||||
.attachment-block {
|
||||
border: 1px solid @box-border-color;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
background: #f7f7f7;
|
||||
|
||||
.attachment-img {
|
||||
max-width: 100px;
|
||||
max-height: 100px;
|
||||
height: auto;
|
||||
float: left;
|
||||
}
|
||||
.attachment-pushed {
|
||||
margin-left: 110px;
|
||||
}
|
||||
.attachment-heading {
|
||||
margin: 0;
|
||||
}
|
||||
.attachment-text {
|
||||
color: #555;
|
||||
}
|
||||
}
|
||||
|
||||
.connectedSortable {
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.ui-helper-hidden-accessible {
|
||||
border: 0;
|
||||
clip: rect(0 0 0 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.sort-highlight {
|
||||
background: #f4f4f4;
|
||||
border: 1px dashed #ddd;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.full-opacity-hover {
|
||||
.opacity(.65);
|
||||
&:hover {
|
||||
.opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
// Charts
|
||||
.chart {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
svg,
|
||||
canvas {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
312
build/less/mixins.less
Normal file
312
build/less/mixins.less
Normal file
@@ -0,0 +1,312 @@
|
||||
//AdminLTE mixins
|
||||
//===============
|
||||
|
||||
//Changes the color and the hovering properties of the navbar
|
||||
.navbar-variant(@color; @font-color: rgba(255, 255, 255, 0.8); @hover-color: #f6f6f6; @hover-bg: rgba(0, 0, 0, 0.1)) {
|
||||
background-color: @color;
|
||||
//Navbar links
|
||||
.nav > li > a {
|
||||
color: @font-color;
|
||||
}
|
||||
|
||||
.nav > li > a:hover,
|
||||
.nav > li > a:active,
|
||||
.nav > li > a:focus,
|
||||
.nav .open > a,
|
||||
.nav .open > a:hover,
|
||||
.nav .open > a:focus,
|
||||
.nav > .active > a {
|
||||
background: @hover-bg;
|
||||
color: @hover-color;
|
||||
}
|
||||
|
||||
//Add color to the sidebar toggle button
|
||||
.sidebar-toggle {
|
||||
color: @font-color;
|
||||
&:hover {
|
||||
color: @hover-color;
|
||||
background: @hover-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Logo color variation
|
||||
.logo-variant(@bg-color; @color: #fff; @border-bottom-color: transparent; @border-bottom-width: 0) {
|
||||
background-color: @bg-color;
|
||||
color: @color;
|
||||
border-bottom: @border-bottom-width solid @border-bottom-color;
|
||||
|
||||
&:hover {
|
||||
background-color: darken(@bg-color, 1%);
|
||||
}
|
||||
}
|
||||
|
||||
//Box solid color variantion creator
|
||||
.box-solid-variant(@color; @text-color: #fff) {
|
||||
border: 1px solid @color;
|
||||
> .box-header {
|
||||
color: @text-color;
|
||||
background: @color;
|
||||
background-color: @color;
|
||||
a,
|
||||
.btn {
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Direct Chat Variant
|
||||
.direct-chat-variant(@bg-color; @color: #fff) {
|
||||
.right > .direct-chat-text {
|
||||
background: @bg-color;
|
||||
border-color: @bg-color;
|
||||
color: @color;
|
||||
&:after,
|
||||
&:before {
|
||||
border-left-color: @bg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//border radius creator
|
||||
.border-radius(@radius) {
|
||||
border-radius: @radius;
|
||||
}
|
||||
|
||||
//Different radius each side
|
||||
.border-radius(@top-left, @top-right, @bottom-left, @bottom-right)
|
||||
{
|
||||
border-top-left-radius: @top-left;
|
||||
border-top-right-radius: @top-right;
|
||||
border-bottom-right-radius: @bottom-right;
|
||||
border-bottom-left-radius: @bottom-left;
|
||||
}
|
||||
|
||||
//Gradient background
|
||||
.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) {
|
||||
background: @color;
|
||||
background: -webkit-gradient(linear,
|
||||
left bottom,
|
||||
left top,
|
||||
color-stop(0, @start),
|
||||
color-stop(1, @stop));
|
||||
background: -ms-linear-gradient(bottom,
|
||||
@start,
|
||||
@stop);
|
||||
background: -moz-linear-gradient(center bottom,
|
||||
@start 0%,
|
||||
@stop 100%);
|
||||
background: -o-linear-gradient(@stop,
|
||||
@start);
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start));
|
||||
}
|
||||
|
||||
//Added 2.1.0
|
||||
//Skins Mixins
|
||||
|
||||
//Dark Sidebar Mixin
|
||||
.skin-dark-sidebar(@link-hover-border-color) {
|
||||
// Sidebar background color (Both .wrapper and .left-side are responsible for sidebar bg color)
|
||||
.wrapper,
|
||||
.main-sidebar,
|
||||
.left-side {
|
||||
background-color: @sidebar-dark-bg;
|
||||
}
|
||||
//User Panel (resides in the sidebar)
|
||||
.user-panel {
|
||||
> .info, > .info > a {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
//Sidebar Menu. First level links
|
||||
.sidebar-menu > li {
|
||||
//Section Headning
|
||||
&.header {
|
||||
color: lighten(@sidebar-dark-bg, 20%);
|
||||
background: darken(@sidebar-dark-bg, 4%);
|
||||
}
|
||||
//links
|
||||
> a {
|
||||
border-left: 3px solid transparent;
|
||||
}
|
||||
//Hover and active states
|
||||
&:hover > a,
|
||||
&.active > a,
|
||||
&.menu-open > a {
|
||||
color: @sidebar-dark-hover-color;
|
||||
background: @sidebar-dark-hover-bg;
|
||||
}
|
||||
&.active > a {
|
||||
border-left-color: @link-hover-border-color;
|
||||
}
|
||||
//First Level Submenu
|
||||
> .treeview-menu {
|
||||
margin: 0 1px;
|
||||
background: @sidebar-dark-submenu-bg;
|
||||
}
|
||||
}
|
||||
//All links within the sidebar menu
|
||||
.sidebar a {
|
||||
color: @sidebar-dark-color;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
//All submenus
|
||||
.sidebar-menu .treeview-menu {
|
||||
> li {
|
||||
> a {
|
||||
color: @sidebar-dark-submenu-color;
|
||||
}
|
||||
&.active > a, > a:hover {
|
||||
color: @sidebar-dark-submenu-hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
//The sidebar search form
|
||||
.sidebar-form {
|
||||
.border-radius(3px);
|
||||
border: 1px solid lighten(@sidebar-dark-bg, 10%);
|
||||
margin: 10px 10px;
|
||||
input[type="text"], .btn {
|
||||
box-shadow: none;
|
||||
background-color: lighten(@sidebar-dark-bg, 10%);
|
||||
border: 1px solid transparent;
|
||||
height: 35px;
|
||||
//.transition(all @transition-speed @transition-fn);
|
||||
}
|
||||
input[type="text"] {
|
||||
color: #666;
|
||||
.border-radius(2px, 0, 2px, 0);
|
||||
&:focus,
|
||||
&:focus + .input-group-btn .btn {
|
||||
background-color: #fff;
|
||||
color: #666;
|
||||
}
|
||||
&:focus + .input-group-btn .btn {
|
||||
border-left-color: #fff;
|
||||
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
color: #999;
|
||||
.border-radius(0, 2px, 0, 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Light Sidebar Mixin
|
||||
.skin-light-sidebar(@icon-active-color) {
|
||||
// Sidebar background color (Both .wrapper and .left-side are responsible for sidebar bg color)
|
||||
.wrapper,
|
||||
.main-sidebar,
|
||||
.left-side {
|
||||
background-color: @sidebar-light-bg;
|
||||
}
|
||||
.content-wrapper,
|
||||
.main-footer {
|
||||
//border-left: 1px solid @gray-lte;
|
||||
}
|
||||
.main-sidebar {
|
||||
border-right: 1px solid @gray-lte;
|
||||
}
|
||||
//User Panel (resides in the sidebar)
|
||||
.user-panel {
|
||||
> .info, > .info > a {
|
||||
color: @sidebar-light-color;
|
||||
}
|
||||
}
|
||||
//Sidebar Menu. First level links
|
||||
.sidebar-menu > li {
|
||||
.transition(border-left-color .3s ease);
|
||||
//border-left: 3px solid transparent;
|
||||
//Section Headning
|
||||
&.header {
|
||||
color: lighten(@sidebar-light-color, 25%);
|
||||
background: @sidebar-light-bg;
|
||||
}
|
||||
//links
|
||||
> a {
|
||||
border-left: 3px solid transparent;
|
||||
font-weight: 600;
|
||||
}
|
||||
//Hover and active states
|
||||
&:hover > a,
|
||||
&.active > a {
|
||||
color: @sidebar-light-hover-color;
|
||||
background: @sidebar-light-hover-bg;
|
||||
}
|
||||
&:hover > a {
|
||||
|
||||
}
|
||||
&.active {
|
||||
border-left-color: @icon-active-color;
|
||||
> a {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
//First Level Submenu
|
||||
> .treeview-menu {
|
||||
background: @sidebar-light-submenu-bg;
|
||||
}
|
||||
}
|
||||
//All links within the sidebar menu
|
||||
.sidebar a {
|
||||
color: @sidebar-light-color;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
//All submenus
|
||||
.sidebar-menu .treeview-menu {
|
||||
> li {
|
||||
> a {
|
||||
color: @sidebar-light-submenu-color;
|
||||
}
|
||||
&.active > a,
|
||||
> a:hover {
|
||||
color: @sidebar-light-submenu-hover-color;
|
||||
}
|
||||
&.active > a {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
//The sidebar search form
|
||||
.sidebar-form {
|
||||
.border-radius(3px);
|
||||
border: 1px solid @gray-lte; //darken(@sidebar-light-bg, 5%);
|
||||
margin: 10px 10px;
|
||||
input[type="text"],
|
||||
.btn {
|
||||
box-shadow: none;
|
||||
background-color: #fff; //darken(@sidebar-light-bg, 3%);
|
||||
border: 1px solid transparent;
|
||||
height: 35px;
|
||||
//.transition(all @transition-speed @transition-fn);
|
||||
}
|
||||
input[type="text"] {
|
||||
color: #666;
|
||||
.border-radius(2px, 0, 2px, 0);
|
||||
&:focus,
|
||||
&:focus + .input-group-btn .btn {
|
||||
background-color: #fff;
|
||||
color: #666;
|
||||
}
|
||||
&:focus + .input-group-btn .btn {
|
||||
border-left-color: #fff;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
color: #999;
|
||||
.border-radius(0, 2px, 0, 2px);
|
||||
}
|
||||
}
|
||||
@media (min-width: @screen-sm-min) {
|
||||
&.sidebar-mini.sidebar-collapse {
|
||||
.sidebar-menu > li > .treeview-menu {
|
||||
border-left: 1px solid @gray-lte;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
80
build/less/modal.less
Normal file
80
build/less/modal.less
Normal file
@@ -0,0 +1,80 @@
|
||||
/*
|
||||
* Component: modal
|
||||
* ----------------
|
||||
*/
|
||||
.modal {
|
||||
background: rgba(0, 0, 0, .3);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
.border-radius(0);
|
||||
.box-shadow(0 2px 3px rgba(0, 0, 0, .125));
|
||||
border: 0;
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.box-shadow(0 2px 3px rgba(0, 0, 0, .125));
|
||||
}
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
border-bottom-color: @box-border-color;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
border-top-color: @box-border-color;
|
||||
}
|
||||
|
||||
//Modal variants
|
||||
.modal-primary {
|
||||
.modal-body {
|
||||
&:extend(.bg-light-blue);
|
||||
}
|
||||
.modal-header,
|
||||
.modal-footer {
|
||||
&:extend(.bg-light-blue-active);
|
||||
border-color: darken(@light-blue, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-warning {
|
||||
.modal-body {
|
||||
&:extend(.bg-yellow);
|
||||
}
|
||||
.modal-header,
|
||||
.modal-footer {
|
||||
&:extend(.bg-yellow-active);
|
||||
border-color: darken(@yellow, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-info {
|
||||
.modal-body {
|
||||
&:extend(.bg-aqua);
|
||||
}
|
||||
.modal-header,
|
||||
.modal-footer {
|
||||
&:extend(.bg-aqua-active);
|
||||
border-color: darken(@aqua, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-success {
|
||||
.modal-body {
|
||||
&:extend(.bg-green);
|
||||
}
|
||||
.modal-header,
|
||||
.modal-footer {
|
||||
&:extend(.bg-green-active);
|
||||
border-color: darken(@green, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-danger {
|
||||
.modal-body {
|
||||
&:extend(.bg-red);
|
||||
}
|
||||
.modal-header,
|
||||
.modal-footer {
|
||||
&:extend(.bg-red-active);
|
||||
border-color: darken(@red, 10%);
|
||||
}
|
||||
}
|
||||
232
build/less/navs.less
Normal file
232
build/less/navs.less
Normal file
@@ -0,0 +1,232 @@
|
||||
/*
|
||||
* Component: Nav
|
||||
* --------------
|
||||
*/
|
||||
|
||||
.nav {
|
||||
> li > a:hover,
|
||||
> li > a:active,
|
||||
> li > a:focus {
|
||||
color: #444;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
}
|
||||
|
||||
/* NAV PILLS */
|
||||
.nav-pills {
|
||||
> li > a {
|
||||
.border-radius(0);
|
||||
border-top: 3px solid transparent;
|
||||
color: #444;
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
> li.active > a,
|
||||
> li.active > a:hover,
|
||||
> li.active > a:focus {
|
||||
border-top-color: @light-blue;
|
||||
}
|
||||
> li.active > a {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
/* NAV STACKED */
|
||||
.nav-stacked {
|
||||
> li > a {
|
||||
.border-radius(0);
|
||||
border-top: 0;
|
||||
border-left: 3px solid transparent;
|
||||
color: #444;
|
||||
}
|
||||
> li.active > a,
|
||||
> li.active > a:hover {
|
||||
background: transparent;
|
||||
color: #444;
|
||||
border-top: 0;
|
||||
border-left-color: @light-blue;
|
||||
}
|
||||
|
||||
> li.header {
|
||||
border-bottom: 1px solid #ddd;
|
||||
color: #777;
|
||||
margin-bottom: 10px;
|
||||
padding: 5px 10px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
/* NAV TABS */
|
||||
.nav-tabs-custom {
|
||||
margin-bottom: 20px;
|
||||
background: #fff;
|
||||
box-shadow: @box-boxshadow;
|
||||
border-radius: @box-border-radius;
|
||||
> .nav-tabs {
|
||||
margin: 0;
|
||||
border-bottom-color: #f4f4f4;
|
||||
|
||||
.border-top-radius(@box-border-radius);
|
||||
> li {
|
||||
border-top: 3px solid transparent;
|
||||
margin-bottom: -2px;
|
||||
|
||||
&.disabled > a {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
> a {
|
||||
color: #444;
|
||||
.border-radius(0);
|
||||
&.text-muted {
|
||||
color: #999;
|
||||
}
|
||||
&,
|
||||
&:hover {
|
||||
background: transparent;
|
||||
margin: 0;
|
||||
}
|
||||
&:hover {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
&:not(.active) {
|
||||
> a:hover,
|
||||
> a:focus,
|
||||
> a:active {
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
> li.active {
|
||||
border-top-color: @light-blue;
|
||||
& > a,
|
||||
&:hover > a {
|
||||
background-color: #fff;
|
||||
color: #444;
|
||||
}
|
||||
> a {
|
||||
border-top-color: transparent;
|
||||
border-left-color: #f4f4f4;
|
||||
border-right-color: #f4f4f4;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
> li:first-of-type {
|
||||
margin-left: 0;
|
||||
&.active {
|
||||
> a {
|
||||
border-left-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Pulled to the right
|
||||
&.pull-right {
|
||||
float: none !important;
|
||||
> li {
|
||||
float: right;
|
||||
}
|
||||
> li:first-of-type {
|
||||
margin-right: 0;
|
||||
> a {
|
||||
border-left-width: 1px;
|
||||
}
|
||||
&.active {
|
||||
> a {
|
||||
border-left-color: #f4f4f4;
|
||||
border-right-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> li.header {
|
||||
line-height: 35px;
|
||||
padding: 0 10px;
|
||||
font-size: 20px;
|
||||
color: #444;
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .tab-content {
|
||||
background: #fff;
|
||||
padding: 10px;
|
||||
.border-bottom-radius(@box-border-radius);
|
||||
}
|
||||
|
||||
.dropdown.open > a {
|
||||
&:active,
|
||||
&:focus {
|
||||
background: transparent;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
// Tab color variations
|
||||
&.tab-primary {
|
||||
> .nav-tabs {
|
||||
> li.active {
|
||||
border-top-color: @light-blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.tab-info {
|
||||
> .nav-tabs {
|
||||
> li.active {
|
||||
border-top-color: @aqua;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.tab-danger {
|
||||
> .nav-tabs {
|
||||
> li.active {
|
||||
border-top-color: @red;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.tab-warning {
|
||||
> .nav-tabs {
|
||||
> li.active {
|
||||
border-top-color: @yellow;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.tab-success {
|
||||
> .nav-tabs {
|
||||
> li.active {
|
||||
border-top-color: @green;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.tab-default {
|
||||
> .nav-tabs {
|
||||
> li.active {
|
||||
border-top-color: @gray-lte;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* PAGINATION */
|
||||
.pagination {
|
||||
> li > a {
|
||||
background: #fafafa;
|
||||
color: #666;
|
||||
}
|
||||
&.pagination-flat {
|
||||
> li > a {
|
||||
.border-radius(0) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
5
build/less/plugins.less
Normal file
5
build/less/plugins.less
Normal file
@@ -0,0 +1,5 @@
|
||||
// Customized third-party plugins
|
||||
@import "bootstrap-social.less";
|
||||
@import "fullcalendar.less";
|
||||
@import "select2.less";
|
||||
@import "datepicker";
|
||||
54
build/less/print.less
Normal file
54
build/less/print.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Misc: print
|
||||
* -----------
|
||||
*/
|
||||
@media print {
|
||||
//Add to elements that you do not want to show when printing
|
||||
.no-print {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
//Elements that we want to hide when printing
|
||||
.main-sidebar,
|
||||
.left-side,
|
||||
.main-header,
|
||||
.content-header {
|
||||
&:extend(.no-print);
|
||||
}
|
||||
|
||||
//This is the only element that should appear, so let's remove the margins
|
||||
.content-wrapper,
|
||||
.right-side,
|
||||
.main-footer {
|
||||
margin-left: 0 !important;
|
||||
min-height: 0 !important;
|
||||
.translate(0, 0) !important;
|
||||
}
|
||||
|
||||
.fixed .content-wrapper,
|
||||
.fixed .right-side {
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
|
||||
//Invoice printing
|
||||
.invoice {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.invoice-col {
|
||||
float: left;
|
||||
width: 33.3333333%;
|
||||
}
|
||||
|
||||
//Make sure table content displays properly
|
||||
.table-responsive {
|
||||
overflow: auto;
|
||||
> .table tr th,
|
||||
> .table tr td {
|
||||
white-space: normal !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
45
build/less/products.less
Normal file
45
build/less/products.less
Normal file
@@ -0,0 +1,45 @@
|
||||
/*
|
||||
* Component: Products List
|
||||
* ------------------------
|
||||
*/
|
||||
.products-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
> .item {
|
||||
.border-radius(@box-border-radius);
|
||||
.box-shadow(@box-boxshadow);
|
||||
.clearfix();
|
||||
padding: 10px 0;
|
||||
background: #fff;
|
||||
}
|
||||
.product-img {
|
||||
float: left;
|
||||
img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
.product-info {
|
||||
margin-left: 60px;
|
||||
}
|
||||
.product-title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.product-description {
|
||||
display: block;
|
||||
color: #999;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.product-list-in-box > .item {
|
||||
.box-shadow(none);
|
||||
.border-radius(0);
|
||||
border-bottom: 1px solid @box-border-color;
|
||||
&:last-of-type {
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
}
|
||||
31
build/less/profile.less
Normal file
31
build/less/profile.less
Normal file
@@ -0,0 +1,31 @@
|
||||
/*
|
||||
* Page: Profile
|
||||
* -------------
|
||||
*/
|
||||
|
||||
.profile-user-img {
|
||||
margin: 0 auto;
|
||||
width: 100px;
|
||||
padding: 3px;
|
||||
border: 3px solid @gray-lte;
|
||||
}
|
||||
|
||||
.profile-username {
|
||||
font-size: 21px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.post {
|
||||
border-bottom: 1px solid @gray-lte;
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 15px;
|
||||
color: #666;
|
||||
&:last-of-type {
|
||||
border-bottom: 0;
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.user-block {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
111
build/less/progress-bars.less
Normal file
111
build/less/progress-bars.less
Normal file
@@ -0,0 +1,111 @@
|
||||
/*
|
||||
* Component: Progress Bar
|
||||
* -----------------------
|
||||
*/
|
||||
|
||||
//General CSS
|
||||
.progress,
|
||||
.progress > .progress-bar {
|
||||
.box-shadow(none);
|
||||
&, .progress-bar {
|
||||
.border-radius(@progress-bar-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
/* size variation */
|
||||
.progress.sm,
|
||||
.progress-sm {
|
||||
height: 10px;
|
||||
&, .progress-bar {
|
||||
.border-radius(@progress-bar-sm-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
.progress.xs,
|
||||
.progress-xs {
|
||||
height: 7px;
|
||||
&, .progress-bar {
|
||||
.border-radius(@progress-bar-xs-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
.progress.xxs,
|
||||
.progress-xxs {
|
||||
height: 3px;
|
||||
&, .progress-bar {
|
||||
.border-radius(@progress-bar-xs-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
/* Vertical bars */
|
||||
.progress.vertical {
|
||||
position: relative;
|
||||
width: 30px;
|
||||
height: 200px;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
> .progress-bar {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
//Sizes
|
||||
&.sm,
|
||||
&.progress-sm {
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
&.xs,
|
||||
&.progress-xs {
|
||||
width: 10px;
|
||||
}
|
||||
&.xxs,
|
||||
&.progress-xxs {
|
||||
width: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
//Progress Groups
|
||||
.progress-group {
|
||||
.progress-text {
|
||||
font-weight: 600;
|
||||
}
|
||||
.progress-number {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
/* Remove margins from progress bars when put in a table */
|
||||
.table {
|
||||
tr > td .progress {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Variations
|
||||
// -------------------------
|
||||
.progress-bar-light-blue,
|
||||
.progress-bar-primary {
|
||||
.progress-bar-variant(@light-blue);
|
||||
}
|
||||
|
||||
.progress-bar-green,
|
||||
.progress-bar-success {
|
||||
.progress-bar-variant(@green);
|
||||
}
|
||||
|
||||
.progress-bar-aqua,
|
||||
.progress-bar-info {
|
||||
.progress-bar-variant(@aqua);
|
||||
}
|
||||
|
||||
.progress-bar-yellow,
|
||||
.progress-bar-warning {
|
||||
.progress-bar-variant(@yellow);
|
||||
}
|
||||
|
||||
.progress-bar-red,
|
||||
.progress-bar-danger {
|
||||
.progress-bar-variant(@red);
|
||||
}
|
||||
127
build/less/select2.less
Normal file
127
build/less/select2.less
Normal file
@@ -0,0 +1,127 @@
|
||||
/*
|
||||
* Plugin: Select2
|
||||
* ---------------
|
||||
*/
|
||||
// Import variables and mixins as a reference for separate plugins version
|
||||
@import (reference) "../../bower_components/bootstrap/less/mixins";
|
||||
@import (reference) "../../bower_components/bootstrap/less/variables";
|
||||
@import (reference) "variables";
|
||||
@import (reference) "mixins";
|
||||
|
||||
//Signle select
|
||||
.select2-container--default,
|
||||
.select2-selection {
|
||||
&.select2-container--focus,
|
||||
&:focus,
|
||||
&:active {
|
||||
outline: none;
|
||||
}
|
||||
.select2-selection--single {
|
||||
border: 1px solid @gray-lte;
|
||||
border-radius: @input-radius;
|
||||
padding: 6px 12px;
|
||||
height: 34px;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--open {
|
||||
border-color: @light-blue;
|
||||
}
|
||||
|
||||
.select2-dropdown {
|
||||
border: 1px solid @gray-lte;
|
||||
border-radius: @input-radius;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: @light-blue;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.select2-results__option {
|
||||
padding: 6px 12px;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
.select2-container .select2-selection--single .select2-selection__rendered {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
height: auto;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
|
||||
padding-right: 6px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--single .select2-selection__arrow {
|
||||
height: 28px;
|
||||
right: 3px;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--single .select2-selection__arrow b {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.select2-dropdown,
|
||||
.select2-search--inline {
|
||||
.select2-search__field {
|
||||
border: 1px solid @gray-lte;
|
||||
&:focus {
|
||||
outline: none;
|
||||
//border: 1px solid @light-blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--focus .select2-selection--multiple,
|
||||
.select2-container--default .select2-search--dropdown .select2-search__field {
|
||||
border-color: @light-blue !important;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-disabled=true] {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true] {
|
||||
background-color: #ddd;
|
||||
&,
|
||||
&:hover {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
|
||||
//Multiple select
|
||||
.select2-container--default {
|
||||
.select2-selection--multiple {
|
||||
border: 1px solid @gray-lte;
|
||||
border-radius: @input-radius;
|
||||
&:focus {
|
||||
border-color: @light-blue;
|
||||
}
|
||||
}
|
||||
&.select2-container--focus .select2-selection--multiple {
|
||||
border-color: @gray-lte;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple .select2-selection__choice {
|
||||
background-color: @light-blue;
|
||||
border-color: darken(@light-blue, 5%);
|
||||
padding: 1px 10px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
|
||||
margin-right: 5px;
|
||||
color: rgba(255, 255, 255, .7);
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container .select2-selection--single .select2-selection__rendered {
|
||||
padding-right: 10px;
|
||||
}
|
||||
165
build/less/sidebar-mini.less
Normal file
165
build/less/sidebar-mini.less
Normal file
@@ -0,0 +1,165 @@
|
||||
/*
|
||||
* Component: Sidebar Mini
|
||||
*/
|
||||
|
||||
//Add sidebar-mini class to the body tag to activate this feature
|
||||
.sidebar-mini {
|
||||
//Sidebar mini should work only on devices larger than @screen-sm
|
||||
@media (min-width: @screen-sm) {
|
||||
//When the sidebar is collapsed...
|
||||
&.sidebar-collapse {
|
||||
|
||||
//Apply the new margining to the main content and footer
|
||||
.content-wrapper,
|
||||
.right-side,
|
||||
.main-footer {
|
||||
margin-left: 50px !important;
|
||||
z-index: 840;
|
||||
}
|
||||
|
||||
//Modify the sidebar to shrink instead of disappearing
|
||||
.main-sidebar {
|
||||
//Don't go away! Just shrink
|
||||
.translate(0, 0);
|
||||
width: 50px !important;
|
||||
z-index: 850;
|
||||
}
|
||||
|
||||
.sidebar-menu {
|
||||
> li {
|
||||
position: relative;
|
||||
> a {
|
||||
margin-right: 0;
|
||||
}
|
||||
> a > span {
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
|
||||
&:not(.treeview) {
|
||||
> a > span {
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
> .treeview-menu {
|
||||
// Add some padding to the treeview menu
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Make the sidebar links, menus, labels, badges
|
||||
//and angle icons disappear
|
||||
.main-sidebar .user-panel > .info,
|
||||
.sidebar-form,
|
||||
.sidebar-menu > li > a > span,
|
||||
.sidebar-menu > li > .treeview-menu,
|
||||
.sidebar-menu > li > a > .pull-right,
|
||||
.sidebar-menu li.header {
|
||||
display: none !important;
|
||||
-webkit-transform: translateZ(0);
|
||||
}
|
||||
|
||||
.main-header {
|
||||
//Let's make the logo also shrink and the mini logo to appear
|
||||
.logo {
|
||||
width: 50px;
|
||||
> .logo-mini {
|
||||
display: block;
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
font-size: 18px;
|
||||
}
|
||||
> .logo-lg {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
//Since the logo got smaller, we need to fix the navbar's position
|
||||
.navbar {
|
||||
margin-left: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Show menu items on hover
|
||||
.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse {
|
||||
.sidebar-menu > li:hover {
|
||||
> a {
|
||||
//overflow: visible;
|
||||
}
|
||||
> a > span:not(.pull-right), //:not(.pull-right-container),
|
||||
> .treeview-menu {
|
||||
display: block !important;
|
||||
position: absolute;
|
||||
width: @sidebar-width - 50;
|
||||
left: 50px;
|
||||
}
|
||||
|
||||
//position the header & treeview menus
|
||||
> a > span {
|
||||
top: 0;
|
||||
margin-left: -3px;
|
||||
padding: 12px 5px 12px 20px;
|
||||
background-color: inherit;
|
||||
}
|
||||
> a > .pull-right-container {
|
||||
//display: block!important;
|
||||
position: relative !important;
|
||||
float: right;
|
||||
width: auto !important;
|
||||
left: 200px - 20px !important;
|
||||
top: -22px !important;
|
||||
z-index: 900;
|
||||
> .label:not(:first-of-type) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
> .treeview-menu {
|
||||
top: 44px;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-expanded-on-hover {
|
||||
.main-footer,
|
||||
.content-wrapper {
|
||||
margin-left: 50px;
|
||||
}
|
||||
.main-sidebar {
|
||||
box-shadow: @sidebar-expanded-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
//A fix for text overflow while transitioning from sidebar mini to full sidebar
|
||||
.sidebar-menu,
|
||||
.main-sidebar .user-panel,
|
||||
.sidebar-menu > li.header {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidebar-menu:hover {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.sidebar-form,
|
||||
.sidebar-menu > li.header {
|
||||
overflow: hidden;
|
||||
text-overflow: clip;
|
||||
}
|
||||
|
||||
.sidebar-menu li > a {
|
||||
position: relative;
|
||||
> .pull-right-container {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 50%;
|
||||
margin-top: -7px;
|
||||
}
|
||||
}
|
||||
141
build/less/sidebar.less
Normal file
141
build/less/sidebar.less
Normal file
@@ -0,0 +1,141 @@
|
||||
/*
|
||||
* Component: Sidebar
|
||||
* ------------------
|
||||
*/
|
||||
// Main Sidebar
|
||||
.main-sidebar {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-top: 50px;
|
||||
min-height: 100%;
|
||||
width: @sidebar-width;
|
||||
z-index: 810;
|
||||
|
||||
// Using disposable variable to join statements with a comma
|
||||
@transition-rule: @transition-speed @transition-fn, width @transition-speed @transition-fn;
|
||||
.transition-transform(@transition-rule);
|
||||
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
padding-top: 100px;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
.translate(-@sidebar-width, 0);
|
||||
}
|
||||
|
||||
.sidebar-collapse & {
|
||||
@media (min-width: @screen-sm) {
|
||||
.translate(-@sidebar-width, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-open & {
|
||||
@media (max-width: @screen-xs-max) {
|
||||
.translate(0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
// Remove border from form
|
||||
.sidebar-form {
|
||||
input:focus {
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar user panel
|
||||
.user-panel {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
overflow: hidden;
|
||||
.clearfix();
|
||||
> .image > img {
|
||||
width: 100%;
|
||||
max-width: 45px;
|
||||
height: auto;
|
||||
}
|
||||
> .info {
|
||||
padding: 5px 5px 5px 15px;
|
||||
line-height: 1;
|
||||
position: absolute;
|
||||
left: 55px;
|
||||
> p {
|
||||
font-weight: 600;
|
||||
margin-bottom: 9px;
|
||||
}
|
||||
> a {
|
||||
text-decoration: none;
|
||||
padding-right: 5px;
|
||||
margin-top: 3px;
|
||||
font-size: 11px;
|
||||
> .fa,
|
||||
> .ion,
|
||||
> .glyphicon {
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar menu
|
||||
.sidebar-menu {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
//First Level
|
||||
> li {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
> a {
|
||||
padding: 12px 5px 12px 15px;
|
||||
display: block;
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
.label,
|
||||
.badge {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.badge {
|
||||
margin-top: 3px;
|
||||
}
|
||||
}
|
||||
li.header {
|
||||
padding: 10px 25px 10px 15px;
|
||||
font-size: 12px;
|
||||
}
|
||||
li > a > .fa-angle-left,
|
||||
li > a > .pull-right-container > .fa-angle-left {
|
||||
width: auto;
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin-right: 10px;
|
||||
.transition(transform .5s ease);
|
||||
}
|
||||
li > a > .fa-angle-left {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 10px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
.menu-open {
|
||||
> a > .fa-angle-left,
|
||||
> a > .pull-right-container > .fa-angle-left {
|
||||
.rotate(-90deg);
|
||||
}
|
||||
}
|
||||
.active > .treeview-menu {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
13
build/less/skins/_all-skins.less
Normal file
13
build/less/skins/_all-skins.less
Normal file
@@ -0,0 +1,13 @@
|
||||
//All skins in one file
|
||||
@import "skin-blue.less";
|
||||
@import "skin-blue-light.less";
|
||||
@import "skin-black.less";
|
||||
@import "skin-black-light.less";
|
||||
@import "skin-green.less";
|
||||
@import "skin-green-light.less";
|
||||
@import "skin-red.less";
|
||||
@import "skin-red-light.less";
|
||||
@import "skin-yellow.less";
|
||||
@import "skin-yellow-light.less";
|
||||
@import "skin-purple.less";
|
||||
@import "skin-purple-light.less";
|
||||
65
build/less/skins/skin-black-light.less
Normal file
65
build/less/skins/skin-black-light.less
Normal file
@@ -0,0 +1,65 @@
|
||||
/*
|
||||
* Skin: Black
|
||||
* -----------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
/* skin-black navbar */
|
||||
.skin-black-light {
|
||||
//Navbar & Logo
|
||||
.main-header {
|
||||
//.box-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
|
||||
border-bottom: 1px solid @gray-lte;
|
||||
.navbar-toggle {
|
||||
color: #333;
|
||||
}
|
||||
.navbar-brand {
|
||||
color: #333;
|
||||
border-right: 1px solid @gray-lte;
|
||||
}
|
||||
.navbar {
|
||||
.navbar-variant(#fff; #333; #999; #fff);
|
||||
> .sidebar-toggle {
|
||||
color: #333;
|
||||
border-right: 1px solid @gray-lte;
|
||||
}
|
||||
.navbar-nav {
|
||||
> li > a {
|
||||
border-right: 1px solid @gray-lte;
|
||||
}
|
||||
}
|
||||
.navbar-custom-menu .navbar-nav,
|
||||
.navbar-right {
|
||||
> li {
|
||||
> a {
|
||||
border-left: 1px solid @gray-lte;
|
||||
border-right-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
> .logo {
|
||||
.logo-variant(#fff; #333);
|
||||
border-right: 1px solid @gray-lte;
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.logo-variant(#222; #fff);
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
//Create the sidebar skin
|
||||
.skin-light-sidebar(#fff);
|
||||
}
|
||||
74
build/less/skins/skin-black.less
Normal file
74
build/less/skins/skin-black.less
Normal file
@@ -0,0 +1,74 @@
|
||||
/*
|
||||
* Skin: Black
|
||||
* -----------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
/* skin-black navbar */
|
||||
.skin-black {
|
||||
//Navbar & Logo
|
||||
.main-header {
|
||||
.box-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
|
||||
.navbar-toggle {
|
||||
color: #333;
|
||||
}
|
||||
.navbar-brand {
|
||||
color: #333;
|
||||
border-right: 1px solid #eee;
|
||||
}
|
||||
.navbar {
|
||||
.navbar-variant(#fff; #333; #999; #fff);
|
||||
> .sidebar-toggle {
|
||||
color: #333;
|
||||
border-right: 1px solid #eee;
|
||||
}
|
||||
.navbar-nav {
|
||||
> li > a {
|
||||
border-right: 1px solid #eee;
|
||||
}
|
||||
}
|
||||
.navbar-custom-menu .navbar-nav,
|
||||
.navbar-right {
|
||||
> li {
|
||||
> a {
|
||||
border-left: 1px solid #eee;
|
||||
border-right-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
> .logo {
|
||||
.logo-variant(#fff; #333);
|
||||
border-right: 1px solid #eee;
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.logo-variant(#222; #fff);
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
//Create the sidebar skin
|
||||
.skin-dark-sidebar(#fff);
|
||||
|
||||
.pace {
|
||||
.pace-progress {
|
||||
background: #222;
|
||||
}
|
||||
.pace-activity {
|
||||
border-top-color: #222;
|
||||
border-left-color: #222;
|
||||
}
|
||||
}
|
||||
}
|
||||
61
build/less/skins/skin-blue-light.less
Normal file
61
build/less/skins/skin-blue-light.less
Normal file
@@ -0,0 +1,61 @@
|
||||
/*
|
||||
* Skin: Blue
|
||||
* ----------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-blue-light {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@light-blue; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@light-blue, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@light-blue, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(@light-blue);
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @light-blue;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-light-sidebar(@light-blue);
|
||||
.main-footer {
|
||||
border-top-color: @gray-lte;
|
||||
}
|
||||
}
|
||||
|
||||
.skin-blue.layout-top-nav .main-header > .logo {
|
||||
.logo-variant(@light-blue);
|
||||
}
|
||||
58
build/less/skins/skin-blue.less
Normal file
58
build/less/skins/skin-blue.less
Normal file
@@ -0,0 +1,58 @@
|
||||
/*
|
||||
* Skin: Blue
|
||||
* ----------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-blue {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@light-blue; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@light-blue, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@light-blue, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(darken(@light-blue, 5%));
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @light-blue;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-dark-sidebar(@light-blue);
|
||||
}
|
||||
|
||||
.skin-blue.layout-top-nav .main-header > .logo {
|
||||
.logo-variant(@light-blue);
|
||||
}
|
||||
55
build/less/skins/skin-green-light.less
Normal file
55
build/less/skins/skin-green-light.less
Normal file
@@ -0,0 +1,55 @@
|
||||
/*
|
||||
* Skin: Green
|
||||
* -----------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-green-light {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@green; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@green, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@green, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(@green);
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-light-sidebar(@green);
|
||||
|
||||
}
|
||||
55
build/less/skins/skin-green.less
Normal file
55
build/less/skins/skin-green.less
Normal file
@@ -0,0 +1,55 @@
|
||||
/*
|
||||
* Skin: Green
|
||||
* -----------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-green {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@green; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@green, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@green, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(darken(@green, 5%));
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-dark-sidebar(@green);
|
||||
|
||||
}
|
||||
54
build/less/skins/skin-purple-light.less
Normal file
54
build/less/skins/skin-purple-light.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Skin: Purple
|
||||
* ------------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-purple-light {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@purple; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@purple, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@purple, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(@purple);
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @purple;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-light-sidebar(@purple);
|
||||
}
|
||||
54
build/less/skins/skin-purple.less
Normal file
54
build/less/skins/skin-purple.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Skin: Purple
|
||||
* ------------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-purple {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@purple; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@purple, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@purple, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(darken(@purple, 5%));
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @purple;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-dark-sidebar(@purple);
|
||||
}
|
||||
54
build/less/skins/skin-red-light.less
Normal file
54
build/less/skins/skin-red-light.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Skin: Red
|
||||
* ---------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-red-light {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@red; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@red, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@red, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(@red);
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @red;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-light-sidebar(@red);
|
||||
}
|
||||
54
build/less/skins/skin-red.less
Normal file
54
build/less/skins/skin-red.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Skin: Red
|
||||
* ---------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-red {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@red; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@red, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@red, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(darken(@red, 5%));
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @red;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-dark-sidebar(@red);
|
||||
}
|
||||
54
build/less/skins/skin-yellow-light.less
Normal file
54
build/less/skins/skin-yellow-light.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Skin: Yellow
|
||||
* ------------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-yellow-light {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@yellow; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@yellow, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@yellow, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(@yellow);
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @yellow;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-light-sidebar(@yellow);
|
||||
}
|
||||
54
build/less/skins/skin-yellow.less
Normal file
54
build/less/skins/skin-yellow.less
Normal file
@@ -0,0 +1,54 @@
|
||||
/*
|
||||
* Skin: Yellow
|
||||
* ------------
|
||||
*/
|
||||
@import "../../../bower_components/bootstrap/less/mixins.less";
|
||||
@import "../../../bower_components/bootstrap/less/variables.less";
|
||||
@import "../variables.less";
|
||||
@import "../mixins.less";
|
||||
|
||||
.skin-yellow {
|
||||
//Navbar
|
||||
.main-header {
|
||||
.navbar {
|
||||
.navbar-variant(@yellow; #fff);
|
||||
.sidebar-toggle {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: darken(@yellow, 5%);
|
||||
}
|
||||
}
|
||||
@media (max-width: @screen-header-collapse) {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
&.divider {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background: darken(@yellow, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
//Logo
|
||||
.logo {
|
||||
.logo-variant(darken(@yellow, 5%));
|
||||
}
|
||||
|
||||
li.user-header {
|
||||
background-color: @yellow;
|
||||
}
|
||||
}
|
||||
|
||||
//Content Header
|
||||
.content-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//Create the sidebar skin
|
||||
.skin-dark-sidebar(@yellow);
|
||||
}
|
||||
89
build/less/small-box.less
Normal file
89
build/less/small-box.less
Normal file
@@ -0,0 +1,89 @@
|
||||
/*
|
||||
* Component: Small Box
|
||||
* --------------------
|
||||
*/
|
||||
|
||||
.small-box {
|
||||
.border-radius(2px);
|
||||
position: relative;
|
||||
display: block;
|
||||
margin-bottom: 20px;
|
||||
box-shadow: @box-boxshadow;
|
||||
// content wrapper
|
||||
> .inner {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
> .small-box-footer {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 3px 0;
|
||||
color: #fff;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
display: block;
|
||||
z-index: 10;
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 38px;
|
||||
font-weight: bold;
|
||||
margin: 0 0 10px 0;
|
||||
white-space: nowrap;
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 15px;
|
||||
> small {
|
||||
display: block;
|
||||
color: #f9f9f9;
|
||||
font-size: 13px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
h3, p {
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
// the icon
|
||||
.icon {
|
||||
.transition(all @transition-speed linear);
|
||||
position: absolute;
|
||||
top: -10px;
|
||||
right: 10px;
|
||||
z-index: 0;
|
||||
font-size: 90px;
|
||||
color: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
// Small box hover state
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: #f9f9f9;
|
||||
// Animate icons on small box hover
|
||||
.icon {
|
||||
font-size: 95px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
// No need for icons on very small devices
|
||||
.small-box {
|
||||
text-align: center;
|
||||
.icon {
|
||||
display: none;
|
||||
}
|
||||
p {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
78
build/less/social-widgets.less
Normal file
78
build/less/social-widgets.less
Normal file
@@ -0,0 +1,78 @@
|
||||
/*
|
||||
* Component: Social Widgets
|
||||
* -------------------------
|
||||
*/
|
||||
//General widget style
|
||||
.box-widget {
|
||||
border: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
//User Widget Style 1
|
||||
.widget-user {
|
||||
//User name container
|
||||
.widget-user-header {
|
||||
padding: 20px;
|
||||
height: 120px;
|
||||
.border-top-radius(@box-border-radius);
|
||||
}
|
||||
//User name
|
||||
.widget-user-username {
|
||||
margin-top: 0;
|
||||
margin-bottom: 5px;
|
||||
font-size: 25px;
|
||||
font-weight: 300;
|
||||
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
//User single line description
|
||||
.widget-user-desc {
|
||||
margin-top: 0;
|
||||
}
|
||||
//User image container
|
||||
.widget-user-image {
|
||||
position: absolute;
|
||||
top: 65px;
|
||||
left: 50%;
|
||||
margin-left: -45px;
|
||||
> img {
|
||||
width: 90px;
|
||||
height: auto;
|
||||
border: 3px solid #fff;
|
||||
}
|
||||
}
|
||||
.box-footer {
|
||||
padding-top: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
//User Widget Style 2
|
||||
.widget-user-2 {
|
||||
//User name container
|
||||
.widget-user-header {
|
||||
padding: 20px;
|
||||
.border-top-radius(@box-border-radius);
|
||||
}
|
||||
//User name
|
||||
.widget-user-username {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
font-size: 25px;
|
||||
font-weight: 300;
|
||||
}
|
||||
//User single line description
|
||||
.widget-user-desc {
|
||||
margin-top: 0;
|
||||
}
|
||||
.widget-user-username,
|
||||
.widget-user-desc {
|
||||
margin-left: 75px;
|
||||
}
|
||||
//User image container
|
||||
.widget-user-image {
|
||||
> img {
|
||||
width: 65px;
|
||||
height: auto;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
71
build/less/table.less
Normal file
71
build/less/table.less
Normal file
@@ -0,0 +1,71 @@
|
||||
/*
|
||||
* Component: Table
|
||||
* ----------------
|
||||
*/
|
||||
|
||||
.table {
|
||||
//Cells
|
||||
> thead,
|
||||
> tbody,
|
||||
> tfoot {
|
||||
> tr {
|
||||
> th,
|
||||
> td {
|
||||
border-top: 1px solid @box-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
//thead cells
|
||||
> thead > tr > th {
|
||||
border-bottom: 2px solid @box-border-color;
|
||||
}
|
||||
//progress bars in tables
|
||||
tr td .progress {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
//Bordered Table
|
||||
.table-bordered {
|
||||
border: 1px solid @box-border-color;
|
||||
> thead,
|
||||
> tbody,
|
||||
> tfoot {
|
||||
> tr {
|
||||
> th,
|
||||
> td {
|
||||
border: 1px solid @box-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
> thead > tr {
|
||||
> th,
|
||||
> td {
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table.no-border {
|
||||
&,
|
||||
td,
|
||||
th {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* .text-center in tables */
|
||||
table.text-center {
|
||||
&, td, th {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.table.align {
|
||||
th {
|
||||
text-align: left;
|
||||
}
|
||||
td {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
110
build/less/timeline.less
Normal file
110
build/less/timeline.less
Normal file
@@ -0,0 +1,110 @@
|
||||
/*
|
||||
* Component: Timeline
|
||||
* -------------------
|
||||
*/
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
margin: 0 0 30px 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
// The line
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 4px;
|
||||
background: #ddd;
|
||||
left: 31px;
|
||||
margin: 0;
|
||||
.border-radius(2px);
|
||||
}
|
||||
|
||||
> li {
|
||||
position: relative;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 15px;
|
||||
.clearfix();
|
||||
|
||||
// The content
|
||||
> .timeline-item {
|
||||
.box-shadow(@box-boxshadow);
|
||||
.border-radius(@box-border-radius);
|
||||
margin-top: 0;
|
||||
background: #fff;
|
||||
color: #444;
|
||||
margin-left: 60px;
|
||||
margin-right: 15px;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
|
||||
// The time and header
|
||||
> .time {
|
||||
color: #999;
|
||||
float: right;
|
||||
padding: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
> .timeline-header {
|
||||
margin: 0;
|
||||
color: #555;
|
||||
border-bottom: 1px solid @box-border-color;
|
||||
padding: 10px;
|
||||
font-size: 16px;
|
||||
line-height: 1.1;
|
||||
> a {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
// Item body and footer
|
||||
> .timeline-body, > .timeline-footer {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// The icons
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-size: 15px;
|
||||
line-height: 30px;
|
||||
position: absolute;
|
||||
color: #666;
|
||||
background: @gray-lte;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
left: 18px;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Time label
|
||||
> .time-label {
|
||||
> span {
|
||||
font-weight: 600;
|
||||
padding: 5px;
|
||||
display: inline-block;
|
||||
background-color: #fff;
|
||||
|
||||
.border-radius(4px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.timeline-inverse {
|
||||
> li {
|
||||
> .timeline-item {
|
||||
background: #f0f0f0;
|
||||
border: 1px solid #ddd;
|
||||
.box-shadow(none);
|
||||
> .timeline-header {
|
||||
border-bottom-color: #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
30
build/less/treeview.less
Normal file
30
build/less/treeview.less
Normal file
@@ -0,0 +1,30 @@
|
||||
// Tree view menu
|
||||
.treeview-menu {
|
||||
display: none;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
padding-left: 5px;
|
||||
.treeview-menu {
|
||||
padding-left: 20px;
|
||||
}
|
||||
> li {
|
||||
margin: 0;
|
||||
> a {
|
||||
padding: 5px 5px 5px 15px;
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
> .fa,
|
||||
> .glyphicon,
|
||||
> .ion {
|
||||
width: 20px;
|
||||
}
|
||||
> .pull-right-container > .fa-angle-left,
|
||||
> .pull-right-container > .fa-angle-down,
|
||||
> .fa-angle-left,
|
||||
> .fa-angle-down {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
42
build/less/users-list.less
Normal file
42
build/less/users-list.less
Normal file
@@ -0,0 +1,42 @@
|
||||
/*
|
||||
* Component: Users List
|
||||
* ---------------------
|
||||
*/
|
||||
.users-list {
|
||||
&:extend(.list-unstyled);
|
||||
> li {
|
||||
width: 25%;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
img {
|
||||
.border-radius(50%);
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
> a:hover {
|
||||
&,
|
||||
.users-list-name {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.users-list-name,
|
||||
.users-list-date {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.users-list-name {
|
||||
font-weight: 600;
|
||||
color: #444;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.users-list-date {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
125
build/less/variables.less
Normal file
125
build/less/variables.less
Normal file
@@ -0,0 +1,125 @@
|
||||
// AdminLTE 2 Variables.less
|
||||
// =========================
|
||||
|
||||
// PATHS
|
||||
// --------------------------------------------------------
|
||||
|
||||
@boxed-layout-bg-image-path: "../img/boxed-bg.jpg";
|
||||
|
||||
// COLORS
|
||||
// --------------------------------------------------------
|
||||
// Primary
|
||||
@light-blue: #3c8dbc;
|
||||
// Danger
|
||||
@red: #dd4b39;
|
||||
// Success
|
||||
@green: #00a65a;
|
||||
// Info
|
||||
@aqua: #00c0ef;
|
||||
// Warning
|
||||
@yellow: #f39c12;
|
||||
@blue: #0073b7;
|
||||
@navy: #001F3F;
|
||||
@teal: #39CCCC;
|
||||
@olive: #3D9970;
|
||||
@lime: #01FF70;
|
||||
@orange: #FF851B;
|
||||
@fuchsia: #F012BE;
|
||||
@purple: #605ca8;
|
||||
@maroon: #D81B60;
|
||||
@black: #111;
|
||||
@gray-lte: #d2d6de;
|
||||
|
||||
// LAYOUT
|
||||
// --------------------------------------------------------
|
||||
|
||||
// Side bar and logo width
|
||||
@sidebar-width: 230px;
|
||||
// Boxed layout maximum width
|
||||
@boxed-layout-max-width: 1024px;
|
||||
// When the logo should go to the top of the screen
|
||||
@screen-header-collapse: @screen-xs-max;
|
||||
|
||||
// Link colors (Aka: <a> tags)
|
||||
@link-color: @light-blue;
|
||||
@link-hover-color: lighten(@link-color, 15%);
|
||||
|
||||
// Body background (Affects main content background only)
|
||||
@body-bg: #ecf0f5;
|
||||
|
||||
// SIDEBAR SKINS
|
||||
// --------------------------------------------------------
|
||||
|
||||
// Dark sidebar
|
||||
@sidebar-dark-bg: #222d32;
|
||||
@sidebar-dark-hover-bg: darken(@sidebar-dark-bg, 2%);
|
||||
@sidebar-dark-color: lighten(@sidebar-dark-bg, 60%);
|
||||
@sidebar-dark-hover-color: #fff;
|
||||
@sidebar-dark-submenu-bg: lighten(@sidebar-dark-bg, 5%);
|
||||
@sidebar-dark-submenu-color: lighten(@sidebar-dark-submenu-bg, 40%);
|
||||
@sidebar-dark-submenu-hover-color: #fff;
|
||||
|
||||
// Light sidebar
|
||||
@sidebar-light-bg: #f9fafc;
|
||||
@sidebar-light-hover-bg: lighten(#f0f0f1, 1.5%);
|
||||
@sidebar-light-color: #444;
|
||||
@sidebar-light-hover-color: #000;
|
||||
@sidebar-light-submenu-bg: @sidebar-light-hover-bg;
|
||||
@sidebar-light-submenu-color: #777;
|
||||
@sidebar-light-submenu-hover-color: #000;
|
||||
|
||||
// sidebar-expanded-on-hover
|
||||
@sidebar-expanded-shadow: 3px 0 8px rgba(0,0,0,.125);
|
||||
|
||||
// CONTROL SIDEBAR
|
||||
// --------------------------------------------------------
|
||||
@control-sidebar-width: @sidebar-width;
|
||||
|
||||
// BOXES
|
||||
// --------------------------------------------------------
|
||||
@box-border-color: #f4f4f4;
|
||||
@box-border-radius: 3px;
|
||||
@box-footer-bg: #fff;
|
||||
@box-boxshadow: 0 1px 1px rgba(0, 0, 0, .1);
|
||||
@box-padding: 10px;
|
||||
|
||||
// Box variants
|
||||
@box-default-border-top-color: #d2d6de;
|
||||
|
||||
// BUTTONS
|
||||
// --------------------------------------------------------
|
||||
@btn-boxshadow: none;
|
||||
|
||||
// PROGRESS BARS
|
||||
// --------------------------------------------------------
|
||||
@progress-bar-border-radius: 1px;
|
||||
@progress-bar-sm-border-radius: 1px;
|
||||
@progress-bar-xs-border-radius: 1px;
|
||||
|
||||
// FORMS
|
||||
// --------------------------------------------------------
|
||||
@input-radius: 0;
|
||||
|
||||
// BUTTONS
|
||||
// --------------------------------------------------------
|
||||
|
||||
// Border radius for non flat buttons
|
||||
@btn-border-radius: 3px;
|
||||
|
||||
// DIRECT CHAT
|
||||
// --------------------------------------------------------
|
||||
@direct-chat-height: 250px;
|
||||
@direct-chat-default-msg-bg: @gray-lte;
|
||||
@direct-chat-default-font-color: #444;
|
||||
@direct-chat-default-msg-border-color: @gray-lte;
|
||||
|
||||
// CHAT WIDGET
|
||||
// --------------------------------------------------------
|
||||
@attachment-border-radius: 3px;
|
||||
|
||||
// TRANSITIONS SETTINGS
|
||||
// --------------------------------------------------------
|
||||
|
||||
// Transition global options
|
||||
@transition-speed: .3s;
|
||||
@transition-fn: ease-in-out;
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user