Compare commits
47 Commits
Author | SHA1 | Date |
---|---|---|
YuCheng Hu | c4739346f6 | |
YuCheng Hu | 950069c96e | |
YuCheng Hu | 900f01e0ab | |
YuCheng Hu | 21e0373cf0 | |
YuCheng Hu | d40944ed0f | |
YuCheng Hu | 2e112a119b | |
YuCheng Hu | af2c18727e | |
YuCheng Hu | 16341c2c0e | |
YuCheng Hu | ff91705622 | |
YuCheng Hu | 3f51026fa9 | |
YuCheng Hu | 805ac8edfd | |
YuCheng Hu | 4c6e8cdaa7 | |
YuCheng Hu | 834874797e | |
YuCheng Hu | 366f9e6a6f | |
YuCheng Hu | 33450b2ee1 | |
YuCheng Hu | dd65972cc7 | |
YuCheng Hu | 5648c24a2b | |
YuCheng Hu | 53439ad7c1 | |
YuCheng Hu | 574f467bc8 | |
YuCheng Hu | bf4ccde35d | |
YuCheng Hu | 7f90248eb9 | |
yang.xie | 251238d874 | |
yang.xie | 45c25273f9 | |
YuCheng Hu | dce935da7b | |
fujiao | 0e90087f35 | |
fujiao | 9f05faf7dd | |
fujiao | 1d73a49e26 | |
fujiao | cfaeb84fe2 | |
yang.xie | 5b25aca4f3 | |
yang.xie | a36d7ff44c | |
yang.xie | 30536420a1 | |
yang.xie | 62ff589f29 | |
fujiao | 235caec681 | |
yang.xie | e9c7de2e96 | |
yang.xie | 72725e0999 | |
fujiao | 88083cceb5 | |
fujiao | a3abf36e30 | |
fujiao | 0b38bbd004 | |
fujiao | 45d7c2b26d | |
fujiao | 5109025c52 | |
fujiao | 6d0b3dda43 | |
fujiao | d4fa831510 | |
fujiao | 0b337ca3e2 | |
fujiao | 4d7d94be9f | |
fujiao | 3b142d3414 | |
fujiao | db0dc0d657 | |
fujiao | 0129bd6747 |
|
@ -0,0 +1,8 @@
|
|||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
# Datasource local storage ignored files
|
||||
/dataSources/
|
||||
/dataSources.local.xml
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="CheckStyle-IDEA" serialisationVersion="2">
|
||||
<checkstyleVersion>10.15.0</checkstyleVersion>
|
||||
<scanScope>JavaOnly</scanScope>
|
||||
<copyLibs>true</copyLibs>
|
||||
<option name="thirdPartyClasspath" />
|
||||
<option name="activeLocationIds" />
|
||||
<option name="locations">
|
||||
<list>
|
||||
<ConfigurationLocation id="bundled-sun-checks" type="BUNDLED" scope="All" description="Sun Checks">(bundled)</ConfigurationLocation>
|
||||
<ConfigurationLocation id="bundled-google-checks" type="BUNDLED" scope="All" description="Google Checks">(bundled)</ConfigurationLocation>
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
</project>
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ComposerSettings">
|
||||
<execution />
|
||||
</component>
|
||||
<component name="ProjectRootManager">
|
||||
<output url="file://$PROJECT_DIR$/out" />
|
||||
</component>
|
||||
<component name="ThriftCompiler">
|
||||
<compilers />
|
||||
</component>
|
||||
</project>
|
|
@ -0,0 +1,8 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/Ui-Skote.iml" filepath="$PROJECT_DIR$/Ui-Skote.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
|
@ -0,0 +1,6 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
|
@ -0,0 +1,63 @@
|
|||
pipeline {
|
||||
agent any
|
||||
|
||||
options {
|
||||
ansiColor('xterm')
|
||||
}
|
||||
|
||||
tools {
|
||||
nodejs 'node 17.9.1'
|
||||
}
|
||||
|
||||
environment {
|
||||
|
||||
PRJ_NAME = 'usvisartrack_ui'
|
||||
PRJ_VERSION = '0.0.10'
|
||||
REPO_USERNAME = credentials('86617b35-b114-4604-b054-082c8638bf8e')
|
||||
REPO_PASSWORD = credentials('c96b3079-b141-43f0-b43a-c9c2adfb14ea')
|
||||
NODE_OPTIONS = '--openssl-legacy-provider'
|
||||
}
|
||||
|
||||
stages {
|
||||
stage("Pull Source Code"){
|
||||
steps {
|
||||
git credentialsId: 'd8a95129-132d-46d9-a864-06514d16feba', url: 'https://src.ossez.com/USVisaTrack/Usvisatrack-Ui-Docker.git'
|
||||
}
|
||||
}
|
||||
|
||||
stage('Build VUE') {
|
||||
steps {
|
||||
echo 'Building..'
|
||||
dir('Vuejs/Admin') {
|
||||
sh 'yarn install'
|
||||
sh 'npx browserslist@latest --update-db'
|
||||
sh 'yarn build'
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
stage('Build Dokder') {
|
||||
steps {
|
||||
echo 'Testing..'
|
||||
dir('Vuejs/Admin') {
|
||||
sh 'docker image prune -f'
|
||||
sh 'docker build -f Dockerfile -t ${PRJ_NAME}:${PRJ_VERSION} --label ${PRJ_NAME} .'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
stage('Deploy Docker') {
|
||||
steps {
|
||||
echo 'Deploying....'
|
||||
dir('Vuejs/Admin') {
|
||||
sh 'docker tag ${PRJ_NAME}:${PRJ_VERSION} repo-docker.ossez.com/docker-hub/${PRJ_NAME}:${PRJ_VERSION}'
|
||||
sh 'docker tag ${PRJ_NAME}:${PRJ_VERSION} repo-docker.ossez.com/docker-hub/${PRJ_NAME}:latest'
|
||||
|
||||
sh 'docker login repo-docker.ossez.com --username ${REPO_USERNAME} --password ${REPO_PASSWORD}'
|
||||
sh 'docker push repo-docker.ossez.com/docker-hub/${PRJ_NAME}:${PRJ_VERSION}'
|
||||
sh 'docker push repo-docker.ossez.com/docker-hub/${PRJ_NAME}:latest'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -3,13 +3,14 @@ VUE_APP_URL=http://localhost:8080/
|
|||
VUE_APP_I18N_LOCALE=en
|
||||
VUE_APP_I18N_FALLBACK_LOCALE=en
|
||||
|
||||
VUE_APP_DEFAULT_AUTH=fakebackend
|
||||
VUE_APP_DEFAULT_AUTH=fakebackend
|
||||
#firebase
|
||||
|
||||
VUE_APP_APIKEY=
|
||||
VUE_APP_AUTHDOMAIN=
|
||||
VUE_APP_DATABASEURL=
|
||||
VUE_APP_PROJECTId=
|
||||
VUE_APP_STORAGEBUCKET=
|
||||
VUE_APP_MESSAGINGSENDERID=
|
||||
VUE_APP_APPId=
|
||||
VUE_APP_MEASUREMENTID=
|
||||
VUE_APP_APIKEY="AIzaSyCqS9cSPrDCNSQ-Ku2kZf5DBWjPPv7hvcA"
|
||||
VUE_APP_AUTHDOMAIN="test-demo-774f8.firebaseapp.com"
|
||||
VUE_APP_DATABASEURL="https://test-demo-774f8-default-rtdb.firebaseio.com"
|
||||
VUE_APP_PROJECTID="test-demo-774f8"
|
||||
VUE_APP_STORAGEBUCKET="test-demo-774f8.appspot.com"
|
||||
VUE_APP_MESSAGINGSENDERID="916438010670"
|
||||
VUE_APP_APPID="1:916438010670:web:c70cf404da6c0fe7b048bf"
|
||||
VUE_APP_MEASUREMENTID="G-1N6FB2GG55"
|
|
@ -6,6 +6,7 @@ node_modules
|
|||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
.env
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "skote",
|
||||
"version": "1.0.0",
|
||||
"version": "4.0.2",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
|
@ -8,72 +8,72 @@
|
|||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@amcharts/amcharts4": "^4.10.36",
|
||||
"@amcharts/amcharts4-geodata": "^4.1.27",
|
||||
"@anivive/vue3-form-wizard": "^1.0.1",
|
||||
"@ckeditor/ckeditor5-build-classic": "^31.1.0",
|
||||
"@ckeditor/ckeditor5-vue": "^2.0.1",
|
||||
"@fullcalendar/bootstrap": "^5.10.1",
|
||||
"@fullcalendar/core": "^5.10.1",
|
||||
"@fullcalendar/daygrid": "^5.10.1",
|
||||
"@fullcalendar/interaction": "^5.10.1",
|
||||
"@fullcalendar/list": "^5.10.1",
|
||||
"@fullcalendar/timegrid": "^5.10.1",
|
||||
"@fullcalendar/vue": "^5.10.1",
|
||||
"@fullcalendar/vue3": "^5.10.1",
|
||||
"@j-t-mcc/vue3-chartjs": "^1.2.0",
|
||||
"@vue-leaflet/vue-leaflet": "^0.6.1",
|
||||
"@vueform/multiselect": "^2.3.1",
|
||||
"@vueform/slider": "^2.0.8",
|
||||
"@vuelidate/core": "^2.0.0-alpha.34",
|
||||
"@vuelidate/validators": "^2.0.0-alpha.26",
|
||||
"apexcharts": "^3.33.0",
|
||||
"axios": "^0.25.0",
|
||||
"bootstrap": "^5.1.3",
|
||||
"bootstrap-vue-3": "^0.1.0",
|
||||
"chart.js": "^3.7.0",
|
||||
"@ckeditor/ckeditor5-build-classic": "^40.0.0",
|
||||
"@ckeditor/ckeditor5-vue": "^5.1.0",
|
||||
"@fullcalendar/bootstrap": "^6.1.9",
|
||||
"@fullcalendar/core": "^6.1.9",
|
||||
"@fullcalendar/daygrid": "^6.1.9",
|
||||
"@fullcalendar/interaction": "^6.1.9",
|
||||
"@fullcalendar/list": "^6.1.9",
|
||||
"@fullcalendar/timegrid": "^6.1.9",
|
||||
"@fullcalendar/vue": "^6.1.9",
|
||||
"@fullcalendar/vue3": "^6.1.9",
|
||||
"@j-t-mcc/vue3-chartjs": "^1.3.0",
|
||||
"@popperjs/core": "^2.11.8",
|
||||
"@vueform/multiselect": "^2.6.2",
|
||||
"@vueform/slider": "^2.1.7",
|
||||
"@vuelidate/core": "^2.0.3",
|
||||
"@vuelidate/validators": "^2.0.4",
|
||||
"apexcharts": "^3.43.0",
|
||||
"axios": "^1.5.1",
|
||||
"bootstrap": "^5.3.2",
|
||||
"bootstrap-vue-next": "^0.14.8",
|
||||
"chart.js": "^4.4.0",
|
||||
"click-outside-vue3": "^4.0.1",
|
||||
"core-js": "^3.6.5",
|
||||
"core-js": "^3.33.0",
|
||||
"dropzone": "^6.0.0-beta.2",
|
||||
"echarts": "^5.3.0",
|
||||
"firebase": "^9.6.3",
|
||||
"leaflet": "^1.7.1",
|
||||
"maska": "^1.5.0",
|
||||
"metismenujs": "^1.3.1",
|
||||
"moment": "^2.29.1",
|
||||
"sass": "^1.48.0",
|
||||
"sass-loader": "^10.0.1",
|
||||
"simplebar": "^5.3.6",
|
||||
"simplebar-vue3": "^0.1.5",
|
||||
"sweetalert2": "^11.3.6",
|
||||
"vue": "^3.0.0",
|
||||
"echarts": "^5.4.3",
|
||||
"firebase": "^10.4.0",
|
||||
"maska": "^2.1.9",
|
||||
"metismenujs": "^1.4.0",
|
||||
"node-sass": "^9.0.0",
|
||||
"pinia": "^2.1.6",
|
||||
"sass": "^1.68.0",
|
||||
"sass-loader": "^13.3.2",
|
||||
"simplebar": "^6.2.5",
|
||||
"simplebar-vue": "^2.3.3",
|
||||
"sweetalert2": "^11.7.31",
|
||||
"swiper": "^10.3.1",
|
||||
"vue": "^3.3.4",
|
||||
"vue-chartist": "^3.0.0",
|
||||
"vue-cropperjs": "^5.0.0",
|
||||
"vue-draggable-next": "^2.1.1",
|
||||
"vue-easy-lightbox": "^1.2.4",
|
||||
"vue-form-wizard": "^0.8.4",
|
||||
"vue-hotel-datepicker": "^4.5.1",
|
||||
"vue-i18n": "^9.2.0-beta.35",
|
||||
"vue-meta": "^2.4.0",
|
||||
"vue-number-input-spinner": "^2.2.0",
|
||||
"vue-router": "^4",
|
||||
"vue-draggable-next": "^2.2.1",
|
||||
"vue-easy-lightbox": "^1.16.0",
|
||||
"vue-flatpickr-component": "^11.0.3",
|
||||
"vue-i18n": "^9.5.0",
|
||||
"vue-router": "^4.2.5",
|
||||
"vue-switches": "^2.0.1",
|
||||
"vue3-apexcharts": "^1.4.1",
|
||||
"vue3-carousel": "^0.1.36",
|
||||
"vue3-datepicker": "^0.3.2",
|
||||
"vue3-draggable": "^2.0.9",
|
||||
"vue3-dropzone": "^0.0.7",
|
||||
"vue3-echarts": "^1.0.4",
|
||||
"vue3-google-map": "^0.8.3",
|
||||
"vue3-scroll-spy": "^1.0.8",
|
||||
"vuex": "^4.0.2"
|
||||
"vue3-apexcharts": "^1.4.4",
|
||||
"vue3-carousel": "^0.3.1",
|
||||
"vue3-datepicker": "^0.4.0",
|
||||
"vue3-echarts": "^1.1.0",
|
||||
"vue3-google-map": "^0.18.0",
|
||||
"vue3-scroll-spy": "^1.0.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.0",
|
||||
"@vue/cli-plugin-eslint": "~4.5.0",
|
||||
"@vue/cli-service": "~4.5.0",
|
||||
"@vue/compiler-sfc": "^3.0.0",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"eslint": "^6.7.2",
|
||||
"eslint-plugin-vue": "^7.0.0"
|
||||
"@achrinza/node-ipc": "^10.1.7",
|
||||
"@babel/eslint-parser": "^7.21.3",
|
||||
"@vue/cli-plugin-babel": "~5.0.8",
|
||||
"@vue/cli-plugin-eslint": "~5.0.8",
|
||||
"@vue/cli-service": "~5.0.8",
|
||||
"@vue/compiler-sfc": "^3.2.47",
|
||||
"eslint": "^8.36.0",
|
||||
"eslint-plugin-vue": "^7.0.0",
|
||||
"unplugin-vue-components": "^0.24.1",
|
||||
"webpack-dev-server": "2.9.7"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"root": true,
|
||||
|
@ -85,7 +85,7 @@
|
|||
"eslint:recommended"
|
||||
],
|
||||
"parserOptions": {
|
||||
"parser": "babel-eslint"
|
||||
"parser": "@babel/eslint-parser"
|
||||
},
|
||||
"rules": {}
|
||||
},
|
||||
|
|
|
@ -0,0 +1,8 @@
|
|||
import Clients1 from "@/assets/images/clients/1.png"
|
||||
import Clients2 from "@/assets/images/clients/2.png"
|
||||
import Clients3 from "@/assets/images/clients/3.png"
|
||||
import Clients4 from "@/assets/images/clients/4.png"
|
||||
import Clients5 from "@/assets/images/clients/5.png"
|
||||
import Clients6 from "@/assets/images/clients/6.png"
|
||||
|
||||
export { Clients1, Clients2, Clients3, Clients4, Clients5, Clients6 }
|
|
@ -0,0 +1,23 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 512 512" version="1" viewBox="0 0 512 512"><path fill="#00C8FF" d="M93.867,12.8h326.016C470.547,12.8,512,54.253,512,104.918v314.965C512,470.547,470.547,512,419.883,512
|
||||
H92.118C41.453,512,0,470.547,0,419.882V106.667C0,54.933,42.134,12.8,93.867,12.8"/><path fill="#001D26" d="M98.133,34.133h317.482c41.45,0,75.051,33.601,75.051,75.051v306.431c0,41.45-33.602,75.051-75.051,75.051
|
||||
H96.384c-41.45,0-75.051-33.601-75.051-75.051V110.933C21.333,68.267,55.466,34.133,98.133,34.133"/><path fill="#FFF" d="M341.146,233.353c-16.816,0-21.861,8.408-21.861,15.135c0,6.727,4.204,12.612,26.275,24.384
|
||||
c32.792,15.765,43.722,31.11,43.722,53.812c0,33.633-25.224,52.131-60.539,52.131c-15.122,0.671-30.167-2.512-43.722-9.249
|
||||
c-1.682-0.841-1.682-1.682-1.682-3.363v-31.11c0-1.682,0.841-2.522,2.522-1.682c12.437,8.315,27.081,12.708,42.041,12.612
|
||||
c16.816,0,23.543-6.727,23.543-15.765c0-7.567-5.255-14.294-26.276-25.224c-29.429-14.294-42.041-28.588-42.041-52.971
|
||||
c0-26.906,21.02-49.608,57.806-49.608c12.875-0.52,25.728,1.479,37.837,5.886c1.579,0.582,2.388,2.334,1.806,3.914
|
||||
c-0.036,0.099-0.078,0.196-0.124,0.29v28.588c0,1.682-0.841,2.522-3.363,1.682c-10.967-6.006-23.232-9.253-35.735-9.459H341.146z
|
||||
M263.37,216.537c0,53.812-38.678,76.514-86.604,76.514h-15.765v80.718c0.189,1.204-0.634,2.334-1.839,2.522
|
||||
c-0.227,0.036-0.457,0.036-0.684,0h-33.212c-1.204,0.189-2.334-0.634-2.522-1.839c-0.036-0.227-0.036-0.457,0-0.684l0.841-227.02
|
||||
c0-1.682,3.363-2.522,5.255-2.522c13.453-0.841,33.633-0.841,53.812-0.841C240.458,143.386,263.37,175.337,263.37,216.537z
|
||||
M225.113,216.537c0-26.906-16.816-40.359-44.563-40.359c-6.738-0.24-13.485,0.042-20.18,0.841v81.559h16.816
|
||||
C201.781,258.578,225.113,250.17,225.113,216.537z"/><path fill="#00C8FF" d="M341.146,233.353c-16.816,0-21.861,8.408-21.861,15.135c0,6.727,4.204,12.612,26.275,24.384
|
||||
c32.792,15.765,43.722,31.11,43.722,53.812c0,33.633-25.224,52.131-60.539,52.131c-15.122,0.671-30.167-2.512-43.722-9.249
|
||||
c-1.682-0.841-1.682-1.682-1.682-3.363v-31.11c0-1.682,0.841-2.522,2.522-1.682c12.437,8.315,27.081,12.708,42.041,12.612
|
||||
c16.816,0,23.543-6.727,23.543-15.765c0-7.567-5.255-14.294-26.276-25.224c-29.429-14.294-42.041-28.588-42.041-52.971
|
||||
c0-26.906,21.02-49.608,57.806-49.608c12.875-0.52,25.728,1.479,37.837,5.886c1.579,0.582,2.388,2.334,1.806,3.914
|
||||
c-0.036,0.099-0.078,0.196-0.124,0.29v28.588c0,1.682-0.841,2.522-3.363,1.682c-10.967-6.006-23.232-9.253-35.735-9.459H341.146z
|
||||
M263.37,216.537c0,53.812-38.678,76.514-86.604,76.514h-15.765v80.718c0.189,1.204-0.634,2.334-1.839,2.522
|
||||
c-0.227,0.036-0.457,0.036-0.684,0h-33.212c-1.204,0.189-2.334-0.634-2.522-1.839c-0.036-0.227-0.036-0.457,0-0.684l0.841-227.02
|
||||
c0-1.682,3.363-2.522,5.255-2.522c13.453-0.841,33.633-0.841,53.812-0.841C240.458,143.386,263.37,175.337,263.37,216.537z
|
||||
M225.113,216.537c0-26.906-16.816-40.359-44.563-40.359c-6.738-0.24-13.485,0.042-20.18,0.841v81.559h16.816
|
||||
C201.781,258.578,225.113,250.17,225.113,216.537z" opacity=".15"/></svg>
|
After Width: | Height: | Size: 3.0 KiB |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Adobe" viewBox="0 0 512 512"><rect width="512" height="512" fill="#ed2224" rx="15%"/><path fill="#fff" d="M296 120l114 272V120H296m-194 0v272l114-272H102m105 217h52l23 55h46l-73-173-48 118"/></svg>
|
After Width: | Height: | Size: 249 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Airbnb" viewBox="0 0 512 512"><rect width="512" height="512" fill="#ff5a5f" rx="15%"/><path fill="none" stroke="#fff" stroke-width="23" d="M255 84c-29 0-41 24-41 24-36 66-68 133-101 203 0 0-26 51 15 84 57 45 110-22 127-39s48-56 48-100c0 0-1-44-48-44s-49 44-49 44c0 41 32 83 49 100 17 18 71 85 129 39 36-29 13-84 13-84-31-68-67-143-100-203 0 0-10-24-42-24z"/></svg>
|
After Width: | Height: | Size: 416 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" viewBox="0 0 72 72"><g fill="none" fill-rule="evenodd"><rect width="72" height="72" fill="#191619" rx="4"/><g transform="translate(13 14)"><path fill="#F90" d="M41.462 40.25C36.458 44.003 29.202 46 22.955 46 14.2 46 6.315 42.71.348 37.234c-.469-.43-.05-1.017.512-.684 6.438 3.807 14.398 6.1 22.62 6.1 5.547 0 11.644-1.17 17.254-3.588.846-.365 1.556.567.728 1.188zm2.082-3.386c-.64-.833-4.231-.395-5.844-.198-.489.06-.565-.374-.124-.689 2.864-2.045 7.558-1.454 8.103-.77.55.691-.143 5.474-2.828 7.756-.413.351-.806.164-.623-.3.604-1.533 1.957-4.966 1.316-5.799z"/><path fill="#FFF" d="M31.177.71c-.35-.318-.853-.34-1.246-.125-1.753 1.48-2.066 2.164-3.024 3.573C24.012 1.16 21.961.261 18.21.261c-4.441 0-7.895 2.785-7.895 8.356 0 4.352 2.32 7.311 5.626 8.762 2.862 1.276 6.859 1.508 9.917 1.857v.696c0 1.277.1 2.785-.64 3.888-.642.986-1.876 1.392-2.961 1.392-2.012 0-3.801-1.047-4.24-3.219-.092-.483-.438-.96-.917-.985l-5.112.562c-.432.1-.912.45-.787 1.12 1.175 6.305 6.776 8.21 11.795 8.21 2.567 0 5.922-.697 7.946-2.67 2.565-2.437 2.319-5.687 2.319-9.227v-8.352c0-2.512 1.026-3.614 1.99-4.968.337-.488.413-1.068-.016-1.424a230.271 230.271 0 0 1-4.046-3.56l-.012.011zm-5.319 13.071c0-2.09.05-3.83-.986-5.687-.839-1.509-2.17-2.437-3.652-2.437-2.023 0-3.207 1.567-3.207 3.888 0 4.566 4.03 5.396 7.845 5.396v-1.16z" transform="matrix(1 0 0 -1 0 31.16)"/></g></g></svg>
|
After Width: | Height: | Size: 1.4 KiB |
|
@ -0,0 +1,41 @@
|
|||
import adobePhotoshop from "@/assets/images/companies/adobe-photoshop.svg"
|
||||
import adobe from "@/assets/images/companies/adobe.svg"
|
||||
import airbnb from "@/assets/images/companies/airbnb.svg"
|
||||
import amazon from "@/assets/images/companies/amazon.svg"
|
||||
import flutter from "@/assets/images/companies/flutter.svg"
|
||||
import img1 from "@/assets/images/companies/img-1.png"
|
||||
import img2 from "@/assets/images/companies/img-2.png"
|
||||
import img3 from "@/assets/images/companies/img-3.png"
|
||||
import img4 from "@/assets/images/companies/img-4.png"
|
||||
import img5 from "@/assets/images/companies/img-5.png"
|
||||
import img6 from "@/assets/images/companies/img-6.png"
|
||||
import line from "@/assets/images/companies/line.svg"
|
||||
import mailchimp from "@/assets/images/companies/mailchimp.svg"
|
||||
import reddit from "@/assets/images/companies/reddit.svg"
|
||||
import sass from "@/assets/images/companies/sass.svg"
|
||||
import spotify from "@/assets/images/companies/spotify.svg"
|
||||
import upwork from "@/assets/images/companies/upwork.svg"
|
||||
import wechat from "@/assets/images/companies/wechat.svg"
|
||||
import wordpress from "@/assets/images/companies/wordpress.svg"
|
||||
|
||||
export {
|
||||
adobePhotoshop,
|
||||
adobe,
|
||||
airbnb,
|
||||
amazon,
|
||||
flutter,
|
||||
img1,
|
||||
img2,
|
||||
img3,
|
||||
img4,
|
||||
img5,
|
||||
img6,
|
||||
line,
|
||||
mailchimp,
|
||||
reddit,
|
||||
sass,
|
||||
spotify,
|
||||
upwork,
|
||||
wechat,
|
||||
wordpress
|
||||
}
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Flutter" viewBox="0 0 512 512"><rect width="512" height="512" fill="#e8e9eb" rx="15%"/><defs><linearGradient id="a" x1="37409" x2="38109" y1="-20285" y2="-19585" gradientTransform="matrix(.06 0 0 -.06 -1982.43 -801.48)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#1a237e" stop-opacity=".4"/><stop offset="1" stop-color="#1a237e" stop-opacity="0"/></linearGradient></defs><path fill="#39cefd" d="M191.45 342.89L249.11 401 407.75 241.12H292.4zM292.4 66.69H407.75L162.61 313.82l-57.7-58.13z"/><path fill="#03569b" d="M249.11,401l43.29,43.59H407.75L306.8,342.89Z"/><path fill="url(#a)" d="M334.67,371.16,306.8,342.89,249.11,401Z"/><path fill="#16b9fd" d="M191.45,342.87l57.69-58.18,57.7,58.15L249.14,401Z"/></svg>
|
After Width: | Height: | Size: 778 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="LINE" viewBox="0 0 512 512"><rect width="512" height="512" fill="#00B900" rx="15%"/><path fill="#fff" d="m443 231c-2 45-21 76-51 103-53 47-137 105-148 96-11-14 21-47-20-52-88-12-155-74-155-147 0-82 85-150 188-150s189 68 186 150z"/><path fill="none" stroke="#00B900" stroke-linecap="round" stroke-linejoin="round" stroke-width="21" d="m371 232h-34m34-36h-36v72h36m-123 0v-72l54 72v-72m-89 72v-72m-66 0v72h37"/></svg>
|
After Width: | Height: | Size: 467 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Mailchimp" viewBox="0 0 512 512"><rect width="512" height="512" fill="#ffe01b" rx="15%"/><path fill="#1e1e1e" d="M418 306l-6-17s25-38-37-51c0 0 4-47-18-69 48-47 37-118-72-72C229-10 13 241 103 281c-9 12-9 72 53 78 42 90 144 96 203 69s93-113 59-122zm-263 40c-51-5-56-75-12-82s55 86 12 82zm-15-95c-14 0-31 19-31 19-68-33 123-252 164-167 0 0-100 48-133 148zm200 85c0-4-21 6-59-7 3-21 48 18 123-33l6 21c28-5 0 90-90 89-73-1-96-76-56-117 8-8-29-24-22-59 3-15 16-37 49-31s40-24 62-13 9 53 12 59 35 7 41 24-41 54-114 44c-17-2-27 20-16 34 22 32 112 11 127-20-38 29-116 40-122 9 22 10 59 4 59 0zm-58-6zm-73-152c22-27 51-43 51-43l-6 15s21-16 44-16l-8 8c26 1 37 11 37 11s-61-18-118 25zm135 39c13-1 9 29 9 29h-8s-14-28-1-29zm-59 33c-9 1-19 6-18 2 4-16 41-12 40 2s-9-6-22-4zm21 12c1 2-7 0-13 1s-12 4-12 2 23-11 25-3zm20 3c3-6 15 0 12 6s-15 0-12-6zm25 2c-6 0-6-13 0-13s6 14 0 14zm-180 53c3 3-6 9-13 4s8-29-10-35-13 17-18 14 7-35 28-22-6 33 6 39 5-2 7 0z"/></svg>
|
After Width: | Height: | Size: 999 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Reddit" viewBox="0 0 512 512"><rect width="512" height="512" fill="#f40" rx="15%"/><g fill="#fff"><ellipse cx="256" cy="307" rx="166" ry="117"/><circle cx="106" cy="256" r="42"/><circle cx="407" cy="256" r="42"/><circle cx="375" cy="114" r="32"/></g><g fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="#fff" stroke-width="16" d="m256 196 23-101 73 15"/><path stroke="#f40" stroke-width="13" d="m191 359c33 25 97 26 130 0"/></g><g fill="#f40"><circle cx="191" cy="287" r="31"/><circle cx="321" cy="287" r="31"/></g></svg>
|
After Width: | Height: | Size: 596 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Sass" viewBox="0 0 512 512"><rect width="512" height="512" fill="#c69" rx="15%"/><path fill="#fff" d="M258,88c-96,33-158,100-152,140s66,72,93,93h0c-35,18-79,45-78,80,2,48,54,33,76,19s44-53,30-94c31-8,58,2,66,8,31,22,15,47,4,51s-4,6,3,4,22-12,22-29c0-43-46-63-103-48-33-35-78-51-76-89,1-14,6-50,95-95s152-27,144,14c-12,62-120,104-158,68-2-4-9-7-5,4,20,50,182,27,189-79C410,79,329,64,258,88ZM172,408c-25,8-24-8-23-14,3-17,17-38,59-59C220,373,193,402,172,408Z"/></svg>
|
After Width: | Height: | Size: 517 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Spotify" viewBox="0 0 512 512"><rect width="512" height="512" fill="#3bd75f" rx="15%"/><circle cx="256" cy="256" r="192" fill="#fff"/><g fill="none" stroke="#3bd75f" stroke-linecap="round"><path stroke-width="36" d="m141 195c75-20 164-15 238 24"/><path stroke-width="31" d="m152 257c61-17 144-13 203 24"/><path stroke-width="24" d="m156 315c54-12 116-17 178 20"/></g></svg>
|
After Width: | Height: | Size: 425 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="Upwork" viewBox="0 0 512 512"><rect width="512" height="512" fill="#6fda44" rx="15%"/><path fill="#fff" d="M357.2,296.9c-17,0-33-7.2-47.4-18.9l3.5-16.6l0.1-0.6c3.2-17.6,13.1-47.2,43.8-47.2c23,0,41.7,18.7,41.7,41.7S380.2,296.9,357.2,296.9L357.2,296.9z M357.2,171.4c-39.2,0-69.5,25.4-81.9,67.3c-18.8-28.3-33.1-62.2-41.4-90.8h-42.2v109.7c0,21.7-17.6,39.3-39.3,39.3s-39.3-17.6-39.3-39.3V147.8H71v109.7c0,44.9,36.5,81.8,81.4,81.8s81.4-36.9,81.4-81.8v-18.4c8.2,17.1,18.2,34.4,30.4,49.6l-25.8,121.4h43.1l18.7-88c16.4,10.5,35.2,17.1,56.8,17.1c46.2,0,83.8-37.8,83.8-84.1C440.9,209,403.4,171.4,357.2,171.4"/></svg>
|
After Width: | Height: | Size: 656 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" aria-label="WeChat" viewBox="0 0 512 512"><rect width="512" height="512" fill="#00c70a" rx="15%"/><path d="m402 369c23-17 38-42 38-70 0-51-50-92-111-92s-110 41-110 92 49 92 110 92c13 0 25-2 36-5 4-1 8 0 9 1l25 14c3 2 6 0 5-4l-6-22c0-3 2-5 4-6m-110-85a15 15 0 1 1 0-29 15 15 0 0 1 0 29m74 0a15 15 0 1 1 0-29 15 15 0 0 1 0 29"/><path d="m205 105c-73 0-132 50-132 111 0 33 17 63 45 83 3 2 5 5 4 10l-7 24c-1 5 3 7 6 6l30-17c3-2 7-3 11-2 26 8 48 6 51 6-24-84 59-132 123-128-10-52-65-93-131-93m-44 93a18 18 0 1 1 0-35 18 18 0 0 1 0 35m89 0a18 18 0 1 1 0-35 18 18 0 0 1 0 35"/></svg>
|
After Width: | Height: | Size: 628 B |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" aria-label="WordPress" viewBox="0 0 512 512"><rect width="512" height="512" fill="#05a8da" rx="15%"/><circle cx="256" cy="256" r="182" fill="none" stroke="#fff" stroke-width="20"/><path fill="#fff" d="m315 424 28-15 54-156c10-25 13-45 13-62 0-32-13-60-36-63-21-2-33 19-32 31 2 29 31 45 31 85 0 28-18 73-31 117l-62-187 20-1c10 0 9-15-1-14-31 3-60 2-92 0-10-1-10 14-1 14l18 1 27 74-38 114-63-188 20-1c9 0 8-15-1-14-29 2-57 4-64-1l-8 24 84 233 25 14 54-158"/></svg>
|
After Width: | Height: | Size: 502 B |
|
@ -0,0 +1,5 @@
|
|||
import Img1 from "@/assets/images/crypto/blog/img-1.jpg"
|
||||
import Img2 from "@/assets/images/crypto/blog/img-2.jpg"
|
||||
import Img3 from "@/assets/images/crypto/blog/img-3.jpg"
|
||||
|
||||
export { Img1, Img2, Img3 }
|
After Width: | Height: | Size: 633 B |
After Width: | Height: | Size: 147 KiB |
|
@ -0,0 +1,15 @@
|
|||
import layout1 from "@/assets/images/layouts/layout-1.jpg"
|
||||
import layout2 from "@/assets/images/layouts/layout-2.jpg"
|
||||
import layout3 from "@/assets/images/layouts/layout-3.jpg"
|
||||
import layout4 from "@/assets/images/layouts/layout-4.png"
|
||||
import layout5 from "@/assets/images/layouts/layout-5.png"
|
||||
import layout6 from "@/assets/images/layouts/layout-6.png"
|
||||
|
||||
export {
|
||||
layout1,
|
||||
layout2,
|
||||
layout3,
|
||||
layout4,
|
||||
layout5,
|
||||
layout6,
|
||||
}
|
|
@ -0,0 +1,10 @@
|
|||
import Img1 from "@/assets/images/product/img-1.png"
|
||||
import Img2 from "@/assets/images/product/img-2.png"
|
||||
import Img3 from "@/assets/images/product/img-3.png"
|
||||
import Img4 from "@/assets/images/product/img-4.png"
|
||||
import Img5 from "@/assets/images/product/img-5.png"
|
||||
import Img6 from "@/assets/images/product/img-6.png"
|
||||
import Img7 from "@/assets/images/product/img-7.png"
|
||||
import Img8 from "@/assets/images/product/img-8.png"
|
||||
|
||||
export {Img1,Img2,Img3,Img4,Img5,Img6,Img7,Img8}
|
|
@ -0,0 +1,9 @@
|
|||
import Img1 from "@/assets/images/small/img-1.jpg"
|
||||
import Img2 from "@/assets/images/small/img-2.jpg"
|
||||
import Img3 from "@/assets/images/small/img-3.jpg"
|
||||
import Img4 from "@/assets/images/small/img-4.jpg"
|
||||
import Img5 from "@/assets/images/small/img-5.jpg"
|
||||
import Img6 from "@/assets/images/small/img-6.jpg"
|
||||
import Img7 from "@/assets/images/small/img-7.jpg"
|
||||
|
||||
export { Img1, Img2, Img3, Img4, Img5, Img6, Img7 }
|
|
@ -0,0 +1,10 @@
|
|||
import avatar1 from "@/assets/images/users/avatar-1.jpg"
|
||||
import avatar2 from "@/assets/images/users/avatar-2.jpg"
|
||||
import avatar3 from "@/assets/images/users/avatar-3.jpg"
|
||||
import avatar4 from "@/assets/images/users/avatar-4.jpg"
|
||||
import avatar5 from "@/assets/images/users/avatar-5.jpg"
|
||||
import avatar6 from "@/assets/images/users/avatar-6.jpg"
|
||||
import avatar7 from "@/assets/images/users/avatar-7.jpg"
|
||||
import avatar8 from "@/assets/images/users/avatar-8.jpg"
|
||||
|
||||
export { avatar1, avatar2, avatar3, avatar4, avatar5, avatar6, avatar7, avatar8 }
|
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 3.5 KiB |
|
@ -0,0 +1,402 @@
|
|||
@use 'sass:math';
|
||||
|
||||
@import "custom/components/animation";
|
||||
|
||||
.modal-backdrop {
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.modal-header,
|
||||
.alert {
|
||||
.close {
|
||||
padding: 0.3rem 1.75rem;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
font-size: 25px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
opacity: .4;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
z-index: 2;
|
||||
|
||||
button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.vhd__datepicker__input {
|
||||
height: $input-height !important;
|
||||
line-height: $input-height !important;
|
||||
}
|
||||
|
||||
.form-check {
|
||||
.custom-control-input {
|
||||
border-radius: .25em;
|
||||
float: left;
|
||||
margin: 3px 3px 3px -19px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.check-group {
|
||||
input {
|
||||
position: absolute;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
.vue-simple-drawer {
|
||||
background: $gray-100 !important;
|
||||
color: $gray-800 !important;
|
||||
|
||||
.close-btn {
|
||||
|
||||
.leftright,
|
||||
.rightleft {
|
||||
width: 20px !important;
|
||||
background-color: $gray-600 !important
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
* {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.b-form-btn-label-control {
|
||||
padding: 0;
|
||||
border: none;
|
||||
|
||||
>.btn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.vue-simple-drawer {
|
||||
// default style
|
||||
padding: 20px;
|
||||
color: $--simple-drawer-fg-color;
|
||||
background: $--simple-drawer-bg-color;
|
||||
// common
|
||||
position: fixed;
|
||||
overflow: auto;
|
||||
|
||||
&.closeable {
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
||||
&.left {
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
&.right {
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
&.up {
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&.down {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
width: $--simple-drawer-close-width;
|
||||
height: $--simple-drawer-close-width;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 20px;
|
||||
transform: translate(-50%, -50%);
|
||||
color: currentColor;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
|
||||
.leftright {
|
||||
height: 4px;
|
||||
width: $--simple-drawer-close-width;
|
||||
position: absolute;
|
||||
margin-top: math.div($--simple-drawer-close-width, 2);
|
||||
background-color: $--simple-drawer-softorange;
|
||||
border-radius: 2px;
|
||||
transform: rotate(45deg);
|
||||
transition: all 0.3s ease-in;
|
||||
}
|
||||
|
||||
.rightleft {
|
||||
height: 4px;
|
||||
width: $--simple-drawer-close-width;
|
||||
position: absolute;
|
||||
margin-top: math.div($--simple-drawer-close-width, 2);
|
||||
background-color: $--simple-drawer-softorange;
|
||||
border-radius: 2px;
|
||||
transform: rotate(-45deg);
|
||||
transition: all 0.3s ease-in;
|
||||
}
|
||||
|
||||
.close {
|
||||
margin: 60px 0 0 5px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
&:hover .leftright {
|
||||
transform: rotate(-45deg);
|
||||
background-color: $--simple-drawer-tomatored;
|
||||
}
|
||||
|
||||
&:hover .rightleft {
|
||||
transform: rotate(45deg);
|
||||
background-color: $--simple-drawer-tomatored;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mask {
|
||||
position: fixed;
|
||||
background: grey;
|
||||
opacity: 0.5;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.slider-tooltip,
|
||||
.slider-connect {
|
||||
background: $primary !important;
|
||||
}
|
||||
|
||||
.slider-horizontal .slider-tooltip-top:before {
|
||||
border: $primary !important;
|
||||
}
|
||||
|
||||
.slider-touch-area {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.slider-tooltip {
|
||||
border-color: $primary !important;
|
||||
}
|
||||
|
||||
// modal
|
||||
.v-modal-custom {
|
||||
.modal-dialog {
|
||||
.modal-content {
|
||||
z-index: 1056;
|
||||
}
|
||||
}
|
||||
|
||||
.v-modal-footer {
|
||||
padding: var(--vz-modal-padding) 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-toggle::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
// ===========================
|
||||
.advance-form-switches {
|
||||
.vue-switcher-theme--custom {
|
||||
&.vue-switcher-color--secondary {
|
||||
&.vue-switcher--unchecked {
|
||||
div {
|
||||
background-color: lighten($secondary, 40%);
|
||||
|
||||
&:after {
|
||||
background-color: lighten($secondary, 2%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.vue-switcher-color--warning {
|
||||
&.vue-switcher--unchecked {
|
||||
div {
|
||||
background-color: lighten($warning, 30%);
|
||||
|
||||
&:after {
|
||||
background-color: lighten($warning, 2%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.vue-switcher-color--danger {
|
||||
&.vue-switcher--unchecked {
|
||||
div {
|
||||
background-color: lighten($danger, 20%);
|
||||
|
||||
&:after {
|
||||
background-color: lighten($danger, 2%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.vue-switcher-color--primary {
|
||||
&.vue-switcher--unchecked {
|
||||
div {
|
||||
background-color: lighten($primary, 30%);
|
||||
|
||||
&:after {
|
||||
background-color: lighten($primary, 2%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.vue-switcher-color--success {
|
||||
&.vue-switcher--unchecked {
|
||||
div {
|
||||
background-color: lighten($success, 30%);
|
||||
|
||||
&:after {
|
||||
background-color: lighten($success, 2%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.vue-switcher-color--info {
|
||||
&.vue-switcher--unchecked {
|
||||
div {
|
||||
background-color: lighten($info, 30%);
|
||||
|
||||
&:after {
|
||||
background-color: lighten($info, 2%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.crypto-buy-tabs {
|
||||
.nav-item {
|
||||
.nav-link {
|
||||
color: var(--#{$prefix}body-color);
|
||||
|
||||
&.active {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
.right {
|
||||
.conversation-list {
|
||||
.chat-dropdown {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.conversation-list {
|
||||
.chat-dropdown {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// EDITOR
|
||||
|
||||
.ck .ck-editor__main {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
|
||||
.ck.ck-editor__main>.ck-editor__editable {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.ck.ck-toolbar {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
}
|
||||
|
||||
.ck .ck-toolbar__items {
|
||||
.ck-button {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
|
||||
&:hover,
|
||||
&.active {
|
||||
background-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ck-toolbar__separator {
|
||||
background-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.ck-button__label {
|
||||
|
||||
&:hover,
|
||||
&.active {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ck .ck-list__item {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.ck .ck-icon {
|
||||
background-color: var(--#{$prefix}tertiary-bg) !important;
|
||||
}
|
||||
|
||||
.ck.ck-button.ck-on,
|
||||
a.ck.ck-button.ck-on {
|
||||
background-color: var(--#{$prefix}tertiary-bg) !important;
|
||||
}
|
||||
|
||||
.ck-dropdown__panel,
|
||||
.ck-labeled-field-view {
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
}
|
||||
|
||||
.ck .ck-input,
|
||||
.ck-labeled-field-view__status,
|
||||
.ck-media-form,
|
||||
.ck-link-form {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.ck-link-form{
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
|
@ -0,0 +1,111 @@
|
|||
// Dark color mode variables
|
||||
//
|
||||
// Custom variables for the `[data-bs-theme="dark"]` theme. Use this as a starting point for your own custom color modes by creating a new theme-specific file like `_variables-dark.scss` and adding the variables you need.
|
||||
|
||||
//
|
||||
// Global colors
|
||||
//
|
||||
|
||||
// scss-docs-start sass-dark-mode-vars
|
||||
// scss-docs-start theme-text-dark-variables
|
||||
$primary-text-emphasis-dark: tint-color($primary, 40%);
|
||||
$secondary-text-emphasis-dark: tint-color($secondary, 40%);
|
||||
$success-text-emphasis-dark: tint-color($success, 40%);
|
||||
$info-text-emphasis-dark: tint-color($info, 40%);
|
||||
$warning-text-emphasis-dark: tint-color($warning, 40%);
|
||||
$danger-text-emphasis-dark: tint-color($danger, 40%);
|
||||
$light-text-emphasis-dark: $gray-100;
|
||||
$dark-text-emphasis-dark: $gray-300;
|
||||
// scss-docs-end theme-text-dark-variables
|
||||
|
||||
// scss-docs-start theme-bg-subtle-dark-variables
|
||||
$primary-bg-subtle-dark: rgba($primary, 0.25);
|
||||
$secondary-bg-subtle-dark: rgba($secondary, 0.25);
|
||||
$success-bg-subtle-dark: rgba($success, 0.25);
|
||||
$info-bg-subtle-dark: rgba($info, 0.25);
|
||||
$warning-bg-subtle-dark: rgba($warning, 0.25);
|
||||
$danger-bg-subtle-dark: rgba($danger, 0.25);
|
||||
$light-bg-subtle-dark: $gray-800;
|
||||
$dark-bg-subtle-dark: rgba($dark, 0.25);
|
||||
// scss-docs-end theme-bg-subtle-dark-variables
|
||||
|
||||
// scss-docs-start theme-border-subtle-dark-variables
|
||||
$primary-border-subtle-dark: shade-color($primary, 40%);
|
||||
$secondary-border-subtle-dark: shade-color($secondary, 40%);
|
||||
$success-border-subtle-dark: shade-color($success, 40%);
|
||||
$info-border-subtle-dark: shade-color($info, 40%);
|
||||
$warning-border-subtle-dark: shade-color($warning, 40%);
|
||||
$danger-border-subtle-dark: shade-color($danger, 40%);
|
||||
$light-border-subtle-dark: $gray-700;
|
||||
$dark-border-subtle-dark: $gray-800;
|
||||
// scss-docs-end theme-border-subtle-dark-variables
|
||||
|
||||
$body-color-dark: #a6b0cf;
|
||||
$body-bg-dark: #222736;
|
||||
$body-secondary-color-dark: #c3cbe4;
|
||||
$body-secondary-bg-dark: #2a3042;
|
||||
$body-tertiary-color-dark: #f6f6f6;
|
||||
$body-tertiary-bg-dark: #32394e;
|
||||
$body-emphasis-color-dark: $white;
|
||||
$border-color-dark: #32394e;
|
||||
$border-color-translucent-dark: #353d55;
|
||||
$headings-color-dark: #f6f6f6;
|
||||
$link-color-dark: $primary;
|
||||
$link-hover-color-dark: shift-color($link-color-dark, -$link-shade-percentage);
|
||||
$code-color-dark: $code-color;
|
||||
|
||||
|
||||
//
|
||||
// Forms
|
||||
//
|
||||
|
||||
$form-select-indicator-color-dark: $body-color-dark;
|
||||
$form-select-indicator-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-select-indicator-color-dark}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/></svg>");
|
||||
|
||||
$form-switch-color-dark: rgba($white, .25);
|
||||
$form-switch-bg-image-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color-dark}'/></svg>");
|
||||
|
||||
// scss-docs-start form-validation-colors-dark
|
||||
$form-valid-color-dark: $green-300;
|
||||
$form-valid-border-color-dark: $green-300;
|
||||
$form-invalid-color-dark: $red-300;
|
||||
$form-invalid-border-color-dark: $red-300;
|
||||
// scss-docs-end form-validation-colors-dark
|
||||
|
||||
|
||||
//
|
||||
// Accordion
|
||||
//
|
||||
|
||||
$accordion-icon-color-dark: $primary-text-emphasis-dark;
|
||||
$accordion-icon-active-color-dark: $primary-text-emphasis-dark;
|
||||
|
||||
$accordion-button-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color-dark}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>");
|
||||
$accordion-button-active-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color-dark}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>");
|
||||
// scss-docs-end sass-dark-mode-vars
|
||||
|
||||
/* =============================Custom Variables========================== */
|
||||
|
||||
$header-bg-dark: #262b3c;
|
||||
$header-item-color-dark: #a6b0cf;
|
||||
|
||||
//topbra dark
|
||||
$header-dark-bg-dark: $primary;
|
||||
$header-dark-item-color-dark: #e9ecef;
|
||||
$topbar-search-bg-dark: #2a3042;
|
||||
|
||||
// Footer
|
||||
$footer-bg-dark: #262b3c;
|
||||
$footer-color-dark: #a6b0cf;
|
||||
|
||||
// Horizontal nav
|
||||
$topnav-bg-dark: #282e3f;
|
||||
$menu-item-color-dark: #a6b0cf;
|
||||
$menu-item-active-color-dark: #556ee6;
|
||||
|
||||
$boxed-body-bg-dark: #32394f;
|
||||
|
||||
|
||||
// Display
|
||||
$display-none-dark: block;
|
||||
$display-block-dark: none;
|
|
@ -1,7 +1,7 @@
|
|||
/*
|
||||
Template Name: Skote - Admin & Dashboard Template
|
||||
Author: Themesbrand
|
||||
Version: 3.0.0
|
||||
Version: 4.1.0.
|
||||
Website: https://themesbrand.com/
|
||||
Contact: themesbrand@gmail.com
|
||||
File: Main Css File
|
||||
|
@ -14,11 +14,13 @@ File: Main Css File
|
|||
@import "./node_modules/bootstrap/scss/functions";
|
||||
@import "./node_modules/bootstrap/scss/variables";
|
||||
@import "variables";
|
||||
@import "./node_modules/bootstrap/scss/mixins.scss";
|
||||
@import "variables-dark";
|
||||
@import "./node_modules/bootstrap/scss/mixins";
|
||||
|
||||
@import "bootstrap";
|
||||
@import "icons";
|
||||
|
||||
|
||||
// Structure
|
||||
@import "custom/structure/general";
|
||||
@import "custom/structure/topbar";
|
||||
|
@ -43,6 +45,7 @@ File: Main Css File
|
|||
// Plugins
|
||||
@import "custom/plugins/custom-scrollbar";
|
||||
@import "custom/plugins/calendar";
|
||||
@import "custom/plugins/calendar-full";
|
||||
@import "custom/plugins/dragula";
|
||||
@import "custom/plugins/session-timeout";
|
||||
@import "custom/plugins/range-slider";
|
||||
|
@ -69,8 +72,6 @@ File: Main Css File
|
|||
@import "custom/plugins/sparkline-chart";
|
||||
@import "custom/plugins/google-map";
|
||||
@import "custom/plugins/vector-maps";
|
||||
@import "custom/plugins/leaflet-maps";
|
||||
@import "custom/plugins/carousel";
|
||||
@import "custom/plugins/chartist";
|
||||
|
||||
// Pages
|
||||
|
@ -85,6 +86,7 @@ File: Main Css File
|
|||
@import "custom/pages/coming-soon";
|
||||
@import "custom/pages/timeline";
|
||||
@import "custom/pages/extras-pages";
|
||||
@import "custom/pages/jobs";
|
||||
|
||||
@import "./custom";
|
||||
|
||||
|
@ -97,4 +99,4 @@ File: Main Css File
|
|||
// @import "custom/rtl/spacing-rtl";
|
||||
// @import "custom/rtl/text-rtl";
|
||||
// @import "custom/rtl/components-rtl";
|
||||
// @import "custom/rtl/bootstrap-rtl";
|
||||
// @import "custom/rtl/bootstrap-rtl";
|
|
@ -1,7 +1,7 @@
|
|||
/*
|
||||
Template Name: Skote - Admin & Dashboard Template
|
||||
Author: Themesbrand
|
||||
Version: 3.0.0
|
||||
Version: 4.1.0.
|
||||
Website: https://themesbrand.com/
|
||||
Contact: themesbrand@gmail.com
|
||||
File: Custom Bootstrap Css File
|
||||
|
@ -11,11 +11,12 @@ File: Custom Bootstrap Css File
|
|||
//Core files
|
||||
@import "./node_modules/bootstrap/scss/functions";
|
||||
@import "./node_modules/bootstrap/scss/variables";
|
||||
@import "variables";
|
||||
@import "variables-dark";
|
||||
@import "./node_modules/bootstrap/scss/bootstrap";
|
||||
|
||||
@import "custom/components/root";
|
||||
@import "custom/components/reboot";
|
||||
@import "custom/components/backgrounds";
|
||||
@import "custom/components/badge";
|
||||
@import "custom/components/buttons";
|
||||
@import "custom/components/breadcrumb";
|
|
@ -7,9 +7,9 @@
|
|||
.accordion-list {
|
||||
display: flex;
|
||||
border-radius: 7px;
|
||||
background-color: $gray-300;
|
||||
background-color: var(--#{$prefix}tertiary-bg);
|
||||
padding: 12px 20px;
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
font-weight: $font-weight-semibold;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
@ -27,7 +27,7 @@
|
|||
height: 24px;
|
||||
width: 24px;
|
||||
line-height: 22px;
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
@ -47,6 +47,6 @@
|
|||
|
||||
|
||||
.card-body {
|
||||
color: $text-muted;
|
||||
color: var(--#{prefix}secondary-color);
|
||||
}
|
||||
}
|
|
@ -32,7 +32,7 @@
|
|||
background-color: $primary;
|
||||
color: $white;
|
||||
display: flex;
|
||||
font-weight: $fw-medium;
|
||||
font-weight: $font-weight-medium;
|
||||
height: 100%;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
|
@ -45,7 +45,7 @@
|
|||
flex-wrap: wrap;
|
||||
.avatar-group-item {
|
||||
margin-left: -12px;
|
||||
border: 2px solid $card-bg;
|
||||
border: 2px solid var(--#{$prefix}secondary-bg);
|
||||
border-radius: 50%;
|
||||
transition: all 0.2s;
|
||||
&:hover{
|
|
@ -0,0 +1,70 @@
|
|||
//
|
||||
// _badge.scss
|
||||
//
|
||||
|
||||
|
||||
.badge {
|
||||
&[href] {
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Soft badge
|
||||
@mixin badge-variant-soft($bg) {
|
||||
color: $bg;
|
||||
background-color: rgba($bg, 0.18);
|
||||
|
||||
&[href] {
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $bg;
|
||||
text-decoration: none;
|
||||
background-color: rgba($bg, 0.4);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@each $color, $value in $theme-colors {
|
||||
.badge {
|
||||
&.bg-#{$color} {
|
||||
&[href] {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: darken($value, 4%) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.badge{
|
||||
&.bg-light{
|
||||
color: var(--#{$prefix}body-color);
|
||||
|
||||
&[href] {
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.badge-soft-#{$color} {
|
||||
@include badge-variant-soft($value);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.rounded-pill{
|
||||
padding-right: .6em;
|
||||
padding-left: .6em;
|
||||
}
|
||||
|
||||
// Dark badge
|
||||
|
||||
.badge.bg-dark{
|
||||
color: var(--#{$prefix}light);
|
||||
}
|
|
@ -7,7 +7,7 @@
|
|||
// Breadcrumb item arrow
|
||||
.breadcrumb-item {
|
||||
> a {
|
||||
color: $gray-700;
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
}
|
||||
+.breadcrumb-item {
|
||||
&::before {
|
|
@ -0,0 +1,136 @@
|
|||
//
|
||||
// _buttons.scss
|
||||
//
|
||||
|
||||
button,
|
||||
a {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
// Rounded Buttons
|
||||
.btn-rounded {
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
&:focus {
|
||||
box-shadow: $btn-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
.header-item{
|
||||
.btn{
|
||||
&:active,&.show,&:focus{
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-toggle{
|
||||
&.btn{
|
||||
&:active,&.show,&:focus{
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// example 1
|
||||
|
||||
.btn-group-example {
|
||||
.btn {
|
||||
position: relative;
|
||||
|
||||
&:first-child {
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "OR";
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--#{$prefix}secondary-color);
|
||||
color: var(--#{$prefix}secondary-bg);
|
||||
border: 1px solid var(--#{$prefix}secondary-bg);
|
||||
left: -12px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Example 2
|
||||
|
||||
.btn-label {
|
||||
position: relative;
|
||||
padding-left: 44px;
|
||||
.label-icon {
|
||||
position: absolute;
|
||||
width: 32px;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-color: rgba($white, 0.1);
|
||||
border-right: 1px solid rgba($white, 0.1);
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
&.btn-light {
|
||||
.label-icon {
|
||||
background-color: rgba($dark, 0.1);
|
||||
border-right: 1px solid rgba($dark, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.btn-group-vertical{
|
||||
label {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Soft Buttons
|
||||
//
|
||||
|
||||
@mixin button-variant-soft($bg) {
|
||||
color: $bg;
|
||||
background-color: rgba($bg, 0.1);
|
||||
border-color: transparent;
|
||||
transition: all 0.5s ease;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: $white;
|
||||
background-color: $bg;
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
@each $color,
|
||||
$value in $theme-colors {
|
||||
.btn-soft-#{$color} {
|
||||
@include button-variant-soft($value);
|
||||
}
|
||||
}
|
||||
|
||||
.like-btn {
|
||||
&.active {
|
||||
.bx-heart {
|
||||
color: $danger;
|
||||
&:before {
|
||||
content: "\ec8f";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -8,17 +8,17 @@
|
|||
}
|
||||
|
||||
.card-drop {
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 15px;
|
||||
margin: 0 0 7px 0;
|
||||
font-weight: $font-weight-semibold;
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
}
|
||||
|
||||
.card-title-desc {
|
||||
color: $card-title-desc;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
margin-bottom: 24px;
|
||||
}
|
|
@ -2,22 +2,14 @@
|
|||
// _demos.scss
|
||||
//
|
||||
|
||||
// Demo Only
|
||||
.button-items {
|
||||
margin-left: -8px;
|
||||
margin-bottom: -12px;
|
||||
|
||||
.btn {
|
||||
margin-bottom: 12px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
// Lightbox
|
||||
|
||||
.mfp-popup-form {
|
||||
max-width: 1140px;
|
||||
}
|
||||
.mfp-close{
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
}
|
||||
|
||||
// Modals
|
||||
|
||||
|
@ -31,6 +23,11 @@
|
|||
display: block;
|
||||
}
|
||||
|
||||
[dir="rtl"]{
|
||||
.modal-open{
|
||||
padding-left: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
// Icon demo ( Demo only )
|
||||
.icon-demo-content {
|
||||
|
@ -41,7 +38,7 @@
|
|||
display: block;
|
||||
font-size: 24px;
|
||||
margin-bottom: 16px;
|
||||
color: $gray-600;
|
||||
color: var(--#{prefix}secondary-color);
|
||||
transition: all 0.4s;
|
||||
}
|
||||
|
||||
|
@ -62,10 +59,10 @@
|
|||
|
||||
.grid-structure {
|
||||
.grid-container {
|
||||
background-color: $gray-100;
|
||||
background-color: var(--#{$prefix}gray-100);
|
||||
margin-top: 10px;
|
||||
font-size: .8rem;
|
||||
font-weight: $fw-medium;
|
||||
font-weight: $font-weight-medium;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
}
|
||||
|
@ -74,9 +71,9 @@
|
|||
// card radio
|
||||
|
||||
.card-radio{
|
||||
background-color: $card-bg;
|
||||
border: 2px solid $card-border-color;
|
||||
border-radius: $border-radius;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
border: 2px solid var(--#{$prefix}border-color);
|
||||
border-radius: var(--#{$prefix}border-radius);
|
||||
padding: 1rem;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
|
@ -0,0 +1,98 @@
|
|||
//
|
||||
// _dropdown.scss
|
||||
//
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: $box-shadow-lg;
|
||||
animation-name: DropDownSlide;
|
||||
animation-duration: 0.3s;
|
||||
animation-fill-mode: both;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
|
||||
&.show {
|
||||
top: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.dropdown-menu-end[style] {
|
||||
left: auto !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
|
||||
.dropdown-menu[data-popper-placement^="right"],
|
||||
.dropdown-menu[data-popper-placement^="top"],
|
||||
.dropdown-menu[data-popper-placement^="left"] {
|
||||
top: auto !important;
|
||||
animation: none !important;
|
||||
}
|
||||
|
||||
@keyframes DropDownSlide {
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
0% {
|
||||
transform: translateY(10px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 600px) {
|
||||
.dropdown-menu-lg {
|
||||
width: 320px;
|
||||
}
|
||||
|
||||
.dropdown-menu-md {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
|
||||
// Dropdown Mega Menu
|
||||
|
||||
.dropdown-mega {
|
||||
position: static !important;
|
||||
}
|
||||
|
||||
.dropdown-megamenu[style] {
|
||||
padding: 20px;
|
||||
left: 20px !important;
|
||||
right: 20px !important;
|
||||
}
|
||||
|
||||
// Dropdown size
|
||||
|
||||
.dropdown-mega-menu-xl {
|
||||
width: 40rem;
|
||||
}
|
||||
|
||||
.dropdown-mega-menu-lg {
|
||||
width: 26rem;
|
||||
}
|
||||
|
||||
|
||||
.dropdown-menu-right {
|
||||
position: absolute;
|
||||
right: 0 !important;
|
||||
}
|
||||
|
||||
.dropdown-toggle.dropdown-toggle-split span {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.dropdown-toggle.dropdown-toggle-split:before {
|
||||
display: block;
|
||||
|
||||
content: "\f0140";
|
||||
font-family: "Material Design Icons";
|
||||
font-size: 12px;
|
||||
|
||||
}
|
||||
|
||||
.job-list-dropdown {
|
||||
.dropdown-menu.show {
|
||||
left: -144px !important;
|
||||
}
|
||||
}
|
|
@ -47,14 +47,14 @@
|
|||
|
||||
.form-check-input {
|
||||
border-width: 2px;
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
|
||||
&:active {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
&:checked {
|
||||
background-color: $card-bg !important;
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
|
||||
&[type=checkbox] {
|
||||
background-image: none;
|
||||
|
@ -69,7 +69,7 @@
|
|||
left: 1px;
|
||||
/*rtl: -4px */
|
||||
font-size: 16px;
|
||||
color: $dark;
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -79,7 +79,7 @@
|
|||
|
||||
.form-radio-outline {
|
||||
.form-check-input {
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
position: relative;
|
||||
|
||||
&:active {
|
||||
|
@ -87,10 +87,11 @@
|
|||
}
|
||||
|
||||
&:checked {
|
||||
background-color: $card-bg !important;
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
|
||||
&[type=checkbox] {
|
||||
background-image: none;
|
||||
|
||||
}
|
||||
|
||||
&:after {
|
||||
|
@ -106,6 +107,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// checkbox color
|
||||
|
||||
@each $color,
|
||||
|
@ -133,6 +136,8 @@ $value in $theme-colors {
|
|||
}
|
||||
}
|
||||
|
||||
.form-check,
|
||||
.form-check-input,
|
||||
.form-check-label {
|
||||
cursor: pointer;
|
||||
margin-bottom: 0;
|
||||
|
@ -157,6 +162,7 @@ $value in $theme-colors {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.form-switch-lg {
|
||||
padding-left: 2.75rem;
|
||||
min-height: 28px;
|
||||
|
@ -174,83 +180,51 @@ $value in $theme-colors {
|
|||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.custom-control-input:checked[type=radio] {
|
||||
background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$form-check-input-checked-color}'/></svg>");
|
||||
// form select
|
||||
|
||||
.multiselect {
|
||||
width: 151% !important;
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
border: var(--#{$prefix}border-width) solid var(--#{$prefix}border-color-translucent) !important;
|
||||
}
|
||||
|
||||
.custom-control-input:checked {
|
||||
background-color: #556ee6;
|
||||
border-color: #556ee6;
|
||||
}
|
||||
.multiselect-dropdown {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
color: $input-color !important;
|
||||
border: var(--#{$prefix}border-width) solid var(--#{$prefix}border-color-translucent) !important;
|
||||
|
||||
.multiselect-option span {
|
||||
color: $input-color !important;
|
||||
}
|
||||
|
||||
.custom-radio {
|
||||
.custom-control-input {
|
||||
appearance: none;
|
||||
width: $form-check-input-width;
|
||||
height: $form-check-input-width;
|
||||
background-color: $form-check-input-bg;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
border: $form-check-input-border;
|
||||
vertical-align: middle;
|
||||
|
||||
|
||||
&[type="radio"] {
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: $form-check-radio-border-radius;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:checked {
|
||||
background-color: $form-check-input-checked-bg-color;
|
||||
border-color: $form-check-input-checked-border-color;
|
||||
|
||||
&[type=radio] {
|
||||
background-image: escape-svg($form-check-radio-checked-bg-image);
|
||||
}
|
||||
}
|
||||
|
||||
.multiselect-option:hover, .multiselect-option.is-pointed {
|
||||
background-color: var(--#{$prefix}light) !important;
|
||||
color: $input-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
.multiselect-option.is-selected.is-pointed {
|
||||
background-color: $primary !important;
|
||||
}
|
||||
|
||||
.custom-checkbox {
|
||||
.custom-control-input {
|
||||
appearance: none;
|
||||
width: $form-check-input-width;
|
||||
height: $form-check-input-width;
|
||||
background-color: $form-check-input-bg;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
border: $form-check-input-border;
|
||||
vertical-align: middle;
|
||||
.multiselect-option.is-selected {
|
||||
background-color: $primary !important;
|
||||
}
|
||||
|
||||
.multiselect.is-active {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
&[type="checkbox"] {
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:checked {
|
||||
background-color: $form-check-input-checked-bg-color;
|
||||
border-color: $form-check-input-checked-border-color;
|
||||
|
||||
&[type=checkbox] {
|
||||
background-image: escape-svg($form-check-input-checked-bg-image);
|
||||
}
|
||||
}
|
||||
.multiselect-single-label-text {
|
||||
font-size: small !important;
|
||||
}
|
||||
|
||||
.multiselect-option {
|
||||
span {
|
||||
font-size: small !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.form-select {
|
||||
padding: 0.47rem 1.75rem 0.47rem 0.75rem;
|
||||
.multiselect-multiple-label {
|
||||
font-size: small !important;
|
||||
}
|
|
@ -0,0 +1,104 @@
|
|||
//
|
||||
// _helper.scss
|
||||
//
|
||||
|
||||
.font-size-10 {
|
||||
font-size: 10px !important;
|
||||
}
|
||||
|
||||
.font-size-11 {
|
||||
font-size: 11px !important;
|
||||
}
|
||||
|
||||
.font-size-12 {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
.font-size-13 {
|
||||
font-size: 13px !important;
|
||||
}
|
||||
|
||||
.font-size-14 {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
.font-size-15 {
|
||||
font-size: 15px !important;
|
||||
}
|
||||
|
||||
.font-size-16 {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.font-size-17 {
|
||||
font-size: 17px !important;
|
||||
}
|
||||
|
||||
.font-size-18 {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
|
||||
.font-size-20 {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
|
||||
.font-size-22 {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
|
||||
.font-size-24 {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
// Social
|
||||
.social-list-item {
|
||||
height: 2rem;
|
||||
width: 2rem;
|
||||
line-height: calc(2rem - 4px);
|
||||
display: block;
|
||||
border: 2px solid $gray-500;
|
||||
border-radius: 50%;
|
||||
color: $gray-500;
|
||||
text-align: center;
|
||||
transition: all 0.4s;
|
||||
|
||||
&:hover {
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
background-color: $gray-200;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.w-xs {
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
.w-sm {
|
||||
min-width: 95px;
|
||||
}
|
||||
|
||||
.w-md {
|
||||
min-width: 110px;
|
||||
}
|
||||
|
||||
.w-lg {
|
||||
min-width: 140px;
|
||||
}
|
||||
|
||||
.w-xl {
|
||||
min-width: 160px;
|
||||
}
|
||||
|
||||
|
||||
// alert
|
||||
|
||||
.alert-dismissible {
|
||||
.btn-close {
|
||||
font-size: 10px;
|
||||
padding: $alert-padding-y * 1.4 $alert-padding-x;
|
||||
}
|
||||
}
|
||||
|
||||
.chartjs-chart {
|
||||
max-height: 300px;
|
||||
}
|
|
@ -0,0 +1,142 @@
|
|||
//
|
||||
// _nav.scss
|
||||
//
|
||||
|
||||
.nav-tabs,
|
||||
.nav-pills {
|
||||
>li {
|
||||
>a {
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-pills {
|
||||
>a {
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.nav-tabs-custom {
|
||||
border-bottom: 2px solid var(--#{$prefix}border-color);
|
||||
|
||||
.nav-item {
|
||||
position: relative;
|
||||
color: var(--#{$prefix}body-color);
|
||||
|
||||
.nav-link {
|
||||
border: none;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
background: $primary;
|
||||
height: 2px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: -1px;
|
||||
transition: all 250ms ease 0s;
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: $primary;
|
||||
|
||||
&:after {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// vertical nav
|
||||
|
||||
.vertical-nav {
|
||||
.nav {
|
||||
.nav-link {
|
||||
padding: 24px 16px;
|
||||
text-align: center;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.nav-icon {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// tabs & accordion.scss
|
||||
|
||||
.default-tabs {
|
||||
.nav-tabs {
|
||||
.nav-item {
|
||||
.nav-link {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
font-weight: 500 !important;
|
||||
|
||||
&:hover {
|
||||
color: var(--#{$prefix}primary) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-pills {
|
||||
&.nav-justified {
|
||||
.nav-item {
|
||||
.nav-link {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
font-weight: 500 !important;
|
||||
|
||||
&:hover {
|
||||
color: var(--#{$prefix}primary) !important;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.vertical-pills {
|
||||
.nav-item {
|
||||
.nav-link {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
width: 100%;
|
||||
font-weight: 500 !important;
|
||||
|
||||
&:hover {
|
||||
color: var(--#{$prefix}primary) !important;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-tabs-custom {
|
||||
.nav-item {
|
||||
.nav-link {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
font-weight: 500 !important;
|
||||
|
||||
&:hover {
|
||||
color: var(--#{$prefix}primary) !important;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: var(--#{$prefix}primary) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -8,7 +8,7 @@
|
|||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
z-index: 9999;
|
||||
}
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
position: absolute;
|
||||
top: -12px;
|
||||
.avatar-title{
|
||||
background: $card-bg;
|
||||
background: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
}
|
||||
}
|
|
@ -7,10 +7,10 @@ html {
|
|||
min-height: 100%;
|
||||
}
|
||||
|
||||
.h1,.h2,.h3,.h4,.h5,.h6,
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
color: $gray-700;
|
||||
}
|
||||
// .h1,.h2,.h3,.h4,.h5,.h6,
|
||||
// h1,h2,h3,h4,h5,h6 {
|
||||
// color: $gray-700;
|
||||
// }
|
||||
|
||||
a {
|
||||
text-decoration: none !important;
|
||||
|
@ -25,12 +25,12 @@ label {
|
|||
|
||||
.blockquote {
|
||||
padding: 10px 20px;
|
||||
border-left: 4px solid $gray-300;
|
||||
border-left: 4px solid var(--#{$variable-prefix}border-color);
|
||||
}
|
||||
|
||||
.blockquote-reverse {
|
||||
border-left: 0;
|
||||
border-right: 4px solid $gray-300;
|
||||
border-right: 4px solid var(--#{$variable-prefix}border-color);
|
||||
text-align: right;
|
||||
}
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
//
|
||||
// root.scss
|
||||
//
|
||||
|
||||
//theme-light
|
||||
:root {
|
||||
// Topbar - Default Light
|
||||
--#{$prefix}header-bg: #{$header-bg};
|
||||
--#{$prefix}header-item-color: #{$header-item-color};
|
||||
|
||||
// Topbar - Dark
|
||||
--#{$prefix}header-dark-bg: #{$header-dark-bg};
|
||||
--#{$prefix}header-dark-item-color: #{$header-dark-item-color};
|
||||
|
||||
--#{$prefix}topbar-search-bg: #{$topbar-search-bg};
|
||||
|
||||
// Footer
|
||||
--#{$prefix}footer-bg: #{$footer-bg};
|
||||
--#{$prefix}footer-color: #{$footer-color};
|
||||
|
||||
// Horizontal nav
|
||||
--#{$prefix}topnav-bg: #{$topnav-bg};
|
||||
--#{$prefix}menu-item-color: #{$menu-item-color};
|
||||
--#{$prefix}menu-item-active-color: #{$menu-item-active-color};
|
||||
|
||||
// Boxed layout width
|
||||
--#{$prefix}boxed-body-bg: #{$boxed-body-bg};
|
||||
|
||||
--#{$prefix}display-none: #{$display-none};
|
||||
--#{$prefix}display-block: #{$display-block};
|
||||
}
|
||||
|
||||
//theme dark
|
||||
@if $enable-dark-mode {
|
||||
@include color-mode(dark, true) {
|
||||
// Topbar - Default Light
|
||||
--#{$prefix}header-bg: #{$header-bg-dark};
|
||||
--#{$prefix}header-item-color: #{$header-item-color-dark};
|
||||
|
||||
// Topbar - Dark
|
||||
--#{$prefix}header-dark-bg: #{$header-dark-bg-dark};
|
||||
--#{$prefix}header-dark-item-color: #{$header-dark-item-color-dark};
|
||||
--#{$prefix}topbar-search-bg: #{$topbar-search-bg-dark};
|
||||
|
||||
// Footer
|
||||
--#{$prefix}footer-bg: #{$footer-bg-dark};
|
||||
--#{$prefix}footer-color: #{$footer-color-dark};
|
||||
|
||||
// Horizontal nav
|
||||
--#{$prefix}topnav-bg: #{$topnav-bg-dark};
|
||||
--#{$prefix}menu-item-color: #{$menu-item-color-dark};
|
||||
--#{$prefix}menu-item-active-color: #{$menu-item-active-color-dark};
|
||||
|
||||
// Boxed layout width
|
||||
--#{$prefix}boxed-body-bg: #{$boxed-body-bg-dark};
|
||||
|
||||
// component variable
|
||||
--#{$prefix}light: #{$body-tertiary-bg-dark};
|
||||
--#{$prefix}light-rgb: #{to-rgb($body-tertiary-bg-dark)};
|
||||
--#{$prefix}dark: #{$body-tertiary-color-dark};
|
||||
--#{$prefix}dark-rgb: #{to-rgb($body-tertiary-color-dark)};
|
||||
|
||||
--#{$prefix}display-none: #{$display-none-dark};
|
||||
--#{$prefix}display-block: #{$display-block-dark};
|
||||
|
||||
.btn-light {
|
||||
--#{$prefix}btn-color: #{$body-secondary-color-dark};
|
||||
--#{$prefix}btn-bg: #{$body-tertiary-bg-dark};
|
||||
--#{$prefix}btn-border-color: #{$body-tertiary-bg-dark};
|
||||
}
|
||||
|
||||
.btn-outline-light {
|
||||
--#{$prefix}btn-color: #{$body-secondary-color-dark};
|
||||
--#{$prefix}btn-border-color: #{$body-tertiary-bg-dark};
|
||||
}
|
||||
|
||||
.btn-light,
|
||||
.btn-outline-light {
|
||||
--#{$prefix}btn-hover-color: #{$body-secondary-color-dark};
|
||||
--#{$prefix}btn-hover-bg: #{$body-tertiary-bg-dark};
|
||||
--#{$prefix}btn-hover-border-color: #{$body-tertiary-bg-dark};
|
||||
--#{$prefix}btn-active-color: #{$body-secondary-color-dark};
|
||||
--#{$prefix}btn-active-bg: #{$body-tertiary-bg-dark};
|
||||
--#{$prefix}btn-active-border-color: #{$body-tertiary-bg-dark};
|
||||
--#{$prefix}btn-focus-shadow-rgb: #{to-rgb($body-tertiary-bg-dark)};
|
||||
}
|
||||
|
||||
.btn-dark {
|
||||
--#{$prefix}btn-bg: #{$body-color-dark};
|
||||
--#{$prefix}btn-border-color: #{$body-color-dark};
|
||||
--#{$prefix}btn-hover-bg: #{$body-color-dark};
|
||||
}
|
||||
|
||||
.btn-outline-dark {
|
||||
--#{$prefix}btn-color: #{$body-color-dark};
|
||||
--#{$prefix}btn-border-color: #{$body-color-dark};
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
--#{$prefix}dropdown-border-width: 1px;
|
||||
}
|
||||
|
||||
.table-light {
|
||||
--bs-table-color: #a6b0cf;
|
||||
--bs-table-bg: #32394e;
|
||||
--bs-table-border-color: #32394e;
|
||||
}
|
||||
|
||||
.table-dark {
|
||||
--bs-table-color: #a6b0cf;
|
||||
--bs-table-bg: #32394e;
|
||||
--bs-table-border-color: #3a425a;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
|
@ -5,36 +5,24 @@
|
|||
.table {
|
||||
th {
|
||||
font-weight: $font-weight-bold;
|
||||
&:focus {
|
||||
outline: none !important
|
||||
}
|
||||
}
|
||||
|
||||
.table-light{
|
||||
color: $body-color;
|
||||
border-color: $table-border-color;
|
||||
background-color: $table-head-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.table-bordered {
|
||||
border: $table-border-width solid $table-border-color;
|
||||
|
||||
th,
|
||||
td {
|
||||
border: $table-border-width solid $table-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.table-dark>:not(:last-child)>:last-child>*{
|
||||
border-bottom-color: $table-dark-border-color;
|
||||
}
|
||||
|
||||
|
||||
.table-bordered {
|
||||
border: $table-border-width solid $table-border-color;
|
||||
}
|
||||
|
||||
.table-nowrap {
|
||||
th, td {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.table>:not(:first-child) {
|
||||
border-top: 0;
|
||||
}
|
|
@ -14,15 +14,15 @@
|
|||
|
||||
.auth-logo{
|
||||
.auth-logo-dark{
|
||||
display: $display-block;
|
||||
display: var(--#{$prefix}display-block);
|
||||
}
|
||||
.auth-logo-light{
|
||||
display: $display-none;
|
||||
display: var(--#{$prefix}display-none);
|
||||
}
|
||||
}
|
||||
|
||||
.auth-body-bg{
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
|
||||
|
||||
|
@ -56,7 +56,7 @@
|
|||
}
|
||||
|
||||
.bg-overlay{
|
||||
background: url("~@/assets/images/bg-auth-overlay.png");
|
||||
background: url("../images/bg-auth-overlay.png");
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
|
@ -0,0 +1,242 @@
|
|||
//
|
||||
// Chat.scss
|
||||
//
|
||||
|
||||
.chat-leftsidebar {
|
||||
@media (min-width: 992px) {
|
||||
min-width: 260px;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
min-width: 380px;
|
||||
}
|
||||
|
||||
.chat-leftsidebar-nav {
|
||||
.nav {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
min-height: 488px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chat-noti-dropdown {
|
||||
&.active {
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: $danger;
|
||||
border-radius: 50%;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 6px;
|
||||
box-shadow: none;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.chat-search-box {
|
||||
.form-control {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.chat-list {
|
||||
margin: 0;
|
||||
li {
|
||||
&.active {
|
||||
a {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
border-color: transparent;
|
||||
box-shadow: $box-shadow;
|
||||
}
|
||||
}
|
||||
a {
|
||||
display: block;
|
||||
padding: 14px 16px;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
transition: all 0.4s;
|
||||
border-top: 1px solid var(--#{$prefix}border-color);
|
||||
border-radius: 4px;
|
||||
&:hover {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
border-color: transparent;
|
||||
box-shadow: $box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-chat-nav {
|
||||
.dropdown {
|
||||
.nav-btn {
|
||||
color: var(--#{$prefix}body-color);
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
line-height: 42px;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
font-size: 16px;
|
||||
background-color: var(--#{$prefix}light);
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: $box-shadow;
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chat-conversation {
|
||||
li {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.chat-day-title {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
margin-bottom: 24px;
|
||||
|
||||
.title {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 6px 24px;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: var(--#{$prefix}border-color);
|
||||
top: 10px;
|
||||
}
|
||||
.badge {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
.conversation-list {
|
||||
margin-bottom: 24px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
.ctext-wrap {
|
||||
padding: 12px 24px;
|
||||
background-color: rgba($primary, 0.1);
|
||||
border-radius: 8px 8px 8px 0px;
|
||||
overflow: hidden;
|
||||
|
||||
.conversation-name {
|
||||
font-weight: $font-weight-semibold;
|
||||
color: $primary;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
float: right;
|
||||
.dropdown-toggle {
|
||||
font-size: 18px;
|
||||
padding: 4px;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
@media (max-width: 575.98px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: $box-shadow;
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
|
||||
.chat-time {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
.conversation-list {
|
||||
float: right;
|
||||
.ctext-wrap {
|
||||
background-color: var(--#{$prefix}light);
|
||||
text-align: right;
|
||||
border-radius: 8px 8px 0px 8px;
|
||||
}
|
||||
.dropdown {
|
||||
float: left;
|
||||
}
|
||||
|
||||
&.last-chat {
|
||||
.conversation-list {
|
||||
&:before {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.last-chat {
|
||||
.conversation-list {
|
||||
&:before {
|
||||
content: "\F0009";
|
||||
font-family: "Material Design Icons";
|
||||
position: absolute;
|
||||
color: $primary;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-size: 16px;
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chat-input-section {
|
||||
border-top: 1px solid var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.chat-input {
|
||||
border-radius: 30px;
|
||||
background-color: var(--#{$prefix}light) !important;
|
||||
border-color: var(--#{$prefix}light) !important;
|
||||
padding-right: 120px;
|
||||
}
|
||||
|
||||
.chat-input-links {
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
li {
|
||||
a {
|
||||
font-size: 16px;
|
||||
line-height: 36px;
|
||||
padding: 0px 4px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chat-send {
|
||||
@media (max-width: 575.98px) {
|
||||
min-width: auto;
|
||||
}
|
||||
}
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
.contact-links{
|
||||
a{
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
|
|
@ -2,10 +2,11 @@
|
|||
// crypto.scss
|
||||
//
|
||||
|
||||
@media (min-width: 576px){
|
||||
.currency-value{
|
||||
@media (min-width: 576px) {
|
||||
.currency-value {
|
||||
position: relative;
|
||||
&:after{
|
||||
|
||||
&:after {
|
||||
content: "\F04E1";
|
||||
font-family: "Material Design Icons";
|
||||
font-size: 24px;
|
||||
|
@ -27,18 +28,19 @@
|
|||
|
||||
}
|
||||
|
||||
.crypto-buy-sell-nav-content{
|
||||
border: 2px solid $gray-300;
|
||||
.crypto-buy-sell-nav-content {
|
||||
border: 2px solid var(--#{$prefix}border-color);
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
|
||||
// KYC Application
|
||||
|
||||
.kyc-doc-verification{
|
||||
.dropzone{
|
||||
.kyc-doc-verification {
|
||||
.dropzone {
|
||||
min-height: 180px;
|
||||
.dz-message{
|
||||
|
||||
.dz-message {
|
||||
margin: 24px 0px;
|
||||
}
|
||||
}
|
||||
|
@ -49,18 +51,18 @@
|
|||
Ico Landing
|
||||
*******************/
|
||||
|
||||
.section{
|
||||
.section {
|
||||
position: relative;
|
||||
padding-top: 80px;
|
||||
padding-bottom: 80px;
|
||||
|
||||
&.bg-white{
|
||||
background-color: $card-bg !important;
|
||||
&.bg-white {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.small-title{
|
||||
color: $gray-600;
|
||||
.small-title {
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
|
@ -76,42 +78,47 @@
|
|||
border-bottom: 1px solid rgba($white, 0.1);
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
background-color: $topnav-bg;
|
||||
background-color: var(--#{$prefix}topnav-bg);
|
||||
}
|
||||
|
||||
.navbar-logo{
|
||||
|
||||
.navbar-logo {
|
||||
line-height: 70px;
|
||||
transition: all 0.4s;
|
||||
.logo-dark{
|
||||
|
||||
.logo-dark {
|
||||
display: none;
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.logo-light{
|
||||
|
||||
.logo-light {
|
||||
display: block;
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.navbar-nav{
|
||||
.nav-item{
|
||||
.nav-link{
|
||||
|
||||
.navbar-nav {
|
||||
.nav-item {
|
||||
.nav-link {
|
||||
color: rgba($white, 0.6);
|
||||
line-height: 58px;
|
||||
padding: 6px 16px;
|
||||
font-weight: $fw-medium;
|
||||
font-weight: $font-weight-medium;
|
||||
transition: all 0.4s;
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
color: $header-item-color;
|
||||
color: var(--#{$prefix}header-item-color);
|
||||
}
|
||||
|
||||
&:hover, &.active{
|
||||
color: rgba($white, 0.9);
|
||||
&:hover,
|
||||
&.active {
|
||||
color: rgba($white, 0.9);
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
color: $primary;
|
||||
|
@ -125,26 +132,30 @@
|
|||
}
|
||||
}
|
||||
|
||||
&.nav-sticky{
|
||||
background-color: $topnav-bg;
|
||||
&.nav-sticky {
|
||||
background-color: var(--#{$prefix}topnav-bg);
|
||||
box-shadow: $box-shadow;
|
||||
.navbar-logo{
|
||||
|
||||
.navbar-logo {
|
||||
line-height: 60px;
|
||||
|
||||
.logo-dark{
|
||||
display: $display-block;
|
||||
.logo-dark {
|
||||
display: var(--#{$prefix}display-block);
|
||||
}
|
||||
.logo-light{
|
||||
display: $display-none;
|
||||
|
||||
.logo-light {
|
||||
display: var(--#{$prefix}display-none);
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-nav {
|
||||
.nav-item {
|
||||
.nav-link{
|
||||
.nav-link {
|
||||
line-height: 48px;
|
||||
color: $header-item-color;
|
||||
&:hover, &.active{
|
||||
color: var(--#{$prefix}header-item-color);
|
||||
|
||||
&:hover,
|
||||
&.active {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
@ -153,7 +164,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
.bg-overlay{
|
||||
.bg-overlay {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
@ -165,12 +176,12 @@
|
|||
background-color: $black;
|
||||
}
|
||||
|
||||
.hero-section{
|
||||
.hero-section {
|
||||
padding-top: 220px;
|
||||
padding-bottom: 190px;
|
||||
|
||||
&.bg-ico-hero{
|
||||
background-image: url("~@/assets/images/crypto/bg-ico-hero.jpg");
|
||||
&.bg-ico-hero {
|
||||
background-image: url("../images/crypto/bg-ico-hero.jpg");
|
||||
background-size: cover;
|
||||
background-position: top;
|
||||
}
|
||||
|
@ -180,27 +191,30 @@
|
|||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.hero-title{
|
||||
.hero-title {
|
||||
font-size: 42px;
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
.ico-countdown{
|
||||
.ico-countdown {
|
||||
font-size: 22px;
|
||||
margin-right: -12px;
|
||||
margin-left: -12px;
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
display: block;
|
||||
}
|
||||
.coming-box{
|
||||
|
||||
.coming-box {
|
||||
margin-right: 12px;
|
||||
margin-left: 12px;
|
||||
border: 1px solid $border-color;
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
border-radius: 4px;
|
||||
padding: 8px;
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
display: inline-block;
|
||||
|
@ -208,8 +222,8 @@
|
|||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
span{
|
||||
background-color: $light;
|
||||
span {
|
||||
background-color: var(--#{$prefix}light);
|
||||
font-size: 12px;
|
||||
padding: 4px;
|
||||
margin-top: 8px;
|
||||
|
@ -217,20 +231,20 @@
|
|||
}
|
||||
}
|
||||
|
||||
.softcap-progress{
|
||||
.softcap-progress {
|
||||
overflow: visible;
|
||||
|
||||
.progress-bar{
|
||||
.progress-bar {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.progress-label{
|
||||
.progress-label {
|
||||
position: relative;
|
||||
text-align: right;
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
bottom: 20px;
|
||||
font-size: 12px;
|
||||
font-weight: $fw-medium;
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -238,7 +252,7 @@
|
|||
|
||||
// currency price
|
||||
|
||||
.currency-price{
|
||||
.currency-price {
|
||||
position: relative;
|
||||
bottom: 40px;
|
||||
}
|
||||
|
@ -259,17 +273,17 @@
|
|||
|
||||
// Features
|
||||
|
||||
.features-number{
|
||||
.features-number {
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
|
||||
// Team
|
||||
|
||||
.team-box{
|
||||
.team-social-links{
|
||||
a{
|
||||
color: $body-color;
|
||||
.team-box {
|
||||
.team-social-links {
|
||||
a {
|
||||
color: var(--#{$prefix}body-color);
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
@ -277,8 +291,8 @@
|
|||
|
||||
// Blog
|
||||
|
||||
.blog-box{
|
||||
.blog-badge{
|
||||
.blog-box {
|
||||
.blog-badge {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
|
@ -287,12 +301,12 @@
|
|||
|
||||
// landing footer
|
||||
|
||||
.landing-footer{
|
||||
.landing-footer {
|
||||
padding: 80px 0 40px;
|
||||
background-color: $sidebar-dark-bg;
|
||||
color: rgba($white, 0.5);
|
||||
|
||||
.footer-list-title{
|
||||
.footer-list-title {
|
||||
color: rgba($white, 0.9);
|
||||
}
|
||||
|
||||
|
@ -303,38 +317,39 @@
|
|||
color: rgba($white, 0.5);
|
||||
margin-bottom: 14px;
|
||||
transition: all 0.4s;
|
||||
&:hover{
|
||||
|
||||
&:hover {
|
||||
color: rgba($white, 0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.blog-post{
|
||||
.blog-post {
|
||||
|
||||
.post{
|
||||
.post {
|
||||
display: block;
|
||||
color: rgba($white, 0.5);
|
||||
padding: 16px 0px;
|
||||
border-bottom: 1px solid rgba($white, 0.1);
|
||||
.post-title{
|
||||
|
||||
.post-title {
|
||||
color: rgba($white, 0.8);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
&:first-of-type{
|
||||
&:first-of-type {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
&:last-of-type{
|
||||
&:last-of-type {
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer-border{
|
||||
.footer-border {
|
||||
border-color: rgba($white, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
|
@ -23,7 +23,7 @@
|
|||
a{
|
||||
display: block;
|
||||
padding: 4px 0px;
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -59,7 +59,7 @@
|
|||
margin: 7px 0px;
|
||||
|
||||
&.active{
|
||||
background-color: $gray-300;
|
||||
background-color: var(--#{$prefix}tertiary-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -69,7 +69,7 @@
|
|||
a{
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
.product-color-item{
|
||||
margin: 7px;
|
||||
}
|
||||
|
@ -104,11 +104,25 @@
|
|||
|
||||
.checkout-tabs{
|
||||
.nav-pills{
|
||||
li.nav-item {
|
||||
.nav-link {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.nav-link{
|
||||
margin-bottom: 24px;
|
||||
text-align: center;
|
||||
background-color: $card-bg;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
box-shadow: $box-shadow;
|
||||
color: $input-color;
|
||||
|
||||
&.active {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&:hover:not(&.active) {
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
&.active{
|
||||
background-color: $primary;
|
||||
|
@ -118,4 +132,14 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.checkout-multiselect-form {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.ecommerce-checkout-tabs {
|
||||
@media (max-width: 767px) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
|
@ -14,7 +14,7 @@
|
|||
|
||||
.chat-user-box {
|
||||
p.user-title {
|
||||
color: $dark;
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
p {
|
||||
|
@ -36,7 +36,7 @@
|
|||
.mail-list {
|
||||
a {
|
||||
display: block;
|
||||
color: $gray-600;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
line-height: 24px;
|
||||
padding: 8px 5px;
|
||||
&.active {
|
||||
|
@ -59,11 +59,11 @@
|
|||
transition-duration: .3s;
|
||||
|
||||
a{
|
||||
color: $gray-600;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $gray-300;
|
||||
background: var(--#{$prefix}tertiary-bg);
|
||||
transition-duration: .05s;
|
||||
}
|
||||
|
||||
|
@ -148,11 +148,11 @@
|
|||
|
||||
|
||||
&.unread {
|
||||
background-color: $gray-300;
|
||||
background-color: var(--#{$prefix}tertiary-bg);
|
||||
font-weight: 500;
|
||||
color: darken($dark,5%);
|
||||
color: var(--#{$prefix}body-color);
|
||||
a{
|
||||
color: darken($dark,5%);
|
||||
color: var(--#{$prefix}body-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
@ -165,7 +165,8 @@
|
|||
width: 20px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
box-shadow: inset 0 0 0 1px $gray-400;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
box-shadow: inset 0 0 0 1px var(--#{$prefix}border-color-translucent);
|
||||
border-radius: 1px;
|
||||
|
||||
input {
|
||||
|
@ -191,7 +192,7 @@
|
|||
font-family: "Material Design Icons";
|
||||
top: 0;
|
||||
height: 20px;
|
||||
color: darken($dark,5%);
|
||||
color: var(--#{$prefix}body-color);
|
||||
width: 20px;
|
||||
position: absolute;
|
||||
margin-top: -16px;
|
|
@ -15,7 +15,7 @@
|
|||
position: absolute;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: $gray-300;
|
||||
background: var(--#{$prefix}border-color);
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
top: 12px;
|
||||
|
@ -23,8 +23,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// blog
|
||||
|
||||
.blog-play-icon{
|
|
@ -24,8 +24,8 @@
|
|||
a{
|
||||
display: block;
|
||||
padding: 8px 12px;
|
||||
color: $body-color;
|
||||
font-weight: $fw-medium;
|
||||
color: var(--#{$prefix}body-color);
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
|
||||
&.active{
|
||||
|
@ -39,7 +39,7 @@
|
|||
li{
|
||||
a{
|
||||
padding: 4px 12px;
|
||||
color: $text-muted;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
font-size: 13px;
|
||||
font-weight: $font-weight-normal;
|
||||
}
|
|
@ -0,0 +1,13 @@
|
|||
//
|
||||
// _jobs.scss
|
||||
//
|
||||
|
||||
.jobs-categories {
|
||||
a {
|
||||
color: var(--#{$prefix}body-color);
|
||||
transition: all 0.5s ease;
|
||||
&:hover {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,14 @@
|
|||
//
|
||||
// projects.scss
|
||||
//
|
||||
|
||||
// project list
|
||||
|
||||
.project-list-table {
|
||||
border-collapse: separate;
|
||||
border-spacing: 0 12px;
|
||||
|
||||
tr {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,122 @@
|
|||
//
|
||||
// timeline.scss
|
||||
//
|
||||
|
||||
/************** Horizontal timeline **************/
|
||||
|
||||
|
||||
.hori-timeline {
|
||||
.events {
|
||||
.event-list {
|
||||
text-align: center;
|
||||
display: block;
|
||||
|
||||
.event-down-icon {
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 16px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
border-bottom: 3px dashed var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.down-arrow-icon {
|
||||
position: relative;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
padding: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.down-arrow-icon {
|
||||
animation: fade-down 1.5s infinite linear;
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
.down-arrow-icon {
|
||||
animation: fade-down 1.5s infinite linear;
|
||||
|
||||
&:before {
|
||||
content: "\ec4c";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.owl-nav {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
button {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 28px;
|
||||
font-size: 20px;
|
||||
border-radius: 50%;
|
||||
background-color: rgba(85, 110, 230, .25);
|
||||
border: 0;
|
||||
color: #556ee6;
|
||||
margin: 4px 8px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
box-shadow: none;
|
||||
right: -7px;
|
||||
|
||||
&.active,
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: rgba(85, 110, 230, .25) !important;
|
||||
box-shadow: none !important;
|
||||
color: $primary !important;
|
||||
}
|
||||
|
||||
&:after {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/************** vertical timeline **************/
|
||||
|
||||
.verti-timeline {
|
||||
border-left: 3px dashed var(--#{$prefix}border-color);
|
||||
margin: 0 10px;
|
||||
|
||||
.event-list {
|
||||
position: relative;
|
||||
padding: 0px 0px 40px 30px;
|
||||
|
||||
.event-timeline-dot {
|
||||
position: absolute;
|
||||
left: -9px;
|
||||
top: 0px;
|
||||
z-index: 9;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.event-content {
|
||||
position: relative;
|
||||
border: 2px solid var(--#{$prefix}border-color);
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
.event-timeline-dot {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,85 @@
|
|||
//
|
||||
// apexcharts.scss
|
||||
//
|
||||
.apex-charts {
|
||||
min-height: 10px !important;
|
||||
|
||||
text {
|
||||
font-family: $font-family-base !important;
|
||||
fill: var(--#{$prefix}gray-500);
|
||||
}
|
||||
|
||||
.apexcharts-canvas {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.apexcharts-tooltip-title,
|
||||
.apexcharts-tooltip-text {
|
||||
font-family: $font-family-base !important;
|
||||
}
|
||||
|
||||
.apexcharts-legend-series {
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
|
||||
.apexcharts-gridline {
|
||||
pointer-events: none;
|
||||
stroke: $apex-grid-color;
|
||||
}
|
||||
|
||||
.apexcharts-legend-text {
|
||||
color: #74788d !important;
|
||||
font-family: $font-family-base !important;
|
||||
font-size: 13px !important;
|
||||
}
|
||||
|
||||
.apexcharts-pie-label {
|
||||
fill: $white !important;
|
||||
}
|
||||
|
||||
.apexcharts-yaxis,
|
||||
.apexcharts-xaxis {
|
||||
text {
|
||||
font-family: $font-family-base !important;
|
||||
fill: var(--#{$prefix}secondary-color);
|
||||
}
|
||||
}
|
||||
|
||||
.apexcharts-gridline {
|
||||
stroke: var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.apexcharts-radialbar-track.apexcharts-track {
|
||||
path {
|
||||
stroke: var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
|
||||
.apexcharts-tooltip {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
border: 1px solid var(--#{$prefix}border-color) !important;
|
||||
|
||||
.apexcharts-tooltip-title {
|
||||
background-color: var(--#{$prefix}border-color) !important;
|
||||
border-bottom: 1px solid var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.apexcharts-pie-area {
|
||||
stroke: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
|
||||
.apexcharts-grid-borders {
|
||||
line {
|
||||
stroke: var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
|
||||
.apexcharts-pie-label {
|
||||
fill: var(--#{$prefix}white) !important;
|
||||
}
|
||||
|
||||
.apexcharts-xaxis-tick {
|
||||
stroke: var(--#{$prefix}border-color);
|
||||
}
|
|
@ -0,0 +1,27 @@
|
|||
//
|
||||
// Bootstrap touchspin
|
||||
//
|
||||
|
||||
.bootstrap-touchspin {
|
||||
&.input-group {
|
||||
&>.input-group-prepend {
|
||||
|
||||
&>.btn,
|
||||
&>.input-group-text {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.input-group {
|
||||
&>.input-group-append {
|
||||
|
||||
&>.btn,
|
||||
&>.input-group-text {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,245 @@
|
|||
/* ==============
|
||||
Calendar
|
||||
===================*/
|
||||
|
||||
|
||||
.fc td,
|
||||
.fc th {
|
||||
border: $table-border-width solid $table-border-color;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.fc {
|
||||
.fc-toolbar {
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
line-height: 30px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
|
||||
.fc-left,
|
||||
.fc-right,
|
||||
.fc-center {
|
||||
float: none;
|
||||
display: block;
|
||||
text-align: center;
|
||||
clear: both;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
>*>* {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.fc-today-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fc-col-header-cell-cushion {
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
|
||||
.fc-daygrid-day-number {
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
|
||||
.fc-daygrid-event-dot {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.fc-prev-button,
|
||||
.fc-next-button {
|
||||
position: relative;
|
||||
padding: 6px 8px !important;
|
||||
}
|
||||
|
||||
|
||||
.fc-toolbar-chunk {
|
||||
.fc-button-group {
|
||||
.fc-button {
|
||||
background-color: var(--#{$prefix}primary);
|
||||
border-color: var(--#{$prefix}primary);
|
||||
;
|
||||
box-shadow: none;
|
||||
|
||||
&:hover,
|
||||
&.active {
|
||||
color: $white;
|
||||
background-color: var(--#{$prefix}primary);
|
||||
border-color: var(--#{$prefix}primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-today-button {
|
||||
background-color: var(--#{$prefix}primary) !important;
|
||||
border-color: var(--#{$prefix}primary) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fc {
|
||||
|
||||
.fc-button-primary:not(:disabled).fc-button-active,
|
||||
.fc-button-primary:not(:disabled):active {
|
||||
background-color: var(--#{$prefix}primary) !important;
|
||||
border-color: var(--#{$prefix}primary) !important;
|
||||
color: $white !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
@media (max-width: 575.98px) {
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.fc {
|
||||
th.fc-widget-header {
|
||||
background: $gray-300;
|
||||
color: $gray-700;
|
||||
line-height: 20px;
|
||||
padding: 10px 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-unthemed {
|
||||
|
||||
.fc-content,
|
||||
.fc-divider,
|
||||
.fc-list-heading td,
|
||||
.fc-list-view,
|
||||
.fc-popover,
|
||||
.fc-row,
|
||||
tbody,
|
||||
td,
|
||||
th,
|
||||
thead {
|
||||
border-color: $gray-300;
|
||||
}
|
||||
|
||||
td.fc-today {
|
||||
background: lighten($gray-200, 2%);
|
||||
}
|
||||
}
|
||||
|
||||
.fc-button {
|
||||
background: var(--#{$prefix}secondary-bg);
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
color: $gray-700;
|
||||
text-transform: capitalize;
|
||||
box-shadow: none;
|
||||
padding: 6px 12px !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.fc-state-down,
|
||||
.fc-state-active,
|
||||
.fc-state-disabled {
|
||||
background-color: $primary;
|
||||
color: $white;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.fc-event {
|
||||
border-radius: 2px;
|
||||
border: none;
|
||||
cursor: move;
|
||||
font-size: 0.8125rem;
|
||||
margin: 5px 7px;
|
||||
padding: 5px 5px;
|
||||
text-align: center;
|
||||
color: $white;
|
||||
|
||||
&.bg-dark {
|
||||
.fc-event-time {
|
||||
color: var(--#{$prefix}secondary-bg) !important;
|
||||
}
|
||||
background-color: var(--#{$prefix}secondary-color) !important;
|
||||
.fc-event-title {
|
||||
color: var(--#{$prefix}secondary-bg) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-event,
|
||||
.fc-event-dot {
|
||||
background-color: $primary;
|
||||
}
|
||||
|
||||
.fc-event .fc-content {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
#external-events {
|
||||
.external-event {
|
||||
text-align: left;
|
||||
padding: 8px 16px;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.bg-dark {
|
||||
.fc-content {
|
||||
color: $light;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// RTL
|
||||
[dir="rtl"] {
|
||||
.fc-header-toolbar {
|
||||
direction: ltr !important;
|
||||
}
|
||||
|
||||
.fc-toolbar>*>:not(:first-child) {
|
||||
margin-left: .75em;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-theme-standard .fc-scrollgrid {
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.fc .fc-daygrid-week-number {
|
||||
background-color: var(--#{$prefix}body-bg);
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
|
||||
.fc .fc-daygrid-more-link {
|
||||
padding: 5px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.fc .fc-daygrid-more-link:hover {
|
||||
background-color: rgba(var(--#{$prefix}primary-rgb), 0.1);
|
||||
}
|
||||
|
||||
.fc .fc-popover-header {
|
||||
padding: 6px 12px;
|
||||
}
|
||||
|
||||
.fc-theme-standard .fc-popover-header {
|
||||
background: var(--#{$prefix}body-bg);
|
||||
}
|
||||
|
||||
.fc-theme-standard .fc-popover {
|
||||
background: var(--#{$prefix}secondary-bg);
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
}
|
|
@ -0,0 +1,164 @@
|
|||
/* ==============
|
||||
Calendar
|
||||
===================*/
|
||||
|
||||
.lnb-calendars-item {
|
||||
display: inline-block;
|
||||
margin-right: 7px
|
||||
/*rtl: margin-left: 7px*/
|
||||
;
|
||||
}
|
||||
|
||||
input[type="checkbox"].tui-full-calendar-checkbox-round+span {
|
||||
margin-right: 4px
|
||||
/*rtl: 0*/
|
||||
;
|
||||
margin-left: 0
|
||||
/*rtl: 4px*/
|
||||
;
|
||||
}
|
||||
|
||||
.tui-full-calendar-layout,
|
||||
.tui-full-calendar-timegrid-timezone {
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-dayname-container,
|
||||
.tui-full-calendar-left,
|
||||
.tui-full-calendar-splitter,
|
||||
.tui-full-calendar-time-date,
|
||||
.tui-full-calendar-weekday-grid-line,
|
||||
.tui-full-calendar-timegrid-timezone,
|
||||
.tui-full-calendar-timegrid-gridline {
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-weekday-exceed-in-week {
|
||||
text-align: center;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
line-height: 28px;
|
||||
border-radius: 4px;
|
||||
background-color: var(--#{$prefix}custom-white);
|
||||
color: var(--#{$prefix}body-color);
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.tui-full-calendar-timegrid-hour {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-weekday-schedule-title {
|
||||
color: var(--#{$prefix}emphasis-color) !important;
|
||||
|
||||
.tui-full-calendar-time-schedule {
|
||||
font-weight: $font-weight-semibold;
|
||||
}
|
||||
}
|
||||
|
||||
.tui-full-calendar-popup-container {
|
||||
background-color: var(--#{$prefix}custom-white) !important;
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-dropdown {
|
||||
&:hover {
|
||||
.tui-full-calendar-dropdown-button {
|
||||
border-color: var(--#{$prefix}border-color)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tui-full-calendar-popup-section-item {
|
||||
&:hover, &:focus {
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
|
||||
.tui-full-calendar-arrow-bottom .tui-full-calendar-popup-arrow-fill {
|
||||
border-top-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-arrow-top .tui-full-calendar-popup-arrow-fill {
|
||||
border-bottom-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-arrow-bottom .tui-full-calendar-popup-arrow-borde {
|
||||
border-bottom-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-button {
|
||||
color: $input-color;
|
||||
background-color: $input-bg !important;
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.tui-full-calendar-popup-section-item {
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.tui-full-calendar-month-dayname,
|
||||
.tui-full-calendar-weekday-border {
|
||||
border-top-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-arrow-top .tui-full-calendar-popup-arrow-border {
|
||||
border-bottom-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-dropdown-menu {
|
||||
border-color: var(--#{$prefix}border-color) !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-dropdown-menu-item,
|
||||
.tui-full-calendar-dropdown-menu {
|
||||
background-color: $input-bg !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-arrow-bottom .tui-full-calendar-popup-arrow-border {
|
||||
border-top-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.tui-full-calendar-content {
|
||||
background-color: $input-bg !important;
|
||||
color: $input-color !important;
|
||||
}
|
||||
|
||||
.tui-full-calendar-confirm {
|
||||
background-color: $danger !important;
|
||||
color: $white !important;
|
||||
|
||||
&:hover {
|
||||
background-color: $red-600 !important;
|
||||
color: $white !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tui-full-calendar-month-dayname-item {
|
||||
span {
|
||||
color: var(--#{$prefix}emphasis-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tui-full-calendar-weekday-grid-line {
|
||||
&.tui-full-calendar-near-month-day {
|
||||
&.tui-full-calendar-extra-date {
|
||||
.tui-full-calendar-weekday-grid-header {
|
||||
.tui-full-calendar-weekday-grid-date {
|
||||
color: var(--#{$prefix}secondary-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.tui-full-calendar-weekday-grid-line {
|
||||
&.tui-full-calendar-near-month-day {
|
||||
.tui-full-calendar-weekday-grid-header {
|
||||
.tui-full-calendar-weekday-grid-date {
|
||||
color: var(--#{$prefix}emphasis-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,140 @@
|
|||
.ct-golden-section:before {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.ct-chart {
|
||||
max-height: 300px;
|
||||
|
||||
.ct-label {
|
||||
fill: $gray-500;
|
||||
color: $gray-500;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-chart.simple-pie-chart-chartist {
|
||||
.ct-label {
|
||||
color: $white;
|
||||
fill: $white;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-chart {
|
||||
.ct-series {
|
||||
&.ct-series-a {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
&.ct-series-b {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $success;
|
||||
}
|
||||
}
|
||||
|
||||
&.ct-series-c {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $warning;
|
||||
}
|
||||
}
|
||||
|
||||
&.ct-series-d {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $danger;
|
||||
}
|
||||
}
|
||||
|
||||
&.ct-series-e {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $info;
|
||||
}
|
||||
}
|
||||
|
||||
&.ct-series-f {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $pink;
|
||||
}
|
||||
}
|
||||
|
||||
&.ct-series-g {
|
||||
.ct-bar,
|
||||
.ct-line,
|
||||
.ct-point,
|
||||
.ct-slice-donut {
|
||||
stroke: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ct-series-a {
|
||||
.ct-area,
|
||||
.ct-slice-pie {
|
||||
fill: $primary !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-series-b {
|
||||
.ct-area,
|
||||
.ct-slice-pie {
|
||||
fill: $success !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-series-c {
|
||||
.ct-area,
|
||||
.ct-slice-pie {
|
||||
fill: $warning;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-series-d {
|
||||
.ct-area,
|
||||
.ct-slice-pie {
|
||||
fill: $danger !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ct-area {
|
||||
fill-opacity: 0.33 !important;
|
||||
}
|
||||
|
||||
.chartist-tooltip {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
min-width: 10px;
|
||||
padding: 2px 10px;
|
||||
border-radius: 3px;
|
||||
background: $dark;
|
||||
color: $white;
|
||||
text-align: center;
|
||||
pointer-events: none;
|
||||
z-index: 1;
|
||||
transition: opacity 0.2s linear;
|
||||
|
||||
&.tooltip-show {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,54 @@
|
|||
/*
|
||||
Datatable
|
||||
*/
|
||||
|
||||
// datatable
|
||||
|
||||
div.dataTables_wrapper {
|
||||
div.dataTables_filter {
|
||||
text-align: right;
|
||||
|
||||
@media (max-width: 767px) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
input {
|
||||
margin-left: 0.5em;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table,
|
||||
table {
|
||||
&.dataTable {
|
||||
border-collapse: collapse !important;
|
||||
&.dtr-inline.collapsed>tbody>tr>td {
|
||||
position: relative;
|
||||
|
||||
&.dtr-control {
|
||||
padding-left: 30px;
|
||||
|
||||
&:before {
|
||||
top: 50%;
|
||||
left: 5px;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
margin-top: -9px;
|
||||
display: block;
|
||||
position: absolute;
|
||||
color: $white;
|
||||
border: 2px solid $white;
|
||||
border-radius: 14px;
|
||||
box-sizing: content-box;
|
||||
text-align: center;
|
||||
text-indent: 0 !important;
|
||||
line-height: 14px;
|
||||
content: '+';
|
||||
background-color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,121 @@
|
|||
|
||||
//
|
||||
// Datepicker
|
||||
//
|
||||
|
||||
.datepicker {
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
padding: 8px;
|
||||
z-index: 999 !important;
|
||||
|
||||
|
||||
table{
|
||||
tr{
|
||||
th{
|
||||
font-weight: 500;
|
||||
}
|
||||
td{
|
||||
&.active, &.active:hover, .active.disabled, &.active.disabled:hover,
|
||||
&.today, &.today:hover, &.today.disabled, &.today.disabled:hover,
|
||||
&.selected, &.selected:hover, &.selected.disabled, &.selected.disabled:hover,
|
||||
span.active.active, span.active:hover.active{
|
||||
background-color: $primary !important;
|
||||
background-image: none;
|
||||
box-shadow: none;
|
||||
color: $white !important;
|
||||
}
|
||||
|
||||
&.day.focused,
|
||||
&.day:hover,
|
||||
span.focused,
|
||||
span:hover {
|
||||
background: var(--#{$prefix}light);
|
||||
}
|
||||
|
||||
&.new,
|
||||
&.old,
|
||||
span.new,
|
||||
span.old {
|
||||
color: var(--#{$prefix}gray-500);
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
&.range, &.range.disabled, &.range.disabled:hover, &.range:hover{
|
||||
background-color: var(--#{$prefix}tertiary-bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-condensed{
|
||||
>thead>tr>th, >tbody>tr>td {
|
||||
padding: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.bootstrap-datepicker-inline{
|
||||
.datepicker-inline{
|
||||
width: auto !important;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// DATEPICKER
|
||||
|
||||
.datepicker-container{
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
box-shadow: none;
|
||||
background-color: $dropdown-bg;
|
||||
|
||||
&.datepicker-inline{
|
||||
width: 212px;
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker{
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
.datepicker-switch:hover,.next:hover,.prev:hover, tfoot tr th:hover {
|
||||
background: var(--#{$prefix}light);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.datepicker-panel{
|
||||
|
||||
>ul{
|
||||
>li{
|
||||
background-color: $dropdown-bg;
|
||||
border-radius: 4px;
|
||||
|
||||
&.picked, &.picked:hover{
|
||||
background-color: rgba($primary, 0.25);
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
&.highlighted, &.highlighted:hover, &:hover{
|
||||
background-color: $primary;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
|
||||
&.muted, &.muted:hover{
|
||||
color: var(--#{$prefix}gray-500);
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
&[data-view=week]{
|
||||
>li{
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
|
||||
>li, >li:hover{
|
||||
background-color: $dropdown-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,16 @@
|
|||
|
||||
|
||||
/* ==============
|
||||
Druafula
|
||||
===================*/
|
||||
|
||||
|
||||
.task-box{
|
||||
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
}
|
||||
|
||||
.gu-transit {
|
||||
border: 1px dashed var(--#{$prefix}border-color) !important;
|
||||
background-color: var(--#{$prefix}gray-200) !important;
|
||||
}
|
|
@ -1,3 +1,5 @@
|
|||
|
||||
|
||||
/* Flot chart */
|
||||
.flot-charts-height {
|
||||
height: 320px;
|
|
@ -0,0 +1,13 @@
|
|||
//
|
||||
// Form editors.scss
|
||||
//
|
||||
|
||||
.form-ckeditor {
|
||||
.ck.ck-content.ck-editor__editable_inline {
|
||||
height: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-switch-lg {
|
||||
padding-right: 0.55rem;
|
||||
}
|
|
@ -0,0 +1,22 @@
|
|||
|
||||
//
|
||||
// Form-Upload
|
||||
//
|
||||
|
||||
/* Dropzone */
|
||||
.dropzone {
|
||||
min-height: 230px;
|
||||
border: 2px dashed var(--#{$prefix}border-color) !important;
|
||||
background: var(--#{$prefix}secondary-bg) !important;
|
||||
border-radius: 6px;
|
||||
|
||||
.btn-light{
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
}
|
||||
|
||||
.dz-message {
|
||||
font-size: 24px;
|
||||
width: 100%;
|
||||
margin: 3rem 0;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,171 @@
|
|||
//
|
||||
// Form Wizard
|
||||
//
|
||||
|
||||
|
||||
.form-wizard-wrapper {
|
||||
label {
|
||||
font-size: 14px;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.wizard{
|
||||
|
||||
// step
|
||||
.steps{
|
||||
>ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
list-style: none;
|
||||
|
||||
@media (max-width: 1199.98px) {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
> a, > li{
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
>li{
|
||||
width: 100%;
|
||||
|
||||
a{
|
||||
display: block;
|
||||
padding: .5rem 1rem;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
font-weight: $font-weight-medium;
|
||||
|
||||
background-color: rgba($primary, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.current-info{
|
||||
position: absolute;
|
||||
left: -999em;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.number {
|
||||
display: inline-block;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
line-height: 34px;
|
||||
border: 2px solid $primary;
|
||||
color: $primary;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.current {
|
||||
a, a:active, a:hover {
|
||||
background-color: rgba($primary, 0.2);
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
.number {
|
||||
background-color: $primary;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// content
|
||||
>.content {
|
||||
background-color: transparent;
|
||||
padding: 14px;
|
||||
margin-top: 0;
|
||||
border-radius: 0;
|
||||
min-height: 150px;
|
||||
> .title{
|
||||
position: absolute;
|
||||
left: -999em;
|
||||
}
|
||||
>.body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 14px 0 0;
|
||||
position: static
|
||||
}
|
||||
}
|
||||
|
||||
// actions
|
||||
|
||||
>.actions {
|
||||
position: relative;
|
||||
display: block;
|
||||
text-align: right;
|
||||
width: 100%;
|
||||
> ul {
|
||||
display: block;
|
||||
text-align: right;
|
||||
padding-left: 0;
|
||||
> li{
|
||||
display: inline-block;
|
||||
margin: 0 0.5em;
|
||||
|
||||
}
|
||||
}
|
||||
a, a:active, a:hover {
|
||||
background-color: $primary;
|
||||
border-radius: 4px;
|
||||
padding: 8px 15px;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
a, a:active, a:hover {
|
||||
opacity: .65;
|
||||
background-color: $primary;
|
||||
color: $white;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// verticl wixard
|
||||
&.vertical-wizard{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
// step
|
||||
.steps{
|
||||
>ul{
|
||||
flex-direction: column;
|
||||
|
||||
>li{
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.steps, .content, .actions{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.steps{
|
||||
@media (min-width: 1200px) {
|
||||
width: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
.content{
|
||||
padding: 24px;
|
||||
@media (min-width: 1200px) {
|
||||
width: 75%;
|
||||
padding: 12px 24px;
|
||||
}
|
||||
|
||||
>.body{
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,61 @@
|
|||
//
|
||||
// Range slider
|
||||
//
|
||||
|
||||
.irs {
|
||||
font-family: $font-family-base;
|
||||
}
|
||||
|
||||
.irs--square {
|
||||
cursor: pointer;
|
||||
|
||||
.irs-bar,
|
||||
.irs-to,
|
||||
.irs-from,
|
||||
.irs-single {
|
||||
background: $primary !important;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.irs-to,
|
||||
.irs-from,
|
||||
.irs-single {
|
||||
&:before {
|
||||
border-top-color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.irs-line {
|
||||
background: var(--#{$prefix}tertiary-bg);
|
||||
border-color: var(--#{$prefix}tertiary-bg);
|
||||
}
|
||||
|
||||
.irs-grid-text {
|
||||
font-size: 11px;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
}
|
||||
|
||||
.irs-min,
|
||||
.irs-max {
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
background: var(--#{$prefix}tertiary-bg);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.irs-handle {
|
||||
border: 2px solid $primary;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
top: 26px;
|
||||
background-color: var(--#{$prefix}secondary-bg) !important;
|
||||
cursor: pointer;
|
||||
|
||||
&:active {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.irs-grid-pol {
|
||||
background-color: var(--#{$prefix}secondary-color);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,31 @@
|
|||
|
||||
//
|
||||
// Rating
|
||||
//
|
||||
|
||||
.symbol{
|
||||
border-color: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
|
||||
.rating-symbol-background, .rating-symbol-foreground {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.symbol-empty {
|
||||
background-color: var(--#{$prefix}gray-400);
|
||||
}
|
||||
|
||||
.rating-symbol-foreground {
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.rating-star{
|
||||
> span{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
|
||||
&.badge{
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -141,6 +141,13 @@
|
|||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
table.focus-on tbody tr.unfocused th,
|
||||
table.focus-on tfoot tr.unfocused th,
|
||||
table.focus-on tbody tr.unfocused td,
|
||||
table.focus-on tfoot tr.unfocused td {
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
|
||||
body[data-layout="horizontal"] {
|
|
@ -0,0 +1,227 @@
|
|||
//
|
||||
// Select 2
|
||||
//
|
||||
|
||||
.select2-container {
|
||||
.select2-selection--single {
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
border: 1px solid $input-border-color;
|
||||
height: 38px;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.select2-selection__rendered {
|
||||
line-height: 36px;
|
||||
padding-left: $input-padding-x;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
}
|
||||
|
||||
|
||||
.select2-selection__arrow {
|
||||
height: 34px;
|
||||
width: 34px;
|
||||
right: 3px;
|
||||
|
||||
b {
|
||||
border-color: var(--#{$prefix}gray-500) transparent transparent transparent;
|
||||
border-width: 6px 6px 0 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-selection__placeholder {
|
||||
color: var(--#{$prefix}body-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[dir="rtl"] {
|
||||
.select2-selection__rendered {
|
||||
text-align: end;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.select2-container--open {
|
||||
.select2-selection--single {
|
||||
.select2-selection__arrow {
|
||||
b {
|
||||
border-color: transparent transparent var(--#{$prefix}gray-500) transparent !important;
|
||||
border-width: 0 6px 6px 6px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default {
|
||||
.select2-search--dropdown {
|
||||
padding: 10px;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
|
||||
.select2-search__field {
|
||||
border: 1px solid var(--#{$prefix}border-color-translucent);
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-results__option--highlighted[aria-selected] {
|
||||
background-color: $primary;
|
||||
}
|
||||
|
||||
.select2-results__option[aria-selected="true"] {
|
||||
background-color: var(--#{$prefix}light);
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
|
||||
&:hover {
|
||||
background-color: $primary;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-selection--multiple {
|
||||
.select2-selection__choice__remove {
|
||||
border-right: none;
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select2-results__option {
|
||||
padding: 6px 12px;
|
||||
}
|
||||
|
||||
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
|
||||
padding-left: $input-padding-x;
|
||||
}
|
||||
|
||||
.select2-dropdown {
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
box-shadow: $box-shadow;
|
||||
}
|
||||
|
||||
.select2-search {
|
||||
input {
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container {
|
||||
.select2-selection--multiple {
|
||||
min-height: 38px;
|
||||
background-color: var(--#{$prefix}secondary-bg);
|
||||
border: 1px solid var(--#{$prefix}border-color-translucent) !important;
|
||||
padding: 2px $input-padding-x;
|
||||
|
||||
.select2-selection__rendered {
|
||||
padding: 2px $input-padding-x;
|
||||
}
|
||||
|
||||
.select2-search__field {
|
||||
border: 0;
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
margin: 0;
|
||||
margin-top: 7px;
|
||||
|
||||
&::placeholder {
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
}
|
||||
}
|
||||
|
||||
.select2-selection__choice {
|
||||
background-color: var(--#{$prefix}tertiary-bg);
|
||||
border: 1px solid var(--#{$prefix}border-color);
|
||||
border-radius: 1px;
|
||||
padding: 0 7px;
|
||||
}
|
||||
|
||||
.select2-selection__rendered {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default {
|
||||
&.select2-container--focus {
|
||||
.select2-selection--multiple {
|
||||
border-color: var(--#{$prefix}border-color-translucent);
|
||||
}
|
||||
}
|
||||
|
||||
.select2-results__group {
|
||||
font-weight: $font-weight-semibold;
|
||||
}
|
||||
|
||||
.select2-selection--multiple {
|
||||
.select2-selection__choice__display {
|
||||
padding-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ajax select
|
||||
|
||||
.select2-result-repository__avatar {
|
||||
float: left;
|
||||
width: 60px;
|
||||
margin-right: 10px;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-result-repository__statistics {
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
.select2-result-repository__forks,
|
||||
.select2-result-repository__stargazers,
|
||||
.select2-result-repository__watchers {
|
||||
display: inline-block;
|
||||
font-size: 11px;
|
||||
margin-right: 1em;
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
|
||||
.fa {
|
||||
margin-right: 4px;
|
||||
|
||||
&.fa-flash {
|
||||
&::before {
|
||||
content: "\f0e7";
|
||||
font-family: "Font Awesome 5 Free";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select2-results__option--highlighted {
|
||||
|
||||
.select2-result-repository__forks,
|
||||
.select2-result-repository__stargazers,
|
||||
.select2-result-repository__watchers {
|
||||
color: rgba($white, 0.8);
|
||||
}
|
||||
}
|
||||
|
||||
.select2-result-repository__meta {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// templating-select
|
||||
|
||||
.img-flag {
|
||||
margin-right: 7px;
|
||||
height: 15px;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
|
||||
.select2-container--default .select2-results__option--selected {
|
||||
background-color: var(--#{$prefix}tertiary-bg);
|
||||
}
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
.countdown-holder {
|
||||
color: $danger;
|
||||
font-weight: $fw-medium;
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
|
||||
.btn-default {
|
|
@ -18,5 +18,5 @@
|
|||
font-size: 12px !important;
|
||||
line-height: 18px !important;
|
||||
font-family: $font-family-base !important;
|
||||
font-weight: $fw-medium !important;
|
||||
font-weight: $font-weight-medium !important;
|
||||
}
|
|
@ -0,0 +1,83 @@
|
|||
//
|
||||
// Sweetalert2
|
||||
//
|
||||
|
||||
.swal2-container {
|
||||
.swal2-title {
|
||||
font-size: 20px;
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-modal {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.swal2-icon {
|
||||
&.swal2-question {
|
||||
border-color: $info;
|
||||
color: $info;
|
||||
}
|
||||
&.swal2-success {
|
||||
[class^="swal2-success-line"] {
|
||||
background-color: $success;
|
||||
}
|
||||
|
||||
.swal2-success-ring {
|
||||
border-color: rgba($success, 0.3);
|
||||
}
|
||||
}
|
||||
&.swal2-warning {
|
||||
border-color: $warning;
|
||||
color: $warning;
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-styled {
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-progress-steps {
|
||||
.swal2-progress-step {
|
||||
background: $primary;
|
||||
&.swal2-active-progress-step {
|
||||
background: $primary;
|
||||
& ~ .swal2-progress-step,
|
||||
& ~ .swal2-progress-step-line {
|
||||
background: rgba($primary, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-progress-step-line {
|
||||
background: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.swal2-loader {
|
||||
border-color: $primary transparent $primary transparent;
|
||||
}
|
||||
.swal2-popup {
|
||||
background: var(--#{$prefix}secondary-bg);
|
||||
}
|
||||
|
||||
.swal2-title, .swal2-html-container{
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
}
|
||||
|
||||
.swal2-file,
|
||||
.swal2-input,
|
||||
.swal2-textarea {
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
color: var(--#{$prefix}body-color);
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
border-color: var(--#{$prefix}border-color);
|
||||
}
|
||||
}
|
||||
|
||||
div:where(.swal2-container) div:where(.swal2-popup) {
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
}
|
|
@ -0,0 +1,123 @@
|
|||
//
|
||||
// Sweetalert2
|
||||
//
|
||||
|
||||
/* CSS Switch */
|
||||
input[switch] {
|
||||
display: none;
|
||||
+ label {
|
||||
font-size: 1em;
|
||||
line-height: 1;
|
||||
width: 56px;
|
||||
height: 24px;
|
||||
background-color: $gray-400;
|
||||
background-image: none;
|
||||
border-radius: 2rem;
|
||||
padding: 0.16667rem;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
font-weight: $font-weight-medium;
|
||||
transition: all 0.1s ease-in-out;
|
||||
&:before {
|
||||
color: $dark;
|
||||
content: attr(data-off-label);
|
||||
display: block;
|
||||
font-family: inherit;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 21px;
|
||||
position: absolute;
|
||||
right: 1px;
|
||||
margin: 3px;
|
||||
top: -2px;
|
||||
text-align: center;
|
||||
min-width: 1.66667rem;
|
||||
overflow: hidden;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
background-color: $gray-200;
|
||||
box-shadow: none;
|
||||
border-radius: 2rem;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
top: 2px;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
&:checked + label {
|
||||
background-color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
input[switch]:checked + label {
|
||||
background-color: $primary;
|
||||
&:before {
|
||||
color: $white;
|
||||
content: attr(data-on-label);
|
||||
right: auto;
|
||||
left: 3px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
left: 33px;
|
||||
background-color: $gray-200;
|
||||
}
|
||||
}
|
||||
|
||||
input[switch="bool"] + label {
|
||||
background-color: $danger;
|
||||
}
|
||||
input[switch="bool"] + label:before,input[switch="bool"]:checked + label:before,
|
||||
input[switch="default"]:checked + label:before{
|
||||
color: $white;
|
||||
}
|
||||
|
||||
input[switch="bool"]:checked + label {
|
||||
background-color: $success;
|
||||
}
|
||||
|
||||
input[switch="default"]:checked + label {
|
||||
background-color: #a2a2a2;
|
||||
}
|
||||
|
||||
input[switch="primary"]:checked + label {
|
||||
background-color: $primary;
|
||||
}
|
||||
|
||||
input[switch="success"]:checked + label {
|
||||
background-color: $success;
|
||||
}
|
||||
|
||||
input[switch="info"]:checked + label {
|
||||
background-color: $info;
|
||||
}
|
||||
|
||||
input[switch="warning"]:checked + label {
|
||||
background-color: $warning;
|
||||
}
|
||||
|
||||
input[switch="danger"]:checked + label {
|
||||
background-color: $danger;
|
||||
}
|
||||
|
||||
input[switch="dark"]:checked + label {
|
||||
background-color: $dark;
|
||||
&:before {
|
||||
color: $light;
|
||||
}
|
||||
}
|
||||
|
||||
.square-switch{
|
||||
margin-right: 7px;
|
||||
input[switch]+label, input[switch]+label:after{
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
|
@ -8,6 +8,7 @@
|
|||
height: $input-height-sm;
|
||||
padding: $input-padding-y-sm $input-padding-x-sm;
|
||||
border: 1px solid $input-border-color;
|
||||
background-color: $input-bg;
|
||||
color: $input-color;
|
||||
border-radius: $input-border-radius;
|
||||
&:focus{
|