mirror of https://github.com/lukechilds/lnbits.git
Eneko Illarramendi
5 years ago
216 changed files with 23 additions and 76368 deletions
@ -1,68 +0,0 @@ |
|||
'use strict'; |
|||
module.exports = function (grunt) { |
|||
// load all grunt tasks
|
|||
grunt.loadNpmTasks('grunt-contrib-less'); |
|||
grunt.loadNpmTasks('grunt-contrib-watch'); |
|||
grunt.loadNpmTasks('grunt-contrib-uglify'); |
|||
grunt.initConfig({ |
|||
watch: { |
|||
// if any .less file changes in directory "build/less/" run the "less"-task.
|
|||
files: ["build/less/*.less", "build/less/skins/*.less", "dist/js/app.js"], |
|||
tasks: ["less", "uglify"] |
|||
}, |
|||
// "less"-task configuration
|
|||
//this task will compile all less files upon saving to create both AdminLTE.css and AdminLTE.min.css
|
|||
less: { |
|||
//Development not compressed
|
|||
development: { |
|||
options: { |
|||
//Wether to compress or not
|
|||
compress: false |
|||
}, |
|||
files: { |
|||
// compilation.css : source.less
|
|||
"dist/css/AdminLTE.css": "build/less/AdminLTE.less", |
|||
"dist/css/skins/skin-blue.css": "build/less/skins/skin-blue.less", |
|||
"dist/css/skins/skin-black.css": "build/less/skins/skin-black.less", |
|||
"dist/css/skins/skin-yellow.css": "build/less/skins/skin-yellow.less", |
|||
"dist/css/skins/skin-green.css": "build/less/skins/skin-green.less", |
|||
"dist/css/skins/skin-red.css": "build/less/skins/skin-red.less", |
|||
"dist/css/skins/skin-purple.css": "build/less/skins/skin-purple.less", |
|||
"dist/css/skins/_all-skins.css": "build/less/skins/_all-skins.less" |
|||
} |
|||
}, |
|||
//production compresses version
|
|||
production: { |
|||
options: { |
|||
//Wether to compress or not
|
|||
compress: true |
|||
}, |
|||
files: { |
|||
// compilation.css : source.less
|
|||
"dist/css/AdminLTE.min.css": "build/less/AdminLTE.less", |
|||
"dist/css/skins/skin-blue.min.css": "build/less/skins/skin-blue.less", |
|||
"dist/css/skins/skin-black.min.css": "build/less/skins/skin-black.less", |
|||
"dist/css/skins/skin-yellow.min.css": "build/less/skins/skin-yellow.less", |
|||
"dist/css/skins/skin-green.min.css": "build/less/skins/skin-green.less", |
|||
"dist/css/skins/skin-red.min.css": "build/less/skins/skin-red.less", |
|||
"dist/css/skins/skin-purple.min.css": "build/less/skins/skin-purple.less", |
|||
"dist/css/skins/_all-skins.min.css": "build/less/skins/_all-skins.less" |
|||
} |
|||
} |
|||
}, |
|||
//Uglify task info. Compress the js files.
|
|||
uglify: { |
|||
options: { |
|||
mangle: true, |
|||
preserveComments: 'some' |
|||
}, |
|||
my_target: { |
|||
files: { |
|||
'dist/js/app.min.js': ['dist/js/app.js'] |
|||
} |
|||
} |
|||
} |
|||
}); |
|||
// the default task (running "grunt" in console) is "watch"
|
|||
grunt.registerTask('default', ['watch']); |
|||
}; |
|||
@ -1,20 +0,0 @@ |
|||
The MIT License (MIT) |
|||
|
|||
Copyright (c) 2014-2015 almasaeed2010 |
|||
|
|||
Permission is hereby granted, free of charge, to any person obtaining a copy of |
|||
this software and associated documentation files (the "Software"), to deal in |
|||
the Software without restriction, including without limitation the rights to |
|||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of |
|||
the Software, and to permit persons to whom the Software is furnished to do so, |
|||
subject to the following conditions: |
|||
|
|||
The above copyright notice and this permission notice shall be included in all |
|||
copies or substantial portions of the Software. |
|||
|
|||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
|||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS |
|||
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR |
|||
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER |
|||
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN |
|||
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. |
|||
@ -1,145 +0,0 @@ |
|||
Introduction |
|||
============ |
|||
|
|||
**AdminLTE** -- is a fully responsive admin template. Based on **Bootstrap 3** framework. Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops. Check out the live preview now and see for yourself. |
|||
|
|||
**Download & Preview on [Almsaeed Studio](http://almsaeedstudio.com)** |
|||
|
|||
Looking for Premium Templates? |
|||
------------------------------ |
|||
**Almsaeed studio just opened a new premium templates page. Hand picked to insure the best quality and the most affordable prices. Visit http://almsaeedstudio.com/premium for more information.** |
|||
|
|||
|
|||
!["AdminLTE Presentation"] (http://almsaeedstudio.com/AdminLTE2.png "AdminLTE Presentation") |
|||
|
|||
**AdminLTE** has been carefully coded with clear comments in all of its JS, LESS and HTML files. LESS has been used to increase code customizability. |
|||
|
|||
Installation |
|||
------------ |
|||
There are multiple ways to install AdminLTE. |
|||
|
|||
####Download: |
|||
|
|||
Download from Github or [visit Almsaeed Studio](http://almsaeedstudio.com) and download the lateset release. |
|||
|
|||
####Using The Command Line: |
|||
|
|||
**Github** |
|||
|
|||
- Fork the repository ([here is the guide](https://help.github.com/articles/fork-a-repo/)). |
|||
- Clone to your machine |
|||
``` |
|||
git clone https://github.com/YOUR_USERNAME/AdminLTE.git" |
|||
``` |
|||
|
|||
**Bower** |
|||
|
|||
``` |
|||
bower install git://github.com/almasaeed2010/AdminLTE.git |
|||
``` |
|||
|
|||
**Composer** |
|||
|
|||
``` |
|||
composer require "almasaeed2010/adminlte=~2.0" |
|||
``` |
|||
|
|||
Documentation |
|||
------------- |
|||
Visit the [online documentation](http://almsaeedstudio.com/themes/AdminLTE/documentation/index.html) for the most |
|||
updated guide. Information will be added on a weekly basis. |
|||
|
|||
Browser Support |
|||
--------------- |
|||
- IE 9+ |
|||
- Firefox (latest) |
|||
- Chrome (latest) |
|||
- Safari (latest) |
|||
- Opera (latest) |
|||
|
|||
Contribution |
|||
------------ |
|||
Contribution are always **welcome and recommended**! Here is how: |
|||
|
|||
- Fork the repository ([here is the guide](https://help.github.com/articles/fork-a-repo/)). |
|||
- Clone to your machine ```git clone https://github.com/YOUR_USERNAME/AdminLTE.git" |
|||
- Make your changes |
|||
- Create a pull request |
|||
|
|||
#### Contribution Requirements: |
|||
|
|||
- When you contribute, you agree to give a non-exclusive license to Almsaeed Studio to use that contribution in any context as we (Almsaeed Studio) see appropriate. |
|||
- If you use content provided by another party, it must be appropriately licensed using an [open source](http://opensource.org/licenses) license. |
|||
- Contributions are only accepted through Github pull requests. |
|||
- Finally, contributed code must work in all supported browsers (see above for browser support). |
|||
|
|||
License |
|||
------- |
|||
AdminLTE is an open source project by [Almsaeed Studio](http://almsaeedstudio.com) that is licensed under [MIT](http://opensource.org/licenses/MIT). Almsaeed Studio |
|||
reserves the right to change the license of future releases. |
|||
|
|||
Legacy Realeases |
|||
---------------- |
|||
AdminLTE 1.x can be easily upgraded to 2.x using [this guide](http://almsaeedstudio.com/themes/AdminLTE/documentation/index.html#browsers), but if you intend to keep using AdminLTE 1.x, you can download the latest release from the [releases](https://github.com/almasaeed2010/AdminLTE/releases) section above. |
|||
|
|||
Change log |
|||
---------- |
|||
**v2.0:** |
|||
|
|||
- Major layout bug fixes |
|||
- Change in layout mark up |
|||
- Added transitions to the sidebar |
|||
- New skins and modified previous skins |
|||
- Change in color scheme to a more complementing scheme |
|||
- Added footer support |
|||
- Removed pace.js from the main app.js |
|||
- Added support for collapsed sidebar as an initial state (add .sidebar-collapse to the body tag) |
|||
- Added boxed layout (.layout-boxed) |
|||
- Enhanced consistency in padding and margining |
|||
- Updated Bootstrap to 3.3.2 |
|||
- Fixed navbar dropdown menu on small screens positioning issues. |
|||
- Updated Ion Icons to 2.0.0 |
|||
- Updated FontAwesome to 4.3.0 |
|||
- Added ChartJS 1.0.1 |
|||
- Removed iCheck dependency |
|||
- Created Dashboard 2.0 |
|||
- Created new Chat widget (DirectChat) |
|||
- Added transitions to DirectChat |
|||
- Added contacts pane to DirectChat |
|||
- Changed .right-side to .content-wrapper |
|||
- Changed .navbar-right to .navbar-custom-menu |
|||
- Removed unused files |
|||
- Updated lockscreen style (HTML markup changed!) |
|||
- Updated Login & Registration pages (HTML markup changed!) |
|||
- Updated buttons style. |
|||
- Enhanced border-radius consistency |
|||
- Added mailbox: inbox, read, and compose pages |
|||
- Bootstrap & jQuery are now hosted locally |
|||
- Created documentation. |
|||
|
|||
**ver 1.2:** |
|||
|
|||
- Fixed the sidebar scroll issue when using the fixed layout. |
|||
- Added [Bootstrap Social Buttons](http://lipis.github.io/bootstrap-social/ "Bootstrap Social") plugin. |
|||
- Fixed RequireJS bug. Thanks to [StaticSphere](https://github.com/StaticSphere "github user"). |
|||
|
|||
**ver 1.1:** |
|||
|
|||
- Added new skin. class: .skin-black |
|||
- Added [pace](http://github.hubspot.com/pace/docs/welcome/ "pace") plugin. |
|||
|
|||
Image Credits |
|||
------------- |
|||
[Pixeden](http://www.pixeden.com/psd-web-elements/flat-responsive-showcase-psd) |
|||
|
|||
[Graphicsfuel](http://www.graphicsfuel.com/2013/02/13-high-resolution-blur-backgrounds/) |
|||
|
|||
[Pickaface](http://pickaface.net/) |
|||
|
|||
[Unsplash](https://unsplash.com/) |
|||
|
|||
Donations |
|||
--------- |
|||
Donations are **greatly appreciated!** |
|||
|
|||
[](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=629XCUSXBHCBC "Donate") |
|||
@ -1,516 +0,0 @@ |
|||
/** @format */ |
|||
|
|||
const user = window.user |
|||
const user_wallets = window.user_wallets |
|||
const wallet = window.wallet |
|||
const transactions = window.transactions |
|||
|
|||
var thehash = '' |
|||
var theinvoice = '' |
|||
var outamount = '' |
|||
var outmemo = '' |
|||
|
|||
// API CALLS
|
|||
|
|||
function postAjax(url, data, thekey, success) { |
|||
var params = |
|||
typeof data == 'string' |
|||
? data |
|||
: Object.keys(data) |
|||
.map(function(k) { |
|||
return encodeURIComponent(k) + '=' + encodeURIComponent(data[k]) |
|||
}) |
|||
.join('&') |
|||
var xhr = window.XMLHttpRequest |
|||
? new XMLHttpRequest() |
|||
: new ActiveXObject('Microsoft.XMLHTTP') |
|||
xhr.open('POST', url) |
|||
xhr.onreadystatechange = function() { |
|||
if (xhr.readyState > 3 && xhr.status == 200) { |
|||
success(xhr.responseText) |
|||
} |
|||
} |
|||
xhr.setRequestHeader('Grpc-Metadata-macaroon', thekey) |
|||
xhr.setRequestHeader('Content-Type', 'application/json') |
|||
xhr.send(params) |
|||
return xhr |
|||
} |
|||
|
|||
function getAjax(url, thekey, success) { |
|||
var xhr = window.XMLHttpRequest |
|||
? new XMLHttpRequest() |
|||
: new ActiveXObject('Microsoft.XMLHTTP') |
|||
xhr.open('GET', url, true) |
|||
xhr.onreadystatechange = function() { |
|||
if (xhr.readyState > 3 && xhr.status == 200) { |
|||
success(xhr.responseText) |
|||
} |
|||
} |
|||
xhr.setRequestHeader('Grpc-Metadata-macaroon', thekey) |
|||
xhr.setRequestHeader('Content-Type', 'application/json') |
|||
|
|||
xhr.send() |
|||
return xhr |
|||
} |
|||
|
|||
|
|||
|
|||
function sendfundsinput() { |
|||
document.getElementById('sendfunds').innerHTML = |
|||
"<div class='modal fade sends' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel' aria-hidden='true'>"+ |
|||
"<div class='modal-dialog' >"+ |
|||
"<div id='sendfunds2' style='padding: 0 10px 0 10px;'><div class='modal-content'>"+ |
|||
"<br/><br/>" + |
|||
"<textarea id='pasteinvoice' class='form-control' rows='3' placeholder='Paste an invoice'></textarea></div>" + |
|||
"<div class='modal-footer'>"+ |
|||
"<button type='submit' onclick='sendfundspaste()' class='btn btn-primary'>" + |
|||
"Submit</button><button style='margin-left:20px;' type='submit' class='btn btn-primary' onclick='scanQRsend()'>" + |
|||
'Use camera to scan an invoice</button></div>'+ |
|||
"</div></div>" |
|||
document.getElementById('receive').innerHTML = '' |
|||
} |
|||
|
|||
function sendfundspaste() { |
|||
invoice = document.getElementById('pasteinvoice').value |
|||
theinvoice = decode(invoice) |
|||
outmemo = theinvoice.data.tags[1].value |
|||
outamount = Number(theinvoice.human_readable_part.amount) / 1000 |
|||
if (outamount > Number(wallet.balance)) { |
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='modal-content'>"+ |
|||
"<h3><b style='color:red;'>Not enough funds!</b></h3></div>" + |
|||
"<div class='modal-footer'>"+ |
|||
"<button style='margin-left:20px;' type='submit' class='btn btn-primary' onclick='cancelsend()'>Continue</button></div>" |
|||
|
|||
} else { |
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='modal-content'>"+ |
|||
'<h3><b>Invoice details</b></br/>Amount: ' + |
|||
outamount + |
|||
'<br/>Memo: ' + |
|||
outmemo + |
|||
'</h3>' + |
|||
"<div class='input-group input-group-sm'><input type='text' id='invoiceinput' class='form-control' value='" + |
|||
invoice + |
|||
"'><span class='input-group-btn'><button class='btn btn-info btn-flat' type='button' onclick='copyfunc()'>Copy</button></span></div></br/></div>" + |
|||
"<div class='modal-footer'>"+ |
|||
"<button type='submit' class='btn btn-primary' onclick='sendfunds(" + |
|||
JSON.stringify(invoice) + |
|||
")'>Send funds</button>" + |
|||
"<button style='margin-left:20px;' type='submit' class='btn btn-primary' onclick='cancelsend()'>Cancel payment</button>" + |
|||
'</br/></br/></div></div></div>' |
|||
} |
|||
} |
|||
|
|||
function receive() { |
|||
document.getElementById('receive').innerHTML = |
|||
"<div class='modal fade receives' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel' aria-hidden='true'>"+ |
|||
"<div class='modal-dialog' ><div id='QRCODE' ><div class='modal-content' style='padding: 0 10px 0 10px;'>"+ |
|||
"<br/><center><input style='width:80%' type='number' class='form-control' id='amount' placeholder='Amount' max='1000000' required>" + |
|||
"<input style='width:80%' type='text' class='form-control' id='memo' placeholder='Memo' required></center></div>" + |
|||
"<div class='modal-footer'>"+ |
|||
"<input type='button' id='getinvoice' onclick='received()' class='btn btn-primary' value='Create invoice' />" + |
|||
'</div></div><br/>'+ |
|||
"</div></div></div>" |
|||
|
|||
document.getElementById('sendfunds').innerHTML = '' |
|||
} |
|||
|
|||
function received() { |
|||
memo = document.getElementById('memo').value |
|||
amount = document.getElementById('amount').value |
|||
postAjax( |
|||
'/api/v1/invoices', |
|||
JSON.stringify({value: amount, memo: memo}), |
|||
wallet.inkey, |
|||
function(data) { |
|||
theinvoice = JSON.parse(data).pay_req |
|||
thehash = JSON.parse(data).payment_hash |
|||
document.getElementById('QRCODE').innerHTML = |
|||
"<center><div class='modal-content' style='width:360px; padding: 10px 10px 0 10px;'>"+ |
|||
"<a href='lightning:" + |
|||
theinvoice + |
|||
"'><div id='qrcode'></div></a>" + |
|||
"<p style='word-wrap: break-word;'>" + |
|||
theinvoice + |
|||
'</p></center>' |
|||
|
|||
new QRCode(document.getElementById('qrcode'), { |
|||
text: theinvoice, |
|||
width: 300, |
|||
height: 300, |
|||
colorDark: '#000000', |
|||
colorLight: '#ffffff', |
|||
correctLevel: QRCode.CorrectLevel.M |
|||
}) |
|||
document.getElementById("qrcode").style.backgroundColor = "white"; |
|||
document.getElementById("qrcode").style.padding = "20px"; |
|||
|
|||
|
|||
setInterval(function(){ |
|||
getAjax('/api/v1/invoice/' + thehash, wallet.inkey, function(datab) { |
|||
console.log(JSON.parse(datab).PAID) |
|||
if (JSON.parse(datab).PAID == 'TRUE') { |
|||
window.location.href = 'wallet?wal=' + wallet.id + '&usr=' + user |
|||
} |
|||
})}, 3000); |
|||
|
|||
|
|||
} |
|||
) |
|||
} |
|||
|
|||
function cancelsend() { |
|||
window.location.href = 'wallet?wal=' + wallet.id + '&usr=' + user |
|||
} |
|||
|
|||
function processing() { |
|||
document.getElementById('processing').innerHTML = |
|||
"<div class='modal fade proc' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel' aria-hidden='true'>"+ |
|||
"<div class='modal-dialog'>"+ |
|||
"<div style='padding: 0 10px 0 10px;'><div class='modal-content'>"+ |
|||
"<h3><b>Processing...</b></br/></br/></br/></h3></div>"+ |
|||
"</div></div></div>" |
|||
|
|||
|
|||
window.top.location.href = "lnurlwallet?lightning=" + getQueryVariable("lightning"); |
|||
} |
|||
|
|||
|
|||
function getQueryVariable(variable) |
|||
{ |
|||
var query = window.location.search.substring(1); |
|||
var vars = query.split("&"); |
|||
for (var i=0;i<vars.length;i++) { |
|||
var pair = vars[i].split("="); |
|||
if(pair[0] == variable){return pair[1];} |
|||
} |
|||
return(false); |
|||
} |
|||
|
|||
function sendfunds(invoice) { |
|||
|
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='modal-content'></br/></br/>"+ |
|||
'<h3><b>Processing...</b></h3><</br/></br/></br/></div> '; |
|||
|
|||
postAjax( |
|||
'/api/v1/channels/transactions', |
|||
JSON.stringify({payment_request: invoice}), |
|||
wallet.adminkey, |
|||
|
|||
function(data) { |
|||
thehash = JSON.parse(data).payment_hash |
|||
|
|||
setInterval(function(){ |
|||
getAjax('/api/v1/payment/' + thehash, wallet.adminkey, function(datab) { |
|||
console.log(JSON.parse(datab).PAID) |
|||
if (JSON.parse(datab).PAID == 'TRUE') { |
|||
window.location.href = 'wallet?wal=' + wallet.id + '&usr=' + user |
|||
} |
|||
})}, 3000); |
|||
|
|||
} |
|||
) |
|||
|
|||
} |
|||
|
|||
function scanQRsend() { |
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='modal-content'>"+ |
|||
"<br/><div id='loadingMessage'>🎥 Unable to access video stream (please make sure you have a webcam enabled)</div>" + |
|||
"<canvas id='canvas' hidden></canvas><div id='output' hidden><div id='outputMessage'></div>" + |
|||
"<br/><span id='outputData'></span></div></div><div class='modal-footer'>"+ |
|||
"<button type='submit' class='btn btn-primary' onclick='cancelsend()'>Cancel</button><br/><br/>" |
|||
var video = document.createElement('video') |
|||
var canvasElement = document.getElementById('canvas') |
|||
var canvas = canvasElement.getContext('2d') |
|||
var loadingMessage = document.getElementById('loadingMessage') |
|||
var outputContainer = document.getElementById('output') |
|||
var outputMessage = document.getElementById('outputMessage') |
|||
var outputData = document.getElementById('outputData') |
|||
|
|||
// Use facingMode: environment to attemt to get the front camera on phones
|
|||
navigator.mediaDevices |
|||
.getUserMedia({video: {facingMode: 'environment'}}) |
|||
.then(function(stream) { |
|||
video.srcObject = stream |
|||
video.setAttribute('playsinline', true) // required to tell iOS safari we don't want fullscreen
|
|||
video.play() |
|||
requestAnimationFrame(tick) |
|||
}) |
|||
|
|||
function tick() { |
|||
loadingMessage.innerText = '⌛ Loading video...' |
|||
if (video.readyState === video.HAVE_ENOUGH_DATA) { |
|||
loadingMessage.hidden = true |
|||
canvasElement.hidden = false |
|||
outputContainer.hidden = false |
|||
canvasElement.height = video.videoHeight |
|||
canvasElement.width = video.videoWidth |
|||
canvas.drawImage(video, 0, 0, canvasElement.width, canvasElement.height) |
|||
var imageData = canvas.getImageData( |
|||
0, |
|||
0, |
|||
canvasElement.width, |
|||
canvasElement.height |
|||
) |
|||
var code = jsQR(imageData.data, imageData.width, imageData.height, { |
|||
inversionAttempts: 'dontInvert' |
|||
}) |
|||
if (code) { |
|||
|
|||
outputMessage.hidden = true |
|||
outputData.parentElement.hidden = false |
|||
outputData.innerText = JSON.stringify(code.data) |
|||
outstr = "" |
|||
outmemo = "" |
|||
if (code.data.split(":")[0] == "lightning") { |
|||
theinvoice = decode(code.data.split(":")[1]) |
|||
outmemo = theinvoice.data.tags[1].value |
|||
outstr = JSON.stringify(code.data.split(":")[1]) |
|||
} |
|||
|
|||
if (code.data.substring(0, 4).toUpperCase() != "LNBC"){ |
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='row'><div class='col-md-6'>" + |
|||
"<h3><b style='color:red;'>Not a lightning invoice</b></h3>" + |
|||
"<button style='margin-left:20px;' type='submit' class='btn btn-primary' onclick='cancelsend()'>Continue</button>" + |
|||
'</br/></br/></div></div>' |
|||
} |
|||
else{ |
|||
|
|||
theinvoice = decode(code.data) |
|||
outmemo = theinvoice.data.tags[1].value |
|||
outstr = JSON.stringify(code.data) |
|||
} |
|||
|
|||
|
|||
outamount = Number(theinvoice.human_readable_part.amount) / 1000 |
|||
if (outamount > Number(wallet.balance)) { |
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='row'><div class='col-md-6'>" + |
|||
"<h3><b style='color:red;'>Not enough funds!</b></h3>" + |
|||
"<button style='margin-left:20px;' type='submit' class='btn btn-primary' onclick='cancelsend()'>Continue</button>" + |
|||
'</br/></br/></div></div>' |
|||
} else { |
|||
document.getElementById('sendfunds2').innerHTML = |
|||
"<div class='row'><div class='col-md-6'>" + |
|||
'<h3><b>Invoice details</b></br/>Amount: ' + |
|||
outamount + |
|||
'<br/>Memo: ' + |
|||
outmemo + |
|||
'</h3>' + |
|||
"<div class='input-group input-group-sm'><input type='text' id='invoiceinput' class='form-control' value='" + |
|||
outstr + |
|||
"'><span class='input-group-btn'><button class='btn btn-info btn-flat' type='button' onclick='copyfunc()'>Copy</button></span></div></br/>" + |
|||
"<button type='submit' class='btn btn-primary' onclick='sendfunds(" + |
|||
outstr + |
|||
")'>Send funds</button>" + |
|||
"<button style='margin-left:20px;' type='submit' class='btn btn-primary' onclick='cancelsend()'>Cancel payment</button>" + |
|||
'</br/></br/></div></div>' |
|||
} |
|||
} else { |
|||
outputMessage.hidden = false |
|||
outputData.parentElement.hidden = true |
|||
} |
|||
} |
|||
requestAnimationFrame(tick) |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
function copyfunc(){ |
|||
var copyText = document.getElementById("invoiceinput"); |
|||
copyText.select(); |
|||
copyText.setSelectionRange(0, 99999); |
|||
document.execCommand("copy"); |
|||
|
|||
} |
|||
|
|||
function deletewallet() { |
|||
var url = 'deletewallet?wal=' + wallet.id + '&usr=' + user |
|||
window.location.href = url |
|||
} |
|||
|
|||
function sidebarmake() { |
|||
document.getElementById('sidebarmake').innerHTML = |
|||
"<li><div class='form-group'>" + |
|||
"<input style='width:70%;float:left;' type='text' class='form-control' id='walname' placeholder='Name wallet' required>" + |
|||
"<button style='width:30%;float:left;' type='button' class='btn btn-primary' onclick='newwallet()'>Submit</button>" + |
|||
'</div></li><br/><br/>' |
|||
} |
|||
|
|||
function newwallet() { |
|||
var walname = document.getElementById('walname').value |
|||
window.location.href = |
|||
'wallet?' + (user ? 'usr=' + user + '&' : '') + 'nme=' + walname |
|||
} |
|||
|
|||
function drawChart(transactions) { |
|||
var linechart = [] |
|||
var transactionsHTML = '' |
|||
var balance = 0 |
|||
|
|||
for (var i = 0; i < transactions.length; i++) { |
|||
var tx = transactions[i] |
|||
var datime = convertTimestamp(tx.time) |
|||
|
|||
// make the transactions table
|
|||
transactionsHTML = |
|||
"<tr><td style='width: 50%'>" + |
|||
tx.memo + |
|||
'</td><td>' + |
|||
datime + |
|||
'</td><td>' + |
|||
parseFloat(tx.amount / 1000) + |
|||
'</td></tr>' + |
|||
transactionsHTML |
|||
|
|||
// make the line chart
|
|||
balance += parseInt(tx.amount / 1000) |
|||
linechart.push({y: datime, balance: balance}) |
|||
} |
|||
|
|||
document.getElementById('transactions').innerHTML = transactionsHTML |
|||
|
|||
if (linechart[0] != '') { |
|||
document.getElementById('satschart').innerHTML = |
|||
"<div class='row'><div class='col-md-6'><div class='box box-info'><div class='box-header'>" + |
|||
"<h3 class='box-title'>Spending</h3></div><div class='box-body chart-responsive'>" + |
|||
"<div class='chart' id='line-chart' style='height: 300px;'></div></div></div></div></div>" |
|||
} |
|||
|
|||
console.log(linechart) |
|||
var line = new Morris.Line({ |
|||
element: 'line-chart', |
|||
resize: true, |
|||
data: linechart, |
|||
xkey: 'y', |
|||
ykeys: ['balance'], |
|||
labels: ['balance'], |
|||
lineColors: ['#3c8dbc'], |
|||
hideHover: 'auto' |
|||
}) |
|||
} |
|||
|
|||
function convertTimestamp(timestamp) { |
|||
var d = new Date(timestamp * 1000), |
|||
yyyy = d.getFullYear(), |
|||
mm = ('0' + (d.getMonth() + 1)).slice(-2), |
|||
dd = ('0' + d.getDate()).slice(-2), |
|||
hh = d.getHours(), |
|||
h = hh, |
|||
min = ('0' + d.getMinutes()).slice(-2), |
|||
ampm = 'AM', |
|||
time |
|||
time = yyyy + '-' + mm + '-' + dd + ' ' + h + ':' + min |
|||
return time |
|||
} |
|||
|
|||
if (transactions.length) { |
|||
drawChart(transactions) |
|||
} |
|||
|
|||
if (wallet) { |
|||
postAjax('/api/v1/checkpending', '', wallet.adminkey, function(data) {}) |
|||
} |
|||
|
|||
|
|||
function download_csv(csv, filename) { |
|||
var csvFile; |
|||
var downloadLink; |
|||
|
|||
// CSV FILE
|
|||
csvFile = new Blob([csv], {type: "text/csv"}); |
|||
|
|||
// Download link
|
|||
downloadLink = document.createElement("a"); |
|||
|
|||
// File name
|
|||
downloadLink.download = filename; |
|||
|
|||
// We have to create a link to the file
|
|||
downloadLink.href = window.URL.createObjectURL(csvFile); |
|||
|
|||
// Make sure that the link is not displayed
|
|||
downloadLink.style.display = "none"; |
|||
|
|||
// Add the link to your DOM
|
|||
document.body.appendChild(downloadLink); |
|||
|
|||
// Lanzamos
|
|||
downloadLink.click(); |
|||
} |
|||
|
|||
function export_table_to_csv(html, filename) { |
|||
var csv = []; |
|||
var rows = document.querySelectorAll("table tr"); |
|||
|
|||
for (var i = 0; i < rows.length; i++) { |
|||
var row = [], cols = rows[i].querySelectorAll("td, th"); |
|||
|
|||
for (var j = 0; j < cols.length; j++) |
|||
row.push(cols[j].innerText); |
|||
|
|||
csv.push(row.join(",")); |
|||
} |
|||
|
|||
// Download CSV
|
|||
download_csv(csv.join("\n"), filename); |
|||
} |
|||
|
|||
function exportbut(){ |
|||
var html = document.querySelector("table").outerHTML; |
|||
export_table_to_csv(html, "table.csv"); |
|||
} |
|||
|
|||
|
|||
function download_csv(csv, filename) { |
|||
var csvFile; |
|||
var downloadLink; |
|||
|
|||
// CSV FILE
|
|||
csvFile = new Blob([csv], {type: "text/csv"}); |
|||
|
|||
// Download link
|
|||
downloadLink = document.createElement("a"); |
|||
|
|||
// File name
|
|||
downloadLink.download = filename; |
|||
|
|||
// We have to create a link to the file
|
|||
downloadLink.href = window.URL.createObjectURL(csvFile); |
|||
|
|||
// Make sure that the link is not displayed
|
|||
downloadLink.style.display = "none"; |
|||
|
|||
// Add the link to your DOM
|
|||
document.body.appendChild(downloadLink); |
|||
|
|||
// Lanzamos
|
|||
downloadLink.click(); |
|||
} |
|||
|
|||
function export_table_to_csv(html, filename) { |
|||
var csv = []; |
|||
var rows = document.querySelectorAll("table tr"); |
|||
|
|||
for (var i = 0; i < rows.length; i++) { |
|||
var row = [], cols = rows[i].querySelectorAll("td, th"); |
|||
|
|||
for (var j = 0; j < cols.length; j++) |
|||
row.push(cols[j].innerText); |
|||
|
|||
csv.push(row.join(",")); |
|||
} |
|||
|
|||
// Download CSV
|
|||
download_csv(csv.join("\n"), filename); |
|||
} |
|||
|
|||
function exportbut(){ |
|||
var html = document.querySelector("table").outerHTML; |
|||
export_table_to_csv(html, "table.csv"); |
|||
} |
|||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 106 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,13 +0,0 @@ |
|||
// This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.
|
|||
require('../../js/transition.js') |
|||
require('../../js/alert.js') |
|||
require('../../js/button.js') |
|||
require('../../js/carousel.js') |
|||
require('../../js/collapse.js') |
|||
require('../../js/dropdown.js') |
|||
require('../../js/modal.js') |
|||
require('../../js/tooltip.js') |
|||
require('../../js/popover.js') |
|||
require('../../js/scrollspy.js') |
|||
require('../../js/tab.js') |
|||
require('../../js/affix.js') |
|||
@ -1,39 +0,0 @@ |
|||
// Mixins |
|||
// -------------------------------------------------- |
|||
|
|||
// Utilities |
|||
@import "mixins/hide-text.less"; |
|||
@import "mixins/opacity.less"; |
|||
@import "mixins/image.less"; |
|||
@import "mixins/labels.less"; |
|||
@import "mixins/reset-filter.less"; |
|||
@import "mixins/resize.less"; |
|||
@import "mixins/responsive-visibility.less"; |
|||
@import "mixins/size.less"; |
|||
@import "mixins/tab-focus.less"; |
|||
@import "mixins/text-emphasis.less"; |
|||
@import "mixins/text-overflow.less"; |
|||
@import "mixins/vendor-prefixes.less"; |
|||
|
|||
// Components |
|||
@import "mixins/alerts.less"; |
|||
@import "mixins/buttons.less"; |
|||
@import "mixins/panels.less"; |
|||
@import "mixins/pagination.less"; |
|||
@import "mixins/list-group.less"; |
|||
@import "mixins/nav-divider.less"; |
|||
@import "mixins/forms.less"; |
|||
@import "mixins/progress-bar.less"; |
|||
@import "mixins/table-row.less"; |
|||
|
|||
// Skins |
|||
@import "mixins/background-variant.less"; |
|||
@import "mixins/border-radius.less"; |
|||
@import "mixins/gradients.less"; |
|||
|
|||
// Layout |
|||
@import "mixins/clearfix.less"; |
|||
@import "mixins/center-block.less"; |
|||
@import "mixins/nav-vertical-align.less"; |
|||
@import "mixins/grid-framework.less"; |
|||
@import "mixins/grid.less"; |
|||
@ -1,14 +0,0 @@ |
|||
// Alerts |
|||
|
|||
.alert-variant(@background; @border; @text-color) { |
|||
background-color: @background; |
|||
border-color: @border; |
|||
color: @text-color; |
|||
|
|||
hr { |
|||
border-top-color: darken(@border, 5%); |
|||
} |
|||
.alert-link { |
|||
color: darken(@text-color, 10%); |
|||
} |
|||
} |
|||
@ -1,8 +0,0 @@ |
|||
// Contextual backgrounds |
|||
|
|||
.bg-variant(@color) { |
|||
background-color: @color; |
|||
a&:hover { |
|||
background-color: darken(@color, 10%); |
|||
} |
|||
} |
|||
@ -1,18 +0,0 @@ |
|||
// Single side border-radius |
|||
|
|||
.border-top-radius(@radius) { |
|||
border-top-right-radius: @radius; |
|||
border-top-left-radius: @radius; |
|||
} |
|||
.border-right-radius(@radius) { |
|||
border-bottom-right-radius: @radius; |
|||
border-top-right-radius: @radius; |
|||
} |
|||
.border-bottom-radius(@radius) { |
|||
border-bottom-right-radius: @radius; |
|||
border-bottom-left-radius: @radius; |
|||
} |
|||
.border-left-radius(@radius) { |
|||
border-bottom-left-radius: @radius; |
|||
border-top-left-radius: @radius; |
|||
} |
|||
@ -1,52 +0,0 @@ |
|||
// Button variants |
|||
// |
|||
// Easily pump out default styles, as well as :hover, :focus, :active, |
|||
// and disabled options for all buttons |
|||
|
|||
.button-variant(@color; @background; @border) { |
|||
color: @color; |
|||
background-color: @background; |
|||
border-color: @border; |
|||
|
|||
&:hover, |
|||
&:focus, |
|||
&.focus, |
|||
&:active, |
|||
&.active, |
|||
.open > .dropdown-toggle& { |
|||
color: @color; |
|||
background-color: darken(@background, 10%); |
|||
border-color: darken(@border, 12%); |
|||
} |
|||
&:active, |
|||
&.active, |
|||
.open > .dropdown-toggle& { |
|||
background-image: none; |
|||
} |
|||
&.disabled, |
|||
&[disabled], |
|||
fieldset[disabled] & { |
|||
&, |
|||
&:hover, |
|||
&:focus, |
|||
&.focus, |
|||
&:active, |
|||
&.active { |
|||
background-color: @background; |
|||
border-color: @border; |
|||
} |
|||
} |
|||
|
|||
.badge { |
|||
color: @background; |
|||
background-color: @color; |
|||
} |
|||
} |
|||
|
|||
// Button sizes |
|||
.button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { |
|||
padding: @padding-vertical @padding-horizontal; |
|||
font-size: @font-size; |
|||
line-height: @line-height; |
|||
border-radius: @border-radius; |
|||
} |
|||
@ -1,7 +0,0 @@ |
|||
// Center-align a block level element |
|||
|
|||
.center-block() { |
|||
display: block; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
} |
|||
@ -1,22 +0,0 @@ |
|||
// Clearfix |
|||
// |
|||
// For modern browsers |
|||
// 1. The space content is one way to avoid an Opera bug when the |
|||
// contenteditable attribute is included anywhere else in the document. |
|||
// Otherwise it causes space to appear at the top and bottom of elements |
|||
// that are clearfixed. |
|||
// 2. The use of `table` rather than `block` is only necessary if using |
|||
// `:before` to contain the top-margins of child elements. |
|||
// |
|||
// Source: http://nicolasgallagher.com/micro-clearfix-hack/ |
|||
|
|||
.clearfix() { |
|||
&:before, |
|||
&:after { |
|||
content: " "; // 1 |
|||
display: table; // 2 |
|||
} |
|||
&:after { |
|||
clear: both; |
|||
} |
|||
} |
|||
@ -1,85 +0,0 @@ |
|||
// Form validation states |
|||
// |
|||
// Used in forms.less to generate the form validation CSS for warnings, errors, |
|||
// and successes. |
|||
|
|||
.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) { |
|||
// Color the label and help text |
|||
.help-block, |
|||
.control-label, |
|||
.radio, |
|||
.checkbox, |
|||
.radio-inline, |
|||
.checkbox-inline, |
|||
&.radio label, |
|||
&.checkbox label, |
|||
&.radio-inline label, |
|||
&.checkbox-inline label { |
|||
color: @text-color; |
|||
} |
|||
// Set the border and box shadow on specific inputs to match |
|||
.form-control { |
|||
border-color: @border-color; |
|||
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work |
|||
&:focus { |
|||
border-color: darken(@border-color, 10%); |
|||
@shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%); |
|||
.box-shadow(@shadow); |
|||
} |
|||
} |
|||
// Set validation states also for addons |
|||
.input-group-addon { |
|||
color: @text-color; |
|||
border-color: @border-color; |
|||
background-color: @background-color; |
|||
} |
|||
// Optional feedback icon |
|||
.form-control-feedback { |
|||
color: @text-color; |
|||
} |
|||
} |
|||
|
|||
|
|||
// Form control focus state |
|||
// |
|||
// Generate a customized focus state and for any input with the specified color, |
|||
// which defaults to the `@input-border-focus` variable. |
|||
// |
|||
// We highly encourage you to not customize the default value, but instead use |
|||
// this to tweak colors on an as-needed basis. This aesthetic change is based on |
|||
// WebKit's default styles, but applicable to a wider range of browsers. Its |
|||
// usability and accessibility should be taken into account with any change. |
|||
// |
|||
// Example usage: change the default blue border and shadow to white for better |
|||
// contrast against a dark gray background. |
|||
.form-control-focus(@color: @input-border-focus) { |
|||
@color-rgba: rgba(red(@color), green(@color), blue(@color), .6); |
|||
&:focus { |
|||
border-color: @color; |
|||
outline: 0; |
|||
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}"); |
|||
} |
|||
} |
|||
|
|||
// Form control sizing |
|||
// |
|||
// Relative text size, padding, and border-radii changes for form controls. For |
|||
// horizontal sizing, wrap controls in the predefined grid classes. `<select>` |
|||
// element gets special love because it's special, and that's a fact! |
|||
.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { |
|||
height: @input-height; |
|||
padding: @padding-vertical @padding-horizontal; |
|||
font-size: @font-size; |
|||
line-height: @line-height; |
|||
border-radius: @border-radius; |
|||
|
|||
select& { |
|||
height: @input-height; |
|||
line-height: @input-height; |
|||
} |
|||
|
|||
textarea&, |
|||
select[multiple]& { |
|||
height: auto; |
|||
} |
|||
} |
|||
@ -1,59 +0,0 @@ |
|||
// Gradients |
|||
|
|||
#gradient { |
|||
|
|||
// Horizontal gradient, from left to right |
|||
// |
|||
// Creates two color stops, start and end, by specifying a color and position for each color stop. |
|||
// Color stops are not available in IE9 and below. |
|||
.horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { |
|||
background-image: -webkit-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+ |
|||
background-image: -o-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // Opera 12 |
|||
background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ |
|||
background-repeat: repeat-x; |
|||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down |
|||
} |
|||
|
|||
// Vertical gradient, from top to bottom |
|||
// |
|||
// Creates two color stops, start and end, by specifying a color and position for each color stop. |
|||
// Color stops are not available in IE9 and below. |
|||
.vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { |
|||
background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+ |
|||
background-image: -o-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Opera 12 |
|||
background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ |
|||
background-repeat: repeat-x; |
|||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down |
|||
} |
|||
|
|||
.directional(@start-color: #555; @end-color: #333; @deg: 45deg) { |
|||
background-repeat: repeat-x; |
|||
background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+ |
|||
background-image: -o-linear-gradient(@deg, @start-color, @end-color); // Opera 12 |
|||
background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+ |
|||
} |
|||
.horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { |
|||
background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); |
|||
background-image: -o-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); |
|||
background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color); |
|||
background-repeat: no-repeat; |
|||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback |
|||
} |
|||
.vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { |
|||
background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color); |
|||
background-image: -o-linear-gradient(@start-color, @mid-color @color-stop, @end-color); |
|||
background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color); |
|||
background-repeat: no-repeat; |
|||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback |
|||
} |
|||
.radial(@inner-color: #555; @outer-color: #333) { |
|||
background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color); |
|||
background-image: radial-gradient(circle, @inner-color, @outer-color); |
|||
background-repeat: no-repeat; |
|||
} |
|||
.striped(@color: rgba(255,255,255,.15); @angle: 45deg) { |
|||
background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); |
|||
background-image: -o-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); |
|||
background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); |
|||
} |
|||
} |
|||
@ -1,91 +0,0 @@ |
|||
// Framework grid generation |
|||
// |
|||
// Used only by Bootstrap to generate the correct number of grid classes given |
|||
// any value of `@grid-columns`. |
|||
|
|||
.make-grid-columns() { |
|||
// Common styles for all sizes of grid columns, widths 1-12 |
|||
.col(@index) { // initial |
|||
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}"; |
|||
.col((@index + 1), @item); |
|||
} |
|||
.col(@index, @list) when (@index =< @grid-columns) { // general; "=<" isn't a typo |
|||
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}"; |
|||
.col((@index + 1), ~"@{list}, @{item}"); |
|||
} |
|||
.col(@index, @list) when (@index > @grid-columns) { // terminal |
|||
@{list} { |
|||
position: relative; |
|||
// Prevent columns from collapsing when empty |
|||
min-height: 1px; |
|||
// Inner gutter via padding |
|||
padding-left: (@grid-gutter-width / 2); |
|||
padding-right: (@grid-gutter-width / 2); |
|||
} |
|||
} |
|||
.col(1); // kickstart it |
|||
} |
|||
|
|||
.float-grid-columns(@class) { |
|||
.col(@index) { // initial |
|||
@item: ~".col-@{class}-@{index}"; |
|||
.col((@index + 1), @item); |
|||
} |
|||
.col(@index, @list) when (@index =< @grid-columns) { // general |
|||
@item: ~".col-@{class}-@{index}"; |
|||
.col((@index + 1), ~"@{list}, @{item}"); |
|||
} |
|||
.col(@index, @list) when (@index > @grid-columns) { // terminal |
|||
@{list} { |
|||
float: left; |
|||
} |
|||
} |
|||
.col(1); // kickstart it |
|||
} |
|||
|
|||
.calc-grid-column(@index, @class, @type) when (@type = width) and (@index > 0) { |
|||
.col-@{class}-@{index} { |
|||
width: percentage((@index / @grid-columns)); |
|||
} |
|||
} |
|||
.calc-grid-column(@index, @class, @type) when (@type = push) and (@index > 0) { |
|||
.col-@{class}-push-@{index} { |
|||
left: percentage((@index / @grid-columns)); |
|||
} |
|||
} |
|||
.calc-grid-column(@index, @class, @type) when (@type = push) and (@index = 0) { |
|||
.col-@{class}-push-0 { |
|||
left: auto; |
|||
} |
|||
} |
|||
.calc-grid-column(@index, @class, @type) when (@type = pull) and (@index > 0) { |
|||
.col-@{class}-pull-@{index} { |
|||
right: percentage((@index / @grid-columns)); |
|||
} |
|||
} |
|||
.calc-grid-column(@index, @class, @type) when (@type = pull) and (@index = 0) { |
|||
.col-@{class}-pull-0 { |
|||
right: auto; |
|||
} |
|||
} |
|||
.calc-grid-column(@index, @class, @type) when (@type = offset) { |
|||
.col-@{class}-offset-@{index} { |
|||
margin-left: percentage((@index / @grid-columns)); |
|||
} |
|||
} |
|||
|
|||
// Basic looping in LESS |
|||
.loop-grid-columns(@index, @class, @type) when (@index >= 0) { |
|||
.calc-grid-column(@index, @class, @type); |
|||
// next iteration |
|||
.loop-grid-columns((@index - 1), @class, @type); |
|||
} |
|||
|
|||
// Create grid for specific class |
|||
.make-grid(@class) { |
|||
.float-grid-columns(@class); |
|||
.loop-grid-columns(@grid-columns, @class, width); |
|||
.loop-grid-columns(@grid-columns, @class, pull); |
|||
.loop-grid-columns(@grid-columns, @class, push); |
|||
.loop-grid-columns(@grid-columns, @class, offset); |
|||
} |
|||
@ -1,122 +0,0 @@ |
|||
// Grid system |
|||
// |
|||
// Generate semantic grid columns with these mixins. |
|||
|
|||
// Centered container element |
|||
.container-fixed(@gutter: @grid-gutter-width) { |
|||
margin-right: auto; |
|||
margin-left: auto; |
|||
padding-left: (@gutter / 2); |
|||
padding-right: (@gutter / 2); |
|||
&:extend(.clearfix all); |
|||
} |
|||
|
|||
// Creates a wrapper for a series of columns |
|||
.make-row(@gutter: @grid-gutter-width) { |
|||
margin-left: (@gutter / -2); |
|||
margin-right: (@gutter / -2); |
|||
&:extend(.clearfix all); |
|||
} |
|||
|
|||
// Generate the extra small columns |
|||
.make-xs-column(@columns; @gutter: @grid-gutter-width) { |
|||
position: relative; |
|||
float: left; |
|||
width: percentage((@columns / @grid-columns)); |
|||
min-height: 1px; |
|||
padding-left: (@gutter / 2); |
|||
padding-right: (@gutter / 2); |
|||
} |
|||
.make-xs-column-offset(@columns) { |
|||
margin-left: percentage((@columns / @grid-columns)); |
|||
} |
|||
.make-xs-column-push(@columns) { |
|||
left: percentage((@columns / @grid-columns)); |
|||
} |
|||
.make-xs-column-pull(@columns) { |
|||
right: percentage((@columns / @grid-columns)); |
|||
} |
|||
|
|||
// Generate the small columns |
|||
.make-sm-column(@columns; @gutter: @grid-gutter-width) { |
|||
position: relative; |
|||
min-height: 1px; |
|||
padding-left: (@gutter / 2); |
|||
padding-right: (@gutter / 2); |
|||
|
|||
@media (min-width: @screen-sm-min) { |
|||
float: left; |
|||
width: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-sm-column-offset(@columns) { |
|||
@media (min-width: @screen-sm-min) { |
|||
margin-left: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-sm-column-push(@columns) { |
|||
@media (min-width: @screen-sm-min) { |
|||
left: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-sm-column-pull(@columns) { |
|||
@media (min-width: @screen-sm-min) { |
|||
right: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
|
|||
// Generate the medium columns |
|||
.make-md-column(@columns; @gutter: @grid-gutter-width) { |
|||
position: relative; |
|||
min-height: 1px; |
|||
padding-left: (@gutter / 2); |
|||
padding-right: (@gutter / 2); |
|||
|
|||
@media (min-width: @screen-md-min) { |
|||
float: left; |
|||
width: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-md-column-offset(@columns) { |
|||
@media (min-width: @screen-md-min) { |
|||
margin-left: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-md-column-push(@columns) { |
|||
@media (min-width: @screen-md-min) { |
|||
left: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-md-column-pull(@columns) { |
|||
@media (min-width: @screen-md-min) { |
|||
right: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
|
|||
// Generate the large columns |
|||
.make-lg-column(@columns; @gutter: @grid-gutter-width) { |
|||
position: relative; |
|||
min-height: 1px; |
|||
padding-left: (@gutter / 2); |
|||
padding-right: (@gutter / 2); |
|||
|
|||
@media (min-width: @screen-lg-min) { |
|||
float: left; |
|||
width: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-lg-column-offset(@columns) { |
|||
@media (min-width: @screen-lg-min) { |
|||
margin-left: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-lg-column-push(@columns) { |
|||
@media (min-width: @screen-lg-min) { |
|||
left: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
.make-lg-column-pull(@columns) { |
|||
@media (min-width: @screen-lg-min) { |
|||
right: percentage((@columns / @grid-columns)); |
|||
} |
|||
} |
|||
@ -1,21 +0,0 @@ |
|||
// CSS image replacement |
|||
// |
|||
// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for |
|||
// mixins being reused as classes with the same name, this doesn't hold up. As |
|||
// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`. |
|||
// |
|||
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757 |
|||
|
|||
// Deprecated as of v3.0.1 (will be removed in v4) |
|||
.hide-text() { |
|||
font: ~"0/0" a; |
|||
color: transparent; |
|||
text-shadow: none; |
|||
background-color: transparent; |
|||
border: 0; |
|||
} |
|||
|
|||
// New mixin to use as of v3.0.1 |
|||
.text-hide() { |
|||
.hide-text(); |
|||
} |
|||
@ -1,33 +0,0 @@ |
|||
// Image Mixins |
|||
// - Responsive image |
|||
// - Retina image |
|||
|
|||
|
|||
// Responsive image |
|||
// |
|||
// Keep images from scaling beyond the width of their parents. |
|||
.img-responsive(@display: block) { |
|||
display: @display; |
|||
max-width: 100%; // Part 1: Set a maximum relative to the parent |
|||
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching |
|||
} |
|||
|
|||
|
|||
// Retina image |
|||
// |
|||
// Short retina mixin for setting background-image and -size. Note that the |
|||
// spelling of `min--moz-device-pixel-ratio` is intentional. |
|||
.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { |
|||
background-image: url("@{file-1x}"); |
|||
|
|||
@media |
|||
only screen and (-webkit-min-device-pixel-ratio: 2), |
|||
only screen and ( min--moz-device-pixel-ratio: 2), |
|||
only screen and ( -o-min-device-pixel-ratio: 2/1), |
|||
only screen and ( min-device-pixel-ratio: 2), |
|||
only screen and ( min-resolution: 192dpi), |
|||
only screen and ( min-resolution: 2dppx) { |
|||
background-image: url("@{file-2x}"); |
|||
background-size: @width-1x @height-1x; |
|||
} |
|||
} |
|||
@ -1,12 +0,0 @@ |
|||
// Labels |
|||
|
|||
.label-variant(@color) { |
|||
background-color: @color; |
|||
|
|||
&[href] { |
|||
&:hover, |
|||
&:focus { |
|||
background-color: darken(@color, 10%); |
|||
} |
|||
} |
|||
} |
|||
@ -1,29 +0,0 @@ |
|||
// List Groups |
|||
|
|||
.list-group-item-variant(@state; @background; @color) { |
|||
.list-group-item-@{state} { |
|||
color: @color; |
|||
background-color: @background; |
|||
|
|||
a& { |
|||
color: @color; |
|||
|
|||
.list-group-item-heading { |
|||
color: inherit; |
|||
} |
|||
|
|||
&:hover, |
|||
&:focus { |
|||
color: @color; |
|||
background-color: darken(@background, 5%); |
|||
} |
|||
&.active, |
|||
&.active:hover, |
|||
&.active:focus { |
|||
color: #fff; |
|||
background-color: @color; |
|||
border-color: @color; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -1,10 +0,0 @@ |
|||
// Horizontal dividers |
|||
// |
|||
// Dividers (basically an hr) within dropdowns and nav lists |
|||
|
|||
.nav-divider(@color: #e5e5e5) { |
|||
height: 1px; |
|||
margin: ((@line-height-computed / 2) - 1) 0; |
|||
overflow: hidden; |
|||
background-color: @color; |
|||
} |
|||
@ -1,9 +0,0 @@ |
|||
// Navbar vertical align |
|||
// |
|||
// Vertically center elements in the navbar. |
|||
// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin. |
|||
|
|||
.navbar-vertical-align(@element-height) { |
|||
margin-top: ((@navbar-height - @element-height) / 2); |
|||
margin-bottom: ((@navbar-height - @element-height) / 2); |
|||
} |
|||
@ -1,8 +0,0 @@ |
|||
// Opacity |
|||
|
|||
.opacity(@opacity) { |
|||
opacity: @opacity; |
|||
// IE8 filter |
|||
@opacity-ie: (@opacity * 100); |
|||
filter: ~"alpha(opacity=@{opacity-ie})"; |
|||
} |
|||
@ -1,23 +0,0 @@ |
|||
// Pagination |
|||
|
|||
.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) { |
|||
> li { |
|||
> a, |
|||
> span { |
|||
padding: @padding-vertical @padding-horizontal; |
|||
font-size: @font-size; |
|||
} |
|||
&:first-child { |
|||
> a, |
|||
> span { |
|||
.border-left-radius(@border-radius); |
|||
} |
|||
} |
|||
&:last-child { |
|||
> a, |
|||
> span { |
|||
.border-right-radius(@border-radius); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -1,24 +0,0 @@ |
|||
// Panels |
|||
|
|||
.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) { |
|||
border-color: @border; |
|||
|
|||
& > .panel-heading { |
|||
color: @heading-text-color; |
|||
background-color: @heading-bg-color; |
|||
border-color: @heading-border; |
|||
|
|||
+ .panel-collapse > .panel-body { |
|||
border-top-color: @border; |
|||
} |
|||
.badge { |
|||
color: @heading-bg-color; |
|||
background-color: @heading-text-color; |
|||
} |
|||
} |
|||
& > .panel-footer { |
|||
+ .panel-collapse > .panel-body { |
|||
border-bottom-color: @border; |
|||
} |
|||
} |
|||
} |
|||
@ -1,9 +0,0 @@ |
|||
// Progress bars |
|||
.progress-bar-variant(@color) { |
|||
background-color: @color; |
|||
|
|||
// Deprecated parent class requirement as of v3.2.0 |
|||
.progress-striped & { |
|||
#gradient > .striped(); |
|||
} |
|||
} |
|||
@ -1,8 +0,0 @@ |
|||
// Reset filters for IE |
|||
// |
|||
// When you need to remove a gradient background, do not forget to use this to reset |
|||
// the IE filter for IE9 and below. |
|||
|
|||
.reset-filter() { |
|||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)")); |
|||
} |
|||
@ -1,6 +0,0 @@ |
|||
// Resize anything |
|||
|
|||
.resizable(@direction) { |
|||
resize: @direction; // Options: horizontal, vertical, both |
|||
overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible` |
|||
} |
|||
@ -1,15 +0,0 @@ |
|||
// Responsive utilities |
|||
|
|||
// |
|||
// More easily include all the states for responsive-utilities.less. |
|||
.responsive-visibility() { |
|||
display: block !important; |
|||
table& { display: table; } |
|||
tr& { display: table-row !important; } |
|||
th&, |
|||
td& { display: table-cell !important; } |
|||
} |
|||
|
|||
.responsive-invisibility() { |
|||
display: none !important; |
|||
} |
|||
@ -1,10 +0,0 @@ |
|||
// Sizing shortcuts |
|||
|
|||
.size(@width; @height) { |
|||
width: @width; |
|||
height: @height; |
|||
} |
|||
|
|||
.square(@size) { |
|||
.size(@size; @size); |
|||
} |
|||
@ -1,9 +0,0 @@ |
|||
// WebKit-style focus |
|||
|
|||
.tab-focus() { |
|||
// Default |
|||
outline: thin dotted; |
|||
// WebKit |
|||
outline: 5px auto -webkit-focus-ring-color; |
|||
outline-offset: -2px; |
|||
} |
|||
@ -1,28 +0,0 @@ |
|||
// Tables |
|||
|
|||
.table-row-variant(@state; @background) { |
|||
// Exact selectors below required to override `.table-striped` and prevent |
|||
// inheritance to nested tables. |
|||
.table > thead > tr, |
|||
.table > tbody > tr, |
|||
.table > tfoot > tr { |
|||
> td.@{state}, |
|||
> th.@{state}, |
|||
&.@{state} > td, |
|||
&.@{state} > th { |
|||
background-color: @background; |
|||
} |
|||
} |
|||
|
|||
// Hover states for `.table-hover` |
|||
// Note: this is not available for cells or rows within `thead` or `tfoot`. |
|||
.table-hover > tbody > tr { |
|||
> td.@{state}:hover, |
|||
> th.@{state}:hover, |
|||
&.@{state}:hover > td, |
|||
&:hover > .@{state}, |
|||
&.@{state}:hover > th { |
|||
background-color: darken(@background, 5%); |
|||
} |
|||
} |
|||
} |
|||
@ -1,8 +0,0 @@ |
|||
// Typography |
|||
|
|||
.text-emphasis-variant(@color) { |
|||
color: @color; |
|||
a&:hover { |
|||
color: darken(@color, 10%); |
|||
} |
|||
} |
|||
@ -1,8 +0,0 @@ |
|||
// Text overflow |
|||
// Requires inline-block or block for proper styling |
|||
|
|||
.text-overflow() { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
} |
|||
@ -1,227 +0,0 @@ |
|||
// Vendor Prefixes |
|||
// |
|||
// All vendor mixins are deprecated as of v3.2.0 due to the introduction of |
|||
// Autoprefixer in our Gruntfile. They will be removed in v4. |
|||
|
|||
// - Animations |
|||
// - Backface visibility |
|||
// - Box shadow |
|||
// - Box sizing |
|||
// - Content columns |
|||
// - Hyphens |
|||
// - Placeholder text |
|||
// - Transformations |
|||
// - Transitions |
|||
// - User Select |
|||
|
|||
|
|||
// Animations |
|||
.animation(@animation) { |
|||
-webkit-animation: @animation; |
|||
-o-animation: @animation; |
|||
animation: @animation; |
|||
} |
|||
.animation-name(@name) { |
|||
-webkit-animation-name: @name; |
|||
animation-name: @name; |
|||
} |
|||
.animation-duration(@duration) { |
|||
-webkit-animation-duration: @duration; |
|||
animation-duration: @duration; |
|||
} |
|||
.animation-timing-function(@timing-function) { |
|||
-webkit-animation-timing-function: @timing-function; |
|||
animation-timing-function: @timing-function; |
|||
} |
|||
.animation-delay(@delay) { |
|||
-webkit-animation-delay: @delay; |
|||
animation-delay: @delay; |
|||
} |
|||
.animation-iteration-count(@iteration-count) { |
|||
-webkit-animation-iteration-count: @iteration-count; |
|||
animation-iteration-count: @iteration-count; |
|||
} |
|||
.animation-direction(@direction) { |
|||
-webkit-animation-direction: @direction; |
|||
animation-direction: @direction; |
|||
} |
|||
.animation-fill-mode(@fill-mode) { |
|||
-webkit-animation-fill-mode: @fill-mode; |
|||
animation-fill-mode: @fill-mode; |
|||
} |
|||
|
|||
// Backface visibility |
|||
// Prevent browsers from flickering when using CSS 3D transforms. |
|||
// Default value is `visible`, but can be changed to `hidden` |
|||
|
|||
.backface-visibility(@visibility){ |
|||
-webkit-backface-visibility: @visibility; |
|||
-moz-backface-visibility: @visibility; |
|||
backface-visibility: @visibility; |
|||
} |
|||
|
|||
// Drop shadows |
|||
// |
|||
// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's |
|||
// supported browsers that have box shadow capabilities now support it. |
|||
|
|||
.box-shadow(@shadow) { |
|||
-webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1 |
|||
box-shadow: @shadow; |
|||
} |
|||
|
|||
// Box sizing |
|||
.box-sizing(@boxmodel) { |
|||
-webkit-box-sizing: @boxmodel; |
|||
-moz-box-sizing: @boxmodel; |
|||
box-sizing: @boxmodel; |
|||
} |
|||
|
|||
// CSS3 Content Columns |
|||
.content-columns(@column-count; @column-gap: @grid-gutter-width) { |
|||
-webkit-column-count: @column-count; |
|||
-moz-column-count: @column-count; |
|||
column-count: @column-count; |
|||
-webkit-column-gap: @column-gap; |
|||
-moz-column-gap: @column-gap; |
|||
column-gap: @column-gap; |
|||
} |
|||
|
|||
// Optional hyphenation |
|||
.hyphens(@mode: auto) { |
|||
word-wrap: break-word; |
|||
-webkit-hyphens: @mode; |
|||
-moz-hyphens: @mode; |
|||
-ms-hyphens: @mode; // IE10+ |
|||
-o-hyphens: @mode; |
|||
hyphens: @mode; |
|||
} |
|||
|
|||
// Placeholder text |
|||
.placeholder(@color: @input-color-placeholder) { |
|||
// Firefox |
|||
&::-moz-placeholder { |
|||
color: @color; |
|||
opacity: 1; // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526 |
|||
} |
|||
&:-ms-input-placeholder { color: @color; } // Internet Explorer 10+ |
|||
&::-webkit-input-placeholder { color: @color; } // Safari and Chrome |
|||
} |
|||
|
|||
// Transformations |
|||
.scale(@ratio) { |
|||
-webkit-transform: scale(@ratio); |
|||
-ms-transform: scale(@ratio); // IE9 only |
|||
-o-transform: scale(@ratio); |
|||
transform: scale(@ratio); |
|||
} |
|||
.scale(@ratioX; @ratioY) { |
|||
-webkit-transform: scale(@ratioX, @ratioY); |
|||
-ms-transform: scale(@ratioX, @ratioY); // IE9 only |
|||
-o-transform: scale(@ratioX, @ratioY); |
|||
transform: scale(@ratioX, @ratioY); |
|||
} |
|||
.scaleX(@ratio) { |
|||
-webkit-transform: scaleX(@ratio); |
|||
-ms-transform: scaleX(@ratio); // IE9 only |
|||
-o-transform: scaleX(@ratio); |
|||
transform: scaleX(@ratio); |
|||
} |
|||
.scaleY(@ratio) { |
|||
-webkit-transform: scaleY(@ratio); |
|||
-ms-transform: scaleY(@ratio); // IE9 only |
|||
-o-transform: scaleY(@ratio); |
|||
transform: scaleY(@ratio); |
|||
} |
|||
.skew(@x; @y) { |
|||
-webkit-transform: skewX(@x) skewY(@y); |
|||
-ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+ |
|||
-o-transform: skewX(@x) skewY(@y); |
|||
transform: skewX(@x) skewY(@y); |
|||
} |
|||
.translate(@x; @y) { |
|||
-webkit-transform: translate(@x, @y); |
|||
-ms-transform: translate(@x, @y); // IE9 only |
|||
-o-transform: translate(@x, @y); |
|||
transform: translate(@x, @y); |
|||
} |
|||
.translate3d(@x; @y; @z) { |
|||
-webkit-transform: translate3d(@x, @y, @z); |
|||
transform: translate3d(@x, @y, @z); |
|||
} |
|||
.rotate(@degrees) { |
|||
-webkit-transform: rotate(@degrees); |
|||
-ms-transform: rotate(@degrees); // IE9 only |
|||
-o-transform: rotate(@degrees); |
|||
transform: rotate(@degrees); |
|||
} |
|||
.rotateX(@degrees) { |
|||
-webkit-transform: rotateX(@degrees); |
|||
-ms-transform: rotateX(@degrees); // IE9 only |
|||
-o-transform: rotateX(@degrees); |
|||
transform: rotateX(@degrees); |
|||
} |
|||
.rotateY(@degrees) { |
|||
-webkit-transform: rotateY(@degrees); |
|||
-ms-transform: rotateY(@degrees); // IE9 only |
|||
-o-transform: rotateY(@degrees); |
|||
transform: rotateY(@degrees); |
|||
} |
|||
.perspective(@perspective) { |
|||
-webkit-perspective: @perspective; |
|||
-moz-perspective: @perspective; |
|||
perspective: @perspective; |
|||
} |
|||
.perspective-origin(@perspective) { |
|||
-webkit-perspective-origin: @perspective; |
|||
-moz-perspective-origin: @perspective; |
|||
perspective-origin: @perspective; |
|||
} |
|||
.transform-origin(@origin) { |
|||
-webkit-transform-origin: @origin; |
|||
-moz-transform-origin: @origin; |
|||
-ms-transform-origin: @origin; // IE9 only |
|||
transform-origin: @origin; |
|||
} |
|||
|
|||
|
|||
// Transitions |
|||
|
|||
.transition(@transition) { |
|||
-webkit-transition: @transition; |
|||
-o-transition: @transition; |
|||
transition: @transition; |
|||
} |
|||
.transition-property(@transition-property) { |
|||
-webkit-transition-property: @transition-property; |
|||
transition-property: @transition-property; |
|||
} |
|||
.transition-delay(@transition-delay) { |
|||
-webkit-transition-delay: @transition-delay; |
|||
transition-delay: @transition-delay; |
|||
} |
|||
.transition-duration(@transition-duration) { |
|||
-webkit-transition-duration: @transition-duration; |
|||
transition-duration: @transition-duration; |
|||
} |
|||
.transition-timing-function(@timing-function) { |
|||
-webkit-transition-timing-function: @timing-function; |
|||
transition-timing-function: @timing-function; |
|||
} |
|||
.transition-transform(@transition) { |
|||
-webkit-transition: -webkit-transform @transition; |
|||
-moz-transition: -moz-transform @transition; |
|||
-o-transition: -o-transform @transition; |
|||
transition: transform @transition; |
|||
} |
|||
|
|||
|
|||
// User select |
|||
// For selecting text on the page |
|||
|
|||
.user-select(@select) { |
|||
-webkit-user-select: @select; |
|||
-moz-user-select: @select; |
|||
-ms-user-select: @select; // IE10+ |
|||
user-select: @select; |
|||
} |
|||
@ -1,857 +0,0 @@ |
|||
// |
|||
// Variables |
|||
// -------------------------------------------------- |
|||
|
|||
|
|||
//== Colors |
|||
// |
|||
//## Gray and brand colors for use across Bootstrap. |
|||
|
|||
@gray-base: #000; |
|||
@gray-darker: lighten(@gray-base, 13.5%); // #222 |
|||
@gray-dark: lighten(@gray-base, 20%); // #333 |
|||
@gray: lighten(@gray-base, 33.5%); // #555 |
|||
@gray-light: lighten(@gray-base, 46.7%); // #777 |
|||
@gray-lighter: lighten(@gray-base, 93.5%); // #eee |
|||
|
|||
@brand-primary: darken(#428bca, 6.5%); // #337ab7 |
|||
@brand-success: #5cb85c; |
|||
@brand-info: #5bc0de; |
|||
@brand-warning: #f0ad4e; |
|||
@brand-danger: #d9534f; |
|||
|
|||
|
|||
//== Scaffolding |
|||
// |
|||
//## Settings for some of the most global styles. |
|||
|
|||
//** Background color for `<body>`. |
|||
@body-bg: #fff; |
|||
//** Global text color on `<body>`. |
|||
@text-color: @gray-dark; |
|||
|
|||
//** Global textual link color. |
|||
@link-color: @brand-primary; |
|||
//** Link hover color set via `darken()` function. |
|||
@link-hover-color: darken(@link-color, 15%); |
|||
//** Link hover decoration. |
|||
@link-hover-decoration: underline; |
|||
|
|||
|
|||
//== Typography |
|||
// |
|||
//## Font, line-height, and color for body text, headings, and more. |
|||
|
|||
@font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif; |
|||
@font-family-serif: Georgia, "Times New Roman", Times, serif; |
|||
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`. |
|||
@font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace; |
|||
@font-family-base: @font-family-sans-serif; |
|||
|
|||
@font-size-base: 14px; |
|||
@font-size-large: ceil((@font-size-base * 1.25)); // ~18px |
|||
@font-size-small: ceil((@font-size-base * 0.85)); // ~12px |
|||
|
|||
@font-size-h1: floor((@font-size-base * 2.6)); // ~36px |
|||
@font-size-h2: floor((@font-size-base * 2.15)); // ~30px |
|||
@font-size-h3: ceil((@font-size-base * 1.7)); // ~24px |
|||
@font-size-h4: ceil((@font-size-base * 1.25)); // ~18px |
|||
@font-size-h5: @font-size-base; |
|||
@font-size-h6: ceil((@font-size-base * 0.85)); // ~12px |
|||
|
|||
//** Unit-less `line-height` for use in components like buttons. |
|||
@line-height-base: 1.428571429; // 20/14 |
|||
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc. |
|||
@line-height-computed: floor((@font-size-base * @line-height-base)); // ~20px |
|||
|
|||
//** By default, this inherits from the `<body>`. |
|||
@headings-font-family: inherit; |
|||
@headings-font-weight: 500; |
|||
@headings-line-height: 1.1; |
|||
@headings-color: inherit; |
|||
|
|||
|
|||
//== Iconography |
|||
// |
|||
//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower. |
|||
|
|||
//** Load fonts from this directory. |
|||
@icon-font-path: "../fonts/"; |
|||
//** File name for all font files. |
|||
@icon-font-name: "glyphicons-halflings-regular"; |
|||
//** Element ID within SVG icon file. |
|||
@icon-font-svg-id: "glyphicons_halflingsregular"; |
|||
|
|||
|
|||
//== Components |
|||
// |
|||
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start). |
|||
|
|||
@padding-base-vertical: 6px; |
|||
@padding-base-horizontal: 12px; |
|||
|
|||
@padding-large-vertical: 10px; |
|||
@padding-large-horizontal: 16px; |
|||
|
|||
@padding-small-vertical: 5px; |
|||
@padding-small-horizontal: 10px; |
|||
|
|||
@padding-xs-vertical: 1px; |
|||
@padding-xs-horizontal: 5px; |
|||
|
|||
@line-height-large: 1.3333333; // extra decimals for Win 8.1 Chrome |
|||
@line-height-small: 1.5; |
|||
|
|||
@border-radius-base: 4px; |
|||
@border-radius-large: 6px; |
|||
@border-radius-small: 3px; |
|||
|
|||
//** Global color for active items (e.g., navs or dropdowns). |
|||
@component-active-color: #fff; |
|||
//** Global background color for active items (e.g., navs or dropdowns). |
|||
@component-active-bg: @brand-primary; |
|||
|
|||
//** Width of the `border` for generating carets that indicator dropdowns. |
|||
@caret-width-base: 4px; |
|||
//** Carets increase slightly in size for larger components. |
|||
@caret-width-large: 5px; |
|||
|
|||
|
|||
//== Tables |
|||
// |
|||
//## Customizes the `.table` component with basic values, each used across all table variations. |
|||
|
|||
//** Padding for `<th>`s and `<td>`s. |
|||
@table-cell-padding: 8px; |
|||
//** Padding for cells in `.table-condensed`. |
|||
@table-condensed-cell-padding: 5px; |
|||
|
|||
//** Default background color used for all tables. |
|||
@table-bg: transparent; |
|||
//** Background color used for `.table-striped`. |
|||
@table-bg-accent: #f9f9f9; |
|||
//** Background color used for `.table-hover`. |
|||
@table-bg-hover: #f5f5f5; |
|||
@table-bg-active: @table-bg-hover; |
|||
|
|||
//** Border color for table and cell borders. |
|||
@table-border-color: #ddd; |
|||
|
|||
|
|||
//== Buttons |
|||
// |
|||
//## For each of Bootstrap's buttons, define text, background and border color. |
|||
|
|||
@btn-font-weight: normal; |
|||
|
|||
@btn-default-color: #333; |
|||
@btn-default-bg: #fff; |
|||
@btn-default-border: #ccc; |
|||
|
|||
@btn-primary-color: #fff; |
|||
@btn-primary-bg: @brand-primary; |
|||
@btn-primary-border: darken(@btn-primary-bg, 5%); |
|||
|
|||
@btn-success-color: #fff; |
|||
@btn-success-bg: @brand-success; |
|||
@btn-success-border: darken(@btn-success-bg, 5%); |
|||
|
|||
@btn-info-color: #fff; |
|||
@btn-info-bg: @brand-info; |
|||
@btn-info-border: darken(@btn-info-bg, 5%); |
|||
|
|||
@btn-warning-color: #fff; |
|||
@btn-warning-bg: @brand-warning; |
|||
@btn-warning-border: darken(@btn-warning-bg, 5%); |
|||
|
|||
@btn-danger-color: #fff; |
|||
@btn-danger-bg: @brand-danger; |
|||
@btn-danger-border: darken(@btn-danger-bg, 5%); |
|||
|
|||
@btn-link-disabled-color: @gray-light; |
|||
|
|||
|
|||
//== Forms |
|||
// |
|||
//## |
|||
|
|||
//** `<input>` background color |
|||
@input-bg: #fff; |
|||
//** `<input disabled>` background color |
|||
@input-bg-disabled: @gray-lighter; |
|||
|
|||
//** Text color for `<input>`s |
|||
@input-color: @gray; |
|||
//** `<input>` border color |
|||
@input-border: #ccc; |
|||
|
|||
// TODO: Rename `@input-border-radius` to `@input-border-radius-base` in v4 |
|||
//** Default `.form-control` border radius |
|||
// This has no effect on `<select>`s in some browsers, due to the limited stylability of `<select>`s in CSS. |
|||
@input-border-radius: @border-radius-base; |
|||
//** Large `.form-control` border radius |
|||
@input-border-radius-large: @border-radius-large; |
|||
//** Small `.form-control` border radius |
|||
@input-border-radius-small: @border-radius-small; |
|||
|
|||
//** Border color for inputs on focus |
|||
@input-border-focus: #66afe9; |
|||
|
|||
//** Placeholder text color |
|||
@input-color-placeholder: #999; |
|||
|
|||
//** Default `.form-control` height |
|||
@input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2); |
|||
//** Large `.form-control` height |
|||
@input-height-large: (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2); |
|||
//** Small `.form-control` height |
|||
@input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2); |
|||
|
|||
@legend-color: @gray-dark; |
|||
@legend-border-color: #e5e5e5; |
|||
|
|||
//** Background color for textual input addons |
|||
@input-group-addon-bg: @gray-lighter; |
|||
//** Border color for textual input addons |
|||
@input-group-addon-border-color: @input-border; |
|||
|
|||
//** Disabled cursor for form controls and buttons. |
|||
@cursor-disabled: not-allowed; |
|||
|
|||
|
|||
//== Dropdowns |
|||
// |
|||
//## Dropdown menu container and contents. |
|||
|
|||
//** Background for the dropdown menu. |
|||
@dropdown-bg: #fff; |
|||
//** Dropdown menu `border-color`. |
|||
@dropdown-border: rgba(0,0,0,.15); |
|||
//** Dropdown menu `border-color` **for IE8**. |
|||
@dropdown-fallback-border: #ccc; |
|||
//** Divider color for between dropdown items. |
|||
@dropdown-divider-bg: #e5e5e5; |
|||
|
|||
//** Dropdown link text color. |
|||
@dropdown-link-color: @gray-dark; |
|||
//** Hover color for dropdown links. |
|||
@dropdown-link-hover-color: darken(@gray-dark, 5%); |
|||
//** Hover background for dropdown links. |
|||
@dropdown-link-hover-bg: #f5f5f5; |
|||
|
|||
//** Active dropdown menu item text color. |
|||
@dropdown-link-active-color: @component-active-color; |
|||
//** Active dropdown menu item background color. |
|||
@dropdown-link-active-bg: @component-active-bg; |
|||
|
|||
//** Disabled dropdown menu item background color. |
|||
@dropdown-link-disabled-color: @gray-light; |
|||
|
|||
//** Text color for headers within dropdown menus. |
|||
@dropdown-header-color: @gray-light; |
|||
|
|||
//** Deprecated `@dropdown-caret-color` as of v3.1.0 |
|||
@dropdown-caret-color: #000; |
|||
|
|||
|
|||
//-- Z-index master list |
|||
// |
|||
// Warning: Avoid customizing these values. They're used for a bird's eye view |
|||
// of components dependent on the z-axis and are designed to all work together. |
|||
// |
|||
// Note: These variables are not generated into the Customizer. |
|||
|
|||
@zindex-navbar: 1000; |
|||
@zindex-dropdown: 1000; |
|||
@zindex-popover: 1060; |
|||
@zindex-tooltip: 1070; |
|||
@zindex-navbar-fixed: 1030; |
|||
@zindex-modal: 1040; |
|||
|
|||
|
|||
//== Media queries breakpoints |
|||
// |
|||
//## Define the breakpoints at which your layout will change, adapting to different screen sizes. |
|||
|
|||
// Extra small screen / phone |
|||
//** Deprecated `@screen-xs` as of v3.0.1 |
|||
@screen-xs: 480px; |
|||
//** Deprecated `@screen-xs-min` as of v3.2.0 |
|||
@screen-xs-min: @screen-xs; |
|||
//** Deprecated `@screen-phone` as of v3.0.1 |
|||
@screen-phone: @screen-xs-min; |
|||
|
|||
// Small screen / tablet |
|||
//** Deprecated `@screen-sm` as of v3.0.1 |
|||
@screen-sm: 768px; |
|||
@screen-sm-min: @screen-sm; |
|||
//** Deprecated `@screen-tablet` as of v3.0.1 |
|||
@screen-tablet: @screen-sm-min; |
|||
|
|||
// Medium screen / desktop |
|||
//** Deprecated `@screen-md` as of v3.0.1 |
|||
@screen-md: 992px; |
|||
@screen-md-min: @screen-md; |
|||
//** Deprecated `@screen-desktop` as of v3.0.1 |
|||
@screen-desktop: @screen-md-min; |
|||
|
|||
// Large screen / wide desktop |
|||
//** Deprecated `@screen-lg` as of v3.0.1 |
|||
@screen-lg: 1200px; |
|||
@screen-lg-min: @screen-lg; |
|||
//** Deprecated `@screen-lg-desktop` as of v3.0.1 |
|||
@screen-lg-desktop: @screen-lg-min; |
|||
|
|||
// So media queries don't overlap when required, provide a maximum |
|||
@screen-xs-max: (@screen-sm-min - 1); |
|||
@screen-sm-max: (@screen-md-min - 1); |
|||
@screen-md-max: (@screen-lg-min - 1); |
|||
|
|||
|
|||
//== Grid system |
|||
// |
|||
//## Define your custom responsive grid. |
|||
|
|||
//** Number of columns in the grid. |
|||
@grid-columns: 12; |
|||
//** Padding between columns. Gets divided in half for the left and right. |
|||
@grid-gutter-width: 30px; |
|||
// Navbar collapse |
|||
//** Point at which the navbar becomes uncollapsed. |
|||
@grid-float-breakpoint: @screen-sm-min; |
|||
//** Point at which the navbar begins collapsing. |
|||
@grid-float-breakpoint-max: (@grid-float-breakpoint - 1); |
|||
|
|||
|
|||
//== Container sizes |
|||
// |
|||
//## Define the maximum width of `.container` for different screen sizes. |
|||
|
|||
// Small screen / tablet |
|||
@container-tablet: (720px + @grid-gutter-width); |
|||
//** For `@screen-sm-min` and up. |
|||
@container-sm: @container-tablet; |
|||
|
|||
// Medium screen / desktop |
|||
@container-desktop: (940px + @grid-gutter-width); |
|||
//** For `@screen-md-min` and up. |
|||
@container-md: @container-desktop; |
|||
|
|||
// Large screen / wide desktop |
|||
@container-large-desktop: (1140px + @grid-gutter-width); |
|||
//** For `@screen-lg-min` and up. |
|||
@container-lg: @container-large-desktop; |
|||
|
|||
|
|||
//== Navbar |
|||
// |
|||
//## |
|||
|
|||
// Basics of a navbar |
|||
@navbar-height: 50px; |
|||
@navbar-margin-bottom: @line-height-computed; |
|||
@navbar-border-radius: @border-radius-base; |
|||
@navbar-padding-horizontal: floor((@grid-gutter-width / 2)); |
|||
@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2); |
|||
@navbar-collapse-max-height: 340px; |
|||
|
|||
@navbar-default-color: #777; |
|||
@navbar-default-bg: #f8f8f8; |
|||
@navbar-default-border: darken(@navbar-default-bg, 6.5%); |
|||
|
|||
// Navbar links |
|||
@navbar-default-link-color: #777; |
|||
@navbar-default-link-hover-color: #333; |
|||
@navbar-default-link-hover-bg: transparent; |
|||
@navbar-default-link-active-color: #555; |
|||
@navbar-default-link-active-bg: darken(@navbar-default-bg, 6.5%); |
|||
@navbar-default-link-disabled-color: #ccc; |
|||
@navbar-default-link-disabled-bg: transparent; |
|||
|
|||
// Navbar brand label |
|||
@navbar-default-brand-color: @navbar-default-link-color; |
|||
@navbar-default-brand-hover-color: darken(@navbar-default-brand-color, 10%); |
|||
@navbar-default-brand-hover-bg: transparent; |
|||
|
|||
// Navbar toggle |
|||
@navbar-default-toggle-hover-bg: #ddd; |
|||
@navbar-default-toggle-icon-bar-bg: #888; |
|||
@navbar-default-toggle-border-color: #ddd; |
|||
|
|||
|
|||
// Inverted navbar |
|||
// Reset inverted navbar basics |
|||
@navbar-inverse-color: lighten(@gray-light, 15%); |
|||
@navbar-inverse-bg: #222; |
|||
@navbar-inverse-border: darken(@navbar-inverse-bg, 10%); |
|||
|
|||
// Inverted navbar links |
|||
@navbar-inverse-link-color: lighten(@gray-light, 15%); |
|||
@navbar-inverse-link-hover-color: #fff; |
|||
@navbar-inverse-link-hover-bg: transparent; |
|||
@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color; |
|||
@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%); |
|||
@navbar-inverse-link-disabled-color: #444; |
|||
@navbar-inverse-link-disabled-bg: transparent; |
|||
|
|||
// Inverted navbar brand label |
|||
@navbar-inverse-brand-color: @navbar-inverse-link-color; |
|||
@navbar-inverse-brand-hover-color: #fff; |
|||
@navbar-inverse-brand-hover-bg: transparent; |
|||
|
|||
// Inverted navbar toggle |
|||
@navbar-inverse-toggle-hover-bg: #333; |
|||
@navbar-inverse-toggle-icon-bar-bg: #fff; |
|||
@navbar-inverse-toggle-border-color: #333; |
|||
|
|||
|
|||
//== Navs |
|||
// |
|||
//## |
|||
|
|||
//=== Shared nav styles |
|||
@nav-link-padding: 10px 15px; |
|||
@nav-link-hover-bg: @gray-lighter; |
|||
|
|||
@nav-disabled-link-color: @gray-light; |
|||
@nav-disabled-link-hover-color: @gray-light; |
|||
|
|||
//== Tabs |
|||
@nav-tabs-border-color: #ddd; |
|||
|
|||
@nav-tabs-link-hover-border-color: @gray-lighter; |
|||
|
|||
@nav-tabs-active-link-hover-bg: @body-bg; |
|||
@nav-tabs-active-link-hover-color: @gray; |
|||
@nav-tabs-active-link-hover-border-color: #ddd; |
|||
|
|||
@nav-tabs-justified-link-border-color: #ddd; |
|||
@nav-tabs-justified-active-link-border-color: @body-bg; |
|||
|
|||
//== Pills |
|||
@nav-pills-border-radius: @border-radius-base; |
|||
@nav-pills-active-link-hover-bg: @component-active-bg; |
|||
@nav-pills-active-link-hover-color: @component-active-color; |
|||
|
|||
|
|||
//== Pagination |
|||
// |
|||
//## |
|||
|
|||
@pagination-color: @link-color; |
|||
@pagination-bg: #fff; |
|||
@pagination-border: #ddd; |
|||
|
|||
@pagination-hover-color: @link-hover-color; |
|||
@pagination-hover-bg: @gray-lighter; |
|||
@pagination-hover-border: #ddd; |
|||
|
|||
@pagination-active-color: #fff; |
|||
@pagination-active-bg: @brand-primary; |
|||
@pagination-active-border: @brand-primary; |
|||
|
|||
@pagination-disabled-color: @gray-light; |
|||
@pagination-disabled-bg: #fff; |
|||
@pagination-disabled-border: #ddd; |
|||
|
|||
|
|||
//== Pager |
|||
// |
|||
//## |
|||
|
|||
@pager-bg: @pagination-bg; |
|||
@pager-border: @pagination-border; |
|||
@pager-border-radius: 15px; |
|||
|
|||
@pager-hover-bg: @pagination-hover-bg; |
|||
|
|||
@pager-active-bg: @pagination-active-bg; |
|||
@pager-active-color: @pagination-active-color; |
|||
|
|||
@pager-disabled-color: @pagination-disabled-color; |
|||
|
|||
|
|||
//== Jumbotron |
|||
// |
|||
//## |
|||
|
|||
@jumbotron-padding: 30px; |
|||
@jumbotron-color: inherit; |
|||
@jumbotron-bg: @gray-lighter; |
|||
@jumbotron-heading-color: inherit; |
|||
@jumbotron-font-size: ceil((@font-size-base * 1.5)); |
|||
|
|||
|
|||
//== Form states and alerts |
|||
// |
|||
//## Define colors for form feedback states and, by default, alerts. |
|||
|
|||
@state-success-text: #3c763d; |
|||
@state-success-bg: #dff0d8; |
|||
@state-success-border: darken(spin(@state-success-bg, -10), 5%); |
|||
|
|||
@state-info-text: #31708f; |
|||
@state-info-bg: #d9edf7; |
|||
@state-info-border: darken(spin(@state-info-bg, -10), 7%); |
|||
|
|||
@state-warning-text: #8a6d3b; |
|||
@state-warning-bg: #fcf8e3; |
|||
@state-warning-border: darken(spin(@state-warning-bg, -10), 5%); |
|||
|
|||
@state-danger-text: #a94442; |
|||
@state-danger-bg: #f2dede; |
|||
@state-danger-border: darken(spin(@state-danger-bg, -10), 5%); |
|||
|
|||
|
|||
//== Tooltips |
|||
// |
|||
//## |
|||
|
|||
//** Tooltip max width |
|||
@tooltip-max-width: 200px; |
|||
//** Tooltip text color |
|||
@tooltip-color: #fff; |
|||
//** Tooltip background color |
|||
@tooltip-bg: #000; |
|||
@tooltip-opacity: .9; |
|||
|
|||
//** Tooltip arrow width |
|||
@tooltip-arrow-width: 5px; |
|||
//** Tooltip arrow color |
|||
@tooltip-arrow-color: @tooltip-bg; |
|||
|
|||
|
|||
//== Popovers |
|||
// |
|||
//## |
|||
|
|||
//** Popover body background color |
|||
@popover-bg: #fff; |
|||
//** Popover maximum width |
|||
@popover-max-width: 276px; |
|||
//** Popover border color |
|||
@popover-border-color: rgba(0,0,0,.2); |
|||
//** Popover fallback border color |
|||
@popover-fallback-border-color: #ccc; |
|||
|
|||
//** Popover title background color |
|||
@popover-title-bg: darken(@popover-bg, 3%); |
|||
|
|||
//** Popover arrow width |
|||
@popover-arrow-width: 10px; |
|||
//** Popover arrow color |
|||
@popover-arrow-color: @popover-bg; |
|||
|
|||
//** Popover outer arrow width |
|||
@popover-arrow-outer-width: (@popover-arrow-width + 1); |
|||
//** Popover outer arrow color |
|||
@popover-arrow-outer-color: fadein(@popover-border-color, 5%); |
|||
//** Popover outer arrow fallback color |
|||
@popover-arrow-outer-fallback-color: darken(@popover-fallback-border-color, 20%); |
|||
|
|||
|
|||
//== Labels |
|||
// |
|||
//## |
|||
|
|||
//** Default label background color |
|||
@label-default-bg: @gray-light; |
|||
//** Primary label background color |
|||
@label-primary-bg: @brand-primary; |
|||
//** Success label background color |
|||
@label-success-bg: @brand-success; |
|||
//** Info label background color |
|||
@label-info-bg: @brand-info; |
|||
//** Warning label background color |
|||
@label-warning-bg: @brand-warning; |
|||
//** Danger label background color |
|||
@label-danger-bg: @brand-danger; |
|||
|
|||
//** Default label text color |
|||
@label-color: #fff; |
|||
//** Default text color of a linked label |
|||
@label-link-hover-color: #fff; |
|||
|
|||
|
|||
//== Modals |
|||
// |
|||
//## |
|||
|
|||
//** Padding applied to the modal body |
|||
@modal-inner-padding: 15px; |
|||
|
|||
//** Padding applied to the modal title |
|||
@modal-title-padding: 15px; |
|||
//** Modal title line-height |
|||
@modal-title-line-height: @line-height-base; |
|||
|
|||
//** Background color of modal content area |
|||
@modal-content-bg: #fff; |
|||
//** Modal content border color |
|||
@modal-content-border-color: rgba(0,0,0,.2); |
|||
//** Modal content border color **for IE8** |
|||
@modal-content-fallback-border-color: #999; |
|||
|
|||
//** Modal backdrop background color |
|||
@modal-backdrop-bg: #000; |
|||
//** Modal backdrop opacity |
|||
@modal-backdrop-opacity: .5; |
|||
//** Modal header border color |
|||
@modal-header-border-color: #e5e5e5; |
|||
//** Modal footer border color |
|||
@modal-footer-border-color: @modal-header-border-color; |
|||
|
|||
@modal-lg: 900px; |
|||
@modal-md: 600px; |
|||
@modal-sm: 300px; |
|||
|
|||
|
|||
//== Alerts |
|||
// |
|||
//## Define alert colors, border radius, and padding. |
|||
|
|||
@alert-padding: 15px; |
|||
@alert-border-radius: @border-radius-base; |
|||
@alert-link-font-weight: bold; |
|||
|
|||
@alert-success-bg: @state-success-bg; |
|||
@alert-success-text: @state-success-text; |
|||
@alert-success-border: @state-success-border; |
|||
|
|||
@alert-info-bg: @state-info-bg; |
|||
@alert-info-text: @state-info-text; |
|||
@alert-info-border: @state-info-border; |
|||
|
|||
@alert-warning-bg: @state-warning-bg; |
|||
@alert-warning-text: @state-warning-text; |
|||
@alert-warning-border: @state-warning-border; |
|||
|
|||
@alert-danger-bg: @state-danger-bg; |
|||
@alert-danger-text: @state-danger-text; |
|||
@alert-danger-border: @state-danger-border; |
|||
|
|||
|
|||
//== Progress bars |
|||
// |
|||
//## |
|||
|
|||
//** Background color of the whole progress component |
|||
@progress-bg: #f5f5f5; |
|||
//** Progress bar text color |
|||
@progress-bar-color: #fff; |
|||
//** Variable for setting rounded corners on progress bar. |
|||
@progress-border-radius: @border-radius-base; |
|||
|
|||
//** Default progress bar color |
|||
@progress-bar-bg: @brand-primary; |
|||
//** Success progress bar color |
|||
@progress-bar-success-bg: @brand-success; |
|||
//** Warning progress bar color |
|||
@progress-bar-warning-bg: @brand-warning; |
|||
//** Danger progress bar color |
|||
@progress-bar-danger-bg: @brand-danger; |
|||
//** Info progress bar color |
|||
@progress-bar-info-bg: @brand-info; |
|||
|
|||
|
|||
//== List group |
|||
// |
|||
//## |
|||
|
|||
//** Background color on `.list-group-item` |
|||
@list-group-bg: #fff; |
|||
//** `.list-group-item` border color |
|||
@list-group-border: #ddd; |
|||
//** List group border radius |
|||
@list-group-border-radius: @border-radius-base; |
|||
|
|||
//** Background color of single list items on hover |
|||
@list-group-hover-bg: #f5f5f5; |
|||
//** Text color of active list items |
|||
@list-group-active-color: @component-active-color; |
|||
//** Background color of active list items |
|||
@list-group-active-bg: @component-active-bg; |
|||
//** Border color of active list elements |
|||
@list-group-active-border: @list-group-active-bg; |
|||
//** Text color for content within active list items |
|||
@list-group-active-text-color: lighten(@list-group-active-bg, 40%); |
|||
|
|||
//** Text color of disabled list items |
|||
@list-group-disabled-color: @gray-light; |
|||
//** Background color of disabled list items |
|||
@list-group-disabled-bg: @gray-lighter; |
|||
//** Text color for content within disabled list items |
|||
@list-group-disabled-text-color: @list-group-disabled-color; |
|||
|
|||
@list-group-link-color: #555; |
|||
@list-group-link-hover-color: @list-group-link-color; |
|||
@list-group-link-heading-color: #333; |
|||
|
|||
|
|||
//== Panels |
|||
// |
|||
//## |
|||
|
|||
@panel-bg: #fff; |
|||
@panel-body-padding: 15px; |
|||
@panel-heading-padding: 10px 15px; |
|||
@panel-footer-padding: @panel-heading-padding; |
|||
@panel-border-radius: @border-radius-base; |
|||
|
|||
//** Border color for elements within panels |
|||
@panel-inner-border: #ddd; |
|||
@panel-footer-bg: #f5f5f5; |
|||
|
|||
@panel-default-text: @gray-dark; |
|||
@panel-default-border: #ddd; |
|||
@panel-default-heading-bg: #f5f5f5; |
|||
|
|||
@panel-primary-text: #fff; |
|||
@panel-primary-border: @brand-primary; |
|||
@panel-primary-heading-bg: @brand-primary; |
|||
|
|||
@panel-success-text: @state-success-text; |
|||
@panel-success-border: @state-success-border; |
|||
@panel-success-heading-bg: @state-success-bg; |
|||
|
|||
@panel-info-text: @state-info-text; |
|||
@panel-info-border: @state-info-border; |
|||
@panel-info-heading-bg: @state-info-bg; |
|||
|
|||
@panel-warning-text: @state-warning-text; |
|||
@panel-warning-border: @state-warning-border; |
|||
@panel-warning-heading-bg: @state-warning-bg; |
|||
|
|||
@panel-danger-text: @state-danger-text; |
|||
@panel-danger-border: @state-danger-border; |
|||
@panel-danger-heading-bg: @state-danger-bg; |
|||
|
|||
|
|||
//== Thumbnails |
|||
// |
|||
//## |
|||
|
|||
//** Padding around the thumbnail image |
|||
@thumbnail-padding: 4px; |
|||
//** Thumbnail background color |
|||
@thumbnail-bg: @body-bg; |
|||
//** Thumbnail border color |
|||
@thumbnail-border: #ddd; |
|||
//** Thumbnail border radius |
|||
@thumbnail-border-radius: @border-radius-base; |
|||
|
|||
//** Custom text color for thumbnail captions |
|||
@thumbnail-caption-color: @text-color; |
|||
//** Padding around the thumbnail caption |
|||
@thumbnail-caption-padding: 9px; |
|||
|
|||
|
|||
//== Wells |
|||
// |
|||
//## |
|||
|
|||
@well-bg: #f5f5f5; |
|||
@well-border: darken(@well-bg, 7%); |
|||
|
|||
|
|||
//== Badges |
|||
// |
|||
//## |
|||
|
|||
@badge-color: #fff; |
|||
//** Linked badge text color on hover |
|||
@badge-link-hover-color: #fff; |
|||
@badge-bg: @gray-light; |
|||
|
|||
//** Badge text color in active nav link |
|||
@badge-active-color: @link-color; |
|||
//** Badge background color in active nav link |
|||
@badge-active-bg: #fff; |
|||
|
|||
@badge-font-weight: bold; |
|||
@badge-line-height: 1; |
|||
@badge-border-radius: 10px; |
|||
|
|||
|
|||
//== Breadcrumbs |
|||
// |
|||
//## |
|||
|
|||
@breadcrumb-padding-vertical: 8px; |
|||
@breadcrumb-padding-horizontal: 15px; |
|||
//** Breadcrumb background color |
|||
@breadcrumb-bg: #f5f5f5; |
|||
//** Breadcrumb text color |
|||
@breadcrumb-color: #ccc; |
|||
//** Text color of current page in the breadcrumb |
|||
@breadcrumb-active-color: @gray-light; |
|||
//** Textual separator for between breadcrumb elements |
|||
@breadcrumb-separator: "/"; |
|||
|
|||
|
|||
//== Carousel |
|||
// |
|||
//## |
|||
|
|||
@carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6); |
|||
|
|||
@carousel-control-color: #fff; |
|||
@carousel-control-width: 15%; |
|||
@carousel-control-opacity: .5; |
|||
@carousel-control-font-size: 20px; |
|||
|
|||
@carousel-indicator-active-bg: #fff; |
|||
@carousel-indicator-border-color: #fff; |
|||
|
|||
@carousel-caption-color: #fff; |
|||
|
|||
|
|||
//== Close |
|||
// |
|||
//## |
|||
|
|||
@close-font-weight: bold; |
|||
@close-color: #000; |
|||
@close-text-shadow: 0 1px 0 #fff; |
|||
|
|||
|
|||
//== Code |
|||
// |
|||
//## |
|||
|
|||
@code-color: #c7254e; |
|||
@code-bg: #f9f2f4; |
|||
|
|||
@kbd-color: #fff; |
|||
@kbd-bg: #333; |
|||
|
|||
@pre-bg: #f5f5f5; |
|||
@pre-color: @gray-dark; |
|||
@pre-border-color: #ccc; |
|||
@pre-scrollable-max-height: 340px; |
|||
|
|||
|
|||
//== Type |
|||
// |
|||
//## |
|||
|
|||
//** Horizontal offset for forms and lists. |
|||
@component-offset-horizontal: 180px; |
|||
//** Text muted color |
|||
@text-muted: @gray-light; |
|||
//** Abbreviations and acronyms border color |
|||
@abbr-border-color: @gray-light; |
|||
//** Headings small color |
|||
@headings-small-color: @gray-light; |
|||
//** Blockquote small color |
|||
@blockquote-small-color: @gray-light; |
|||
//** Blockquote font size |
|||
@blockquote-font-size: (@font-size-base * 1.25); |
|||
//** Blockquote border color |
|||
@blockquote-border-color: @gray-lighter; |
|||
//** Page header border color |
|||
@page-header-border-color: @gray-lighter; |
|||
//** Width of horizontal description list titles |
|||
@dl-horizontal-offset: @component-offset-horizontal; |
|||
//** Horizontal line color. |
|||
@hr-border: @gray-lighter; |
|||
@ -1,36 +0,0 @@ |
|||
/* |
|||
* Page: 400 and 500 error pages |
|||
* ------------------------------ |
|||
*/ |
|||
.error-page { |
|||
width: 600px; |
|||
margin: 20px auto 0 auto; |
|||
@media (max-width: @screen-sm-max) { |
|||
width: 100%; |
|||
} |
|||
//For the error number e.g: 404 |
|||
> .headline { |
|||
float: left; |
|||
font-size: 100px; |
|||
font-weight: 300; |
|||
@media (max-width: @screen-sm-max) { |
|||
float: none; |
|||
text-align: center; |
|||
} |
|||
} |
|||
//For the message |
|||
> .error-content { |
|||
margin-left: 190px; |
|||
@media (max-width: @screen-sm-max) { |
|||
margin-left: 0; |
|||
} |
|||
> h3 { |
|||
font-weight: 300; |
|||
font-size: 25px; |
|||
@media(max-width: @screen-sm-max) { |
|||
text-align: center; |
|||
} |
|||
} |
|||
display: block; |
|||
} |
|||
} |
|||
@ -1,71 +0,0 @@ |
|||
/*! |
|||
* AdminLTE v2.0.1 |
|||
* Author: Almsaeed Studio |
|||
* Website: Almsaeed Studio <http://almsaeedstudio.com> |
|||
* License: Open source - MIT |
|||
* Please visit http://opensource.org/licenses/MIT for more information |
|||
!*/ |
|||
|
|||
//google fonts |
|||
@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic); |
|||
|
|||
//Bootstrap Variables & Mixins |
|||
//The core bootstrap code have not been modified. These files |
|||
//are included only for refrence. |
|||
@import "../bootstrap-less/mixins.less"; |
|||
@import "../bootstrap-less/variables.less"; |
|||
|
|||
//MISC |
|||
//---- |
|||
@import "core.less"; |
|||
@import "variables.less"; |
|||
@import "mixins.less"; |
|||
|
|||
//COMPONENTS |
|||
//----------- |
|||
@import "header.less"; |
|||
@import "sidebar.less"; |
|||
@import "dropdown.less"; |
|||
@import "forms.less"; |
|||
@import "progress-bars.less"; |
|||
@import "small-box.less"; |
|||
@import "boxes.less"; |
|||
@import "info-box.less"; |
|||
@import "timeline.less"; |
|||
@import "buttons.less"; |
|||
@import "callout.less"; |
|||
@import "alerts.less"; |
|||
@import "navs.less"; |
|||
@import "products.less"; |
|||
@import "table.less"; |
|||
@import "labels.less"; |
|||
@import "direct-chat.less"; |
|||
@import "users-list.less"; |
|||
@import "carousel.less"; |
|||
@import "modal.less"; |
|||
|
|||
//PAGES |
|||
//------ |
|||
@import "mailbox.less"; |
|||
@import "lockscreen.less"; |
|||
@import "login_and_register.less"; |
|||
@import "404_500_errors.less"; |
|||
@import "invoice.less"; |
|||
|
|||
//Skins |
|||
//------- |
|||
//@import "skins/skin-blue.less"; |
|||
//@import "skins/skin-black.less"; |
|||
//@import "skins/skin-red.less"; |
|||
//@import "skins/skin-green.less"; |
|||
//@import "skins/skin-yellow.less"; |
|||
//@import "skins/skin-purple.less"; |
|||
|
|||
//Plugins |
|||
//-------- |
|||
@import "bootstrap-social.less"; |
|||
@import "fullcalendar.less"; |
|||
|
|||
//Miscellaneous |
|||
//------------- |
|||
@import "miscellaneous.less"; |
|||
@ -1,44 +0,0 @@ |
|||
/* |
|||
* Component: alert |
|||
* ---------------- |
|||
*/ |
|||
|
|||
.alert { |
|||
.border-radius(3px); |
|||
h4 { |
|||
font-weight: 600; |
|||
} |
|||
.icon { |
|||
margin-right: 10px; |
|||
} |
|||
.close { |
|||
color: #000; |
|||
.opacity(.2); |
|||
&:hover { |
|||
.opacity(.5); |
|||
} |
|||
} |
|||
a { |
|||
color: #fff; |
|||
text-decoration: underline; |
|||
} |
|||
} |
|||
|
|||
//Alert Variants |
|||
.alert-success { |
|||
&:extend(.bg-green); |
|||
border-color: darken(@green, 5%); |
|||
} |
|||
.alert-danger, |
|||
.alert-error { |
|||
&:extend(.bg-red); |
|||
border-color: darken(@red, 5%); |
|||
} |
|||
.alert-warning { |
|||
&:extend(.bg-yellow); |
|||
border-color: darken(@yellow, 5%); |
|||
} |
|||
.alert-info { |
|||
&:extend(.bg-aqua); |
|||
border-color: darken(@aqua, 5%); |
|||
} |
|||
@ -1,107 +0,0 @@ |
|||
/* |
|||
* Plugin: Social Buttons |
|||
* ---------------------- |
|||
*/ |
|||
|
|||
// Copyright 2013-2014 Panayiotis Lipiridis |
|||
// Licensed under the MIT License |
|||
// |
|||
// https://github.com/lipis/bootstrap-social |
|||
|
|||
@bs-height-base: (@line-height-computed + @padding-base-vertical * 2); |
|||
@bs-height-lg: (floor(@font-size-large * @line-height-base) + @padding-large-vertical * 2); |
|||
@bs-height-sm: (floor(@font-size-small * 1.5) + @padding-small-vertical * 2); |
|||
@bs-height-xs: (floor(@font-size-small * 1.2) + @padding-small-vertical + 1); |
|||
|
|||
.btn-social { |
|||
position: relative; |
|||
padding-left: @bs-height-base + @padding-base-horizontal!important; |
|||
text-align: left; |
|||
white-space: nowrap; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
:first-child { |
|||
position: absolute; |
|||
left: 0; |
|||
top: 0; |
|||
bottom: 0; |
|||
width: @bs-height-base!important; |
|||
line-height: (@bs-height-base + 2)!important; |
|||
font-size: 1.6em!important; |
|||
text-align: center; |
|||
border-right: 1px solid rgba(0, 0, 0, 0.2); |
|||
} |
|||
&.btn-lg { |
|||
padding-left: @bs-height-lg + @padding-large-horizontal!important; |
|||
:first-child { |
|||
line-height: @bs-height-lg; |
|||
width: @bs-height-lg; |
|||
font-size: 1.8em; |
|||
} |
|||
} |
|||
&.btn-sm { |
|||
padding-left: @bs-height-sm + @padding-small-horizontal!important; |
|||
:first-child { |
|||
line-height: @bs-height-sm; |
|||
width: @bs-height-sm; |
|||
font-size: 1.4em; |
|||
} |
|||
} |
|||
&.btn-xs { |
|||
padding-left: @bs-height-xs + @padding-small-horizontal!important; |
|||
:first-child { |
|||
line-height: @bs-height-xs; |
|||
width: @bs-height-xs; |
|||
font-size: 1.2em; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btn-social-icon { |
|||
.btn-social; |
|||
height: (@bs-height-base + 2); |
|||
width: (@bs-height-base + 2); |
|||
padding: 0; |
|||
:first-child { |
|||
border: none; |
|||
text-align: center; |
|||
width: 100%!important; |
|||
} |
|||
&.btn-lg { |
|||
height: @bs-height-lg; |
|||
width: @bs-height-lg; |
|||
padding-left: 0; |
|||
padding-right: 0; |
|||
} |
|||
&.btn-sm { |
|||
height: (@bs-height-sm + 2); |
|||
width: (@bs-height-sm + 2); |
|||
padding-left: 0; |
|||
padding-right: 0; |
|||
} |
|||
&.btn-xs { |
|||
height: (@bs-height-xs + 2); |
|||
width: (@bs-height-xs + 2); |
|||
padding-left: 0; |
|||
padding-right: 0; |
|||
} |
|||
} |
|||
|
|||
.btn-social(@color-bg, @color: white) { |
|||
background-color: @color-bg; |
|||
.button-variant(@color, @color-bg, rgba(0, 0, 0, 0.2)); |
|||
} |
|||
|
|||
|
|||
.btn-bitbucket { .btn-social(#205081); } |
|||
.btn-dropbox { .btn-social(#1087dd); } |
|||
.btn-facebook { .btn-social(#3b5998); } |
|||
.btn-flickr { .btn-social(#ff0084); } |
|||
.btn-foursquare { .btn-social(#0072b1); } |
|||
.btn-github { .btn-social(#444444); } |
|||
.btn-google-plus { .btn-social(#dd4b39); } |
|||
.btn-instagram { .btn-social(#3f729b); } |
|||
.btn-linkedin { .btn-social(#007bb6); } |
|||
.btn-tumblr { .btn-social(#2c4762); } |
|||
.btn-twitter { .btn-social(#55acee); } |
|||
.btn-vk { .btn-social(#587ea3); } |
|||
@ -1,446 +0,0 @@ |
|||
/* |
|||
* Component: Box |
|||
* -------------- |
|||
*/ |
|||
.box { |
|||
position: relative; |
|||
.border-radius(@box-border-radius); |
|||
background: #ffffff; |
|||
border-top: 3px solid @box-default-border-top-color; |
|||
margin-bottom: 20px; |
|||
width: 100%; |
|||
box-shadow: @box-boxshadow; |
|||
|
|||
// Box color variations |
|||
&.box-primary { |
|||
border-top-color: @light-blue; |
|||
} |
|||
&.box-info { |
|||
border-top-color: @aqua; |
|||
} |
|||
&.box-danger { |
|||
border-top-color: @red; |
|||
} |
|||
&.box-warning { |
|||
border-top-color: @yellow; |
|||
} |
|||
&.box-success { |
|||
border-top-color: @green; |
|||
} |
|||
&.box-default { |
|||
border-top-color: @gray; |
|||
} |
|||
|
|||
// collapsed mode |
|||
&.collapsed-box { |
|||
.box-body, |
|||
.box-footer { |
|||
display: none; |
|||
} |
|||
} |
|||
|
|||
.nav-stacked { |
|||
> li { |
|||
border-bottom: 1px solid @box-border-color; |
|||
margin: 0; |
|||
&:last-of-type { |
|||
border-bottom: none; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// fixed height to 300px |
|||
&.height-control { |
|||
.box-body { |
|||
max-height: 300px; |
|||
overflow: auto; |
|||
} |
|||
} |
|||
|
|||
.border-right { |
|||
border-right: 1px solid @box-border-color; |
|||
} |
|||
.border-left { |
|||
border-left: 1px solid @box-border-color; |
|||
} |
|||
|
|||
//SOLID BOX |
|||
//--------- |
|||
//use this class to get a colored header and borders |
|||
|
|||
&.box-solid { |
|||
border-top: 0px; |
|||
> .box-header { |
|||
.btn.btn-default { |
|||
background: transparent; |
|||
} |
|||
.btn, |
|||
a { |
|||
&:hover { |
|||
background: rgba(0,0,0,0.1)!important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// Box color variations |
|||
&.box-default { |
|||
.box-solid-variant(@gray, #444); |
|||
} |
|||
&.box-primary { |
|||
.box-solid-variant(@light-blue); |
|||
} |
|||
&.box-info { |
|||
.box-solid-variant(@aqua); |
|||
} |
|||
&.box-danger { |
|||
.box-solid-variant(@red); |
|||
} |
|||
&.box-warning { |
|||
.box-solid-variant(@yellow); |
|||
} |
|||
&.box-success { |
|||
.box-solid-variant(@green); |
|||
} |
|||
|
|||
> .box-header > .box-tools .btn { |
|||
border: 0; |
|||
box-shadow: none; |
|||
} |
|||
|
|||
// Fix font color for tiles |
|||
&[class*='bg'] { |
|||
> .box-header { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
//BOX GROUP |
|||
.box-group { |
|||
> .box { |
|||
margin-bottom: 5px; |
|||
} |
|||
} |
|||
|
|||
|
|||
// jQuery Knob in a box |
|||
.knob-label { |
|||
text-align: center; |
|||
color: #333; |
|||
font-weight: 100; |
|||
font-size: 12px; |
|||
margin-bottom: 0.3em; |
|||
} |
|||
|
|||
// Box overlay for LOADING STATE effect |
|||
> .overlay, |
|||
> .loading-img { |
|||
position: absolute; |
|||
top: -3px; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.overlay { |
|||
z-index: 1010; |
|||
background: rgba(255, 255, 255, 0.7); |
|||
.border-radius(@box-border-radius); |
|||
> .fa { |
|||
position: absolute; |
|||
top: 50%; |
|||
left: 50%; |
|||
margin-left: -15px; |
|||
margin-top: -15px; |
|||
color: #000; |
|||
font-size: 30px; |
|||
} |
|||
} |
|||
|
|||
.overlay.dark { |
|||
background: rgba(0, 0, 0, 0.5); |
|||
} |
|||
|
|||
} |
|||
|
|||
//Box header |
|||
.box-header { |
|||
//Add top left and top right border radius |
|||
.clearfix(); |
|||
color: #444; |
|||
display: block; |
|||
padding: @box-padding; |
|||
position: relative; |
|||
|
|||
//Add bottom border |
|||
&.with-border { |
|||
border-bottom: 1px solid @box-border-color; |
|||
.collapsed-box & { |
|||
border-bottom: none; |
|||
} |
|||
} |
|||
|
|||
//Icons and box title |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion, |
|||
.box-title { |
|||
display: inline-block; |
|||
font-size: 18px; |
|||
margin: 0; |
|||
line-height: 1; |
|||
} |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
margin-right: 5px; |
|||
} |
|||
> .box-tools { |
|||
position: absolute; |
|||
right: 10px; |
|||
top: 5px; |
|||
[data-toggle="tooltip"] { |
|||
position: relative; |
|||
} |
|||
//float: none!important; |
|||
&.pull-right { |
|||
.dropdown-menu { |
|||
right: 0; |
|||
left: auto; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Box Tools Buttons |
|||
.btn-box-tool { |
|||
padding: 5px; |
|||
font-size: 12px; |
|||
background: transparent; |
|||
box-shadow: none!important; |
|||
color: darken(@box-default-border-top-color, 20%); |
|||
.open &, |
|||
&:hover { |
|||
color: darken(@box-default-border-top-color, 40%); |
|||
} |
|||
&:active { |
|||
outline: none!important; |
|||
} |
|||
} |
|||
|
|||
//Box Body |
|||
.box-body { |
|||
.border-radius(0; 0; @box-border-radius; @box-border-radius); |
|||
padding: @box-padding; |
|||
.no-header & { |
|||
.border-top-radius(@box-border-radius); |
|||
} |
|||
// Tables within the box body |
|||
> .table { |
|||
margin-bottom: 0; |
|||
} |
|||
|
|||
// Charts |
|||
> .chart { |
|||
position: relative; |
|||
overflow: hidden; |
|||
width: 100%; |
|||
svg, |
|||
canvas { |
|||
width: 100%!important; |
|||
} |
|||
} |
|||
|
|||
// Calendar within the box body |
|||
.fc { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.full-width-chart { |
|||
margin: -19px; |
|||
} |
|||
&.no-padding .full-width-chart { |
|||
margin: -9px; |
|||
} |
|||
|
|||
.box-pane { |
|||
.border-radius(0; 0; @box-border-radius; 0); |
|||
} |
|||
.box-pane-right { |
|||
.border-radius(0; 0; 0; @box-border-radius); |
|||
} |
|||
} |
|||
|
|||
//Box footer |
|||
.box-footer { |
|||
.border-radius(0; 0; @box-border-radius; @box-border-radius); |
|||
border-top: 1px solid @box-border-color; |
|||
padding: @box-padding; |
|||
background-color: @box-footer-bg; |
|||
} |
|||
.chart-legend { |
|||
&:extend(.list-unstyled); |
|||
margin: 10px 0; |
|||
> li { |
|||
@media (max-width: @screen-sm-max) { |
|||
float: left; |
|||
margin-right: 10px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Widgets |
|||
//----------- |
|||
|
|||
/* Widget: TODO LIST */ |
|||
|
|||
.todo-list { |
|||
margin: 0; |
|||
padding: 0px 0px; |
|||
list-style: none; |
|||
overflow: auto; |
|||
// Todo list element |
|||
> li { |
|||
.border-radius(2px); |
|||
padding: 10px; |
|||
background: #f4f4f4; |
|||
margin-bottom: 2px; |
|||
border-left: 2px solid #e6e7e8; |
|||
color: #444; |
|||
&:last-of-type { |
|||
margin-bottom: 0; |
|||
} |
|||
// Color varaity |
|||
&.danger { |
|||
border-left-color: @red; |
|||
} |
|||
&.warning { |
|||
border-left-color: @yellow; |
|||
} |
|||
&.info { |
|||
border-left-color: @aqua; |
|||
} |
|||
&.success { |
|||
border-left-color: @green; |
|||
} |
|||
&.primary { |
|||
border-left-color: @light-blue; |
|||
} |
|||
|
|||
> input[type='checkbox'] { |
|||
margin: 0 10px 0 5px; |
|||
} |
|||
|
|||
.text { |
|||
display: inline-block; |
|||
margin-left: 5px; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
// Time labels |
|||
.label { |
|||
margin-left: 10px; |
|||
font-size: 9px; |
|||
} |
|||
|
|||
// Tools and options box |
|||
.tools { |
|||
display: none; |
|||
float: right; |
|||
color: @red; |
|||
// icons |
|||
> .fa, > .glyphicon, > .ion { |
|||
margin-right: 5px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
} |
|||
&:hover .tools { |
|||
display: inline-block; |
|||
} |
|||
|
|||
&.done { |
|||
color: #999; |
|||
.text { |
|||
text-decoration: line-through; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.label { |
|||
background: @gray!important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.handle { |
|||
display: inline-block; |
|||
cursor: move; |
|||
margin: 0 5px; |
|||
} |
|||
|
|||
} |
|||
// END TODO WIDGET |
|||
|
|||
/* Chat widget (DEPRECATED - this will be removed in the next major release. Use Direct Chat instead)*/ |
|||
.chat { |
|||
padding: 5px 20px 5px 10px; |
|||
|
|||
.item { |
|||
.clearfix(); |
|||
margin-bottom: 10px; |
|||
// The image |
|||
> img { |
|||
//display: inline-block; |
|||
width: 40px; |
|||
height: 40px; |
|||
border: 2px solid transparent; |
|||
.border-radius(50%)!important; |
|||
&.online { |
|||
border: 2px solid @green; |
|||
} |
|||
&.offline { |
|||
border: 2px solid @red; |
|||
} |
|||
} |
|||
|
|||
// The message body |
|||
> .message { |
|||
margin-left: 55px; |
|||
margin-top: -40px; |
|||
> .name { |
|||
display: block; |
|||
font-weight: 600; |
|||
} |
|||
} |
|||
|
|||
// The attachment |
|||
> .attachment { |
|||
.border-radius(@attachment-border-radius); |
|||
background: #f4f4f4; |
|||
margin-left: 65px; |
|||
margin-right: 15px; |
|||
padding: 10px; |
|||
> h4 { |
|||
margin: 0 0 5px 0; |
|||
font-weight: 600; |
|||
font-size: 14px; |
|||
} |
|||
> p, > .filename { |
|||
font-weight: 600; |
|||
font-size: 13px; |
|||
font-style: italic; |
|||
margin: 0; |
|||
|
|||
} |
|||
.clearfix(); |
|||
} |
|||
} |
|||
|
|||
} |
|||
//END CHAT WIDGET |
|||
|
|||
//Input in box |
|||
.box-input { |
|||
max-width: 200px; |
|||
} |
|||
@ -1,157 +0,0 @@ |
|||
/* |
|||
* Component: Button |
|||
* ----------------- |
|||
*/ |
|||
|
|||
.btn { |
|||
.border-radius(@btn-border-radius); |
|||
.box-shadow(@btn-boxshadow); |
|||
border: 1px solid transparent; |
|||
|
|||
&.uppercase { |
|||
text-transform: uppercase |
|||
} |
|||
|
|||
// Flat buttons |
|||
&.btn-flat { |
|||
.border-radius(0); |
|||
-webkit-box-shadow: none; |
|||
-moz-box-shadow: none; |
|||
box-shadow: none; |
|||
border-width: 1px; |
|||
} |
|||
|
|||
// Active state |
|||
&:active { |
|||
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125); |
|||
-moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.125); |
|||
box-shadow: inset 0 3px 5px rgba(0,0,0,.125); |
|||
} |
|||
|
|||
&:focus { |
|||
outline: none; |
|||
} |
|||
|
|||
// input file btn |
|||
&.btn-file { |
|||
position: relative; |
|||
overflow: hidden; |
|||
> input[type='file'] { |
|||
position: absolute; |
|||
top: 0; |
|||
right: 0; |
|||
min-width: 100%; |
|||
min-height: 100%; |
|||
font-size: 100px; |
|||
text-align: right; |
|||
.opacity(0); |
|||
outline: none; |
|||
background: white; |
|||
cursor: inherit; |
|||
display: block; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Button color variations |
|||
.btn-default { |
|||
background-color: #f4f4f4; |
|||
color: #444; |
|||
border-color: #ddd; |
|||
&:hover, &:active, &.hover { |
|||
background-color:darken(#f4f4f4, 5%)!important; |
|||
} |
|||
} |
|||
.btn-primary { |
|||
background-color: @light-blue; |
|||
border-color: darken(@light-blue, 5%); |
|||
&:hover, &:active, &.hover { |
|||
background-color: darken(@light-blue, 5%); |
|||
} |
|||
} |
|||
.btn-success { |
|||
background-color: @green; |
|||
border-color: darken(@green, 5%); |
|||
&:hover, &:active, &.hover { |
|||
background-color: darken(@green, 5%); |
|||
} |
|||
} |
|||
.btn-info { |
|||
background-color: @aqua; |
|||
border-color: darken(@aqua, 5%); |
|||
&:hover, &:active, &.hover { |
|||
background-color: darken(@aqua, 5%); |
|||
} |
|||
} |
|||
.btn-danger { |
|||
background-color: @red; |
|||
border-color: darken(@red, 5%); |
|||
&:hover, &:active, &.hover { |
|||
background-color: darken(@red, 5%); |
|||
} |
|||
} |
|||
.btn-warning { |
|||
background-color: @yellow; |
|||
border-color: darken(@yellow, 5%); |
|||
&:hover, &:active, &.hover { |
|||
background-color: darken(@yellow, 5%); |
|||
} |
|||
} |
|||
.btn-outline { |
|||
border: 1px solid #fff; |
|||
background: transparent; |
|||
color: #fff; |
|||
&:hover, |
|||
&:focus, |
|||
&:active { |
|||
color: rgba(255,255,255,.7); |
|||
border-color: rgba(255,255,255,.7); |
|||
} |
|||
} |
|||
.btn-link { |
|||
.box-shadow(none); |
|||
} |
|||
//General .btn with bg class |
|||
.btn[class*='bg-']:hover { |
|||
.box-shadow(inset 0 0 100px rgba(0,0,0,0.2)); |
|||
} |
|||
// Application buttons |
|||
.btn-app { |
|||
.border-radius(3px); |
|||
position: relative; |
|||
padding: 15px 5px; |
|||
margin: 0 0 10px 10px; |
|||
min-width: 80px; |
|||
height: 60px; |
|||
text-align: center; |
|||
color: #666; |
|||
border: 1px solid #ddd; |
|||
background-color: #f4f4f4; |
|||
font-size: 12px; |
|||
//Icons within the btn |
|||
> .fa, > .glyphicon, > .ion { |
|||
font-size: 20px; |
|||
display: block; |
|||
} |
|||
|
|||
&:hover { |
|||
background: #f4f4f4; |
|||
color: #444; |
|||
border-color: #aaa; |
|||
} |
|||
|
|||
&:active, &:focus { |
|||
-webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125); |
|||
-moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.125); |
|||
box-shadow: inset 0 3px 5px rgba(0,0,0,.125); |
|||
} |
|||
|
|||
//The badge |
|||
> .badge { |
|||
position: absolute; |
|||
top: -3px; |
|||
right: -10px; |
|||
font-size: 10px; |
|||
font-weight: 400; |
|||
} |
|||
} |
|||
@ -1,48 +0,0 @@ |
|||
/* |
|||
* Component: Callout |
|||
* ------------------ |
|||
*/ |
|||
|
|||
// Base styles (regardless of theme) |
|||
.callout { |
|||
.border-radius(3px); |
|||
margin: 0 0 20px 0; |
|||
padding: 15px 30px 15px 15px; |
|||
border-left: 5px solid #eee; |
|||
a { |
|||
color: #fff; |
|||
text-decoration: underline; |
|||
&:hover { |
|||
color: #eee; |
|||
} |
|||
} |
|||
h4 { |
|||
margin-top: 0; |
|||
font-weight: 600; |
|||
} |
|||
p:last-child { |
|||
margin-bottom: 0; |
|||
} |
|||
code, |
|||
.highlight { |
|||
background-color: #fff; |
|||
} |
|||
|
|||
// Themes for different contexts |
|||
&.callout-danger { |
|||
&:extend(.bg-red); |
|||
border-color: darken(@red, 10%); |
|||
} |
|||
&.callout-warning { |
|||
&:extend(.bg-yellow); |
|||
border-color: darken(@yellow, 10%); |
|||
} |
|||
&.callout-info { |
|||
&:extend(.bg-aqua); |
|||
border-color: darken(@aqua, 10%); |
|||
} |
|||
&.callout-success { |
|||
&:extend(.bg-green); |
|||
border-color: darken(@green, 10%); |
|||
} |
|||
} |
|||
@ -1,15 +0,0 @@ |
|||
/* |
|||
* Component: Carousel |
|||
* ------------------- |
|||
*/ |
|||
.carousel-control { |
|||
background-image: none!important; |
|||
> .fa { |
|||
font-size: 40px; |
|||
position: absolute; |
|||
top: 50%; |
|||
z-index: 5; |
|||
display: inline-block; |
|||
margin-top: -20px; |
|||
} |
|||
} |
|||
@ -1,175 +0,0 @@ |
|||
/* |
|||
* Core: Genral Layout Style |
|||
* ------------------------- |
|||
*/ |
|||
html, |
|||
body { |
|||
min-height: 100%; |
|||
.layout-boxed & { |
|||
height: 100%; |
|||
} |
|||
} |
|||
|
|||
body { |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif; |
|||
font-weight: 400; |
|||
overflow-x: hidden; |
|||
overflow-y: auto; |
|||
} |
|||
|
|||
/* Layout */ |
|||
.wrapper { |
|||
.clearfix(); |
|||
min-height: 100%; |
|||
position: static; |
|||
overflow: hidden; |
|||
.layout-boxed & { |
|||
max-width: 1250px; |
|||
margin: 0 auto; |
|||
min-height: 100%; |
|||
box-shadow: 0 0 8px rgba(0,0,0,0.5); |
|||
position: relative; |
|||
} |
|||
} |
|||
|
|||
.layout-boxed { |
|||
background: url('../img/boxed-bg.jpg') repeat fixed; |
|||
} |
|||
|
|||
/* |
|||
* Content Wrapper - contins main content |
|||
* ```.right-side has been deprecated as of v2.0 in favor of .content-wrapper ``` |
|||
*/ |
|||
.content-wrapper, |
|||
.right-side, |
|||
.main-footer { |
|||
.transition-transform(@transition-speed @transition-fn); |
|||
.transition(margin-left @transition-speed @transition-fn); |
|||
margin-left: @sidebar-width; |
|||
z-index: 820; |
|||
//Top nav layout |
|||
.layout-top-nav & { |
|||
margin-left: 0; |
|||
} |
|||
@media (max-width: @screen-xs-max) { |
|||
margin-left: 0; |
|||
} |
|||
//When opening the sidebar on large screens |
|||
.sidebar-collapse & { |
|||
@media (min-width: @screen-sm) { |
|||
margin-left: 0; |
|||
} |
|||
} |
|||
//When opening the sidebar on small screens |
|||
.sidebar-open & { |
|||
@media (max-width: @screen-xs-max) { |
|||
.translate(@sidebar-width, 0); |
|||
} |
|||
} |
|||
} |
|||
|
|||
.content-wrapper, |
|||
.right-side { |
|||
min-height: 100%; |
|||
background-color: @body-bg; |
|||
z-index: 800; |
|||
} |
|||
.main-footer { |
|||
background: #fff; |
|||
padding: 15px; |
|||
color: #444; |
|||
border-top: 1px solid #eee; |
|||
} |
|||
|
|||
/* Fixed layout */ |
|||
.fixed { |
|||
.main-header, |
|||
.main-sidebar, |
|||
.left-side { |
|||
position: fixed; |
|||
} |
|||
.main-header { |
|||
top: 0; |
|||
right: 0; |
|||
left: 0; |
|||
} |
|||
.content-wrapper, |
|||
.right-side { |
|||
padding-top: 50px; |
|||
@media (max-width: @screen-header-collapse) { |
|||
padding-top: 100px; |
|||
} |
|||
} |
|||
&.layout-boxed { |
|||
.wrapper { |
|||
max-width: 100%; |
|||
} |
|||
} |
|||
} |
|||
|
|||
/* Content */ |
|||
.content { |
|||
min-height: 250px; |
|||
padding: 15px; |
|||
.container-fixed(@grid-gutter-width); |
|||
} |
|||
|
|||
/* H1 - H6 font */ |
|||
h1, |
|||
h2, |
|||
h3, |
|||
h4, |
|||
h5, |
|||
h6, |
|||
.h1, |
|||
.h2, |
|||
.h3, |
|||
.h4, |
|||
.h5, |
|||
.h6 { |
|||
font-family: 'Source Sans Pro', sans-serif; |
|||
} |
|||
/* General Links */ |
|||
a { |
|||
color: @link-color; |
|||
} |
|||
a:hover, a:active, a:focus { |
|||
outline: none; |
|||
text-decoration: none; |
|||
color: @link-hover-color; |
|||
} |
|||
|
|||
/* Page Header */ |
|||
.page-header { |
|||
margin: 10px 0 20px 0; |
|||
font-size: 22px; |
|||
|
|||
> small { |
|||
color: #666; |
|||
display: block; |
|||
margin-top: 5px; |
|||
} |
|||
} |
|||
|
|||
/* Don't display when printing */ |
|||
@media print { |
|||
//Add to elements that you do not want to show when printing |
|||
.no-print { |
|||
display: none; |
|||
} |
|||
|
|||
//Elements that we want to hide when printing |
|||
.main-sidebar, |
|||
.left-side, |
|||
.main-header, |
|||
.content-header { |
|||
display: none; |
|||
} |
|||
//This is the only element that should appear, so let's remove the margins |
|||
.content-wrapper, |
|||
.right-side { |
|||
margin: 0!important; |
|||
} |
|||
} |
|||
@ -1,175 +0,0 @@ |
|||
/* |
|||
* Component: Direct Chat |
|||
* ---------------------- |
|||
*/ |
|||
.direct-chat { |
|||
.box-body { |
|||
.border-bottom-radius(0); |
|||
position: relative; |
|||
overflow-x: hidden; |
|||
padding: 0; |
|||
} |
|||
&.chat-pane-open { |
|||
.direct-chat-contacts { |
|||
.translate(0, 0); |
|||
} |
|||
} |
|||
} |
|||
.direct-chat-messages { |
|||
.translate(0, 0); |
|||
padding: 10px; |
|||
height: 250px; |
|||
overflow: auto; |
|||
} |
|||
.direct-chat-msg, |
|||
.direct-chat-text { |
|||
display: block; |
|||
} |
|||
.direct-chat-msg { |
|||
.clearfix(); |
|||
margin-bottom: 10px; |
|||
} |
|||
.direct-chat-messages, |
|||
.direct-chat-contacts { |
|||
.transition-transform(.5s ease-in-out); |
|||
} |
|||
.direct-chat-text { |
|||
.border-radius(5px); |
|||
position: relative; |
|||
padding: 5px 10px; |
|||
background: @direct-chat-default-msg-bg; |
|||
border: 1px solid @direct-chat-default-msg-border-color; |
|||
margin: 5px 0 0 50px; |
|||
color: @direct-chat-default-font-color; |
|||
|
|||
//Create the arrow |
|||
&:after, |
|||
&:before { |
|||
position: absolute; |
|||
right: 100%; |
|||
top: 15px; |
|||
border: solid transparent; |
|||
border-right-color: @direct-chat-default-msg-border-color; |
|||
content: ' '; |
|||
height: 0; |
|||
width: 0; |
|||
pointer-events: none; |
|||
} |
|||
|
|||
&:after { |
|||
border-width: 5px; |
|||
margin-top: -5px; |
|||
} |
|||
&:before { |
|||
border-width: 6px; |
|||
margin-top: -6px; |
|||
} |
|||
.right & { |
|||
margin-right: 50px; |
|||
margin-left: 0; |
|||
&:after, |
|||
&:before { |
|||
right: auto; |
|||
left: 100%; |
|||
border-right-color: transparent; |
|||
border-left-color: @direct-chat-default-msg-border-color; |
|||
} |
|||
} |
|||
} |
|||
.direct-chat-img { |
|||
.border-radius(50%); |
|||
float: left; |
|||
width: 40px; |
|||
height: 40px; |
|||
.right & { |
|||
float: right; |
|||
} |
|||
} |
|||
.direct-chat-info { |
|||
display: block; |
|||
margin-bottom: 2px; |
|||
font-size: 12px; |
|||
} |
|||
.direct-chat-name { |
|||
font-weight: 600; |
|||
} |
|||
.direct-chat-timestamp { |
|||
color: #999; |
|||
} |
|||
//Direct chat contacts pane |
|||
.direct-chat-contacts-open { |
|||
/*.direct-chat-messages { |
|||
.translate(-101%, 0); |
|||
}*/ |
|||
.direct-chat-contacts { |
|||
.translate(0, 0); |
|||
} |
|||
} |
|||
.direct-chat-contacts { |
|||
.translate(101%, 0); |
|||
position: absolute; |
|||
top: 0; |
|||
bottom: 0; |
|||
height: 250px; |
|||
width: 100%; |
|||
background: #222d32; |
|||
color: #fff; |
|||
overflow: auto; |
|||
} |
|||
|
|||
//Contacts list -- for displaying contacts in direct chat contacts pane |
|||
.contacts-list { |
|||
&:extend(.list-unstyled); |
|||
> li { |
|||
.clearfix(); |
|||
border-bottom: 1px solid rgba(0,0,0,0.2); |
|||
padding: 10px; |
|||
margin: 0; |
|||
&:last-of-type { |
|||
border-bottom: none; |
|||
} |
|||
} |
|||
} |
|||
.contacts-list-img { |
|||
.border-radius(50%); |
|||
width: 40px; |
|||
float: left; |
|||
} |
|||
.contacts-list-info { |
|||
margin-left: 45px; |
|||
color: #fff; |
|||
} |
|||
.contacts-list-name, |
|||
.contacts-list-status { |
|||
display: block; |
|||
} |
|||
.contacts-list-name { |
|||
font-weight: 600; |
|||
} |
|||
.contacts-list-status { |
|||
font-size: 12px; |
|||
} |
|||
.contacts-list-date { |
|||
color: #aaa; |
|||
font-weight: normal; |
|||
} |
|||
.contacts-list-msg { |
|||
color: #999; |
|||
} |
|||
|
|||
//Direct Chat Variants |
|||
.direct-chat-danger { |
|||
.direct-chat-variant(@red); |
|||
} |
|||
.direct-chat-primary { |
|||
.direct-chat-variant(@light-blue); |
|||
} |
|||
.direct-chat-warning { |
|||
.direct-chat-variant(@yellow); |
|||
} |
|||
.direct-chat-info { |
|||
.direct-chat-variant(@aqua); |
|||
} |
|||
.direct-chat-success { |
|||
.direct-chat-variant(@green); |
|||
} |
|||
@ -1,342 +0,0 @@ |
|||
/* |
|||
* Component: Dropdown menus |
|||
* ------------------------- |
|||
*/ |
|||
|
|||
/*Dropdowns in general*/ |
|||
.dropdown-menu { |
|||
box-shadow: @box-boxshadow; |
|||
border-color: #eee; |
|||
> li > a { |
|||
color: #777; |
|||
} |
|||
> li > a > .glyphicon, |
|||
> li > a > .fa, |
|||
> li > a > .ion{ |
|||
margin-right: 10px; |
|||
} |
|||
> li > a:hover { |
|||
background-color: lighten(@gray, 5%); |
|||
color: #333; |
|||
} |
|||
> .divider { |
|||
background-color: #eee; |
|||
} |
|||
} |
|||
|
|||
/* |
|||
Navbar custom dropdown menu |
|||
------------------------------------ |
|||
*/ |
|||
.navbar-nav > .notifications-menu, |
|||
.navbar-nav > .messages-menu, |
|||
.navbar-nav > .tasks-menu { |
|||
position: relative; |
|||
//fix width and padding |
|||
> .dropdown-menu { |
|||
> li { |
|||
position: relative; |
|||
} |
|||
width: 280px; |
|||
//Remove padding and margins |
|||
padding: 0 0 0 0!important; |
|||
margin: 0!important; |
|||
top: 100%; |
|||
//.border-radius(4px)!important; |
|||
} |
|||
//Define header class |
|||
> .dropdown-menu > li.header { |
|||
.border-radius(4px; 4px; 0; 0); |
|||
background-color: #ffffff; |
|||
padding: 7px 10px; |
|||
border-bottom: 1px solid #f4f4f4; |
|||
color: #444444; |
|||
font-size: 14px; |
|||
} |
|||
|
|||
|
|||
//Define footer class |
|||
> .dropdown-menu > li.footer > a { |
|||
.border-radius(0px; 0px; 4px; 4px); |
|||
font-size: 12px; |
|||
background-color: #fff; |
|||
padding: 7px 10px; |
|||
border-bottom: 1px solid #eeeeee; |
|||
color: #444!important; |
|||
@media (max-width: @screen-sm-max) { |
|||
background: #fff!important; |
|||
color: #444!important; |
|||
} |
|||
text-align: center; |
|||
//Hover state |
|||
&:hover { |
|||
text-decoration: none; |
|||
font-weight: normal; |
|||
} |
|||
} |
|||
|
|||
//Clear inner menu padding and margins |
|||
> .dropdown-menu > li .menu { |
|||
max-height: 200px; |
|||
margin: 0; |
|||
padding: 0; |
|||
list-style: none; |
|||
overflow-x: hidden; |
|||
> li > a { |
|||
display: block; |
|||
white-space: nowrap; /* Prevent text from breaking */ |
|||
border-bottom: 1px solid #f4f4f4; |
|||
// Hove state |
|||
&:hover { |
|||
background: #f4f4f4; |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Notifications menu |
|||
.navbar-nav > .notifications-menu { |
|||
> .dropdown-menu > li .menu { |
|||
// Links inside the menu |
|||
> li > a { |
|||
color: #444444; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
padding: 10px; |
|||
// Icons inside the menu |
|||
> .glyphicon, |
|||
> .fa, |
|||
> .ion { |
|||
width: 20px; |
|||
} |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
//Messages menu |
|||
.navbar-nav > .messages-menu { |
|||
//Inner menu |
|||
> .dropdown-menu > li .menu { |
|||
// Messages menu item |
|||
> li > a { |
|||
margin: 0px; |
|||
//line-height: 20px; |
|||
padding: 10px 10px; |
|||
// User image |
|||
> div > img { |
|||
margin: auto 10px auto auto; |
|||
width: 40px; |
|||
height: 40px; |
|||
} |
|||
// Message heading |
|||
> h4 { |
|||
padding: 0; |
|||
margin: 0 0 0 45px; |
|||
color: #444444; |
|||
font-size: 15px; |
|||
position: relative; |
|||
// Small for message time display |
|||
> small { |
|||
color: #999999; |
|||
font-size: 10px; |
|||
position: absolute; |
|||
top: 0px; |
|||
right: 0px; |
|||
} |
|||
} |
|||
|
|||
> p { |
|||
margin: 0 0 0 45px; |
|||
font-size: 12px; |
|||
color: #888888; |
|||
} |
|||
|
|||
.clearfix(); |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
//Tasks menu |
|||
.navbar-nav > .tasks-menu { |
|||
> .dropdown-menu > li .menu { |
|||
> li > a { |
|||
padding: 10px; |
|||
|
|||
> h3 { |
|||
font-size: 14px; |
|||
padding: 0; |
|||
margin: 0 0 10px 0; |
|||
color: #666666; |
|||
} |
|||
|
|||
> .progress { |
|||
padding: 0; |
|||
margin: 0; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
//User menu |
|||
.navbar-nav > .user-menu { |
|||
> .dropdown-menu { |
|||
.border-radius(0); |
|||
padding: 1px 0 0 0; |
|||
border-top-width: 0; |
|||
width: 280px; |
|||
// Header menu |
|||
> li.user-header { |
|||
height: 175px; |
|||
padding: 10px; |
|||
text-align: center; |
|||
// User image |
|||
> img { |
|||
z-index: 5; |
|||
height: 90px; |
|||
width: 90px; |
|||
border: 3px solid; |
|||
border-color: transparent; |
|||
border-color: rgba(255, 255, 255, 0.2); |
|||
} |
|||
> p { |
|||
z-index: 5; |
|||
color: #fff; |
|||
color: rgba(255, 255, 255, 0.8); |
|||
font-size: 17px; |
|||
//text-shadow: 2px 2px 3px #333333; |
|||
margin-top: 10px; |
|||
> small { |
|||
display: block; |
|||
font-size: 12px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// Menu Body |
|||
> .user-body { |
|||
padding: 15px; |
|||
border-bottom: 1px solid #f4f4f4; |
|||
border-top: 1px solid #dddddd; |
|||
.clearfix(); |
|||
a { |
|||
color: #444 !important; |
|||
@media (max-width: @screen-sm-max) { |
|||
background: #fff !important; |
|||
color: #444 !important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// Menu Footer |
|||
> .user-footer { |
|||
background-color: #f9f9f9; |
|||
padding: 10px; |
|||
.clearfix(); |
|||
.btn-default { |
|||
color: #666666; |
|||
} |
|||
} |
|||
} |
|||
.user-image { |
|||
float: left; |
|||
width: 25px; |
|||
height: 25px; |
|||
border-radius: 50%; |
|||
margin-right: 10px; |
|||
margin-top: -2px; |
|||
@media (max-width: @screen-xs-max) { |
|||
float: none; |
|||
margin-right: 0; |
|||
margin-top: -8px; |
|||
line-height: 10px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
/* Add fade animation to dropdown menus by appending |
|||
the class .animated-dropdown-menu to the .dropdown-menu ul (or ol)*/ |
|||
.open:not(.dropup) > .animated-dropdown-menu { |
|||
backface-visibility: visible !important; |
|||
.animation(flipInX .7s both); |
|||
|
|||
} |
|||
@keyframes flipInX { |
|||
0% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); |
|||
transition-timing-function: ease-in; |
|||
opacity: 0; |
|||
} |
|||
|
|||
40% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); |
|||
transition-timing-function: ease-in; |
|||
} |
|||
|
|||
60% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, 10deg); |
|||
opacity: 1; |
|||
} |
|||
|
|||
80% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, -5deg); |
|||
} |
|||
|
|||
100% { |
|||
transform: perspective(400px); |
|||
} |
|||
} |
|||
@-webkit-keyframes flipInX { |
|||
0% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); |
|||
transition-timing-function: ease-in; |
|||
opacity: 0; |
|||
} |
|||
|
|||
40% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); |
|||
transition-timing-function: ease-in; |
|||
} |
|||
|
|||
60% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, 10deg); |
|||
opacity: 1; |
|||
} |
|||
|
|||
80% { |
|||
transform: perspective(400px) rotate3d(1, 0, 0, -5deg); |
|||
} |
|||
|
|||
100% { |
|||
transform: perspective(400px); |
|||
} |
|||
} |
|||
|
|||
/* Fix dropdown menu in navbars */ |
|||
.navbar-custom-menu > .navbar-nav { |
|||
> li { |
|||
position: relative; |
|||
> .dropdown-menu { |
|||
position: absolute; |
|||
right: 0; |
|||
left: auto; |
|||
} |
|||
} |
|||
} |
|||
@media (max-width: @screen-sm-max) { |
|||
.navbar-custom-menu > .navbar-nav { |
|||
float: right; |
|||
> li { |
|||
position: static; |
|||
> .dropdown-menu { |
|||
position: absolute; |
|||
right: 5%; |
|||
left: auto; |
|||
border: 1px solid #ddd; |
|||
background: #fff; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -1,82 +0,0 @@ |
|||
/* |
|||
* Component: Form |
|||
* --------------- |
|||
*/ |
|||
.form-control { |
|||
.border-radius(@input-radius)!important; |
|||
box-shadow: none; |
|||
border-color: @gray; |
|||
&:focus { |
|||
border-color: @light-blue !important; |
|||
box-shadow: none; |
|||
} |
|||
&::-moz-placeholder { |
|||
color: #bbb; |
|||
opacity: 1; |
|||
} |
|||
&:-ms-input-placeholder { |
|||
color: #bbb; |
|||
} |
|||
&::-webkit-input-placeholder { |
|||
color: #bbb; |
|||
} |
|||
|
|||
&:not(select) { |
|||
-webkit-appearance: none; |
|||
-moz-appearance: none; |
|||
appearance: none; |
|||
} |
|||
} |
|||
|
|||
.form-group { |
|||
&.has-success { |
|||
label { |
|||
color: @green; |
|||
} |
|||
.form-control { |
|||
border-color: @green !important; |
|||
box-shadow: none; |
|||
} |
|||
} |
|||
|
|||
&.has-warning { |
|||
label { |
|||
color: @yellow; |
|||
} |
|||
.form-control { |
|||
border-color: @yellow !important; |
|||
box-shadow: none; |
|||
} |
|||
} |
|||
|
|||
&.has-error { |
|||
label { |
|||
color: @red; |
|||
} |
|||
.form-control { |
|||
border-color: @red !important; |
|||
box-shadow: none; |
|||
} |
|||
} |
|||
} |
|||
|
|||
/* Input group */ |
|||
.input-group { |
|||
.input-group-addon { |
|||
.border-radius(@input-radius); |
|||
border-color: @gray; |
|||
background-color: #fff; |
|||
} |
|||
} |
|||
/* button groups */ |
|||
.btn-group-vertical { |
|||
.btn { |
|||
&.btn-flat:first-of-type, &.btn-flat:last-of-type { |
|||
.border-radius(0); |
|||
} |
|||
} |
|||
} |
|||
|
|||
.icheck > label { |
|||
padding-left: 0; |
|||
} |
|||
@ -1,88 +0,0 @@ |
|||
/* |
|||
* Plugin: Full Calendar |
|||
* --------------------- |
|||
*/ |
|||
//Fullcalendar buttons |
|||
.fc-button { |
|||
background: #f4f4f4; |
|||
background-image: none; |
|||
color: #444; |
|||
border-color: #ddd; |
|||
border-bottom-color: #ddd; |
|||
&:hover, |
|||
&:active, |
|||
&.hover { |
|||
background-color: #e9e9e9; |
|||
} |
|||
} |
|||
// Calendar title |
|||
.fc-header-title h2 { |
|||
font-size: 15px; |
|||
line-height: 1.6em; |
|||
color: #666; |
|||
margin-left: 10px; |
|||
} |
|||
.fc-header-right { |
|||
padding-right: 10px; |
|||
} |
|||
.fc-header-left { |
|||
padding-left: 10px; |
|||
} |
|||
// Calendar table header cells |
|||
.fc-widget-header { |
|||
background: #fafafa; |
|||
} |
|||
.fc-grid { |
|||
width: 100%; |
|||
border: 0; |
|||
} |
|||
.fc-widget-header:first-of-type, |
|||
.fc-widget-content:first-of-type { |
|||
border-left: 0; |
|||
border-right: 0; |
|||
} |
|||
.fc-widget-header:last-of-type, |
|||
.fc-widget-content:last-of-type { |
|||
border-right: 0; |
|||
} |
|||
.fc-toolbar { |
|||
padding: @box-padding; |
|||
margin: 0; |
|||
} |
|||
.fc-day-number { |
|||
font-size: 20px; |
|||
font-weight: 300; |
|||
padding-right: 10px; |
|||
} |
|||
.fc-color-picker { |
|||
list-style: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
> li { |
|||
float: left; |
|||
font-size: 30px; |
|||
margin-right: 5px; |
|||
line-height: 30px; |
|||
.fa { |
|||
.transition-transform(linear .3s); |
|||
&:hover { |
|||
.rotate(30deg); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
#add-new-event { |
|||
.transition(all linear .3s); |
|||
} |
|||
.external-event { |
|||
padding: 5px 10px; |
|||
font-weight: bold; |
|||
margin-bottom: 4px; |
|||
box-shadow: @box-boxshadow; |
|||
text-shadow: @box-boxshadow; |
|||
border-radius: @box-border-radius; |
|||
cursor: move; |
|||
&:hover { |
|||
box-shadow: inset 0 0 90px rgba(0,0,0,0.2); |
|||
} |
|||
} |
|||
@ -1,221 +0,0 @@ |
|||
/* |
|||
* Component: Main Header |
|||
* ---------------------- |
|||
*/ |
|||
|
|||
.main-header { |
|||
position: relative; |
|||
max-height: 100px; |
|||
z-index: 1030; |
|||
//Navbar |
|||
> .navbar { |
|||
margin-bottom: 0; |
|||
margin-left: @sidebar-width; |
|||
border: none; |
|||
min-height: @navbar-height; |
|||
border-radius: 0; |
|||
.layout-top-nav & { |
|||
margin-left: 0!important; |
|||
} |
|||
} |
|||
//Navbar search text input |
|||
#navbar-search-input { |
|||
background: rgba(255,255,255,.2); |
|||
border-color: transparent; |
|||
&:focus, |
|||
&:active { |
|||
border-color: rgba(0,0,0,.1)!important; |
|||
background: rgba(255,255,255,.9); |
|||
} |
|||
&::-moz-placeholder { |
|||
color: #ccc; |
|||
opacity: 1; |
|||
} |
|||
&:-ms-input-placeholder { |
|||
color: #ccc; |
|||
} |
|||
&::-webkit-input-placeholder { |
|||
color: #ccc; |
|||
} |
|||
} |
|||
//Navbar Right Menu |
|||
.navbar-custom-menu, |
|||
.navbar-right { |
|||
margin-right: 5px; |
|||
float: right; |
|||
@media (max-width: @screen-sm-max) { |
|||
a { |
|||
color: inherit; |
|||
background: transparent; |
|||
} |
|||
} |
|||
} |
|||
.navbar-right { |
|||
@media (max-width: @screen-header-collapse) { |
|||
float: none; |
|||
.navbar-collapse & { |
|||
margin: 7.5px -15px; |
|||
} |
|||
> li { |
|||
color: inherit; |
|||
border: 0; |
|||
} |
|||
} |
|||
} |
|||
//Navbar toggle button |
|||
.sidebar-toggle { |
|||
float: left; |
|||
background-color: transparent; |
|||
background-image: none; |
|||
padding: @navbar-padding-vertical @navbar-padding-horizontal; |
|||
//Add the fontawesome bars icon |
|||
font-family: fontAwesome; |
|||
&:before { |
|||
content: "\f0c9"; |
|||
} |
|||
&:hover { |
|||
color: #fff; |
|||
} |
|||
} |
|||
.sidebar-toggle .icon-bar { |
|||
display: none; |
|||
} |
|||
//Navbar User Menu |
|||
.navbar .nav > li.user > a { |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
|
|||
//Labels in navbar |
|||
.navbar .nav > li > a > .label { |
|||
position: absolute; |
|||
top: 9px; |
|||
right: 7px; |
|||
text-align: center; |
|||
font-size: 9px; |
|||
padding: 2px 3px; |
|||
line-height: .9; |
|||
} |
|||
|
|||
//Logo bar |
|||
.logo { |
|||
display: block; |
|||
float: left; |
|||
height: 50px; |
|||
font-size: 20px; |
|||
line-height: 50px; |
|||
text-align: center; |
|||
width: @sidebar-width; |
|||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; |
|||
padding: 0 15px; |
|||
font-weight: 300; |
|||
} |
|||
//Navbar Brand. Alternative logo with layout-top-nav |
|||
.navbar-brand { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
// Content Header |
|||
.content-header { |
|||
position: relative; |
|||
padding: 15px 15px 0 15px; |
|||
// Header Text |
|||
> h1 { |
|||
margin: 0; |
|||
font-size: 24px; |
|||
> small { |
|||
font-size: 15px; |
|||
display: inline-block; |
|||
padding-left: 4px; |
|||
font-weight: 300; |
|||
} |
|||
} |
|||
|
|||
> .breadcrumb { |
|||
float: right; |
|||
background: transparent; |
|||
margin-top: 0px; |
|||
margin-bottom: 0; |
|||
font-size: 12px; |
|||
padding: 7px 5px; |
|||
position: absolute; |
|||
top: 15px; |
|||
right: 10px; |
|||
.border-radius(2px); |
|||
> li > a { |
|||
color: #444; |
|||
text-decoration: none; |
|||
> .fa, > .glyphicon, > .ion { |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
> li + li:before { |
|||
content: '>\00a0'; |
|||
} |
|||
} |
|||
|
|||
@media (max-width: @screen-sm-max) { |
|||
> .breadcrumb { |
|||
position: relative; |
|||
margin-top: 5px; |
|||
top: 0; |
|||
right: 0; |
|||
float: none; |
|||
background: @gray; |
|||
padding-left: 10px; |
|||
li:before { |
|||
color: darken(@gray, 20%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.navbar-toggle { |
|||
color: #fff; |
|||
border: 0; |
|||
margin: 0; |
|||
padding: @navbar-padding-vertical @navbar-padding-horizontal; |
|||
} |
|||
//Control navbar scaffolding on x-small screens |
|||
@media (max-width: @screen-sm-max) { |
|||
.navbar-custom-menu .navbar-nav > li { |
|||
float: left; |
|||
} |
|||
//Dont't let links get full width |
|||
.navbar-custom-menu .navbar-nav { |
|||
margin: 0; |
|||
float: left; |
|||
} |
|||
|
|||
.navbar-custom-menu .navbar-nav > li > a { |
|||
padding-top: 15px; |
|||
padding-bottom: 15px; |
|||
line-height: 20px; |
|||
} |
|||
} |
|||
|
|||
// Collapse header |
|||
@media (max-width: @screen-header-collapse) { |
|||
.main-header { |
|||
position: relative; |
|||
.logo, |
|||
.navbar { |
|||
width: 100%; |
|||
float: none; |
|||
position: relative!important; |
|||
} |
|||
.navbar { |
|||
margin: 0; |
|||
} |
|||
.navbar-custom-menu { |
|||
float: right; |
|||
} |
|||
} |
|||
.main-sidebar, |
|||
.left-side { |
|||
padding-top: 100px!important; |
|||
} |
|||
} |
|||
@ -1,63 +0,0 @@ |
|||
/* |
|||
* Component: Info Box |
|||
* ------------------- |
|||
*/ |
|||
.info-box { |
|||
display: block; |
|||
min-height: 90px; |
|||
background: #fff; |
|||
width: 100%; |
|||
box-shadow: @box-boxshadow; |
|||
.border-radius(2px); |
|||
margin-bottom: 15px; |
|||
small { |
|||
font-size: 14px; |
|||
} |
|||
.progress { |
|||
background: rgba(0,0,0,.2); |
|||
margin: 5px -10px 5px -10px; |
|||
height: 2px; |
|||
&, |
|||
& .progress-bar { |
|||
.border-radius(0); |
|||
} |
|||
.progress-bar { |
|||
background: #fff; |
|||
} |
|||
} |
|||
} |
|||
.info-box-icon { |
|||
.border-radius(2px; 0; 2px; 0); |
|||
display: block; |
|||
float: left; |
|||
height: 90px; |
|||
width: 90px; |
|||
text-align: center; |
|||
font-size: 45px; |
|||
line-height: 90px; |
|||
background: rgba(0,0,0,0.2); |
|||
} |
|||
.info-box-content { |
|||
padding: 5px 10px; |
|||
margin-left: 90px; |
|||
} |
|||
.info-box-number { |
|||
display: block; |
|||
font-weight: bold; |
|||
font-size: 18px; |
|||
} |
|||
.progress-description, |
|||
.info-box-text { |
|||
display: block; |
|||
font-size: 14px; |
|||
white-space: nowrap; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
} |
|||
.info-box-more { |
|||
display: block; |
|||
} |
|||
|
|||
.progress-description { |
|||
margin: 0; |
|||
} |
|||
@ -1,39 +0,0 @@ |
|||
/* |
|||
* Page: Invoice |
|||
* ------------- |
|||
*/ |
|||
|
|||
.invoice { |
|||
position: relative; |
|||
background: #fff; |
|||
border: 1px solid #f4f4f4; |
|||
padding: 20px; |
|||
margin: 10px 25px; |
|||
} |
|||
|
|||
.invoice-title { |
|||
margin-top: 0; |
|||
} |
|||
|
|||
/* Enhancement for printing */ |
|||
@media print { |
|||
.invoice { |
|||
width: 100%; |
|||
border: 0; |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
|||
.invoice-col { |
|||
float: left; |
|||
width: 33.3333333%; |
|||
} |
|||
|
|||
.table-responsive { |
|||
overflow: auto; |
|||
> .table tr th, |
|||
> .table tr td { |
|||
white-space: normal!important; |
|||
} |
|||
} |
|||
|
|||
} |
|||
@ -1,23 +0,0 @@ |
|||
/* |
|||
* Component: Label |
|||
* ---------------- |
|||
*/ |
|||
.label-default { |
|||
background-color: @gray; |
|||
color: #444; |
|||
} |
|||
.label-danger { |
|||
&:extend(.bg-red); |
|||
} |
|||
.label-info { |
|||
&:extend(.bg-aqua); |
|||
} |
|||
.label-waring { |
|||
&:extend(.bg-yellow); |
|||
} |
|||
.label-primary { |
|||
&:extend(.bg-light-blue); |
|||
} |
|||
.label-success { |
|||
&:extend(.bg-green); |
|||
} |
|||
@ -1,68 +0,0 @@ |
|||
/* |
|||
* Page: Lock Screen |
|||
* ----------------- |
|||
*/ |
|||
/* ADD THIS CLASS TO THE <BODY> TAG */ |
|||
.lockscreen { |
|||
background: @gray; |
|||
} |
|||
.lockscreen-logo { |
|||
font-size: 35px; |
|||
text-align: center; |
|||
margin-bottom: 25px; |
|||
font-weight: 300; |
|||
a { |
|||
color: #444; |
|||
} |
|||
} |
|||
.lockscreen-wrapper { |
|||
max-width: 400px; |
|||
margin: 0 auto; |
|||
margin-top: 10%; |
|||
} |
|||
/* User name [optional] */ |
|||
.lockscreen .lockscreen-name { |
|||
text-align: center; |
|||
font-weight: 600; |
|||
} |
|||
/* Will contain the image and the sign in form */ |
|||
.lockscreen-item { |
|||
.border-radius(4px); |
|||
padding: 0; |
|||
background: #fff; |
|||
position: relative; |
|||
margin: 10px auto 30px auto; |
|||
width: 290px; |
|||
} |
|||
/* User image */ |
|||
.lockscreen-image { |
|||
.border-radius(50%); |
|||
position: absolute; |
|||
left: -10px; |
|||
top: -25px; |
|||
background: #fff; |
|||
padding: 5px; |
|||
z-index: 10; |
|||
> img { |
|||
.border-radius(50%); |
|||
width: 70px; |
|||
height: 70px; |
|||
} |
|||
} |
|||
|
|||
/* Contains the password input and the login button */ |
|||
.lockscreen-credentials { |
|||
margin-left: 70px; |
|||
.form-control { |
|||
border: 0 !important; |
|||
} |
|||
.btn { |
|||
background-color: #fff; |
|||
border: 0; |
|||
padding: 0 10px; |
|||
} |
|||
} |
|||
|
|||
.lockscreen-footer { |
|||
margin-top: 10px; |
|||
} |
|||
@ -1,51 +0,0 @@ |
|||
/* |
|||
* Page: Login & Register |
|||
* ---------------------- |
|||
*/ |
|||
|
|||
.login-logo, |
|||
.register-logo { |
|||
font-size: 35px; |
|||
text-align: center; |
|||
margin-bottom: 25px; |
|||
font-weight: 300; |
|||
a { |
|||
color: #444; |
|||
} |
|||
} |
|||
|
|||
.login-page, |
|||
.register-page { |
|||
background: @gray; |
|||
} |
|||
|
|||
.login-box, |
|||
.register-box { |
|||
width: 360px; |
|||
margin: 7% auto; |
|||
@media (max-width: @screen-sm) { |
|||
width: 90%; |
|||
margin-top: 20px; |
|||
} |
|||
} |
|||
|
|||
.login-box-body, |
|||
.register-box-body { |
|||
background: #fff; |
|||
padding: 20px; |
|||
color: #444; |
|||
border-top: 0; |
|||
color: #666; |
|||
.form-control-feedback { |
|||
color: #777; |
|||
} |
|||
} |
|||
.login-box-msg, |
|||
.register-box-msg { |
|||
margin: 0; |
|||
text-align: center; |
|||
padding: 0 20px 20px 20px; |
|||
} |
|||
.social-auth-links { |
|||
margin: 10px 0; |
|||
} |
|||
@ -1,136 +0,0 @@ |
|||
/* |
|||
* Page: Mailbox |
|||
* ------------- |
|||
*/ |
|||
.mailbox-messages { |
|||
> .table { |
|||
margin: 0; |
|||
} |
|||
} |
|||
.mailbox-controls { |
|||
padding: 5px; |
|||
&.with-border { |
|||
border-bottom: 1px solid @box-border-color; |
|||
} |
|||
} |
|||
.mailbox-read-info { |
|||
border-bottom: 1px solid @box-border-color; |
|||
padding: 10px; |
|||
h3 { |
|||
font-size: 20px; |
|||
margin: 0; |
|||
} |
|||
h5 { |
|||
margin: 0; |
|||
padding: 5px 0 0 0; |
|||
} |
|||
} |
|||
.mailbox-read-time { |
|||
color: #999; |
|||
font-size: 13px; |
|||
} |
|||
.mailbox-read-message { |
|||
padding: 10px; |
|||
} |
|||
.mailbox-attachments { |
|||
&:extend(.list-unstyled); |
|||
li { |
|||
float: left; |
|||
width: 200px; |
|||
border: 1px solid #eee; |
|||
margin-bottom: 10px; |
|||
margin-right: 10px; |
|||
} |
|||
} |
|||
.mailbox-attachment-name { |
|||
font-weight: bold; |
|||
color: #666; |
|||
} |
|||
.mailbox-attachment-icon, |
|||
.mailbox-attachment-info, |
|||
.mailbox-attachment-size { |
|||
display: block; |
|||
} |
|||
.mailbox-attachment-info { |
|||
padding: 10px; |
|||
background: #f4f4f4; |
|||
} |
|||
.mailbox-attachment-size { |
|||
color: #999; |
|||
font-size: 12px; |
|||
} |
|||
.mailbox-attachment-icon { |
|||
text-align: center; |
|||
font-size: 65px; |
|||
color: #666; |
|||
padding: 20px 10px; |
|||
&.has-img { |
|||
padding: 0; |
|||
> img { |
|||
max-width: 100%; |
|||
height: auto; |
|||
} |
|||
} |
|||
} |
|||
.mailbox-attachment-close { |
|||
&:extend(.close); |
|||
} |
|||
|
|||
// ``` These are the rules of the old mailbox, which is now deprecated and will be removed in the a future release ``` |
|||
.mailbox { |
|||
.table-mailbox { |
|||
border-left: 1px solid @box-border-color; |
|||
border-right: 1px solid @box-border-color; |
|||
border-bottom: 1px solid @box-border-color; |
|||
tr { |
|||
&.unread { |
|||
> td { |
|||
background-color: rgba(0, 0, 0, 0.05); |
|||
color: #000; |
|||
font-weight: 600; |
|||
} |
|||
} |
|||
> td > .fa.fa-star, |
|||
> td > .fa.fa-star-o, |
|||
> td > .glyphicon.glyphicon-star, |
|||
> td > .glyphicon.glyphicon-star-empty{ |
|||
color: @yellow; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
> td.small-col { |
|||
width: 30px; |
|||
} |
|||
|
|||
> td.name { |
|||
width: 150px; |
|||
font-weight: 600; |
|||
} |
|||
> td.time { |
|||
text-align: right; |
|||
width: 100px; |
|||
} |
|||
> td { |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
& > td > a {color: #444;} |
|||
} |
|||
} |
|||
|
|||
@media (max-width: @screen-sm-max) { |
|||
.nav-stacked { |
|||
> li:not(.header) { |
|||
float: left; |
|||
width: 50%; |
|||
&.header { |
|||
border: 0!important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.search-form { |
|||
margin-top: 10px; |
|||
} |
|||
} |
|||
} |
|||
@ -1,345 +0,0 @@ |
|||
/* |
|||
* General: Miscellaneous |
|||
* ---------------------- |
|||
*/ |
|||
/* 10px padding and margins */ |
|||
.pad { |
|||
padding: 10px; |
|||
} |
|||
.margin { |
|||
margin: 10px; |
|||
} |
|||
.margin-bottom { |
|||
margin-bottom: 20px; |
|||
} |
|||
/* Display inline */ |
|||
.inline { |
|||
display: inline; |
|||
width: auto; |
|||
} |
|||
|
|||
/* Description Blocks */ |
|||
.description-block { |
|||
display: block; |
|||
margin: 10px 0; |
|||
text-align: center; |
|||
&.margin-bottom { |
|||
margin-bottom: 25px; |
|||
} |
|||
> .description-header { |
|||
margin: 0; |
|||
padding: 0; |
|||
font-weight: 600; |
|||
font-size: 16px; |
|||
} |
|||
> .description-text { |
|||
text-transform: uppercase; |
|||
} |
|||
} |
|||
|
|||
/* Background colors */ |
|||
.bg-red, |
|||
.bg-yellow, |
|||
.bg-aqua, |
|||
.bg-blue, |
|||
.bg-light-blue, |
|||
.bg-green, |
|||
.bg-navy, |
|||
.bg-teal, |
|||
.bg-olive, |
|||
.bg-lime, |
|||
.bg-orange , |
|||
.bg-fuchsia, |
|||
.bg-purple, |
|||
.bg-maroon, |
|||
.bg-black, |
|||
.bg-red-active, |
|||
.bg-yellow-active, |
|||
.bg-aqua-active, |
|||
.bg-blue-active, |
|||
.bg-light-blue-active, |
|||
.bg-green-active, |
|||
.bg-navy-active, |
|||
.bg-teal-active, |
|||
.bg-olive-active, |
|||
.bg-lime-active, |
|||
.bg-orange-active, |
|||
.bg-fuchsia-active, |
|||
.bg-purple-active, |
|||
.bg-maroon-active, |
|||
.bg-black-active { |
|||
color: #fff !important; |
|||
} |
|||
.bg-gray { |
|||
color: #000; |
|||
background-color: @gray!important; |
|||
} |
|||
.bg-black { |
|||
background-color: @black!important; |
|||
} |
|||
.bg-red { |
|||
background-color: @red !important; |
|||
} |
|||
.bg-yellow { |
|||
background-color: @yellow !important; |
|||
} |
|||
.bg-aqua { |
|||
background-color: @aqua !important; |
|||
} |
|||
.bg-blue { |
|||
background-color: @blue !important; |
|||
} |
|||
.bg-light-blue { |
|||
background-color: @light-blue !important; |
|||
} |
|||
.bg-green { |
|||
background-color: @green !important; |
|||
} |
|||
.bg-navy { |
|||
background-color: @navy !important; |
|||
} |
|||
.bg-teal { |
|||
background-color: @teal !important; |
|||
} |
|||
.bg-olive { |
|||
background-color: @olive !important; |
|||
} |
|||
.bg-lime { |
|||
background-color: @lime !important; |
|||
} |
|||
.bg-orange { |
|||
background-color: @orange !important; |
|||
} |
|||
.bg-fuchsia { |
|||
background-color: @fuchsia !important; |
|||
} |
|||
.bg-purple { |
|||
background-color: @purple !important; |
|||
} |
|||
.bg-maroon { |
|||
background-color: @maroon !important; |
|||
} |
|||
|
|||
//Set of Active Background Colors |
|||
.bg-gray-active { |
|||
color: #000; |
|||
background-color: darken(@gray,10%)!important; |
|||
} |
|||
.bg-black-active { |
|||
background-color: darken(@black, 10%)!important; |
|||
} |
|||
.bg-red-active { |
|||
background-color: darken(@red , 6%)!important; |
|||
} |
|||
.bg-yellow-active { |
|||
background-color: darken(@yellow , 6%)!important; |
|||
} |
|||
.bg-aqua-active { |
|||
background-color: darken(@aqua , 6%)!important; |
|||
} |
|||
.bg-blue-active { |
|||
background-color: darken(@blue , 10%)!important; |
|||
} |
|||
.bg-light-blue-active { |
|||
background-color: darken(@light-blue , 6%)!important; |
|||
} |
|||
.bg-green-active { |
|||
background-color: darken(@green , 5%)!important; |
|||
} |
|||
.bg-navy-active { |
|||
background-color: darken(@navy , 2%)!important; |
|||
} |
|||
.bg-teal-active { |
|||
background-color: darken(@teal , 5%)!important; |
|||
} |
|||
.bg-olive-active { |
|||
background-color: darken(@olive , 5%)!important; |
|||
} |
|||
.bg-lime-active { |
|||
background-color: darken(@lime , 5%)!important; |
|||
} |
|||
.bg-orange-active { |
|||
background-color: darken(@orange , 5%)!important; |
|||
} |
|||
.bg-fuchsia-active { |
|||
background-color: darken(@fuchsia , 5%)!important; |
|||
} |
|||
.bg-purple-active { |
|||
background-color: darken(@purple , 5%)!important; |
|||
} |
|||
.bg-maroon-active { |
|||
background-color: darken(@maroon , 3%)!important; |
|||
} |
|||
|
|||
//Disabled! |
|||
[class^="bg-"].disabled { |
|||
.opacity(.65); |
|||
} |
|||
|
|||
/* Text colors */ |
|||
.text-red { |
|||
color: @red !important; |
|||
} |
|||
.text-yellow { |
|||
color: @yellow !important; |
|||
} |
|||
.text-aqua { |
|||
color: @aqua !important; |
|||
} |
|||
.text-blue { |
|||
color: @blue !important; |
|||
} |
|||
.text-black { |
|||
color: @black!important; |
|||
} |
|||
.text-light-blue { |
|||
color: @light-blue !important; |
|||
} |
|||
.text-green { |
|||
color: @green !important; |
|||
} |
|||
.text-gray { |
|||
color: @gray !important; |
|||
} |
|||
.text-navy { |
|||
color: @navy !important; |
|||
} |
|||
.text-teal { |
|||
color: @teal !important; |
|||
} |
|||
.text-olive { |
|||
color: @olive !important; |
|||
} |
|||
.text-lime { |
|||
color: @lime !important; |
|||
} |
|||
.text-orange { |
|||
color: @orange !important; |
|||
} |
|||
.text-fuchsia { |
|||
color: @fuchsia !important; |
|||
} |
|||
.text-purple { |
|||
color: @purple !important; |
|||
} |
|||
.text-maroon { |
|||
color: @maroon !important; |
|||
} |
|||
|
|||
/*Hide elements by display none only*/ |
|||
.hide { |
|||
display: none !important; |
|||
} |
|||
|
|||
/* Remove borders */ |
|||
.no-border { |
|||
border: 0px !important; |
|||
} |
|||
/* Remove padding */ |
|||
.no-padding { |
|||
padding: 0px !important; |
|||
} |
|||
/* Remove margins */ |
|||
.no-margin { |
|||
margin: 0px !important; |
|||
} |
|||
|
|||
/* Remove box shadow */ |
|||
.no-shadow { |
|||
box-shadow: none!important; |
|||
} |
|||
|
|||
/* Unstyled List */ |
|||
.list-unstyled { |
|||
list-style: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
|||
|
|||
/* Remove border radius */ |
|||
.flat { |
|||
.border-radius(0)!important; |
|||
} |
|||
|
|||
.text-bold { |
|||
&, &.table td, &.table th { |
|||
font-weight: 700; |
|||
} |
|||
|
|||
|
|||
} |
|||
|
|||
/* _fix for sparkline tooltip */ |
|||
.jqstooltip{ |
|||
padding: 5px!important; |
|||
width:auto!important; |
|||
height:auto!important; |
|||
} |
|||
|
|||
/* |
|||
Gradient Background colors |
|||
*/ |
|||
.bg-teal-gradient { |
|||
.gradient(@teal; @teal; lighten(@teal, 16%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-light-blue-gradient { |
|||
.gradient(@light-blue; @light-blue; lighten(@light-blue, 12%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-blue-gradient { |
|||
.gradient(@blue; @blue; lighten(@blue, 7%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-aqua-gradient { |
|||
.gradient(@aqua; @aqua; lighten(@aqua, 7%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-yellow-gradient { |
|||
.gradient(@yellow; @yellow; lighten(@yellow, 16%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-purple-gradient { |
|||
.gradient(@purple; @purple; lighten(@purple, 16%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-green-gradient { |
|||
.gradient(@green; @green; lighten(@green, 7%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-red-gradient { |
|||
.gradient(@red; @red; lighten(@red, 10%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-black-gradient { |
|||
.gradient(@black; @black; lighten(@black, 10%))!important; |
|||
color: #fff; |
|||
} |
|||
.bg-maroon-gradient { |
|||
.gradient(@maroon; @maroon; lighten(@maroon, 10%))!important; |
|||
color: #fff; |
|||
} |
|||
.connectedSortable { |
|||
min-height: 100px; |
|||
} |
|||
.ui-helper-hidden-accessible { |
|||
border: 0; |
|||
clip: rect(0 0 0 0); |
|||
height: 1px; |
|||
margin: -1px; |
|||
overflow: hidden; |
|||
padding: 0; |
|||
position: absolute; |
|||
width: 1px; |
|||
} |
|||
.sort-highlight { |
|||
background: #f4f4f4; |
|||
border: 1px dashed #ddd; |
|||
margin-bottom: 10px; |
|||
} |
|||
.full-opacity-hover { |
|||
.opacity(.65); |
|||
&:hover { |
|||
.opacity(1); |
|||
} |
|||
} |
|||
@ -1,105 +0,0 @@ |
|||
//AdminLTE mixins |
|||
//=============== |
|||
|
|||
//Changes the color and the hovering properties of the navbar |
|||
.navbar-variant(@color; @font-color: rgba(255, 255, 255, 0.8); @hover-color: #f6f6f6; @hover-bg: rgba(0, 0, 0, 0.1)) { |
|||
background-color: @color; |
|||
//Navbar links |
|||
.nav > li > a { |
|||
color: @font-color; |
|||
} |
|||
|
|||
.nav > li > a:hover, |
|||
.nav > li > a:active, |
|||
.nav > li > a:focus, |
|||
.nav .open > a, |
|||
.nav .open > a:hover, |
|||
.nav .open > a:focus { |
|||
background: @hover-bg; |
|||
color: @hover-color; |
|||
} |
|||
|
|||
.navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
//Add color to the sidebar toggle button |
|||
.sidebar-toggle { |
|||
color: @font-color; |
|||
&:hover { |
|||
color: @hover-color; |
|||
background: @hover-bg; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Logo color variation |
|||
.logo-variant(@bg-color; @color: #fff; @border-bottom-color: transparent; @border-bottom-width: 0px) { |
|||
background-color: @bg-color; |
|||
color: @color; |
|||
border-bottom: @border-bottom-width solid @border-bottom-color; |
|||
> a { |
|||
color: @color; |
|||
} |
|||
|
|||
&:hover { |
|||
background: darken(@bg-color, 1%); |
|||
} |
|||
} |
|||
|
|||
//Box solid color variantion creator |
|||
.box-solid-variant(@color; @text-color: #fff) { |
|||
border: 1px solid @color; |
|||
> .box-header { |
|||
color: @text-color; |
|||
background: @color; |
|||
background-color: @color; |
|||
a, |
|||
.btn { |
|||
color: @text-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Direct Chat Variant |
|||
.direct-chat-variant(@bg-color; @color: #fff) { |
|||
.right > .direct-chat-text { |
|||
background: @bg-color; |
|||
border-color: @bg-color; |
|||
color: @color; |
|||
&:after, |
|||
&:before { |
|||
border-left-color: @bg-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//border radius creator |
|||
.border-radius(@radius) { |
|||
border-radius: @radius; |
|||
} |
|||
//Different radius each side |
|||
.border-radius(@top-left; @top-right; @bottom-left; @bottom-right) { |
|||
border-top-left-radius: @top-left; |
|||
border-top-right-radius: @top-right; |
|||
border-bottom-right-radius: @bottom-right; |
|||
border-bottom-left-radius: @bottom-left; |
|||
} |
|||
|
|||
//Gradient background |
|||
.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) { |
|||
background: @color; |
|||
background: -webkit-gradient(linear, |
|||
left bottom, |
|||
left top, |
|||
color-stop(0, @start), |
|||
color-stop(1, @stop)); |
|||
background: -ms-linear-gradient(bottom, |
|||
@start, |
|||
@stop); |
|||
background: -moz-linear-gradient(center bottom, |
|||
@start 0%, |
|||
@stop 100%); |
|||
background: -o-linear-gradient(@stop, |
|||
@start); |
|||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start)); |
|||
} |
|||
@ -1,73 +0,0 @@ |
|||
/* |
|||
* Component: modal |
|||
* ---------------- |
|||
*/ |
|||
.modal { |
|||
background: rgba(0,0,0,.3); |
|||
} |
|||
.modal-content { |
|||
.border-radius(0); |
|||
.box-shadow(0 2px 3px rgba(0,0,0,.125))!important; |
|||
border: 0; |
|||
@media (min-width: @screen-sm-min) { |
|||
.box-shadow(0 2px 3px rgba(0,0,0,.125))!important; |
|||
} |
|||
} |
|||
.modal-header { |
|||
border-bottom-color: @box-border-color; |
|||
} |
|||
.modal-footer { |
|||
border-top-color: @box-border-color; |
|||
} |
|||
|
|||
//Modal variants |
|||
.modal-primary { |
|||
.modal-body { |
|||
&:extend(.bg-light-blue); |
|||
} |
|||
.modal-header, |
|||
.modal-footer { |
|||
&:extend(.bg-light-blue-active); |
|||
border-color: darken(@light-blue, 10%); |
|||
} |
|||
} |
|||
.modal-warning { |
|||
.modal-body { |
|||
&:extend(.bg-yellow); |
|||
} |
|||
.modal-header, |
|||
.modal-footer { |
|||
&:extend(.bg-yellow-active); |
|||
border-color: darken(@yellow, 10%); |
|||
} |
|||
} |
|||
.modal-info { |
|||
.modal-body { |
|||
&:extend(.bg-aqua); |
|||
} |
|||
.modal-header, |
|||
.modal-footer { |
|||
&:extend(.bg-aqua-active); |
|||
border-color: darken(@aqua, 10%); |
|||
} |
|||
} |
|||
.modal-success { |
|||
.modal-body { |
|||
&:extend(.bg-green); |
|||
} |
|||
.modal-header, |
|||
.modal-footer { |
|||
&:extend(.bg-green-active); |
|||
border-color: darken(@green, 10%); |
|||
} |
|||
} |
|||
.modal-danger { |
|||
.modal-body { |
|||
&:extend(.bg-red); |
|||
} |
|||
.modal-header, |
|||
.modal-footer { |
|||
&:extend(.bg-red-active); |
|||
border-color: darken(@red, 10%); |
|||
} |
|||
} |
|||
@ -1,170 +0,0 @@ |
|||
/* |
|||
* Component: Nav |
|||
* -------------- |
|||
*/ |
|||
|
|||
/* NAV PILLS */ |
|||
.nav-pills { |
|||
> li > a { |
|||
.border-radius(0); |
|||
border-top: 3px solid transparent; |
|||
color: #444; |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
> li.active > a, |
|||
> li.active > a:hover { |
|||
background-color: #f4f4f4; |
|||
border-top-color: @light-blue; |
|||
color: #444; |
|||
} |
|||
> li.active > a { |
|||
font-weight: 600; |
|||
} |
|||
> li > a:hover { |
|||
background-color: #f6f6f6; |
|||
} |
|||
} |
|||
/* NAV STACKED */ |
|||
.nav-stacked { |
|||
> li > a { |
|||
.border-radius(0); |
|||
border-top: 0; |
|||
border-left: 3px solid transparent; |
|||
color: #444; |
|||
} |
|||
> li.active > a, |
|||
> li.active > a:hover { |
|||
background-color: #f4f4f4; |
|||
border-top: 0; |
|||
border-left-color: @light-blue; |
|||
color: #444; |
|||
} |
|||
|
|||
> li.header { |
|||
border-bottom: 1px solid #ddd; |
|||
color: #777; |
|||
margin-bottom: 10px; |
|||
padding: 5px 10px; |
|||
text-transform: uppercase; |
|||
} |
|||
} |
|||
|
|||
/* NAV TABS */ |
|||
.nav-tabs-custom { |
|||
margin-bottom: 20px; |
|||
background: #fff; |
|||
box-shadow: @box-boxshadow; |
|||
border-radius: @box-border-radius; |
|||
> .nav-tabs { |
|||
margin: 0; |
|||
border-bottom-color: #f4f4f4; |
|||
.border-top-radius(@box-border-radius); |
|||
> li { |
|||
border-top: 3px solid transparent; |
|||
margin-bottom: -2px; |
|||
> a { |
|||
.border-radius(0)!important; |
|||
&, |
|||
&:hover { |
|||
background: transparent; |
|||
margin: 0; |
|||
} |
|||
} |
|||
&:not(.active) { |
|||
> a:hover, |
|||
> a:focus, |
|||
> a:active { |
|||
border-color: transparent; |
|||
} |
|||
} |
|||
margin-right: 5px; |
|||
} |
|||
|
|||
> li.active { |
|||
border-top-color: @light-blue; |
|||
& > a, |
|||
&:hover > a { |
|||
background-color: #fff; |
|||
|
|||
} |
|||
> a { |
|||
border-top: 0; |
|||
border-left-color: #f4f4f4; |
|||
border-right-color: #f4f4f4; |
|||
} |
|||
|
|||
} |
|||
|
|||
> li:first-of-type { |
|||
margin-left: 0; |
|||
&.active { |
|||
> a { |
|||
border-left-width: 0; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Pulled to the right |
|||
&.pull-right { |
|||
float: none!important; |
|||
> li { |
|||
float: right; |
|||
} |
|||
> li:first-of-type { |
|||
margin-right: 0; |
|||
&.active { |
|||
> a { |
|||
border-left-width: 1px; |
|||
border-right-width: 0; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
> li.header { |
|||
line-height: 35px; |
|||
padding: 0 10px; |
|||
font-size: 20px; |
|||
color: #444; |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
> .tab-content { |
|||
background: #fff; |
|||
padding: 10px; |
|||
.border-bottom-radius(@box-border-radius); |
|||
} |
|||
} |
|||
|
|||
/* Nav tabs bottom */ |
|||
.tabs-bottom { |
|||
&.nav-3 { |
|||
li a { |
|||
width: percentage(100/3)!important; |
|||
} |
|||
} |
|||
li a { |
|||
border: 0; |
|||
} |
|||
} |
|||
|
|||
/* PAGINATION */ |
|||
.pagination { |
|||
> li > a { |
|||
background: #fafafa; |
|||
color: #666; |
|||
} |
|||
> li:first-of-type a, |
|||
> li:last-of-type a { |
|||
.border-radius(0); |
|||
} |
|||
} |
|||
@ -1,44 +0,0 @@ |
|||
/* |
|||
* Component: Products List |
|||
* ------------------------ |
|||
*/ |
|||
.products-list { |
|||
list-style: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
> .item { |
|||
.border-radius(@box-border-radius); |
|||
.box-shadow(@box-boxshadow); |
|||
.clearfix(); |
|||
padding: 10px 0; |
|||
background: #fff; |
|||
} |
|||
.product-img { |
|||
float: left; |
|||
img { |
|||
width: 50px; |
|||
height: 50px; |
|||
} |
|||
} |
|||
.product-info { |
|||
margin-left: 60px; |
|||
} |
|||
.product-title { |
|||
font-weight: 600; |
|||
} |
|||
.product-description { |
|||
display: block; |
|||
color: #999; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
} |
|||
} |
|||
.product-list-in-box > .item { |
|||
.box-shadow(none); |
|||
.border-radius(0); |
|||
border-bottom: 1px solid @box-border-color; |
|||
&:last-of-type { |
|||
border-bottom-width: 0; |
|||
} |
|||
} |
|||
@ -1,107 +0,0 @@ |
|||
/* |
|||
* Component: Progress Bar |
|||
* ----------------------- |
|||
*/ |
|||
|
|||
//General CSS |
|||
.progress, |
|||
.progress > .progress-bar { |
|||
.box-shadow(none); |
|||
&, .progress-bar { |
|||
.border-radius(@progress-bar-border-radius); |
|||
} |
|||
} |
|||
|
|||
/* size variation */ |
|||
.progress.sm, |
|||
.progress-sm { |
|||
height: 10px; |
|||
&, .progress-bar { |
|||
.border-radius(@progress-bar-sm-border-radius); |
|||
} |
|||
} |
|||
.progress.xs, |
|||
.progress-xs { |
|||
height: 7px; |
|||
&, .progress-bar { |
|||
.border-radius(@progress-bar-xs-border-radius); |
|||
} |
|||
} |
|||
.progress.xxs, |
|||
.progress-xxs { |
|||
height: 3px; |
|||
&, .progress-bar { |
|||
.border-radius(@progress-bar-xs-border-radius); |
|||
} |
|||
} |
|||
/* Vertical bars */ |
|||
.progress.vertical { |
|||
position: relative; |
|||
width: 30px; |
|||
height: 200px; |
|||
display: inline-block; |
|||
margin-right: 10px; |
|||
> .progress-bar { |
|||
width: 100%!important; |
|||
position: absolute; |
|||
bottom: 0; |
|||
} |
|||
|
|||
//Sizes |
|||
&.sm, |
|||
&.progress-sm{ |
|||
width: 20px; |
|||
} |
|||
|
|||
&.xs, |
|||
&.progress-xs{ |
|||
width: 10px; |
|||
} |
|||
&.xxs, |
|||
&.progress-xxs{ |
|||
width: 3px; |
|||
} |
|||
} |
|||
|
|||
//Progress Groups |
|||
.progress-group { |
|||
.progress-text { |
|||
font-weight: 600; |
|||
} |
|||
.progress-number { |
|||
float: right; |
|||
} |
|||
} |
|||
|
|||
/* Remove margins from progress bars when put in a table */ |
|||
.table { |
|||
tr > td .progress { |
|||
margin: 0; |
|||
} |
|||
} |
|||
|
|||
// Variations |
|||
// ------------------------- |
|||
.progress-bar-light-blue, |
|||
.progress-bar-primary { |
|||
.progress-bar-variant(@light-blue); |
|||
} |
|||
.progress-bar-green, |
|||
.progress-bar-success { |
|||
.progress-bar-variant(@green); |
|||
} |
|||
|
|||
.progress-bar-aqua, |
|||
.progress-bar-info { |
|||
.progress-bar-variant(@aqua); |
|||
} |
|||
|
|||
.progress-bar-yellow, |
|||
.progress-bar-warning { |
|||
.progress-bar-variant(@yellow); |
|||
} |
|||
|
|||
.progress-bar-red, |
|||
.progress-bar-danger { |
|||
.progress-bar-variant(@red); |
|||
} |
|||
@ -1,150 +0,0 @@ |
|||
/* |
|||
* Component: Sidebar |
|||
* ------------------ |
|||
*/ |
|||
//Main Sidebar |
|||
// ``` .left-side has been deprecated in favor of .main-sidebar ``` |
|||
|
|||
.main-sidebar, |
|||
.left-side { |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
padding-top: 50px; |
|||
height: 100%; |
|||
width: @sidebar-width; |
|||
z-index: 810; |
|||
.transition-transform(@transition-speed @transition-fn); |
|||
@media (max-width: @screen-xs-max) { |
|||
.translate(-@sidebar-width, 0); |
|||
} |
|||
.sidebar-collapse & { |
|||
@media (min-width: @screen-sm) { |
|||
.translate(-@sidebar-width, 0); |
|||
} |
|||
} |
|||
|
|||
.sidebar-open & { |
|||
@media (max-width: @screen-xs-max) { |
|||
.translate(0, 0); |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebar { |
|||
padding-bottom: 10px; |
|||
.fixed & { |
|||
overflow: auto; |
|||
height: 100%; |
|||
} |
|||
} |
|||
// remove border from form |
|||
.sidebar-form { |
|||
input:focus { |
|||
border-color: transparent!important; |
|||
} |
|||
} |
|||
|
|||
//Sidebar user panel |
|||
.user-panel { |
|||
padding: 10px; |
|||
.clearfix(); |
|||
> .image > img { |
|||
width: 45px; |
|||
height: 45px; |
|||
} |
|||
> .info { |
|||
font-weight: 600; |
|||
padding: 5px 5px 5px 15px; |
|||
font-size: 14px; |
|||
line-height: 1; |
|||
} |
|||
> .info > p { |
|||
margin-bottom: 9px; |
|||
} |
|||
> .info > a { |
|||
text-decoration: none; |
|||
padding-right: 5px; |
|||
margin-top: 3px; |
|||
font-size: 11px; |
|||
font-weight: normal; |
|||
> .fa, > .ion, > .glyphicon { |
|||
margin-right: 3px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
// Sidebar menu |
|||
.sidebar-menu { |
|||
list-style: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
|
|||
> li { |
|||
position: relative; |
|||
margin: 0; |
|||
padding: 0; |
|||
> a { |
|||
padding: 12px 5px 12px 15px; |
|||
display: block; |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
width: 20px; |
|||
} |
|||
} |
|||
.label, |
|||
.badge { |
|||
margin-top: 3px; |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
li.header { |
|||
padding: 10px 25px 10px 15px; |
|||
font-size: 12px; |
|||
} |
|||
li > a > .fa-angle-left { |
|||
width: auto; |
|||
height: auto; |
|||
padding: 0; |
|||
margin-right: 10px; |
|||
margin-top: 3px; |
|||
} |
|||
li.active { |
|||
> a > .fa-angle-left { |
|||
.rotate(-90deg); |
|||
} |
|||
> .treeview-menu { |
|||
display: block; |
|||
} |
|||
} |
|||
|
|||
// Tree view menu |
|||
.treeview-menu { |
|||
display: none; |
|||
list-style: none; |
|||
padding:0; |
|||
margin:0; |
|||
padding-left: 5px; |
|||
.treeview-menu { |
|||
padding-left: 20px; |
|||
} |
|||
> li { |
|||
margin: 0; |
|||
> a { |
|||
padding: 5px 5px 5px 15px; |
|||
display: block; |
|||
font-size: 14px; |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
width: 20px; |
|||
} |
|||
> .fa-angle-left, |
|||
> .fa-angle-down { |
|||
width: auto; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -1,7 +0,0 @@ |
|||
//All skins in one file |
|||
@import "skin-blue.less"; |
|||
@import "skin-black.less"; |
|||
@import "skin-green.less"; |
|||
@import "skin-red.less"; |
|||
@import "skin-yellow.less"; |
|||
@import "skin-purple.less"; |
|||
@ -1,149 +0,0 @@ |
|||
/* |
|||
* Skin: Black |
|||
* ----------- |
|||
*/ |
|||
@import "../../bootstrap-less/mixins.less"; |
|||
@import "../../bootstrap-less/variables.less"; |
|||
@import "../variables.less"; |
|||
@import "../mixins.less"; |
|||
|
|||
/* skin-black navbar */ |
|||
.skin-black { |
|||
//Navbar & Logo |
|||
.main-header { |
|||
.box-shadow(0px 1px 1px rgba(0, 0, 0, 0.05)); |
|||
.navbar-toggle { |
|||
color: #333; |
|||
} |
|||
.navbar-brand { |
|||
color: #333; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
> .navbar { |
|||
.navbar-variant(#fff; #333; #999; #fff); |
|||
> .sidebar-toggle { |
|||
color: #333; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.navbar-nav { |
|||
> li > a { |
|||
border-right: 1px solid #eee; |
|||
} |
|||
} |
|||
.navbar-custom-menu .navbar-nav, |
|||
.navbar-right { |
|||
> li { |
|||
> a { |
|||
border-left: 1px solid #eee; |
|||
border-right-width: 0; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
> .logo { |
|||
.logo-variant(#fff; #333); |
|||
border-right: 1px solid #eee; |
|||
@media (max-width: @screen-header-collapse) { |
|||
.logo-variant(#222; #fff); |
|||
border-right: none; |
|||
} |
|||
} |
|||
|
|||
li.user-header { |
|||
background-color: #222; |
|||
} |
|||
} |
|||
|
|||
//Content Header |
|||
.content-header { |
|||
background: transparent; |
|||
box-shadow: none; |
|||
} |
|||
//User Panel (resides in sidebar) |
|||
.user-panel { |
|||
> .image > img { |
|||
border: 1px solid #444; |
|||
} |
|||
|
|||
> .info, > .info > a { |
|||
color: #eee; |
|||
} |
|||
} |
|||
//Sidebar & Treeview |
|||
// Sidebar color |
|||
.main-sidebar, |
|||
.left-side, |
|||
.wrapper { |
|||
background: #222; |
|||
} |
|||
// the menu |
|||
.sidebar > .sidebar-menu > li { |
|||
&.header { |
|||
background: darken(#222, 2%); |
|||
color: rgba(255, 255, 255, .4); |
|||
} |
|||
> a { |
|||
margin-right: 1px; |
|||
border-left: 3px solid transparent; |
|||
} |
|||
//Hover and active states |
|||
> a:hover, |
|||
&.active > a { |
|||
color: #fff; |
|||
background: #444; |
|||
border-left-color: #fff; |
|||
} |
|||
|
|||
> .treeview-menu { |
|||
background: #333; |
|||
} |
|||
} |
|||
|
|||
.sidebar a { |
|||
color: #eee; |
|||
&:hover { |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
// skin blue treeview-menu |
|||
.treeview-menu { |
|||
> li { |
|||
> a { |
|||
color: #ccc; |
|||
} |
|||
&.active > a, |
|||
> a:hover { |
|||
color: #fff; |
|||
} |
|||
} |
|||
} |
|||
|
|||
//Sidebar Search Form |
|||
.sidebar-form { |
|||
.border-radius(3px); |
|||
border: 1px solid lighten(#222, 10%); |
|||
margin: 10px 10px; |
|||
input[type="text"], .btn { |
|||
box-shadow: none; |
|||
background-color: lighten(#222, 10%); |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
.transition(all @transition-speed @transition-fn); |
|||
} |
|||
input[type="text"] { |
|||
color: #666; |
|||
.border-radius(2px, 0, 2px, 0) !important; |
|||
&:focus, &:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
&:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
} |
|||
.btn { |
|||
color: #999; |
|||
.border-radius(0, 2px, 0, 2px) !important; |
|||
} |
|||
} |
|||
} |
|||
@ -1,140 +0,0 @@ |
|||
/* |
|||
* Skin: Blue |
|||
* ---------- |
|||
*/ |
|||
@import "../../bootstrap-less/mixins.less"; |
|||
@import "../../bootstrap-less/variables.less"; |
|||
@import "../variables.less"; |
|||
@import "../mixins.less"; |
|||
|
|||
.skin-blue { |
|||
//Navbar |
|||
.main-header { |
|||
.navbar { |
|||
.navbar-variant(@light-blue; #fff); |
|||
.sidebar-toggle { |
|||
color: #fff; |
|||
&:hover { |
|||
background-color: darken(@light-blue, 5%); |
|||
} |
|||
} |
|||
@media (max-width: @screen-header-collapse) { |
|||
.dropdown-menu { |
|||
li { |
|||
&.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
a { |
|||
color: #fff; |
|||
&:hover { |
|||
background: darken(@light-blue, 5%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
//Logo |
|||
.logo { |
|||
.logo-variant(darken(@light-blue, 5%)); |
|||
} |
|||
|
|||
li.user-header { |
|||
background-color: @light-blue; |
|||
} |
|||
} |
|||
|
|||
//Content Header |
|||
.content-header { |
|||
background: transparent; |
|||
} |
|||
|
|||
//User Panel (resides in the sidebar) |
|||
.user-panel { |
|||
|
|||
> .info, > .info > a { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
//Sidebar & Treeview menu |
|||
// the menu |
|||
.sidebar-menu > li { |
|||
&.header { |
|||
color: lighten(@sidebar-dark-bg, 20%); |
|||
background: darken(@sidebar-dark-bg, 4%); |
|||
} |
|||
> a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
//Hover and active states |
|||
> a:hover, &.active > a { |
|||
color: @sidebar-dark-hover-color; |
|||
background: @sidebar-dark-hover-bg; |
|||
border-left-color: @light-blue; |
|||
} |
|||
|
|||
> .treeview-menu { |
|||
margin: 0 1px; |
|||
background: @sidebar-dark-submenu-bg; |
|||
} |
|||
} |
|||
|
|||
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color) |
|||
.wrapper, |
|||
.main-sidebar, |
|||
.left-side { |
|||
background: @sidebar-dark-bg; |
|||
} |
|||
|
|||
.sidebar a { |
|||
color: @sidebar-dark-color; |
|||
&:hover { |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
// skin blue treeview-menu |
|||
.treeview-menu { |
|||
> li { |
|||
> a { |
|||
color: @sidebar-dark-submenu-color; |
|||
} |
|||
&.active > a, > a:hover { |
|||
color: @sidebar-dark-submenu-hover-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebar-form { |
|||
.border-radius(3px); |
|||
border: 1px solid lighten(@sidebar-dark-bg, 10%); |
|||
margin: 10px 10px; |
|||
input[type="text"], .btn { |
|||
box-shadow: none; |
|||
background-color: lighten(@sidebar-dark-bg, 10%); |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
.transition(all @transition-speed @transition-fn); |
|||
} |
|||
input[type="text"] { |
|||
color: #666; |
|||
.border-radius(2px, 0, 2px, 0) !important; |
|||
&:focus, &:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
&:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
} |
|||
.btn { |
|||
color: #999; |
|||
.border-radius(0, 2px, 0, 2px) !important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.skin-blue.layout-top-nav .main-header > .logo { |
|||
.logo-variant(@light-blue); |
|||
} |
|||
@ -1,135 +0,0 @@ |
|||
/* |
|||
* Skin: Green |
|||
* ----------- |
|||
*/ |
|||
|
|||
@import "../../bootstrap-less/mixins.less"; |
|||
@import "../../bootstrap-less/variables.less"; |
|||
@import "../variables.less"; |
|||
@import "../mixins.less"; |
|||
|
|||
.skin-green { |
|||
//Navbar |
|||
.main-header { |
|||
.navbar { |
|||
.navbar-variant(@green; #fff); |
|||
.sidebar-toggle { |
|||
color: #fff; |
|||
&:hover { |
|||
background-color: darken(@green, 5%); |
|||
} |
|||
} |
|||
@media(max-width: @screen-header-collapse) { |
|||
.dropdown-menu { |
|||
li { |
|||
&.divider { |
|||
background-color: rgba(255,255,255,0.1); |
|||
} |
|||
a { |
|||
color: #fff; |
|||
&:hover { |
|||
background: darken(@green, 5%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
//Logo |
|||
.logo { |
|||
.logo-variant(darken(@green, 5%)); |
|||
} |
|||
|
|||
li.user-header { |
|||
background-color: @green; |
|||
} |
|||
} |
|||
|
|||
//Content Header |
|||
.content-header { |
|||
background: transparent; |
|||
} |
|||
|
|||
//User Panel (resides in the sidebar) |
|||
.user-panel { |
|||
|
|||
> .info, > .info > a { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
//Sidebar & Treeview menu |
|||
// the menu |
|||
.sidebar-menu > li { |
|||
&.header { |
|||
color: lighten(@sidebar-dark-bg, 20%); |
|||
background: darken(@sidebar-dark-bg, 4%); |
|||
} |
|||
> a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
//Hover and active states |
|||
> a:hover, &.active > a { |
|||
color: @sidebar-dark-hover-color; |
|||
background: @sidebar-dark-hover-bg; |
|||
border-left-color: @green; |
|||
} |
|||
|
|||
> .treeview-menu { |
|||
margin: 0 1px; |
|||
background: @sidebar-dark-submenu-bg; |
|||
} |
|||
} |
|||
|
|||
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color) |
|||
.wrapper , |
|||
.main-sidebar, |
|||
.left-side { |
|||
background: @sidebar-dark-bg; |
|||
} |
|||
|
|||
.sidebar a { |
|||
color: @sidebar-dark-color; |
|||
&:hover { |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
// skin blue treeview-menu |
|||
.treeview-menu { |
|||
> li { |
|||
> a {color: @sidebar-dark-submenu-color;} |
|||
&.active > a, > a:hover { |
|||
color: @sidebar-dark-submenu-hover-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebar-form { |
|||
.border-radius(3px); |
|||
border: 1px solid lighten(@sidebar-dark-bg, 10%); |
|||
margin: 10px 10px; |
|||
input[type="text"], .btn { |
|||
box-shadow: none; |
|||
background-color: lighten(@sidebar-dark-bg, 10%); |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
.transition(all @transition-speed @transition-fn); |
|||
} |
|||
input[type="text"]{ |
|||
color: #666; |
|||
.border-radius(2px, 0, 2px, 0)!important; |
|||
&:focus, &:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
&:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
} |
|||
.btn { |
|||
color: #999; |
|||
.border-radius(0, 2px, 0, 2px)!important; |
|||
} |
|||
} |
|||
} |
|||
@ -1,135 +0,0 @@ |
|||
/* |
|||
* Skin: Purple |
|||
* ------------ |
|||
*/ |
|||
|
|||
@import "../../bootstrap-less/mixins.less"; |
|||
@import "../../bootstrap-less/variables.less"; |
|||
@import "../variables.less"; |
|||
@import "../mixins.less"; |
|||
|
|||
.skin-purple { |
|||
//Navbar |
|||
.main-header { |
|||
.navbar { |
|||
.navbar-variant(@purple; #fff); |
|||
.sidebar-toggle { |
|||
color: #fff; |
|||
&:hover { |
|||
background-color: darken(@purple, 5%); |
|||
} |
|||
} |
|||
@media(max-width: @screen-header-collapse) { |
|||
.dropdown-menu { |
|||
li { |
|||
&.divider { |
|||
background-color: rgba(255,255,255,0.1); |
|||
} |
|||
a { |
|||
color: #fff; |
|||
&:hover { |
|||
background: darken(@purple, 5%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
//Logo |
|||
.logo { |
|||
.logo-variant(darken(@purple, 5%)); |
|||
} |
|||
|
|||
li.user-header { |
|||
background-color: @purple; |
|||
} |
|||
} |
|||
|
|||
//Content Header |
|||
.content-header { |
|||
background: transparent; |
|||
} |
|||
|
|||
//User Panel (resides in the sidebar) |
|||
.user-panel { |
|||
|
|||
> .info, > .info > a { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
//Sidebar & Treeview menu |
|||
// the menu |
|||
.sidebar-menu > li { |
|||
&.header { |
|||
color: lighten(@sidebar-dark-bg, 20%); |
|||
background: darken(@sidebar-dark-bg, 4%); |
|||
} |
|||
> a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
//Hover and active states |
|||
> a:hover, &.active > a { |
|||
color: @sidebar-dark-hover-color; |
|||
background: @sidebar-dark-hover-bg; |
|||
border-left-color: @purple; |
|||
} |
|||
|
|||
> .treeview-menu { |
|||
margin: 0 1px; |
|||
background: @sidebar-dark-submenu-bg; |
|||
} |
|||
} |
|||
|
|||
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color) |
|||
.wrapper , |
|||
.main-sidebar, |
|||
.left-side { |
|||
background: @sidebar-dark-bg; |
|||
} |
|||
|
|||
.sidebar a { |
|||
color: @sidebar-dark-color; |
|||
&:hover { |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
// skin blue treeview-menu |
|||
.treeview-menu { |
|||
> li { |
|||
> a {color: @sidebar-dark-submenu-color;} |
|||
&.active > a, > a:hover { |
|||
color: @sidebar-dark-submenu-hover-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebar-form { |
|||
.border-radius(3px); |
|||
border: 1px solid lighten(@sidebar-dark-bg, 10%); |
|||
margin: 10px 10px; |
|||
input[type="text"], .btn { |
|||
box-shadow: none; |
|||
background-color: lighten(@sidebar-dark-bg, 10%); |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
.transition(all @transition-speed @transition-fn); |
|||
} |
|||
input[type="text"]{ |
|||
color: #666; |
|||
.border-radius(2px, 0, 2px, 0)!important; |
|||
&:focus, &:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
&:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
} |
|||
.btn { |
|||
color: #999; |
|||
.border-radius(0, 2px, 0, 2px)!important; |
|||
} |
|||
} |
|||
} |
|||
@ -1,135 +0,0 @@ |
|||
/* |
|||
* Skin: Red |
|||
* --------- |
|||
*/ |
|||
|
|||
@import "../../bootstrap-less/mixins.less"; |
|||
@import "../../bootstrap-less/variables.less"; |
|||
@import "../variables.less"; |
|||
@import "../mixins.less"; |
|||
|
|||
.skin-red { |
|||
//Navbar |
|||
.main-header { |
|||
.navbar { |
|||
.navbar-variant(@red; #fff); |
|||
.sidebar-toggle { |
|||
color: #fff; |
|||
&:hover { |
|||
background-color: darken(@red, 5%); |
|||
} |
|||
} |
|||
@media(max-width: @screen-header-collapse) { |
|||
.dropdown-menu { |
|||
li { |
|||
&.divider { |
|||
background-color: rgba(255,255,255,0.1); |
|||
} |
|||
a { |
|||
color: #fff; |
|||
&:hover { |
|||
background: darken(@red, 5%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
//Logo |
|||
.logo { |
|||
.logo-variant(darken(@red, 5%)); |
|||
} |
|||
|
|||
li.user-header { |
|||
background-color: @red; |
|||
} |
|||
} |
|||
|
|||
//Content Header |
|||
.content-header { |
|||
background: transparent; |
|||
} |
|||
|
|||
//User Panel (resides in the sidebar) |
|||
.user-panel { |
|||
|
|||
> .info, > .info > a { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
//Sidebar & Treeview menu |
|||
// the menu |
|||
.sidebar-menu > li { |
|||
&.header { |
|||
color: lighten(@sidebar-dark-bg, 20%); |
|||
background: darken(@sidebar-dark-bg, 4%); |
|||
} |
|||
> a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
//Hover and active states |
|||
> a:hover, &.active > a { |
|||
color: @sidebar-dark-hover-color; |
|||
background: @sidebar-dark-hover-bg; |
|||
border-left-color: @red; |
|||
} |
|||
|
|||
> .treeview-menu { |
|||
margin: 0 1px; |
|||
background: @sidebar-dark-submenu-bg; |
|||
} |
|||
} |
|||
|
|||
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color) |
|||
.wrapper , |
|||
.main-sidebar, |
|||
.left-side { |
|||
background: @sidebar-dark-bg; |
|||
} |
|||
|
|||
.sidebar a { |
|||
color: @sidebar-dark-color; |
|||
&:hover { |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
// skin blue treeview-menu |
|||
.treeview-menu { |
|||
> li { |
|||
> a {color: @sidebar-dark-submenu-color;} |
|||
&.active > a, > a:hover { |
|||
color: @sidebar-dark-submenu-hover-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebar-form { |
|||
.border-radius(3px); |
|||
border: 1px solid lighten(@sidebar-dark-bg, 10%); |
|||
margin: 10px 10px; |
|||
input[type="text"], .btn { |
|||
box-shadow: none; |
|||
background-color: lighten(@sidebar-dark-bg, 10%); |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
.transition(all @transition-speed @transition-fn); |
|||
} |
|||
input[type="text"]{ |
|||
color: #666; |
|||
.border-radius(2px, 0, 2px, 0)!important; |
|||
&:focus, &:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
&:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
} |
|||
.btn { |
|||
color: #999; |
|||
.border-radius(0, 2px, 0, 2px)!important; |
|||
} |
|||
} |
|||
} |
|||
@ -1,135 +0,0 @@ |
|||
/* |
|||
* Skin: Yellow |
|||
* ------------ |
|||
*/ |
|||
|
|||
@import "../../bootstrap-less/mixins.less"; |
|||
@import "../../bootstrap-less/variables.less"; |
|||
@import "../variables.less"; |
|||
@import "../mixins.less"; |
|||
|
|||
.skin-yellow { |
|||
//Navbar |
|||
.main-header { |
|||
.navbar { |
|||
.navbar-variant(@yellow; #fff); |
|||
.sidebar-toggle { |
|||
color: #fff; |
|||
&:hover { |
|||
background-color: darken(@yellow, 5%); |
|||
} |
|||
} |
|||
@media(max-width: @screen-header-collapse) { |
|||
.dropdown-menu { |
|||
li { |
|||
&.divider { |
|||
background-color: rgba(255,255,255,0.1); |
|||
} |
|||
a { |
|||
color: #fff; |
|||
&:hover { |
|||
background: darken(@yellow, 5%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
//Logo |
|||
.logo { |
|||
.logo-variant(darken(@yellow, 5%)); |
|||
} |
|||
|
|||
li.user-header { |
|||
background-color: @yellow; |
|||
} |
|||
} |
|||
|
|||
//Content Header |
|||
.content-header { |
|||
background: transparent; |
|||
} |
|||
|
|||
//User Panel (resides in the sidebar) |
|||
.user-panel { |
|||
|
|||
> .info, > .info > a { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
//Sidebar & Treeview menu |
|||
// the menu |
|||
.sidebar-menu > li { |
|||
&.header { |
|||
color: lighten(@sidebar-dark-bg, 20%); |
|||
background: darken(@sidebar-dark-bg, 4%); |
|||
} |
|||
> a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
//Hover and active states |
|||
> a:hover, &.active > a { |
|||
color: @sidebar-dark-hover-color; |
|||
background: @sidebar-dark-hover-bg; |
|||
border-left-color: @yellow; |
|||
} |
|||
|
|||
> .treeview-menu { |
|||
margin: 0 1px; |
|||
background: @sidebar-dark-submenu-bg; |
|||
} |
|||
} |
|||
|
|||
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color) |
|||
.wrapper , |
|||
.main-sidebar, |
|||
.left-side { |
|||
background: @sidebar-dark-bg; |
|||
} |
|||
|
|||
.sidebar a { |
|||
color: @sidebar-dark-color; |
|||
&:hover { |
|||
text-decoration: none; |
|||
} |
|||
} |
|||
// skin blue treeview-menu |
|||
.treeview-menu { |
|||
> li { |
|||
> a {color: @sidebar-dark-submenu-color;} |
|||
&.active > a, > a:hover { |
|||
color: @sidebar-dark-submenu-hover-color; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebar-form { |
|||
.border-radius(3px); |
|||
border: 1px solid lighten(@sidebar-dark-bg, 10%); |
|||
margin: 10px 10px; |
|||
input[type="text"], .btn { |
|||
box-shadow: none; |
|||
background-color: lighten(@sidebar-dark-bg, 10%); |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
.transition(all @transition-speed @transition-fn); |
|||
} |
|||
input[type="text"]{ |
|||
color: #666; |
|||
.border-radius(2px, 0, 2px, 0)!important; |
|||
&:focus, &:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
&:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
} |
|||
.btn { |
|||
color: #999; |
|||
.border-radius(0, 2px, 0, 2px)!important; |
|||
} |
|||
} |
|||
} |
|||
@ -1,89 +0,0 @@ |
|||
/* |
|||
* Component: Small Box |
|||
* -------------------- |
|||
*/ |
|||
|
|||
.small-box { |
|||
.border-radius(2px); |
|||
position: relative; |
|||
display: block; |
|||
margin-bottom: 20px; |
|||
box-shadow: @box-boxshadow; |
|||
// content wrapper |
|||
> .inner { |
|||
padding: 10px; |
|||
} |
|||
|
|||
> .small-box-footer { |
|||
position: relative; |
|||
text-align: center; |
|||
padding: 3px 0; |
|||
color: #fff; |
|||
color: rgba(255, 255, 255, 0.8); |
|||
display: block; |
|||
z-index: 10; |
|||
background: rgba(0,0,0,0.1); |
|||
text-decoration: none; |
|||
&:hover { |
|||
color: #fff; |
|||
background: rgba(0,0,0,0.15); |
|||
} |
|||
} |
|||
|
|||
h3 { |
|||
font-size: 38px; |
|||
font-weight: bold; |
|||
margin: 0 0 10px 0; |
|||
white-space: nowrap; |
|||
padding: 0; |
|||
|
|||
} |
|||
|
|||
p { |
|||
font-size: 15px; |
|||
> small { |
|||
display: block; |
|||
color: #f9f9f9; |
|||
font-size: 13px; |
|||
margin-top: 5px; |
|||
} |
|||
} |
|||
|
|||
h3, p { |
|||
z-index: 5px; |
|||
} |
|||
|
|||
// the icon |
|||
.icon { |
|||
.transition(all @transition-speed linear); |
|||
position: absolute; |
|||
top: -10px; |
|||
right: 10px; |
|||
z-index: 0; |
|||
font-size: 90px; |
|||
color: rgba(0, 0, 0, 0.15); |
|||
} |
|||
|
|||
// Small box hover state |
|||
&:hover { |
|||
text-decoration: none; |
|||
color: #f9f9f9; |
|||
// Animate icons on small box hover |
|||
.icon { |
|||
font-size: 95px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
@media (max-width: @screen-xs-max) { |
|||
// No need for icons on very small devices |
|||
.small-box { |
|||
text-align: center; |
|||
.icon { |
|||
display: none; |
|||
} |
|||
p { |
|||
font-size: 12px; |
|||
} |
|||
} |
|||
} |
|||
@ -1,71 +0,0 @@ |
|||
/* |
|||
* Component: Table |
|||
* ---------------- |
|||
*/ |
|||
|
|||
.table { |
|||
//Cells |
|||
> thead, |
|||
> tbody, |
|||
> tfoot { |
|||
> tr { |
|||
> th, |
|||
> td { |
|||
border-top: 1px solid @box-border-color; |
|||
} |
|||
} |
|||
} |
|||
//thead cells |
|||
> thead > tr > th { |
|||
border-bottom: 2px solid @box-border-color; |
|||
} |
|||
//progress bars in tables |
|||
tr td .progress { |
|||
margin-top: 5px; |
|||
} |
|||
} |
|||
|
|||
//Bordered Table |
|||
.table-bordered { |
|||
border: 1px solid @box-border-color; |
|||
> thead, |
|||
> tbody, |
|||
> tfoot { |
|||
> tr { |
|||
> th, |
|||
> td { |
|||
border: 1px solid @box-border-color; |
|||
} |
|||
} |
|||
} |
|||
> thead > tr { |
|||
> th, |
|||
> td { |
|||
border-bottom-width: 2px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.table.no-border { |
|||
&, |
|||
td, |
|||
th { |
|||
border: 0; |
|||
} |
|||
} |
|||
|
|||
/* .text-center in tables */ |
|||
table.text-center { |
|||
&, td, th { |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
.table.align { |
|||
th { |
|||
text-align: left; |
|||
} |
|||
td { |
|||
text-align: right; |
|||
} |
|||
} |
|||
@ -1,98 +0,0 @@ |
|||
/* |
|||
* Component: Timeline |
|||
* ------------------- |
|||
*/ |
|||
|
|||
.timeline{ |
|||
position: relative; |
|||
margin: 0 0 30px 0; |
|||
padding: 0; |
|||
list-style: none; |
|||
|
|||
// The line |
|||
&:before { |
|||
content: ''; |
|||
position: absolute; |
|||
top: 0px; |
|||
bottom: 0; |
|||
width: 4px; |
|||
background: #ddd; |
|||
left: 31px; |
|||
margin: 0; |
|||
.border-radius(2px); |
|||
} |
|||
|
|||
|
|||
> li { |
|||
position: relative; |
|||
margin-right: 10px; |
|||
margin-bottom: 15px; |
|||
.clearfix(); |
|||
|
|||
// The content |
|||
> .timeline-item { |
|||
.box-shadow(@box-boxshadow); |
|||
.border-radius(@box-border-radius); |
|||
margin-top: 0px; |
|||
background: #fff; |
|||
color: #444; |
|||
margin-left: 60px; |
|||
margin-right: 15px; |
|||
padding: 0; |
|||
position: relative; |
|||
|
|||
// The time and header |
|||
> .time { |
|||
color: #999; |
|||
float: right; |
|||
padding: 10px; |
|||
font-size: 12px; |
|||
} |
|||
> .timeline-header { |
|||
margin: 0; |
|||
color: #555; |
|||
border-bottom: 1px solid @box-border-color; |
|||
padding: 10px; |
|||
font-size: 16px; |
|||
line-height: 1.1; |
|||
> a { |
|||
font-weight: 600; |
|||
} |
|||
} |
|||
// Item body and footer |
|||
> .timeline-body, > .timeline-footer { |
|||
padding: 10px; |
|||
} |
|||
|
|||
} |
|||
|
|||
// Time label |
|||
&.time-label { |
|||
> span { |
|||
font-weight: 600; |
|||
padding: 5px; |
|||
display: inline-block; |
|||
background-color: #fff; |
|||
|
|||
.border-radius(4px); |
|||
} |
|||
} |
|||
|
|||
// The icons |
|||
> .fa, |
|||
> .glyphicon, |
|||
> .ion { |
|||
width: 30px; |
|||
height: 30px; |
|||
font-size: 15px; |
|||
line-height: 30px; |
|||
position: absolute; |
|||
color: #666; |
|||
background: @gray; |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
left: 18px; |
|||
top: 0; |
|||
} |
|||
} |
|||
} |
|||
@ -1,36 +0,0 @@ |
|||
/* |
|||
* Component: Users List |
|||
* --------------------- |
|||
*/ |
|||
.users-list { |
|||
&:extend(.list-unstyled); |
|||
> li { |
|||
width: 25%; |
|||
float: left; |
|||
padding: 10px; |
|||
text-align: center; |
|||
> img { |
|||
.border-radius(50%); |
|||
max-width: 100%; |
|||
height: auto; |
|||
} |
|||
} |
|||
} |
|||
.users-list-name, |
|||
.users-list-date { |
|||
display: block; |
|||
} |
|||
.users-list-name { |
|||
font-weight: 600; |
|||
color: #444; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
&:hover { |
|||
color: #999; |
|||
} |
|||
} |
|||
.users-list-date { |
|||
color: #999; |
|||
font-size: 12px; |
|||
} |
|||
@ -1,102 +0,0 @@ |
|||
//AdminLTE 2 Variables.less |
|||
//========================= |
|||
|
|||
//COLORS |
|||
//-------------------------------------------------------- |
|||
|
|||
@light-blue: #3c8dbc; //Primary |
|||
@red: #dd4b39; //Danger |
|||
@green: #00a65a; //Success |
|||
@aqua: #00c0ef; //Info |
|||
@yellow: #f39c12; //Warning |
|||
@blue: #0073b7; |
|||
@navy: #001F3F; |
|||
@teal: #39CCCC; |
|||
@olive: #3D9970; |
|||
@lime: #01FF70; |
|||
@orange: #FF851B; |
|||
@fuchsia: #F012BE; |
|||
@purple: #605ca8; |
|||
@maroon: #D81B60; |
|||
@black: #111; |
|||
@gray: #d2d6de; |
|||
|
|||
//LAYOUT |
|||
//-------------------------------------------------------- |
|||
|
|||
//Side bar and logo width |
|||
@sidebar-width: 230px; |
|||
//Bosex layout maximum width |
|||
@boxed-layout-max-width: 1024px; |
|||
//When the logo should go to the top of the screen |
|||
@screen-header-collapse: @screen-xs-max; |
|||
|
|||
//Link colors (Aka: <a> tags) |
|||
@link-color: @light-blue; |
|||
@link-hover-color: lighten(@link-color, 15%); |
|||
|
|||
//Body background (Affects main content background only) |
|||
@body-bg: #ecf0f5;//darken(#f4f5f7, 4%); |
|||
|
|||
//SIDEBAR SKINS |
|||
//-------------------------------------------------------- |
|||
|
|||
//skin blue (light) sidebar vars |
|||
@sidebar-dark-bg: #222d32; |
|||
@sidebar-dark-hover-bg: darken(@sidebar-dark-bg, 2%); |
|||
@sidebar-dark-color: lighten(@sidebar-dark-bg, 60%); |
|||
@sidebar-dark-hover-color: #fff; |
|||
@sidebar-dark-border: #dbdbdb; |
|||
@sidebar-dark-submenu-bg: lighten(@sidebar-dark-bg, 5%); |
|||
@sidebar-dark-submenu-color: lighten(@sidebar-dark-submenu-bg, 40%); |
|||
@sidebar-dark-submenu-hover-color: #fff; |
|||
|
|||
//BOXES |
|||
//-------------------------------------------------------- |
|||
@box-border-color: #f4f4f4; |
|||
@box-border-radius: 3px; |
|||
@box-footer-bg: #fff; |
|||
@box-boxshadow: 0 1px 1px rgba(0, 0, 0, .1); |
|||
@box-padding: 10px; |
|||
|
|||
//Box variants |
|||
@box-default-border-top-color: #d2d6de; |
|||
|
|||
//BUTTONS |
|||
//-------------------------------------------------------- |
|||
@btn-boxshadow: none; |
|||
|
|||
//PROGRESS BARS |
|||
//-------------------------------------------------------- |
|||
@progress-bar-border-radius: 1px; |
|||
@progress-bar-sm-border-radius: 1px; |
|||
@progress-bar-xs-border-radius: 1px; |
|||
|
|||
//FORMS |
|||
//-------------------------------------------------------- |
|||
@input-radius: 0px; |
|||
|
|||
//BUTTONS |
|||
//-------------------------------------------------------- |
|||
|
|||
//Border radius for non flat buttons |
|||
@btn-border-radius: 3px; |
|||
|
|||
//DIRECT CHAT |
|||
//-------------------------------------------------------- |
|||
@direct-chat-height: 250px; |
|||
@direct-chat-default-msg-bg: @gray; |
|||
@direct-chat-default-font-color: #444; |
|||
@direct-chat-default-msg-border-color: @gray; |
|||
|
|||
|
|||
//CHAT WIDGET |
|||
//-------------------------------------------------------- |
|||
@attachment-border-radius: 3px; |
|||
|
|||
//TRANSITIONS SETTINGS |
|||
//-------------------------------------------------------- |
|||
|
|||
//Transition global options |
|||
@transition-speed: .3s; |
|||
@transition-fn: cubic-bezier(0.32,1.25,0.375,1.15); |
|||
@ -1,33 +0,0 @@ |
|||
CHANGE LOG: |
|||
|
|||
v2.0 |
|||
- Major layout bug fixes |
|||
- Change in layout mark up |
|||
- Added transitions to the sidebar |
|||
- New skins and modified previous skins |
|||
- Change in color scheme to a more complementing scheme |
|||
- Added footer support |
|||
- Removed pace.js from the main app.js |
|||
- Added support for collapsed sidebar as an initial state (add .sidebar-collapse to the body tag) |
|||
- Added boxed layout (.layout-boxed) |
|||
- Enhanced consistency in padding and margining |
|||
- Updated Bootstrap to 3.3.2 |
|||
- Fixed navbar dropdown menu on small screens positioning issues. |
|||
- Updated Ion Icons to 2.0.0 |
|||
- Updated FontAwesome to 4.3.0 |
|||
- Added ChartJS 1.0.1 |
|||
- Removed iCheck dependency |
|||
- Created Dashboard 2.0 |
|||
- Created new Chat widget (DirectChat) |
|||
- Added transitions to DirectChat |
|||
- Added contacts pane to DirectChat |
|||
- Changed .right-side to .content-wrapper |
|||
- Changed .navbar-right to .navbar-custom-menu |
|||
- Removed unused files |
|||
- Updated lockscreen style (HTML markup changed!) |
|||
- Updated Login & Registration pages (HTML markup changed!) |
|||
- Updated buttons style. |
|||
- Enhanced border-radius consistency |
|||
- Added mailbox: inbox, read, and compose pages |
|||
- Bootstrap & jQuery are now hosted locally |
|||
- Created documentation. |
|||
@ -1,26 +0,0 @@ |
|||
{ |
|||
"name": "almasaeed2010/adminlte", |
|||
"description": "AdminLTE - admin control panel and dashboard that's based on Bootstrap 3", |
|||
"homepage": "http://almsaeedstudio.com/", |
|||
"keywords": [ |
|||
"css", |
|||
"js", |
|||
"less", |
|||
"responsive", |
|||
"back-end", |
|||
"template", |
|||
"theme", |
|||
"web", |
|||
"admin" |
|||
], |
|||
"authors": [ |
|||
{ |
|||
"name": "Abdullah Almsaeed", |
|||
"email": "support@almsaeedstudio.com" |
|||
} |
|||
], |
|||
"license": "MIT", |
|||
"support": { |
|||
"issues": "https://github.com/almasaeed2010/AdminLTE/issues" |
|||
} |
|||
} |
|||
@ -1,36 +0,0 @@ |
|||
var app = new Vue({ |
|||
el: '#app', |
|||
data: { |
|||
scanner: null, |
|||
activeCameraId: null, |
|||
cameras: [], |
|||
scans: [] |
|||
}, |
|||
mounted: function () { |
|||
var self = this; |
|||
self.scanner = new Instascan.Scanner({ video: document.getElementById('preview'), scanPeriod: 5 }); |
|||
self.scanner.addListener('scan', function (content, image) { |
|||
self.scans.unshift({ date: +(Date.now()), content: content }); |
|||
}); |
|||
Instascan.Camera.getCameras().then(function (cameras) { |
|||
self.cameras = cameras; |
|||
if (cameras.length > 0) { |
|||
self.activeCameraId = cameras[0].id; |
|||
self.scanner.start(cameras[0]); |
|||
} else { |
|||
console.error('No cameras found.'); |
|||
} |
|||
}).catch(function (e) { |
|||
console.error(e); |
|||
}); |
|||
}, |
|||
methods: { |
|||
formatName: function (name) { |
|||
return name || '(unknown)'; |
|||
}, |
|||
selectCamera: function (camera) { |
|||
this.activeCameraId = camera.id; |
|||
this.scanner.start(camera); |
|||
} |
|||
} |
|||
}); |
|||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
@ -1,876 +0,0 @@ |
|||
/* |
|||
* Skin: Blue |
|||
* ---------- |
|||
*/ |
|||
.skin-blue .main-header .navbar { |
|||
background-color: #3c8dbc; |
|||
} |
|||
.skin-blue .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .main-header .navbar .nav > li > a:hover, |
|||
.skin-blue .main-header .navbar .nav > li > a:active, |
|||
.skin-blue .main-header .navbar .nav > li > a:focus, |
|||
.skin-blue .main-header .navbar .nav .open > a, |
|||
.skin-blue .main-header .navbar .nav .open > a:hover, |
|||
.skin-blue .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-blue .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #367fa9; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-blue .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-blue .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-blue .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #367fa9; |
|||
} |
|||
} |
|||
.skin-blue .main-header .logo { |
|||
background-color: #367fa9; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-blue .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .main-header .logo:hover { |
|||
background: #357ca5; |
|||
} |
|||
.skin-blue .main-header li.user-header { |
|||
background-color: #3c8dbc; |
|||
} |
|||
.skin-blue .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-blue .user-panel > .info, |
|||
.skin-blue .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-blue .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-blue .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-blue .sidebar-menu > li > a:hover, |
|||
.skin-blue .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #3c8dbc; |
|||
} |
|||
.skin-blue .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-blue .wrapper, |
|||
.skin-blue .main-sidebar, |
|||
.skin-blue .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-blue .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-blue .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-blue .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-blue .treeview-menu > li.active > a, |
|||
.skin-blue .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"], |
|||
.skin-blue .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"]:focus, |
|||
.skin-blue .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-blue .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
.skin-blue.layout-top-nav .main-header > .logo { |
|||
background-color: #3c8dbc; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-blue.layout-top-nav .main-header > .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue.layout-top-nav .main-header > .logo:hover { |
|||
background: #3b8ab8; |
|||
} |
|||
/* |
|||
* Skin: Black |
|||
* ----------- |
|||
*/ |
|||
/* skin-black navbar */ |
|||
.skin-black .main-header { |
|||
-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05); |
|||
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05); |
|||
} |
|||
.skin-black .main-header .navbar-toggle { |
|||
color: #333; |
|||
} |
|||
.skin-black .main-header .navbar-brand { |
|||
color: #333; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .navbar { |
|||
background-color: #ffffff; |
|||
} |
|||
.skin-black .main-header > .navbar .nav > li > a { |
|||
color: #333333; |
|||
} |
|||
.skin-black .main-header > .navbar .nav > li > a:hover, |
|||
.skin-black .main-header > .navbar .nav > li > a:active, |
|||
.skin-black .main-header > .navbar .nav > li > a:focus, |
|||
.skin-black .main-header > .navbar .nav .open > a, |
|||
.skin-black .main-header > .navbar .nav .open > a:hover, |
|||
.skin-black .main-header > .navbar .nav .open > a:focus { |
|||
background: #ffffff; |
|||
color: #999999; |
|||
} |
|||
.skin-black .main-header > .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-black .main-header > .navbar .sidebar-toggle { |
|||
color: #333333; |
|||
} |
|||
.skin-black .main-header > .navbar .sidebar-toggle:hover { |
|||
color: #999999; |
|||
background: #ffffff; |
|||
} |
|||
.skin-black .main-header > .navbar > .sidebar-toggle { |
|||
color: #333; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .navbar .navbar-nav > li > a { |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .navbar .navbar-custom-menu .navbar-nav > li > a, |
|||
.skin-black .main-header > .navbar .navbar-right > li > a { |
|||
border-left: 1px solid #eee; |
|||
border-right-width: 0; |
|||
} |
|||
.skin-black .main-header > .logo { |
|||
background-color: #ffffff; |
|||
color: #333333; |
|||
border-bottom: 0px solid transparent; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .logo > a { |
|||
color: #333333; |
|||
} |
|||
.skin-black .main-header > .logo:hover { |
|||
background: #fcfcfc; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-black .main-header > .logo { |
|||
background-color: #222222; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
border-right: none; |
|||
} |
|||
.skin-black .main-header > .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-black .main-header > .logo:hover { |
|||
background: #1f1f1f; |
|||
} |
|||
} |
|||
.skin-black .main-header li.user-header { |
|||
background-color: #222; |
|||
} |
|||
.skin-black .content-header { |
|||
background: transparent; |
|||
box-shadow: none; |
|||
} |
|||
.skin-black .user-panel > .image > img { |
|||
border: 1px solid #444; |
|||
} |
|||
.skin-black .user-panel > .info, |
|||
.skin-black .user-panel > .info > a { |
|||
color: #eee; |
|||
} |
|||
.skin-black .main-sidebar, |
|||
.skin-black .left-side, |
|||
.skin-black .wrapper { |
|||
background: #222; |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li.header { |
|||
background: #1d1d1d; |
|||
color: rgba(255, 255, 255, 0.4); |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li > a { |
|||
margin-right: 1px; |
|||
border-left: 3px solid transparent; |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li > a:hover, |
|||
.skin-black .sidebar > .sidebar-menu > li.active > a { |
|||
color: #fff; |
|||
background: #444; |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li > .treeview-menu { |
|||
background: #333; |
|||
} |
|||
.skin-black .sidebar a { |
|||
color: #eee; |
|||
} |
|||
.skin-black .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-black .treeview-menu > li > a { |
|||
color: #ccc; |
|||
} |
|||
.skin-black .treeview-menu > li.active > a, |
|||
.skin-black .treeview-menu > li > a:hover { |
|||
color: #fff; |
|||
} |
|||
.skin-black .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #3c3c3c; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-black .sidebar-form input[type="text"], |
|||
.skin-black .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #3c3c3c; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-black .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-black .sidebar-form input[type="text"]:focus, |
|||
.skin-black .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-black .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-black .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
/* |
|||
* Skin: Green |
|||
* ----------- |
|||
*/ |
|||
.skin-green .main-header .navbar { |
|||
background-color: #00a65a; |
|||
} |
|||
.skin-green .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .main-header .navbar .nav > li > a:hover, |
|||
.skin-green .main-header .navbar .nav > li > a:active, |
|||
.skin-green .main-header .navbar .nav > li > a:focus, |
|||
.skin-green .main-header .navbar .nav .open > a, |
|||
.skin-green .main-header .navbar .nav .open > a:hover, |
|||
.skin-green .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-green .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #008d4c; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-green .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-green .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-green .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #008d4c; |
|||
} |
|||
} |
|||
.skin-green .main-header .logo { |
|||
background-color: #008d4c; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-green .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .main-header .logo:hover { |
|||
background: #008749; |
|||
} |
|||
.skin-green .main-header li.user-header { |
|||
background-color: #00a65a; |
|||
} |
|||
.skin-green .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-green .user-panel > .info, |
|||
.skin-green .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-green .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-green .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-green .sidebar-menu > li > a:hover, |
|||
.skin-green .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #00a65a; |
|||
} |
|||
.skin-green .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-green .wrapper, |
|||
.skin-green .main-sidebar, |
|||
.skin-green .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-green .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-green .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-green .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-green .treeview-menu > li.active > a, |
|||
.skin-green .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-green .sidebar-form input[type="text"], |
|||
.skin-green .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-green .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-green .sidebar-form input[type="text"]:focus, |
|||
.skin-green .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-green .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-green .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
/* |
|||
* Skin: Red |
|||
* --------- |
|||
*/ |
|||
.skin-red .main-header .navbar { |
|||
background-color: #dd4b39; |
|||
} |
|||
.skin-red .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-red .main-header .navbar .nav > li > a:hover, |
|||
.skin-red .main-header .navbar .nav > li > a:active, |
|||
.skin-red .main-header .navbar .nav > li > a:focus, |
|||
.skin-red .main-header .navbar .nav .open > a, |
|||
.skin-red .main-header .navbar .nav .open > a:hover, |
|||
.skin-red .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-red .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-red .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-red .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-red .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-red .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #d73925; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-red .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-red .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-red .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #d73925; |
|||
} |
|||
} |
|||
.skin-red .main-header .logo { |
|||
background-color: #d73925; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-red .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-red .main-header .logo:hover { |
|||
background: #d33724; |
|||
} |
|||
.skin-red .main-header li.user-header { |
|||
background-color: #dd4b39; |
|||
} |
|||
.skin-red .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-red .user-panel > .info, |
|||
.skin-red .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-red .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-red .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-red .sidebar-menu > li > a:hover, |
|||
.skin-red .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #dd4b39; |
|||
} |
|||
.skin-red .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-red .wrapper, |
|||
.skin-red .main-sidebar, |
|||
.skin-red .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-red .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-red .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-red .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-red .treeview-menu > li.active > a, |
|||
.skin-red .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-red .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-red .sidebar-form input[type="text"], |
|||
.skin-red .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-red .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-red .sidebar-form input[type="text"]:focus, |
|||
.skin-red .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-red .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-red .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
/* |
|||
* Skin: Yellow |
|||
* ------------ |
|||
*/ |
|||
.skin-yellow .main-header .navbar { |
|||
background-color: #f39c12; |
|||
} |
|||
.skin-yellow .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-yellow .main-header .navbar .nav > li > a:hover, |
|||
.skin-yellow .main-header .navbar .nav > li > a:active, |
|||
.skin-yellow .main-header .navbar .nav > li > a:focus, |
|||
.skin-yellow .main-header .navbar .nav .open > a, |
|||
.skin-yellow .main-header .navbar .nav .open > a:hover, |
|||
.skin-yellow .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-yellow .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-yellow .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-yellow .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-yellow .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-yellow .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #e08e0b; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-yellow .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-yellow .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-yellow .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #e08e0b; |
|||
} |
|||
} |
|||
.skin-yellow .main-header .logo { |
|||
background-color: #e08e0b; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-yellow .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-yellow .main-header .logo:hover { |
|||
background: #db8b0b; |
|||
} |
|||
.skin-yellow .main-header li.user-header { |
|||
background-color: #f39c12; |
|||
} |
|||
.skin-yellow .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-yellow .user-panel > .info, |
|||
.skin-yellow .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-yellow .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-yellow .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-yellow .sidebar-menu > li > a:hover, |
|||
.skin-yellow .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #f39c12; |
|||
} |
|||
.skin-yellow .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-yellow .wrapper, |
|||
.skin-yellow .main-sidebar, |
|||
.skin-yellow .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-yellow .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-yellow .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-yellow .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-yellow .treeview-menu > li.active > a, |
|||
.skin-yellow .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-yellow .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-yellow .sidebar-form input[type="text"], |
|||
.skin-yellow .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-yellow .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-yellow .sidebar-form input[type="text"]:focus, |
|||
.skin-yellow .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-yellow .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-yellow .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
/* |
|||
* Skin: Purple |
|||
* ------------ |
|||
*/ |
|||
.skin-purple .main-header .navbar { |
|||
background-color: #605ca8; |
|||
} |
|||
.skin-purple .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-purple .main-header .navbar .nav > li > a:hover, |
|||
.skin-purple .main-header .navbar .nav > li > a:active, |
|||
.skin-purple .main-header .navbar .nav > li > a:focus, |
|||
.skin-purple .main-header .navbar .nav .open > a, |
|||
.skin-purple .main-header .navbar .nav .open > a:hover, |
|||
.skin-purple .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-purple .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-purple .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-purple .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-purple .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-purple .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #555299; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-purple .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-purple .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-purple .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #555299; |
|||
} |
|||
} |
|||
.skin-purple .main-header .logo { |
|||
background-color: #555299; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-purple .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-purple .main-header .logo:hover { |
|||
background: #545096; |
|||
} |
|||
.skin-purple .main-header li.user-header { |
|||
background-color: #605ca8; |
|||
} |
|||
.skin-purple .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-purple .user-panel > .info, |
|||
.skin-purple .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-purple .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-purple .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-purple .sidebar-menu > li > a:hover, |
|||
.skin-purple .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #605ca8; |
|||
} |
|||
.skin-purple .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-purple .wrapper, |
|||
.skin-purple .main-sidebar, |
|||
.skin-purple .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-purple .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-purple .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-purple .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-purple .treeview-menu > li.active > a, |
|||
.skin-purple .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-purple .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-purple .sidebar-form input[type="text"], |
|||
.skin-purple .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-purple .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-purple .sidebar-form input[type="text"]:focus, |
|||
.skin-purple .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-purple .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-purple .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
File diff suppressed because one or more lines are too long
@ -1,165 +0,0 @@ |
|||
/* |
|||
* Skin: Black |
|||
* ----------- |
|||
*/ |
|||
/* skin-black navbar */ |
|||
.skin-black .main-header { |
|||
-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05); |
|||
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05); |
|||
} |
|||
.skin-black .main-header .navbar-toggle { |
|||
color: #333; |
|||
} |
|||
.skin-black .main-header .navbar-brand { |
|||
color: #333; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .navbar { |
|||
background-color: #ffffff; |
|||
} |
|||
.skin-black .main-header > .navbar .nav > li > a { |
|||
color: #333333; |
|||
} |
|||
.skin-black .main-header > .navbar .nav > li > a:hover, |
|||
.skin-black .main-header > .navbar .nav > li > a:active, |
|||
.skin-black .main-header > .navbar .nav > li > a:focus, |
|||
.skin-black .main-header > .navbar .nav .open > a, |
|||
.skin-black .main-header > .navbar .nav .open > a:hover, |
|||
.skin-black .main-header > .navbar .nav .open > a:focus { |
|||
background: #ffffff; |
|||
color: #999999; |
|||
} |
|||
.skin-black .main-header > .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-black .main-header > .navbar .sidebar-toggle { |
|||
color: #333333; |
|||
} |
|||
.skin-black .main-header > .navbar .sidebar-toggle:hover { |
|||
color: #999999; |
|||
background: #ffffff; |
|||
} |
|||
.skin-black .main-header > .navbar > .sidebar-toggle { |
|||
color: #333; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .navbar .navbar-nav > li > a { |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .navbar .navbar-custom-menu .navbar-nav > li > a, |
|||
.skin-black .main-header > .navbar .navbar-right > li > a { |
|||
border-left: 1px solid #eee; |
|||
border-right-width: 0; |
|||
} |
|||
.skin-black .main-header > .logo { |
|||
background-color: #ffffff; |
|||
color: #333333; |
|||
border-bottom: 0px solid transparent; |
|||
border-right: 1px solid #eee; |
|||
} |
|||
.skin-black .main-header > .logo > a { |
|||
color: #333333; |
|||
} |
|||
.skin-black .main-header > .logo:hover { |
|||
background: #fcfcfc; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-black .main-header > .logo { |
|||
background-color: #222222; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
border-right: none; |
|||
} |
|||
.skin-black .main-header > .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-black .main-header > .logo:hover { |
|||
background: #1f1f1f; |
|||
} |
|||
} |
|||
.skin-black .main-header li.user-header { |
|||
background-color: #222; |
|||
} |
|||
.skin-black .content-header { |
|||
background: transparent; |
|||
box-shadow: none; |
|||
} |
|||
.skin-black .user-panel > .image > img { |
|||
border: 1px solid #444; |
|||
} |
|||
.skin-black .user-panel > .info, |
|||
.skin-black .user-panel > .info > a { |
|||
color: #eee; |
|||
} |
|||
.skin-black .main-sidebar, |
|||
.skin-black .left-side, |
|||
.skin-black .wrapper { |
|||
background: #222; |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li.header { |
|||
background: #1d1d1d; |
|||
color: rgba(255, 255, 255, 0.4); |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li > a { |
|||
margin-right: 1px; |
|||
border-left: 3px solid transparent; |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li > a:hover, |
|||
.skin-black .sidebar > .sidebar-menu > li.active > a { |
|||
color: #fff; |
|||
background: #444; |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-black .sidebar > .sidebar-menu > li > .treeview-menu { |
|||
background: #333; |
|||
} |
|||
.skin-black .sidebar a { |
|||
color: #eee; |
|||
} |
|||
.skin-black .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-black .treeview-menu > li > a { |
|||
color: #ccc; |
|||
} |
|||
.skin-black .treeview-menu > li.active > a, |
|||
.skin-black .treeview-menu > li > a:hover { |
|||
color: #fff; |
|||
} |
|||
.skin-black .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #3c3c3c; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-black .sidebar-form input[type="text"], |
|||
.skin-black .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #3c3c3c; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-black .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-black .sidebar-form input[type="text"]:focus, |
|||
.skin-black .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-black .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-black .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
@ -1 +0,0 @@ |
|||
.skin-black .main-header{-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.05);box-shadow:0 1px 1px rgba(0,0,0,0.05)}.skin-black .main-header .navbar-toggle{color:#333}.skin-black .main-header .navbar-brand{color:#333;border-right:1px solid #eee}.skin-black .main-header>.navbar{background-color:#fff}.skin-black .main-header>.navbar .nav>li>a{color:#333}.skin-black .main-header>.navbar .nav>li>a:hover,.skin-black .main-header>.navbar .nav>li>a:active,.skin-black .main-header>.navbar .nav>li>a:focus,.skin-black .main-header>.navbar .nav .open>a,.skin-black .main-header>.navbar .nav .open>a:hover,.skin-black .main-header>.navbar .nav .open>a:focus{background:#fff;color:#999}.skin-black .main-header>.navbar .navbar-custom-menu>.nav{margin-right:10px}.skin-black .main-header>.navbar .sidebar-toggle{color:#333}.skin-black .main-header>.navbar .sidebar-toggle:hover{color:#999;background:#fff}.skin-black .main-header>.navbar>.sidebar-toggle{color:#333;border-right:1px solid #eee}.skin-black .main-header>.navbar .navbar-nav>li>a{border-right:1px solid #eee}.skin-black .main-header>.navbar .navbar-custom-menu .navbar-nav>li>a,.skin-black .main-header>.navbar .navbar-right>li>a{border-left:1px solid #eee;border-right-width:0}.skin-black .main-header>.logo{background-color:#fff;color:#333;border-bottom:0 solid transparent;border-right:1px solid #eee}.skin-black .main-header>.logo>a{color:#333}.skin-black .main-header>.logo:hover{background:#fcfcfc}@media (max-width:767px){.skin-black .main-header>.logo{background-color:#222;color:#fff;border-bottom:0 solid transparent;border-right:none}.skin-black .main-header>.logo>a{color:#fff}.skin-black .main-header>.logo:hover{background:#1f1f1f}}.skin-black .main-header li.user-header{background-color:#222}.skin-black .content-header{background:transparent;box-shadow:none}.skin-black .user-panel>.image>img{border:1px solid #444}.skin-black .user-panel>.info,.skin-black .user-panel>.info>a{color:#eee}.skin-black .main-sidebar,.skin-black .left-side,.skin-black .wrapper{background:#222}.skin-black .sidebar>.sidebar-menu>li.header{background:#1d1d1d;color:rgba(255,255,255,0.4)}.skin-black .sidebar>.sidebar-menu>li>a{margin-right:1px;border-left:3px solid transparent}.skin-black .sidebar>.sidebar-menu>li>a:hover,.skin-black .sidebar>.sidebar-menu>li.active>a{color:#fff;background:#444;border-left-color:#fff}.skin-black .sidebar>.sidebar-menu>li>.treeview-menu{background:#333}.skin-black .sidebar a{color:#eee}.skin-black .sidebar a:hover{text-decoration:none}.skin-black .treeview-menu>li>a{color:#ccc}.skin-black .treeview-menu>li.active>a,.skin-black .treeview-menu>li>a:hover{color:#fff}.skin-black .sidebar-form{border-radius:3px;border:1px solid #3c3c3c;margin:10px 10px}.skin-black .sidebar-form input[type="text"],.skin-black .sidebar-form .btn{box-shadow:none;background-color:#3c3c3c;border:1px solid transparent;height:35px;-webkit-transition:all .3s cubic-bezier(.32, 1.25, .375, 1.15);-o-transition:all .3s cubic-bezier(.32, 1.25, .375, 1.15);transition:all .3s cubic-bezier(.32, 1.25, .375, 1.15)}.skin-black .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;border-bottom-left-radius:2px !important}.skin-black .sidebar-form input[type="text"]:focus,.skin-black .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666}.skin-black .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff}.skin-black .sidebar-form .btn{color:#999;border-top-left-radius:0 !important;border-top-right-radius:2px !important;border-bottom-right-radius:2px !important;border-bottom-left-radius:0 !important} |
|||
@ -1,151 +0,0 @@ |
|||
/* |
|||
* Skin: Blue |
|||
* ---------- |
|||
*/ |
|||
.skin-blue .main-header .navbar { |
|||
background-color: #3c8dbc; |
|||
} |
|||
.skin-blue .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .main-header .navbar .nav > li > a:hover, |
|||
.skin-blue .main-header .navbar .nav > li > a:active, |
|||
.skin-blue .main-header .navbar .nav > li > a:focus, |
|||
.skin-blue .main-header .navbar .nav .open > a, |
|||
.skin-blue .main-header .navbar .nav .open > a:hover, |
|||
.skin-blue .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-blue .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-blue .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #367fa9; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-blue .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-blue .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-blue .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #367fa9; |
|||
} |
|||
} |
|||
.skin-blue .main-header .logo { |
|||
background-color: #367fa9; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-blue .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .main-header .logo:hover { |
|||
background: #357ca5; |
|||
} |
|||
.skin-blue .main-header li.user-header { |
|||
background-color: #3c8dbc; |
|||
} |
|||
.skin-blue .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-blue .user-panel > .info, |
|||
.skin-blue .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-blue .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-blue .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-blue .sidebar-menu > li > a:hover, |
|||
.skin-blue .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #3c8dbc; |
|||
} |
|||
.skin-blue .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-blue .wrapper, |
|||
.skin-blue .main-sidebar, |
|||
.skin-blue .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-blue .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-blue .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-blue .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-blue .treeview-menu > li.active > a, |
|||
.skin-blue .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"], |
|||
.skin-blue .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"]:focus, |
|||
.skin-blue .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-blue .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-blue .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
.skin-blue.layout-top-nav .main-header > .logo { |
|||
background-color: #3c8dbc; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-blue.layout-top-nav .main-header > .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-blue.layout-top-nav .main-header > .logo:hover { |
|||
background: #3b8ab8; |
|||
} |
|||
@ -1 +0,0 @@ |
|||
.skin-blue .main-header .navbar{background-color:#3c8dbc}.skin-blue .main-header .navbar .nav>li>a{color:#fff}.skin-blue .main-header .navbar .nav>li>a:hover,.skin-blue .main-header .navbar .nav>li>a:active,.skin-blue .main-header .navbar .nav>li>a:focus,.skin-blue .main-header .navbar .nav .open>a,.skin-blue .main-header .navbar .nav .open>a:hover,.skin-blue .main-header .navbar .nav .open>a:focus{background:rgba(0,0,0,0.1);color:#f6f6f6}.skin-blue .main-header .navbar .navbar-custom-menu>.nav{margin-right:10px}.skin-blue .main-header .navbar .sidebar-toggle{color:#fff}.skin-blue .main-header .navbar .sidebar-toggle:hover{color:#f6f6f6;background:rgba(0,0,0,0.1)}.skin-blue .main-header .navbar .sidebar-toggle{color:#fff}.skin-blue .main-header .navbar .sidebar-toggle:hover{background-color:#367fa9}@media (max-width:767px){.skin-blue .main-header .navbar .dropdown-menu li.divider{background-color:rgba(255,255,255,0.1)}.skin-blue .main-header .navbar .dropdown-menu li a{color:#fff}.skin-blue .main-header .navbar .dropdown-menu li a:hover{background:#367fa9}}.skin-blue .main-header .logo{background-color:#367fa9;color:#fff;border-bottom:0 solid transparent}.skin-blue .main-header .logo>a{color:#fff}.skin-blue .main-header .logo:hover{background:#357ca5}.skin-blue .main-header li.user-header{background-color:#3c8dbc}.skin-blue .content-header{background:transparent}.skin-blue .user-panel>.info,.skin-blue .user-panel>.info>a{color:#fff}.skin-blue .sidebar-menu>li.header{color:#4b646f;background:#1a2226}.skin-blue .sidebar-menu>li>a{border-left:3px solid transparent;margin-right:1px}.skin-blue .sidebar-menu>li>a:hover,.skin-blue .sidebar-menu>li.active>a{color:#fff;background:#1e282c;border-left-color:#3c8dbc}.skin-blue .sidebar-menu>li>.treeview-menu{margin:0 1px;background:#2c3b41}.skin-blue .wrapper,.skin-blue .main-sidebar,.skin-blue .left-side{background:#222d32}.skin-blue .sidebar a{color:#b8c7ce}.skin-blue .sidebar a:hover{text-decoration:none}.skin-blue .treeview-menu>li>a{color:#8aa4af}.skin-blue .treeview-menu>li.active>a,.skin-blue .treeview-menu>li>a:hover{color:#fff}.skin-blue .sidebar-form{border-radius:3px;border:1px solid #374850;margin:10px 10px}.skin-blue .sidebar-form input[type="text"],.skin-blue .sidebar-form .btn{box-shadow:none;background-color:#374850;border:1px solid transparent;height:35px;-webkit-transition:all .3s cubic-bezier(.32, 1.25, .375, 1.15);-o-transition:all .3s cubic-bezier(.32, 1.25, .375, 1.15);transition:all .3s cubic-bezier(.32, 1.25, .375, 1.15)}.skin-blue .sidebar-form input[type="text"]{color:#666;border-top-left-radius:2px !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;border-bottom-left-radius:2px !important}.skin-blue .sidebar-form input[type="text"]:focus,.skin-blue .sidebar-form input[type="text"]:focus+.input-group-btn .btn{background-color:#fff;color:#666}.skin-blue .sidebar-form input[type="text"]:focus+.input-group-btn .btn{border-left-color:#fff}.skin-blue .sidebar-form .btn{color:#999;border-top-left-radius:0 !important;border-top-right-radius:2px !important;border-bottom-right-radius:2px !important;border-bottom-left-radius:0 !important}.skin-blue.layout-top-nav .main-header>.logo{background-color:#3c8dbc;color:#fff;border-bottom:0 solid transparent}.skin-blue.layout-top-nav .main-header>.logo>a{color:#fff}.skin-blue.layout-top-nav .main-header>.logo:hover{background:#3b8ab8} |
|||
@ -1,140 +0,0 @@ |
|||
/* |
|||
* Skin: Green |
|||
* ----------- |
|||
*/ |
|||
.skin-green .main-header .navbar { |
|||
background-color: #00a65a; |
|||
} |
|||
.skin-green .main-header .navbar .nav > li > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .main-header .navbar .nav > li > a:hover, |
|||
.skin-green .main-header .navbar .nav > li > a:active, |
|||
.skin-green .main-header .navbar .nav > li > a:focus, |
|||
.skin-green .main-header .navbar .nav .open > a, |
|||
.skin-green .main-header .navbar .nav .open > a:hover, |
|||
.skin-green .main-header .navbar .nav .open > a:focus { |
|||
background: rgba(0, 0, 0, 0.1); |
|||
color: #f6f6f6; |
|||
} |
|||
.skin-green .main-header .navbar .navbar-custom-menu > .nav { |
|||
margin-right: 10px; |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle:hover { |
|||
color: #f6f6f6; |
|||
background: rgba(0, 0, 0, 0.1); |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle { |
|||
color: #fff; |
|||
} |
|||
.skin-green .main-header .navbar .sidebar-toggle:hover { |
|||
background-color: #008d4c; |
|||
} |
|||
@media (max-width: 767px) { |
|||
.skin-green .main-header .navbar .dropdown-menu li.divider { |
|||
background-color: rgba(255, 255, 255, 0.1); |
|||
} |
|||
.skin-green .main-header .navbar .dropdown-menu li a { |
|||
color: #fff; |
|||
} |
|||
.skin-green .main-header .navbar .dropdown-menu li a:hover { |
|||
background: #008d4c; |
|||
} |
|||
} |
|||
.skin-green .main-header .logo { |
|||
background-color: #008d4c; |
|||
color: #ffffff; |
|||
border-bottom: 0px solid transparent; |
|||
} |
|||
.skin-green .main-header .logo > a { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .main-header .logo:hover { |
|||
background: #008749; |
|||
} |
|||
.skin-green .main-header li.user-header { |
|||
background-color: #00a65a; |
|||
} |
|||
.skin-green .content-header { |
|||
background: transparent; |
|||
} |
|||
.skin-green .user-panel > .info, |
|||
.skin-green .user-panel > .info > a { |
|||
color: #fff; |
|||
} |
|||
.skin-green .sidebar-menu > li.header { |
|||
color: #4b646f; |
|||
background: #1a2226; |
|||
} |
|||
.skin-green .sidebar-menu > li > a { |
|||
border-left: 3px solid transparent; |
|||
margin-right: 1px; |
|||
} |
|||
.skin-green .sidebar-menu > li > a:hover, |
|||
.skin-green .sidebar-menu > li.active > a { |
|||
color: #ffffff; |
|||
background: #1e282c; |
|||
border-left-color: #00a65a; |
|||
} |
|||
.skin-green .sidebar-menu > li > .treeview-menu { |
|||
margin: 0 1px; |
|||
background: #2c3b41; |
|||
} |
|||
.skin-green .wrapper, |
|||
.skin-green .main-sidebar, |
|||
.skin-green .left-side { |
|||
background: #222d32; |
|||
} |
|||
.skin-green .sidebar a { |
|||
color: #b8c7ce; |
|||
} |
|||
.skin-green .sidebar a:hover { |
|||
text-decoration: none; |
|||
} |
|||
.skin-green .treeview-menu > li > a { |
|||
color: #8aa4af; |
|||
} |
|||
.skin-green .treeview-menu > li.active > a, |
|||
.skin-green .treeview-menu > li > a:hover { |
|||
color: #ffffff; |
|||
} |
|||
.skin-green .sidebar-form { |
|||
border-radius: 3px; |
|||
border: 1px solid #374850; |
|||
margin: 10px 10px; |
|||
} |
|||
.skin-green .sidebar-form input[type="text"], |
|||
.skin-green .sidebar-form .btn { |
|||
box-shadow: none; |
|||
background-color: #374850; |
|||
border: 1px solid transparent; |
|||
height: 35px; |
|||
-webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
-o-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15); |
|||
} |
|||
.skin-green .sidebar-form input[type="text"] { |
|||
color: #666; |
|||
border-top-left-radius: 2px !important; |
|||
border-top-right-radius: 0 !important; |
|||
border-bottom-right-radius: 0 !important; |
|||
border-bottom-left-radius: 2px !important; |
|||
} |
|||
.skin-green .sidebar-form input[type="text"]:focus, |
|||
.skin-green .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
background-color: #fff; |
|||
color: #666; |
|||
} |
|||
.skin-green .sidebar-form input[type="text"]:focus + .input-group-btn .btn { |
|||
border-left-color: #fff; |
|||
} |
|||
.skin-green .sidebar-form .btn { |
|||
color: #999; |
|||
border-top-left-radius: 0 !important; |
|||
border-top-right-radius: 2px !important; |
|||
border-bottom-right-radius: 2px !important; |
|||
border-bottom-left-radius: 0 !important; |
|||
} |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue