Add dark theme, add user database field for theme and update profile form. Create new \App\Customization class that handles all user-customizable values.
This commit is contained in:
parent
8ec0d81e20
commit
91466d298e
|
@ -255,6 +255,10 @@ $di['user'] = function($di) {
|
|||
return NULL;
|
||||
};
|
||||
|
||||
$di['customization'] = function($di) {
|
||||
return new \App\Customization($di);
|
||||
};
|
||||
|
||||
$di['view'] = function($di) {
|
||||
$view = new \App\Mvc\View(APP_INCLUDE_BASE.'/templates');
|
||||
$view->setFileExtension('phtml');
|
||||
|
@ -267,6 +271,7 @@ $di['view'] = function($di) {
|
|||
'url' => $di['url'],
|
||||
'config' => $di['config'],
|
||||
'flash' => $di['flash'],
|
||||
'customization' => $di['customization'],
|
||||
]);
|
||||
|
||||
return $view;
|
||||
|
@ -277,50 +282,14 @@ $cache = $di->get('cache');
|
|||
|
||||
if (!APP_IS_COMMAND_LINE)
|
||||
{
|
||||
/** @var \Entity\User|null $user */
|
||||
$user = $di->get('user');
|
||||
/** @var \App\Customization $customization */
|
||||
$customization = $di->get('customization');
|
||||
|
||||
// Set time zone.
|
||||
if ($user !== null && !empty($user->timezone))
|
||||
date_default_timezone_set($user->timezone);
|
||||
|
||||
/*
|
||||
* Commands:
|
||||
* find /var/azuracast/www -type f \( -name '*.php' -or -name '*.phtml' \) -print > list
|
||||
* xgettext --files-from=list --language=PHP -o /var/azuracast/www/app/locale/default.pot
|
||||
*
|
||||
* find /var/azuracast/www/app/locale -name \*.po -execdir msgfmt default.po -o default.mo \;
|
||||
*/
|
||||
|
||||
$locale = null;
|
||||
$supported_locales = $config->application->locale->supported->toArray();
|
||||
|
||||
// Prefer user-based profile locale.
|
||||
if ($user !== null && !empty($user->locale) && $user->locale !== 'default')
|
||||
{
|
||||
if (isset($supported_locales[$user->locale]))
|
||||
$locale = $user->locale;
|
||||
}
|
||||
|
||||
// Attempt to load from browser headers.
|
||||
if (!$locale)
|
||||
{
|
||||
$browser_locale = Locale::acceptFromHttp($_SERVER['HTTP_ACCEPT_LANGUAGE']);
|
||||
|
||||
foreach($supported_locales as $lang_code => $lang_name)
|
||||
{
|
||||
if (strcmp(substr($browser_locale, 0, 2), substr($lang_code, 0, 2)) == 0)
|
||||
{
|
||||
$locale = $lang_code;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Default to system option.
|
||||
if (!$locale)
|
||||
$locale = $config->application->locale->default;
|
||||
date_default_timezone_set($customization->getTimeZone());
|
||||
|
||||
// Localization
|
||||
$locale = $customization->getLocale();
|
||||
putenv("LANG=".$locale);
|
||||
setlocale(LC_ALL, $locale);
|
||||
|
||||
|
|
|
@ -61,6 +61,14 @@ $config = [
|
|||
],
|
||||
],
|
||||
|
||||
'themes' => [
|
||||
'default' => 'light',
|
||||
'available' => [
|
||||
'light' => 'Light (Default)',
|
||||
'dark' => 'Dark',
|
||||
],
|
||||
],
|
||||
|
||||
/* RESOURCES: Doctrine ORM Layer */
|
||||
'doctrine' => [
|
||||
'autoGenerateProxies' => (APP_APPLICATION_ENV == "development"),
|
||||
|
|
|
@ -0,0 +1,101 @@
|
|||
<?php
|
||||
namespace App;
|
||||
|
||||
use Entity\User;
|
||||
use Interop\Container\ContainerInterface;
|
||||
|
||||
class Customization
|
||||
{
|
||||
/** @var ContainerInterface */
|
||||
protected $di;
|
||||
|
||||
/** @var User|null */
|
||||
protected $user;
|
||||
|
||||
/** @var Config */
|
||||
protected $config;
|
||||
|
||||
public function __construct(ContainerInterface $di)
|
||||
{
|
||||
$this->di = $di;
|
||||
$this->user = $di['user'];
|
||||
$this->config = $di['config'];
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the user's custom time zone or the system default.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function getTimeZone()
|
||||
{
|
||||
if ($this->user !== null && !empty($this->user->timezone))
|
||||
return $this->user->timezone;
|
||||
else
|
||||
return date_default_timezone_get();
|
||||
}
|
||||
|
||||
/*
|
||||
* Locale Commands:
|
||||
* find /var/azuracast/www -type f \( -name '*.php' -or -name '*.phtml' \) -print > list
|
||||
* xgettext --files-from=list --language=PHP -o /var/azuracast/www/app/locale/default.pot
|
||||
*
|
||||
* find /var/azuracast/www/app/locale -name \*.po -execdir msgfmt default.po -o default.mo \;
|
||||
*/
|
||||
|
||||
/**
|
||||
* Return the user-customized, browser-specified or system default locale.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function getLocale()
|
||||
{
|
||||
$locale = null;
|
||||
$supported_locales = $this->config->application->locale->supported->toArray();
|
||||
|
||||
// Prefer user-based profile locale.
|
||||
if ($this->user !== null && !empty($this->user->locale) && $this->user->locale !== 'default')
|
||||
{
|
||||
if (isset($supported_locales[$this->user->locale]))
|
||||
$locale = $this->user->locale;
|
||||
}
|
||||
|
||||
// Attempt to load from browser headers.
|
||||
if (!$locale)
|
||||
{
|
||||
$browser_locale = \Locale::acceptFromHttp($_SERVER['HTTP_ACCEPT_LANGUAGE']);
|
||||
|
||||
foreach($supported_locales as $lang_code => $lang_name)
|
||||
{
|
||||
if (strcmp(substr($browser_locale, 0, 2), substr($lang_code, 0, 2)) == 0)
|
||||
{
|
||||
$locale = $lang_code;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Default to system option.
|
||||
if (!$locale)
|
||||
$locale = $this->config->application->locale->default;
|
||||
|
||||
return $locale;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the user-customized or system default theme.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function getTheme()
|
||||
{
|
||||
if ($this->user !== null && !empty($this->user->theme))
|
||||
{
|
||||
$available_themes = $this->config->application->themes->available->toArray();
|
||||
if (isset($available_themes[$this->user->theme]))
|
||||
return $this->user->theme;
|
||||
}
|
||||
|
||||
return $this->config->application->themes->default;
|
||||
}
|
||||
}
|
|
@ -77,6 +77,9 @@ class User extends \App\Doctrine\Entity
|
|||
/** @Column(name="locale", type="string", length=25, nullable=true) */
|
||||
protected $locale;
|
||||
|
||||
/** @Column(name="theme", type="string", length=25, nullable=true) */
|
||||
protected $theme;
|
||||
|
||||
/** @Column(name="created_at", type="integer") */
|
||||
protected $created_at;
|
||||
|
||||
|
|
|
@ -0,0 +1,34 @@
|
|||
<?php
|
||||
|
||||
namespace Migration;
|
||||
|
||||
use Doctrine\DBAL\Migrations\AbstractMigration;
|
||||
use Doctrine\DBAL\Schema\Schema;
|
||||
|
||||
/**
|
||||
* Auto-generated Migration: Please modify to your needs!
|
||||
*/
|
||||
class Version20161007021719 extends AbstractMigration
|
||||
{
|
||||
/**
|
||||
* @param Schema $schema
|
||||
*/
|
||||
public function up(Schema $schema)
|
||||
{
|
||||
// this up() migration is auto-generated, please modify it to your needs
|
||||
$this->abortIf($this->connection->getDatabasePlatform()->getName() != 'mysql', 'Migration can only be executed safely on \'mysql\'.');
|
||||
|
||||
$this->addSql('ALTER TABLE users ADD theme VARCHAR(25) DEFAULT NULL');
|
||||
}
|
||||
|
||||
/**
|
||||
* @param Schema $schema
|
||||
*/
|
||||
public function down(Schema $schema)
|
||||
{
|
||||
// this down() migration is auto-generated, please modify it to your needs
|
||||
$this->abortIf($this->connection->getDatabasePlatform()->getName() != 'mysql', 'Migration can only be executed safely on \'mysql\'.');
|
||||
|
||||
$this->addSql('ALTER TABLE users DROP theme');
|
||||
}
|
||||
}
|
|
@ -55,6 +55,12 @@ return [
|
|||
'default' => 'default',
|
||||
]],
|
||||
|
||||
'theme' => ['radio', [
|
||||
'label' => _('Site Theme'),
|
||||
'options' => $config->application->themes->available->toArray(),
|
||||
'default' => $config->application->themes->default,
|
||||
]],
|
||||
|
||||
],
|
||||
],
|
||||
|
||||
|
|
|
@ -5,6 +5,10 @@
|
|||
<script type="text/javascript" src="//code.highcharts.com/highcharts-more.js"></script>
|
||||
<script type="text/javascript" src="//code.highcharts.com/modules/exporting.js"></script>
|
||||
|
||||
<?php if ($customization->getTheme() == 'dark'): ?>
|
||||
<script type="text/javascript" src="<?=$url->content('js/highcharts/dark-blue.js') ?>"></script>
|
||||
<?php endif; ?>
|
||||
|
||||
<script type="text/javascript" src="<?=$url->content('vendors/bower_components/jPlayer/dist/jplayer/jquery.jplayer.min.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('vendors/bower_components/store-js/store.min.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('js/radio.js') ?>"></script>
|
||||
|
|
|
@ -4,6 +4,10 @@
|
|||
<script type="text/javascript" src="//code.highcharts.com/highcharts.js"></script>
|
||||
<script type="text/javascript" src="//code.highcharts.com/highcharts-more.js"></script>
|
||||
<script type="text/javascript" src="//code.highcharts.com/modules/exporting.js"></script>
|
||||
|
||||
<?php if ($customization->getTheme() == 'dark'): ?>
|
||||
<script type="text/javascript" src="<?=$url->content('js/highcharts/dark-blue.js') ?>"></script>
|
||||
<?php endif; ?>
|
||||
<?php $this->stop('custom_js') ?>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
|
|
@ -24,7 +24,7 @@ if (APP_APPLICATION_ENV != "production")
|
|||
<link rel="stylesheet" type="text/css" href="<?=$url->content('vendors/bower_components/components-font-awesome/css/font-awesome.min.css') ?>">
|
||||
<link rel="stylesheet" type="text/css" href="<?=$url->content('vendors/bower_components/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.min.css') ?>">
|
||||
<link rel="stylesheet" type="text/css" href="<?=$url->content('vendors/bootgrid/jquery.bootgrid.min.css') ?>">
|
||||
<link rel="stylesheet" type="text/css" href="<?=$url->content('css/app.css') ?>">
|
||||
<link rel="stylesheet" type="text/css" href="<?=$url->content('css/'.$customization->getTheme().'.css') ?>">
|
||||
|
||||
<?=$this->section('custom_css') ?>
|
||||
|
||||
|
@ -37,11 +37,11 @@ var APP_BaseUrl = '<?=$url->named('home') ?>';
|
|||
var APP_ContentPath = '<?=$url->content('') ?>';
|
||||
</script>
|
||||
</head>
|
||||
<body class="<?=$page_class ?> <?php if (!empty($station)): ?>toggled sw-toggled<?php endif; ?>">
|
||||
<header id="header" class="clearfix" data-current-skin="blue" style="background-image: url('<?=$url->content('img/header_bg.png') ?>');" data-rjs="3">
|
||||
<ul class="header-inner">
|
||||
<body class="<?=$page_class ?>">
|
||||
<header id="header" class="clearfix" data-ma-theme="blue" style="background-image: url('<?=$url->content('img/header_bg.png') ?>');" data-rjs="3">
|
||||
<ul class="h-inner">
|
||||
<?php if (!empty($station)): ?>
|
||||
<li id="menu-trigger" data-trigger="#sidebar">
|
||||
<li class="hi-trigger ma-trigger" data-ma-action="sidebar-open" data-ma-target="#sidebar">
|
||||
<div class="line-wrap">
|
||||
<div class="line top"></div>
|
||||
<div class="line center"></div>
|
||||
|
@ -57,7 +57,7 @@ var APP_ContentPath = '<?=$url->content('') ?>';
|
|||
</li>
|
||||
|
||||
<li class="pull-right">
|
||||
<ul class="top-menu">
|
||||
<ul class="hi-menu">
|
||||
<!--
|
||||
<li id="top-search">
|
||||
<a href=""><i class="tm-icon zmdi zmdi-search"></i></a>
|
||||
|
@ -65,7 +65,7 @@ var APP_ContentPath = '<?=$url->content('') ?>';
|
|||
-->
|
||||
|
||||
<li class="dropdown" id="radio-player-controls">
|
||||
<a data-toggle="dropdown" href=""><i class="tm-icon zmdi zmdi-radio"></i></a>
|
||||
<a data-toggle="dropdown" href=""><i class="him-icon zmdi zmdi-radio"></i></a>
|
||||
<ul class="dropdown-menu dm-icon pull-right">
|
||||
<li>
|
||||
<a href="javascript:;" class="jp-pause"><i class="zmdi zmdi-pause"></i> <?=_('Pause') ?></a>
|
||||
|
@ -88,7 +88,7 @@ var APP_ContentPath = '<?=$url->content('') ?>';
|
|||
</li>
|
||||
|
||||
<li class="dropdown">
|
||||
<a data-toggle="dropdown" href=""><i class="tm-icon zmdi zmdi-more-vert"></i></a>
|
||||
<a data-toggle="dropdown" href=""><i class="him-icon zmdi zmdi-more-vert"></i></a>
|
||||
<ul class="dropdown-menu dm-icon pull-right">
|
||||
<? if ($acl->isAllowed('view administration')): ?>
|
||||
<li><a href="<?=$url->named('admin:index:index') ?>"><i class="fa fa-cog"></i> <?=_('System Administration') ?></a></li>
|
||||
|
@ -121,7 +121,7 @@ var APP_ContentPath = '<?=$url->content('') ?>';
|
|||
</aside>
|
||||
<?php endif; ?>
|
||||
|
||||
<section id="content">
|
||||
<section id="content" <?php if (empty($station)): ?>class="content-alt"<?php endif; ?>>
|
||||
<div class="container">
|
||||
<?php if ($manual): ?>
|
||||
<?=$this->section('content') ?>
|
||||
|
@ -168,8 +168,7 @@ var APP_ContentPath = '<?=$url->content('') ?>';
|
|||
<script type="text/javascript" src="<?=$url->content('vendors/bower_components/autosize/dist/autosize.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('vendors/bootgrid/jquery.bootgrid.updated.js') ?>"></script>
|
||||
|
||||
<script type="text/javascript" src="<?=$url->content('js/functions.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('js/app.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('js/app.min.js') ?>"></script>
|
||||
|
||||
<? if ($flash->hasMessages()): ?>
|
||||
<script type="text/javascript">
|
||||
|
|
|
@ -42,8 +42,7 @@ if (APP_APPLICATION_ENV != "production")
|
|||
|
||||
<script type="text/javascript" src="<?=$url->content('vendors/bower_components/Waves/dist/waves.min.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('vendors/bootstrap-growl/bootstrap-growl.min.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('js/functions.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('js/app.js') ?>"></script>
|
||||
<script type="text/javascript" src="<?=$url->content('js/app.min.js') ?>"></script>
|
||||
|
||||
<? if ($flash->hasMessages()): ?>
|
||||
<script type="text/javascript">
|
||||
|
|
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
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
|
@ -9,16 +9,35 @@ module.exports = function(grunt) {
|
|||
paths: ["/var/azuracast/www/web/static/css"],
|
||||
compress: true,
|
||||
sourceMap: true,
|
||||
sourceMapURL: '/static/css/app.css.map',
|
||||
sourceMapBasepath: '/var/azuracast/www/web',
|
||||
sourceMapRootpath: '/'
|
||||
sourceMapRootpath: '/',
|
||||
sourceMapBasepath: function (f) {
|
||||
this.sourceMapURL = this.sourceMapFilename.substr(this.sourceMapFilename.lastIndexOf('/') + 1);
|
||||
return "wwwroot/";
|
||||
}
|
||||
},
|
||||
files: {
|
||||
"/var/azuracast/www/web/static/css/app.css": "/var/azuracast/www/web/static/less/app.less",
|
||||
"/var/azuracast/www/web/static/css/light.css": "/var/azuracast/www/web/static/less/light.less",
|
||||
"/var/azuracast/www/web/static/css/dark.css": "/var/azuracast/www/web/static/less/dark.less"
|
||||
},
|
||||
cleancss: true
|
||||
}
|
||||
},
|
||||
concat: {
|
||||
dist: {
|
||||
src: ['/var/azuracast/www/web/static/js/inc/**/*.js'],
|
||||
dest: '/var/azuracast/www/web/static/js/app.js'
|
||||
}
|
||||
},
|
||||
uglify: {
|
||||
options: {
|
||||
mangle: false
|
||||
},
|
||||
my_target: {
|
||||
files: {
|
||||
'/var/azuracast/www/web/static/js/app.min.js': ['/var/azuracast/www/web/static/js/app.js']
|
||||
}
|
||||
}
|
||||
},
|
||||
csssplit: {
|
||||
your_target: {
|
||||
src: ['/var/azuracast/www/web/static/css/app.css'],
|
||||
|
@ -30,14 +49,18 @@ module.exports = function(grunt) {
|
|||
}
|
||||
},
|
||||
watch: {
|
||||
//styles: {
|
||||
less: {
|
||||
files: ['/var/azuracast/www/web/static/less/**/*.less'], // which files to watch
|
||||
tasks: ['less'],
|
||||
options: {
|
||||
nospawn: true,
|
||||
livereload: 8122,
|
||||
livereload: 8122
|
||||
}
|
||||
//}
|
||||
},
|
||||
js: {
|
||||
files: ['/var/azuracast/www/web/static/js/inc/**/*.js'], // which files to watch
|
||||
tasks: ['concat', 'uglify']
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -46,8 +69,10 @@ module.exports = function(grunt) {
|
|||
grunt.loadNpmTasks('grunt-csssplit');
|
||||
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||
grunt.loadNpmTasks('grunt-contrib-uglify');
|
||||
grunt.loadNpmTasks('grunt-contrib-concat');
|
||||
|
||||
// Default task(s).
|
||||
grunt.registerTask('default', ['less']);
|
||||
grunt.registerTask('default', ['less', 'concat', 'uglify']);
|
||||
grunt.registerTask('js', ['concat', 'uglify']);
|
||||
|
||||
};
|
1402
web/static/js/app.js
1402
web/static/js/app.js
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
@ -5,9 +5,9 @@
|
|||
|
||||
Highcharts.theme = {
|
||||
chart: {
|
||||
backgroundColor: 'rgba(51, 51, 51, 0)',
|
||||
backgroundColor: '#2b343a',
|
||||
className: 'dark-container',
|
||||
plotBackgroundColor: 'rgba(51, 51, 51, 0)',
|
||||
plotBackgroundColor: '#2b343a',
|
||||
plotBorderColor: '#888888',
|
||||
plotBorderWidth: 1
|
||||
},
|
||||
|
|
|
@ -0,0 +1,243 @@
|
|||
$(document).ready(function () {
|
||||
$('body').on('click', '[data-ma-action]', function (e) {
|
||||
e.preventDefault();
|
||||
|
||||
var $this = $(this);
|
||||
var action = $(this).data('ma-action');
|
||||
|
||||
switch (action) {
|
||||
|
||||
/*-------------------------------------------
|
||||
Sidebar & Chat Open/Close
|
||||
---------------------------------------------*/
|
||||
case 'sidebar-open':
|
||||
var target = $this.data('ma-target');
|
||||
var backdrop = '<div data-ma-action="sidebar-close" class="ma-backdrop" />';
|
||||
|
||||
$('body').addClass('sidebar-toggled');
|
||||
$('#header, #header-alt, #main').append(backdrop);
|
||||
$this.addClass('toggled');
|
||||
$(target).addClass('toggled');
|
||||
|
||||
break;
|
||||
|
||||
case 'sidebar-close':
|
||||
$('body').removeClass('sidebar-toggled');
|
||||
$('.ma-backdrop').remove();
|
||||
$('.sidebar, .ma-trigger').removeClass('toggled')
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Mainmenu Submenu Toggle
|
||||
---------------------------------------------*/
|
||||
case 'submenu-toggle':
|
||||
$this.next().slideToggle(200);
|
||||
$this.parent().toggleClass('toggled');
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Top Search Open/Close
|
||||
---------------------------------------------*/
|
||||
//Open
|
||||
case 'search-open':
|
||||
$('#header').addClass('search-toggled');
|
||||
$('#top-search-wrap input').focus();
|
||||
|
||||
break;
|
||||
|
||||
//Close
|
||||
case 'search-close':
|
||||
$('#header').removeClass('search-toggled');
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Header Notification Clear
|
||||
---------------------------------------------*/
|
||||
case 'clear-notification':
|
||||
var x = $this.closest('.list-group');
|
||||
var y = x.find('.list-group-item');
|
||||
var z = y.size();
|
||||
|
||||
$this.parent().fadeOut();
|
||||
|
||||
x.find('.list-group').prepend('<i class="grid-loading hide-it"></i>');
|
||||
x.find('.grid-loading').fadeIn(1500);
|
||||
|
||||
|
||||
var w = 0;
|
||||
y.each(function(){
|
||||
var z = $(this);
|
||||
setTimeout(function(){
|
||||
z.addClass('animated fadeOutRightBig').delay(1000).queue(function(){
|
||||
z.remove();
|
||||
});
|
||||
}, w+=150);
|
||||
})
|
||||
|
||||
//Popup empty message
|
||||
setTimeout(function(){
|
||||
$('#notifications').addClass('empty');
|
||||
}, (z*150)+200);
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Fullscreen Browsing
|
||||
---------------------------------------------*/
|
||||
case 'fullscreen':
|
||||
//Launch
|
||||
function launchIntoFullscreen(element) {
|
||||
if(element.requestFullscreen) {
|
||||
element.requestFullscreen();
|
||||
} else if(element.mozRequestFullScreen) {
|
||||
element.mozRequestFullScreen();
|
||||
} else if(element.webkitRequestFullscreen) {
|
||||
element.webkitRequestFullscreen();
|
||||
} else if(element.msRequestFullscreen) {
|
||||
element.msRequestFullscreen();
|
||||
}
|
||||
}
|
||||
|
||||
//Exit
|
||||
function exitFullscreen() {
|
||||
|
||||
if(document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if(document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
} else if(document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
}
|
||||
}
|
||||
|
||||
launchIntoFullscreen(document.documentElement);
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Clear Local Storage
|
||||
---------------------------------------------*/
|
||||
case 'clear-localstorage':
|
||||
swal({
|
||||
title: "Are you sure?",
|
||||
text: "All your saved localStorage values will be removed",
|
||||
type: "warning",
|
||||
showCancelButton: true,
|
||||
confirmButtonText: "Yes, delete it!",
|
||||
closeOnConfirm: false
|
||||
}, function(){
|
||||
localStorage.clear();
|
||||
swal("Done!", "localStorage is cleared", "success");
|
||||
});
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Print
|
||||
---------------------------------------------*/
|
||||
case 'print':
|
||||
|
||||
window.print();
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Login Window Switch
|
||||
---------------------------------------------*/
|
||||
case 'login-switch':
|
||||
var loginblock = $this.data('ma-block');
|
||||
var loginParent = $this.closest('.lc-block');
|
||||
|
||||
loginParent.removeClass('toggled');
|
||||
|
||||
setTimeout(function(){
|
||||
$(loginblock).addClass('toggled');
|
||||
});
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Profile Edit/Edit Cancel
|
||||
---------------------------------------------*/
|
||||
//Edit
|
||||
case 'profile-edit':
|
||||
$this.closest('.pmb-block').toggleClass('toggled');
|
||||
|
||||
break;
|
||||
|
||||
case 'profile-edit-cancel':
|
||||
$(this).closest('.pmb-block').removeClass('toggled');
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Action Header Open/Close
|
||||
---------------------------------------------*/
|
||||
//Open
|
||||
case 'action-header-open':
|
||||
ahParent = $this.closest('.action-header').find('.ah-search');
|
||||
|
||||
ahParent.fadeIn(300);
|
||||
ahParent.find('.ahs-input').focus();
|
||||
|
||||
break;
|
||||
|
||||
//Close
|
||||
case 'action-header-close':
|
||||
ahParent.fadeOut(300);
|
||||
setTimeout(function(){
|
||||
ahParent.find('.ahs-input').val('');
|
||||
}, 350);
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Wall Comment Open/Close
|
||||
---------------------------------------------*/
|
||||
//Open
|
||||
case 'wall-comment-open':
|
||||
if(!($this).closest('.wic-form').hasClass('toggled')) {
|
||||
$this.closest('.wic-form').addClass('toggled');
|
||||
}
|
||||
|
||||
break;
|
||||
|
||||
//Close
|
||||
case 'wall-comment-close':
|
||||
$this.closest('.wic-form').find('textarea').val('');
|
||||
$this.closest('.wic-form').removeClass('toggled');
|
||||
|
||||
break;
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Todo Form Open/Close
|
||||
---------------------------------------------*/
|
||||
//Open
|
||||
case 'todo-form-open':
|
||||
$this.closest('.t-add').addClass('toggled');
|
||||
|
||||
break;
|
||||
|
||||
//Close
|
||||
case 'todo-form-close':
|
||||
$this.closest('.t-add').removeClass('toggled');
|
||||
$this.closest('.t-add').find('textarea').val('');
|
||||
|
||||
break;
|
||||
}
|
||||
});
|
||||
});
|
|
@ -0,0 +1,101 @@
|
|||
$(document).ready(function () {
|
||||
/*-------------------------------------------
|
||||
Sparkline
|
||||
---------------------------------------------*/
|
||||
function sparklineBar(id, values, height, barWidth, barColor, barSpacing) {
|
||||
$('.'+id).sparkline(values, {
|
||||
type: 'bar',
|
||||
height: height,
|
||||
barWidth: barWidth,
|
||||
barColor: barColor,
|
||||
barSpacing: barSpacing
|
||||
})
|
||||
}
|
||||
|
||||
function sparklineLine(id, values, width, height, lineColor, fillColor, lineWidth, maxSpotColor, minSpotColor, spotColor, spotRadius, hSpotColor, hLineColor) {
|
||||
$('.'+id).sparkline(values, {
|
||||
type: 'line',
|
||||
width: width,
|
||||
height: height,
|
||||
lineColor: lineColor,
|
||||
fillColor: fillColor,
|
||||
lineWidth: lineWidth,
|
||||
maxSpotColor: maxSpotColor,
|
||||
minSpotColor: minSpotColor,
|
||||
spotColor: spotColor,
|
||||
spotRadius: spotRadius,
|
||||
highlightSpotColor: hSpotColor,
|
||||
highlightLineColor: hLineColor
|
||||
});
|
||||
}
|
||||
|
||||
function sparklinePie(id, values, width, height, sliceColors) {
|
||||
$('.'+id).sparkline(values, {
|
||||
type: 'pie',
|
||||
width: width,
|
||||
height: height,
|
||||
sliceColors: sliceColors,
|
||||
offset: 0,
|
||||
borderWidth: 0
|
||||
});
|
||||
}
|
||||
|
||||
// Mini Chart - Bar Chart 1
|
||||
if ($('.stats-bar')[0]) {
|
||||
sparklineBar('stats-bar', [6,4,8,6,5,6,7,8,3,5,9,5,8,4], '35px', 3, '#d6d8d9', 2);
|
||||
}
|
||||
|
||||
// Mini Chart - Bar Chart 2
|
||||
if ($('.stats-bar-2')[0]) {
|
||||
sparklineBar('stats-bar-2', [4,7,6,2,5,3,8,6,6,4,8,6,5,8], '35px', 3, '#d6d8d9', 2);
|
||||
}
|
||||
|
||||
// Mini Chart - Line Chart 1
|
||||
if ($('.stats-line')[0]) {
|
||||
sparklineLine('stats-line', [9,4,6,5,6,4,5,7,9,3,6,5], 68, 35, '#fff', 'rgba(0,0,0,0)', 1.25, '#d6d8d9', '#d6d8d9', '#d6d8d9', 3, '#fff', '#d6d8d9');
|
||||
}
|
||||
|
||||
// Mini Chart - Line Chart 2
|
||||
if ($('.stats-line-2')[0]) {
|
||||
sparklineLine('stats-line-2', [5,6,3,9,7,5,4,6,5,6,4,9], 68, 35, '#fff', 'rgba(0,0,0,0)', 1.25, '#d6d8d9', '#d6d8d9', '#d6d8d9', 3, '#fff', '#d6d8d9');
|
||||
}
|
||||
|
||||
// Mini Chart - Pie Chart 1
|
||||
if ($('.stats-pie')[0]) {
|
||||
sparklinePie('stats-pie', [20, 35, 30, 5], 45, 45, ['#fff', 'rgba(255,255,255,0.7)', 'rgba(255,255,255,0.4)', 'rgba(255,255,255,0.2)']);
|
||||
}
|
||||
|
||||
// Dash Widget Line Chart
|
||||
if ($('.dash-widget-visits')[0]) {
|
||||
sparklineLine('dash-widget-visits', [9,4,6,5,6,4,5,7,9,3,6,5], '100%', '70px', 'rgba(255,255,255,0.7)', 'rgba(0,0,0,0)', 1, 'rgba(255,255,255,0.4)', 'rgba(255,255,255,0.4)', 'rgba(255,255,255,0.4)', 5, 'rgba(255,255,255,0.4)', '#fff');
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------------------------
|
||||
Easy Pie Charts
|
||||
---------------------------------------------*/
|
||||
function easyPieChart(id, trackColor, scaleColor, barColor, lineWidth, lineCap, size) {
|
||||
$('.'+id).easyPieChart({
|
||||
trackColor: trackColor,
|
||||
scaleColor: scaleColor,
|
||||
barColor: barColor,
|
||||
lineWidth: lineWidth,
|
||||
lineCap: lineCap,
|
||||
size: size
|
||||
});
|
||||
}
|
||||
|
||||
// Main Pie Chart
|
||||
if ($('.main-pie')[0]) {
|
||||
easyPieChart('main-pie', 'rgba(0,0,0,0.2)', 'rgba(255,255,255,0)', 'rgba(255,255,255,0.7)', 2, 'butt', 148);
|
||||
}
|
||||
|
||||
// Others
|
||||
if ($('.sub-pie-1')[0]) {
|
||||
easyPieChart('sub-pie-1', 'rgba(0,0,0,0.2)', 'rgba(255,255,255,0)', 'rgba(255,255,255,0.7)', 2, 'butt', 95);
|
||||
}
|
||||
|
||||
if ($('.sub-pie-2')[0]) {
|
||||
easyPieChart('sub-pie-2', 'rgba(0,0,0,0.2)', 'rgba(255,255,255,0)', 'rgba(255,255,255,0.7)', 2, 'butt', 95);
|
||||
}
|
||||
});
|
|
@ -0,0 +1,103 @@
|
|||
$(document).ready(function(){
|
||||
|
||||
|
||||
/*----------------------------------------------
|
||||
Make some random data for Flot Line Chart
|
||||
----------------------------------------------*/
|
||||
var data1 = [[1,60], [2,30], [3,50], [4,100], [5,10], [6,90], [7,85]];
|
||||
var data2 = [[1,20], [2,90], [3,60], [4,40], [5,100], [6,25], [7,65]];
|
||||
var data3 = [[1,100], [2,20], [3,60], [4,90], [5,80], [6,10], [7,5]];
|
||||
|
||||
// Create an Array push the data + Draw the bars
|
||||
|
||||
var barData = [
|
||||
{
|
||||
label: 'Tokyo',
|
||||
data: data1,
|
||||
color: '#dbdddd'
|
||||
},
|
||||
{
|
||||
label: 'Seoul',
|
||||
data: data2,
|
||||
color: '#636c72'
|
||||
},
|
||||
{
|
||||
label: 'Beijing',
|
||||
data: data3,
|
||||
color: '#3e4a51'
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Let's create the chart
|
||||
---------------------------------*/
|
||||
if ($('#bar-chart')[0]) {
|
||||
$.plot($("#bar-chart"), barData, {
|
||||
series: {
|
||||
bars: {
|
||||
show: true,
|
||||
barWidth: 0.05,
|
||||
order: 1,
|
||||
fill: 1
|
||||
}
|
||||
},
|
||||
grid : {
|
||||
borderWidth: 1,
|
||||
borderColor: '#333c42',
|
||||
show : true,
|
||||
hoverable : true,
|
||||
clickable : true
|
||||
},
|
||||
|
||||
yaxis: {
|
||||
tickColor: '#333c42',
|
||||
tickDecimals: 0,
|
||||
font :{
|
||||
lineHeight: 13,
|
||||
style: "normal",
|
||||
color: "#9f9f9f",
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
|
||||
xaxis: {
|
||||
tickColor: '#333c42',
|
||||
tickDecimals: 0,
|
||||
font :{
|
||||
lineHeight: 13,
|
||||
style: "normal",
|
||||
color: "#9f9f9f"
|
||||
},
|
||||
shadowSize: 0
|
||||
},
|
||||
|
||||
legend:{
|
||||
container: '.flc-bar',
|
||||
backgroundOpacity: 0.5,
|
||||
noColumns: 0,
|
||||
backgroundColor: "white",
|
||||
lineWidth: 0
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Tooltips for Flot Charts
|
||||
---------------------------------*/
|
||||
if ($(".flot-chart")[0]) {
|
||||
$(".flot-chart").bind("plothover", function (event, pos, item) {
|
||||
if (item) {
|
||||
var x = item.datapoint[0].toFixed(2),
|
||||
y = item.datapoint[1].toFixed(2);
|
||||
$(".flot-tooltip").html(item.series.label + " of " + x + " = " + y).css({top: item.pageY+5, left: item.pageX+5}).show();
|
||||
}
|
||||
else {
|
||||
$(".flot-tooltip").hide();
|
||||
}
|
||||
});
|
||||
|
||||
$("<div class='flot-tooltip' class='chart-tooltip'></div>").appendTo("body");
|
||||
}
|
||||
});
|
|
@ -0,0 +1,88 @@
|
|||
$(document).ready(function(){
|
||||
|
||||
/*-----------------------------------------
|
||||
Make some random data for the Chart
|
||||
-----------------------------------------*/
|
||||
var d1 = [];
|
||||
for (var i = 0; i <= 10; i += 1) {
|
||||
d1.push([i, parseInt(Math.random() * 30)]);
|
||||
}
|
||||
var d2 = [];
|
||||
for (var i = 0; i <= 20; i += 1) {
|
||||
d2.push([i, parseInt(Math.random() * 30)]);
|
||||
}
|
||||
var d3 = [];
|
||||
for (var i = 0; i <= 10; i += 1) {
|
||||
d3.push([i, parseInt(Math.random() * 30)]);
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Chart Options
|
||||
---------------------------------*/
|
||||
var options = {
|
||||
series: {
|
||||
shadowSize: 0,
|
||||
curvedLines: { //This is a third party plugin to make curved lines
|
||||
apply: true,
|
||||
active: true,
|
||||
monotonicFit: true
|
||||
},
|
||||
lines: {
|
||||
show: false,
|
||||
lineWidth: 0,
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
borderWidth: 0,
|
||||
labelMargin:10,
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
mouseActiveRadius:6,
|
||||
|
||||
},
|
||||
xaxis: {
|
||||
tickDecimals: 0,
|
||||
ticks: false
|
||||
},
|
||||
|
||||
yaxis: {
|
||||
tickDecimals: 0,
|
||||
ticks: false
|
||||
},
|
||||
|
||||
legend: {
|
||||
show: false
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Let's create the chart
|
||||
---------------------------------*/
|
||||
if ($("#curved-line-chart")[0]) {
|
||||
$.plot($("#curved-line-chart"), [
|
||||
{data: d1, lines: { show: true, fill: 0.98 }, label: 'Product 1', stack: true, color: '#1f292f' },
|
||||
{data: d3, lines: { show: true, fill: 0.98 }, label: 'Product 2', stack: true, color: '#dbdddd' }
|
||||
], options);
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Tooltips for Flot Charts
|
||||
---------------------------------*/
|
||||
if ($(".flot-chart")[0]) {
|
||||
$(".flot-chart").bind("plothover", function (event, pos, item) {
|
||||
if (item) {
|
||||
var x = item.datapoint[0].toFixed(2),
|
||||
y = item.datapoint[1].toFixed(2);
|
||||
$(".flot-tooltip").html(item.series.label + " of " + x + " = " + y).css({top: item.pageY+5, left: item.pageX+5}).show();
|
||||
}
|
||||
else {
|
||||
$(".flot-tooltip").hide();
|
||||
}
|
||||
});
|
||||
|
||||
$("<div class='flot-tooltip' class='chart-tooltip'></div>").appendTo("body");
|
||||
}
|
||||
});
|
|
@ -0,0 +1,107 @@
|
|||
$(document).ready(function(){
|
||||
|
||||
/*---------------------------------
|
||||
Make some random data
|
||||
---------------------------------*/
|
||||
var data = [];
|
||||
var totalPoints = 300;
|
||||
var updateInterval = 30;
|
||||
|
||||
function getRandomData() {
|
||||
if (data.length > 0)
|
||||
data = data.slice(1);
|
||||
|
||||
while (data.length < totalPoints) {
|
||||
|
||||
var prev = data.length > 0 ? data[data.length - 1] : 50,
|
||||
y = prev + Math.random() * 10 - 5;
|
||||
if (y < 0) {
|
||||
y = 0;
|
||||
} else if (y > 90) {
|
||||
y = 90;
|
||||
}
|
||||
|
||||
data.push(y);
|
||||
}
|
||||
|
||||
var res = [];
|
||||
for (var i = 0; i < data.length; ++i) {
|
||||
res.push([i, data[i]])
|
||||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Create Chart
|
||||
---------------------------------*/
|
||||
if ($('#dynamic-chart')[0]) {
|
||||
var plot = $.plot("#dynamic-chart", [ getRandomData() ], {
|
||||
series: {
|
||||
label: "Server Process Data",
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 0.2,
|
||||
fill: 0.6
|
||||
},
|
||||
|
||||
color: '#fff',
|
||||
shadowSize: 0,
|
||||
},
|
||||
yaxis: {
|
||||
min: 0,
|
||||
max: 100,
|
||||
tickColor: '#333c42',
|
||||
font :{
|
||||
lineHeight: 13,
|
||||
style: "normal",
|
||||
color: "#9f9f9f",
|
||||
},
|
||||
shadowSize: 0,
|
||||
|
||||
},
|
||||
xaxis: {
|
||||
tickColor: '#333c42',
|
||||
show: true,
|
||||
font :{
|
||||
lineHeight: 13,
|
||||
style: "normal",
|
||||
color: "#9f9f9f",
|
||||
},
|
||||
shadowSize: 0,
|
||||
min: 0,
|
||||
max: 250
|
||||
},
|
||||
grid: {
|
||||
borderWidth: 1,
|
||||
borderColor: '#333c42',
|
||||
labelMargin:10,
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
mouseActiveRadius:6,
|
||||
},
|
||||
legend:{
|
||||
container: '.flc-dynamic',
|
||||
backgroundOpacity: 0.5,
|
||||
noColumns: 0,
|
||||
backgroundColor: "white",
|
||||
lineWidth: 0
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Update
|
||||
---------------------------------*/
|
||||
function update() {
|
||||
plot.setData([getRandomData()]);
|
||||
// Since the axes don't change, we don't need to call plot.setupGrid()
|
||||
|
||||
plot.draw();
|
||||
setTimeout(update, updateInterval);
|
||||
}
|
||||
update();
|
||||
}
|
||||
});
|
|
@ -0,0 +1,123 @@
|
|||
$(document).ready(function(){
|
||||
|
||||
/*---------------------------------------------------
|
||||
Make some random data for Recent Items chart
|
||||
---------------------------------------------------*/
|
||||
var data = [];
|
||||
var totalPoints = 100;
|
||||
|
||||
function getRandomData() {
|
||||
if (data.length > 0)
|
||||
data = data.slice(1);
|
||||
|
||||
while (data.length < totalPoints) {
|
||||
|
||||
var prev = data.length > 0 ? data[data.length - 1] : 50,
|
||||
y = prev + Math.random() * 10 - 5;
|
||||
if (y < 0) {
|
||||
y = 0;
|
||||
} else if (y > 90) {
|
||||
y = 90;
|
||||
}
|
||||
|
||||
data.push(y);
|
||||
}
|
||||
|
||||
var res = [];
|
||||
for (var i = 0; i < data.length; ++i) {
|
||||
res.push([i, data[i]])
|
||||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
/*---------------------------------------------------
|
||||
Make some random data for Flot Line Chart
|
||||
---------------------------------------------------*/
|
||||
var d1 = [];
|
||||
for (var i = 0; i <= 10; i += 1) {
|
||||
d1.push([i, parseInt(Math.random() * 30)]);
|
||||
}
|
||||
var d2 = [];
|
||||
for (var i = 0; i <= 20; i += 1) {
|
||||
d2.push([i, parseInt(Math.random() * 30)]);
|
||||
}
|
||||
var d3 = [];
|
||||
for (var i = 0; i <= 10; i += 1) {
|
||||
d3.push([i, parseInt(Math.random() * 30)]);
|
||||
}
|
||||
|
||||
/*---------------------------------
|
||||
Chart Options
|
||||
---------------------------------*/
|
||||
var options = {
|
||||
series: {
|
||||
shadowSize: 0,
|
||||
lines: {
|
||||
show: false,
|
||||
lineWidth: 0,
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
borderWidth: 0,
|
||||
labelMargin:10,
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
mouseActiveRadius:6,
|
||||
|
||||
},
|
||||
xaxis: {
|
||||
tickDecimals: 0,
|
||||
ticks: false
|
||||
},
|
||||
|
||||
yaxis: {
|
||||
tickDecimals: 0,
|
||||
ticks: false
|
||||
},
|
||||
|
||||
legend: {
|
||||
show: false
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Regular Line Chart
|
||||
---------------------------------*/
|
||||
if ($("#line-chart")[0]) {
|
||||
$.plot($("#line-chart"), [
|
||||
{data: d1, lines: { show: true, fill: 0.98 }, label: 'Product 1', stack: true, color: '#1f292f' },
|
||||
{data: d3, lines: { show: true, fill: 0.98 }, label: 'Product 2', stack: true, color: '#dbdddd' }
|
||||
], options);
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Recent Items Table Chart
|
||||
---------------------------------*/
|
||||
if ($("#recent-items-chart")[0]) {
|
||||
$.plot($("#recent-items-chart"), [
|
||||
{data: getRandomData(), lines: { show: true, fill: 0.1 }, label: 'Items', stack: true, color: '#dbdddd' },
|
||||
], options);
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Tooltips for Flot Charts
|
||||
---------------------------------*/
|
||||
if ($(".flot-chart")[0]) {
|
||||
$(".flot-chart").bind("plothover", function (event, pos, item) {
|
||||
if (item) {
|
||||
var x = item.datapoint[0].toFixed(2),
|
||||
y = item.datapoint[1].toFixed(2);
|
||||
$(".flot-tooltip").html(item.series.label + " of " + x + " = " + y).css({top: item.pageY+5, left: item.pageX+5}).show();
|
||||
}
|
||||
else {
|
||||
$(".flot-tooltip").hide();
|
||||
}
|
||||
});
|
||||
|
||||
$("<div class='flot-tooltip' class='chart-tooltip'></div>").appendTo("body");
|
||||
}
|
||||
});
|
|
@ -0,0 +1,88 @@
|
|||
$(document).ready(function(){
|
||||
var pieData = [
|
||||
{data: 1, color: '#dbdddd', label: 'Toyota'},
|
||||
{data: 2, color: '#636c72', label: 'Nissan'},
|
||||
{data: 3, color: '#3e4a51', label: 'Hyundai'},
|
||||
{data: 4, color: '#1f292f', label: 'Scion'},
|
||||
{data: 4, color: '#ffffff', label: 'Daihatsu'},
|
||||
]
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Pie Chart
|
||||
---------------------------------*/
|
||||
if($('#pie-chart')[0]){
|
||||
$.plot('#pie-chart', pieData, {
|
||||
series: {
|
||||
pie: {
|
||||
show: true,
|
||||
stroke: {
|
||||
width: 0,
|
||||
},
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
container: '.flc-pie',
|
||||
backgroundOpacity: 0.5,
|
||||
noColumns: 0,
|
||||
backgroundColor: "white",
|
||||
lineWidth: 0
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true
|
||||
},
|
||||
tooltip: true,
|
||||
tooltipOpts: {
|
||||
content: "%p.0%, %s", // show percentages, rounding to 2 decimal places
|
||||
shifts: {
|
||||
x: 20,
|
||||
y: 0
|
||||
},
|
||||
defaultTheme: false,
|
||||
cssClass: 'flot-tooltip'
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*---------------------------------
|
||||
Donut Chart
|
||||
---------------------------------*/
|
||||
if($('#donut-chart')[0]){
|
||||
$.plot('#donut-chart', pieData, {
|
||||
series: {
|
||||
pie: {
|
||||
innerRadius: 0.5,
|
||||
show: true,
|
||||
stroke: {
|
||||
width: 0,
|
||||
color: '#2b343a'
|
||||
},
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
container: '.flc-donut',
|
||||
backgroundOpacity: 0.5,
|
||||
noColumns: 0,
|
||||
backgroundColor: "white",
|
||||
lineWidth: 0
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true
|
||||
},
|
||||
tooltip: true,
|
||||
tooltipOpts: {
|
||||
content: "%p.0%, %s", // show percentages, rounding to 2 decimal places
|
||||
shifts: {
|
||||
x: 20,
|
||||
y: 0
|
||||
},
|
||||
defaultTheme: false,
|
||||
cssClass: 'flot-tooltip'
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
|
@ -0,0 +1,497 @@
|
|||
/*----------------------------------------------------------
|
||||
Detect Mobile Browser
|
||||
-----------------------------------------------------------*/
|
||||
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
|
||||
$('html').addClass('ismobile');
|
||||
}
|
||||
|
||||
$(window).load(function () {
|
||||
/*-----------------------------------------------------------
|
||||
Page Loader
|
||||
-----------------------------------------------------------*/
|
||||
if($('.page-loader')[0]) {
|
||||
setTimeout (function () {
|
||||
$('.page-loader').fadeOut();
|
||||
}, 500);
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
$(document).ready(function(){
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Scrollbar
|
||||
-----------------------------------------------------------*/
|
||||
function scrollBar(selector, theme, mousewheelaxis) {
|
||||
$(selector).mCustomScrollbar({
|
||||
theme: theme,
|
||||
scrollInertia: 100,
|
||||
axis:'mousewheelaxis',
|
||||
mouseWheel: {
|
||||
enable: true,
|
||||
axis: mousewheelaxis,
|
||||
preventDefault: true
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (!$('html').hasClass('ismobile')) {
|
||||
//On Custom Class
|
||||
if ($('.c-overflow')[0]) {
|
||||
scrollBar('.c-overflow', 'minimal-dark', 'y');
|
||||
}
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Dropdown Menu
|
||||
-----------------------------------------------------------*/
|
||||
if($('.dropdown')[0]) {
|
||||
//Propagate
|
||||
$('body').on('click', '.dropdown.open .dropdown-menu', function(e){
|
||||
e.stopPropagation();
|
||||
});
|
||||
|
||||
$('.dropdown').on('shown.bs.dropdown', function (e) {
|
||||
if($(this).attr('data-animation')) {
|
||||
$animArray = [];
|
||||
$animation = $(this).data('animation');
|
||||
$animArray = $animation.split(',');
|
||||
$animationIn = 'animated '+$animArray[0];
|
||||
$animationOut = 'animated '+ $animArray[1];
|
||||
$animationDuration = ''
|
||||
if(!$animArray[2]) {
|
||||
$animationDuration = 500; //if duration is not defined, default is set to 500ms
|
||||
}
|
||||
else {
|
||||
$animationDuration = $animArray[2];
|
||||
}
|
||||
|
||||
$(this).find('.dropdown-menu').removeClass($animationOut)
|
||||
$(this).find('.dropdown-menu').addClass($animationIn);
|
||||
}
|
||||
});
|
||||
|
||||
$('.dropdown').on('hide.bs.dropdown', function (e) {
|
||||
if($(this).attr('data-animation')) {
|
||||
e.preventDefault();
|
||||
$this = $(this);
|
||||
$dropdownMenu = $this.find('.dropdown-menu');
|
||||
|
||||
$dropdownMenu.addClass($animationOut);
|
||||
setTimeout(function(){
|
||||
$this.removeClass('open')
|
||||
|
||||
}, $animationDuration);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Calendar Widget
|
||||
-----------------------------------------------------------*/
|
||||
if($('#calendar-widget')[0]) {
|
||||
(function(){
|
||||
$('#calendar-widget #cw-body').fullCalendar({
|
||||
contentHeight: 'auto',
|
||||
theme: true,
|
||||
header: {
|
||||
right: '',
|
||||
center: 'prev, title, next',
|
||||
left: ''
|
||||
},
|
||||
defaultDate: '2014-06-12',
|
||||
editable: true,
|
||||
events: [
|
||||
{
|
||||
title: 'All Day',
|
||||
start: '2014-06-01',
|
||||
},
|
||||
{
|
||||
title: 'Long Event',
|
||||
start: '2014-06-07',
|
||||
end: '2014-06-10',
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeat',
|
||||
start: '2014-06-09',
|
||||
},
|
||||
{
|
||||
id: 999,
|
||||
title: 'Repeat',
|
||||
start: '2014-06-16',
|
||||
},
|
||||
{
|
||||
title: 'Meet',
|
||||
start: '2014-06-12',
|
||||
end: '2014-06-12',
|
||||
},
|
||||
{
|
||||
title: 'Lunch',
|
||||
start: '2014-06-12',
|
||||
},
|
||||
{
|
||||
title: 'Birthday',
|
||||
start: '2014-06-13',
|
||||
},
|
||||
{
|
||||
title: 'Google',
|
||||
url: 'http://google.com/',
|
||||
start: '2014-06-28',
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
//Display Current Date as Calendar widget header
|
||||
var mYear = moment().format('YYYY');
|
||||
var mDay = moment().format('dddd, MMM D');
|
||||
$('#calendar-widget .cwh-year').html(mYear);
|
||||
$('#calendar-widget .cwh-day').html(mDay);
|
||||
})();
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Weather Widget
|
||||
-----------------------------------------------------------*/
|
||||
if ($('#weather-widget')[0]) {
|
||||
$.simpleWeather({
|
||||
location: 'Austin, TX',
|
||||
woeid: '',
|
||||
unit: 'f',
|
||||
success: function(weather) {
|
||||
html = '<div class="weather-status">'+weather.temp+'°'+weather.units.temp+'</div>';
|
||||
html += '<ul class="weather-info"><li>'+weather.city+', '+weather.region+'</li>';
|
||||
html += '<li class="currently">'+weather.currently+'</li></ul>';
|
||||
html += '<div class="weather-icon wi-'+weather.code+'"></div>';
|
||||
html += '<div class="dw-footer"><div class="weather-list tomorrow">';
|
||||
html += '<span class="weather-list-icon wi-'+weather.forecast[2].code+'"></span><span>'+weather.forecast[1].high+'/'+weather.forecast[1].low+'</span><span>'+weather.forecast[1].text+'</span>';
|
||||
html += '</div>';
|
||||
html += '<div class="weather-list after-tomorrow">';
|
||||
html += '<span class="weather-list-icon wi-'+weather.forecast[2].code+'"></span><span>'+weather.forecast[2].high+'/'+weather.forecast[2].low+'</span><span>'+weather.forecast[2].text+'</span>';
|
||||
html += '</div></div>';
|
||||
$("#weather-widget").html(html);
|
||||
},
|
||||
error: function(error) {
|
||||
$("#weather-widget").html('<p>'+error+'</p>');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Auto Size Textare
|
||||
-----------------------------------------------------------*/
|
||||
if ($('.auto-size')[0]) {
|
||||
autosize($('.auto-size'));
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Text Field
|
||||
-----------------------------------------------------------*/
|
||||
//Add blue animated border and remove with condition when focus and blur
|
||||
if($('.fg-line')[0]) {
|
||||
$('body').on('focus', '.fg-line .form-control', function(){
|
||||
$(this).closest('.fg-line').addClass('fg-toggled');
|
||||
})
|
||||
|
||||
$('body').on('blur', '.form-control', function(){
|
||||
var p = $(this).closest('.form-group, .input-group');
|
||||
var i = p.find('.form-control').val();
|
||||
|
||||
if (p.hasClass('fg-float')) {
|
||||
if (i.length == 0) {
|
||||
$(this).closest('.fg-line').removeClass('fg-toggled');
|
||||
}
|
||||
}
|
||||
else {
|
||||
$(this).closest('.fg-line').removeClass('fg-toggled');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//Add blue border for pre-valued fg-flot text feilds
|
||||
if($('.fg-float')[0]) {
|
||||
$('.fg-float .form-control').each(function(){
|
||||
var i = $(this).val();
|
||||
|
||||
if (!i.length == 0) {
|
||||
$(this).closest('.fg-line').addClass('fg-toggled');
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Audio and Video Player
|
||||
-----------------------------------------------------------*/
|
||||
if($('audio, video')[0]) {
|
||||
$('video,audio').mediaelementplayer();
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Chosen
|
||||
-----------------------------------------------------------*/
|
||||
if($('.chosen')[0]) {
|
||||
$('.chosen').chosen({
|
||||
width: '100%',
|
||||
allow_single_deselect: true
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
NoUiSlider (Input Slider)
|
||||
-----------------------------------------------------------*/
|
||||
//Basic
|
||||
if ($('#input-slider')[0]) {
|
||||
var slider = document.getElementById ('input-slider');
|
||||
|
||||
noUiSlider.create (slider, {
|
||||
start: [20],
|
||||
connect: 'lower',
|
||||
range: {
|
||||
'min': 0,
|
||||
'max': 100
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//Range
|
||||
if ($('#input-slider-range')[0]) {
|
||||
var sliderRange = document.getElementById ('input-slider-range');
|
||||
|
||||
noUiSlider.create (sliderRange, {
|
||||
start: [40, 70],
|
||||
connect: true,
|
||||
range: {
|
||||
'min': 0,
|
||||
'max': 100
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//Range with value
|
||||
if($('#input-slider-value')[0]) {
|
||||
var sliderRangeValue = document.getElementById('input-slider-value');
|
||||
|
||||
noUiSlider.create(sliderRangeValue, {
|
||||
start: [10, 50],
|
||||
connect: true,
|
||||
range: {
|
||||
'min': 0,
|
||||
'max': 100
|
||||
}
|
||||
});
|
||||
|
||||
sliderRangeValue.noUiSlider.on('update', function( values, handle ) {
|
||||
document.getElementById('input-slider-value-output').innerHTML = values[handle];
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Input Mask
|
||||
-----------------------------------------------------------*/
|
||||
if ($('input-mask')[0]) {
|
||||
$('.input-mask').mask();
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Farbtastic Color Picker
|
||||
-----------------------------------------------------------*/
|
||||
if ($('.color-picker')[0]) {
|
||||
$('.color-picker').each(function(){
|
||||
var colorOutput = $(this).closest('.cp-container').find('.cp-value');
|
||||
$(this).farbtastic(colorOutput);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Summernote HTML Editor
|
||||
-----------------------------------------------------------*/
|
||||
if ($('.html-editor')[0]) {
|
||||
$('.html-editor').summernote({
|
||||
height: 150
|
||||
});
|
||||
}
|
||||
|
||||
if($('.html-editor-click')[0]) {
|
||||
//Edit
|
||||
$('body').on('click', '.hec-button', function(){
|
||||
$('.html-editor-click').summernote({
|
||||
focus: true
|
||||
});
|
||||
$('.hec-save').show();
|
||||
})
|
||||
|
||||
//Save
|
||||
$('body').on('click', '.hec-save', function(){
|
||||
$('.html-editor-click').code();
|
||||
$('.html-editor-click').destroy();
|
||||
$('.hec-save').hide();
|
||||
});
|
||||
}
|
||||
|
||||
//Air Mode
|
||||
if($('.html-editor-airmod')[0]) {
|
||||
$('.html-editor-airmod').summernote({
|
||||
airMode: true
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Date Time Picker
|
||||
-----------------------------------------------------------*/
|
||||
//Date Time Picker
|
||||
if ($('.date-time-picker')[0]) {
|
||||
$('.date-time-picker').datetimepicker();
|
||||
}
|
||||
|
||||
//Time
|
||||
if ($('.time-picker')[0]) {
|
||||
$('.time-picker').datetimepicker({
|
||||
format: 'LT'
|
||||
});
|
||||
}
|
||||
|
||||
//Date
|
||||
if ($('.date-picker')[0]) {
|
||||
$('.date-picker').datetimepicker({
|
||||
format: 'DD/MM/YYYY'
|
||||
});
|
||||
}
|
||||
|
||||
$('.date-picker').on('dp.hide', function(){
|
||||
$(this).closest('.dtp-container').removeClass('fg-toggled');
|
||||
$(this).blur();
|
||||
})
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Form Wizard
|
||||
-----------------------------------------------------------*/
|
||||
if ($('.form-wizard-basic')[0]) {
|
||||
$('.form-wizard-basic').bootstrapWizard({
|
||||
tabClass: 'fw-nav',
|
||||
'nextSelector': '.next',
|
||||
'previousSelector': '.previous'
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Waves
|
||||
-----------------------------------------------------------
|
||||
(function(){
|
||||
Waves.attach('.btn:not(.btn-icon):not(.btn-float)');
|
||||
Waves.attach('.btn-icon, .btn-float', ['waves-circle', 'waves-float']);
|
||||
Waves.init();
|
||||
})();
|
||||
*/
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Lightbox
|
||||
-----------------------------------------------------------*/
|
||||
if ($('.lightbox')[0]) {
|
||||
$('.lightbox').lightGallery({
|
||||
enableTouch: true
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Link prevent
|
||||
-----------------------------------------------------------*/
|
||||
$('body').on('click', '.a-prevent', function(e){
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
|
||||
/*----------------------------------------------------------
|
||||
Bootstrap Accordion Fix
|
||||
-----------------------------------------------------------*/
|
||||
if ($('.collapse')[0]) {
|
||||
|
||||
//Add active class for opened items
|
||||
$('.collapse').on('show.bs.collapse', function (e) {
|
||||
$(this).closest('.panel').find('.panel-heading').addClass('active');
|
||||
});
|
||||
|
||||
$('.collapse').on('hide.bs.collapse', function (e) {
|
||||
$(this).closest('.panel').find('.panel-heading').removeClass('active');
|
||||
});
|
||||
|
||||
//Add active class for pre opened items
|
||||
$('.collapse.in').each(function(){
|
||||
$(this).closest('.panel').find('.panel-heading').addClass('active');
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Tooltips
|
||||
-----------------------------------------------------------*/
|
||||
if ($('[data-toggle="tooltip"]')[0]) {
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Popover
|
||||
-----------------------------------------------------------*/
|
||||
if ($('[data-toggle="popover"]')[0]) {
|
||||
$('[data-toggle="popover"]').popover();
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
IE 9 Placeholder
|
||||
-----------------------------------------------------------*/
|
||||
if($('html').hasClass('ie9')) {
|
||||
$('input, textarea').placeholder({
|
||||
customClass: 'ie9-placeholder'
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------------------------------------
|
||||
Typeahead Auto Complete
|
||||
-----------------------------------------------------------*/
|
||||
if($('.typeahead')[0]) {
|
||||
|
||||
var statesArray = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
|
||||
'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
|
||||
'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
|
||||
'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
|
||||
'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
|
||||
'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
|
||||
'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
|
||||
'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
|
||||
'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
|
||||
];
|
||||
var states = new Bloodhound({
|
||||
datumTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
||||
local: statesArray
|
||||
});
|
||||
|
||||
$('.typeahead').typeahead({
|
||||
hint: true,
|
||||
highlight: true,
|
||||
minLength: 1
|
||||
},
|
||||
{
|
||||
name: 'states',
|
||||
source: states
|
||||
});
|
||||
}
|
||||
});
|
|
@ -0,0 +1,27 @@
|
|||
$(window).load(function() {
|
||||
|
||||
function notify(message, type) {
|
||||
$.growl({
|
||||
message: message
|
||||
}, {
|
||||
type: type,
|
||||
allow_dismiss: true,
|
||||
label: 'Cancel',
|
||||
className: 'btn-xs btn-inverse align-right',
|
||||
placement: {
|
||||
from: 'top',
|
||||
align: 'right'
|
||||
},
|
||||
delay: 10000,
|
||||
animate: {
|
||||
enter: 'animated fadeIn',
|
||||
exit: 'animated fadeOut'
|
||||
},
|
||||
offset: {
|
||||
x: 20,
|
||||
y: 85
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
|
@ -0,0 +1,3 @@
|
|||
I have created a seperate folder(flot-charts) for Flot Chart items.
|
||||
Each and every Flot chart I have used in this template have it's own js file inside flot-charts folder
|
||||
in order to get a clear picture of codes.
|
|
@ -1,222 +0,0 @@
|
|||
/**
|
||||
* Ponyville Live! Global JavaScript
|
||||
* Made with love for the ponyfolk. /)
|
||||
*/
|
||||
|
||||
$(function() {
|
||||
|
||||
processMultiRows();
|
||||
|
||||
$('a[data-toggle="tab"]').on('shown', function (e) {
|
||||
processMultiRows();
|
||||
});
|
||||
|
||||
if ($('html').hasClass('theme_dark'))
|
||||
{
|
||||
$('.btn.btn-inverse').addClass('btn-normal');
|
||||
$('.btn').not('.btn-inverse,.btn-primary,.btn-success,.btn-warning,.btn-error').addClass('btn-inverse');
|
||||
$('.btn.btn-normal').removeClass('btn-inverse btn-normal');
|
||||
|
||||
$('div.navbar').addClass('navbar-inverse');
|
||||
}
|
||||
|
||||
$('#btn-tune-in,.btn-tune-in').click(function(e) {
|
||||
var href = $(this).attr('href');
|
||||
window.open(href, "pvlplayer", "width=400,height=600,menubar=0,toolbar=0,location=0,status=1");
|
||||
|
||||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
|
||||
/* Indicate Flash support */
|
||||
$('html').addClass(typeof swfobject !== 'undefined' && swfobject.getFlashPlayerVersion().major !== 0 ? 'flash' : 'no-flash');
|
||||
|
||||
/* Autoselect */
|
||||
$('.autoselect').each(function() {
|
||||
var active = $(this).attr('rel');
|
||||
$(this).find('[rel="'+active+'"]').addClass('active');
|
||||
});
|
||||
|
||||
/* Link fixes for iOS Apps */
|
||||
if (('standalone' in window.navigator) && window.navigator.standalone) {
|
||||
$('a').live('click', function() {
|
||||
if(!$(this).hasClass('noeffect')) {
|
||||
window.location = $(this).attr('href');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* Carousel and touch support. */
|
||||
$('.carousel').carousel({
|
||||
interval: 10000
|
||||
});
|
||||
|
||||
if ($().hammer)
|
||||
{
|
||||
var hammer_options = {};
|
||||
$('.carousel')
|
||||
.hammer(hammer_options)
|
||||
.on("swipeleft", function(ev) {
|
||||
$(this).carousel('next');
|
||||
})
|
||||
.on("swiperight", function(ev) {
|
||||
$(this).carousel('prev');
|
||||
});
|
||||
}
|
||||
|
||||
if ($.fn.nanoScroller)
|
||||
{
|
||||
$(".nano").nanoScroller();
|
||||
}
|
||||
|
||||
/* Song Information button. */
|
||||
$('.btn-show-song-info').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
var song_id = $(this).data('id');
|
||||
showSongInfo(song_id);
|
||||
});
|
||||
|
||||
/* Time synchronization. */
|
||||
updateTime();
|
||||
});
|
||||
|
||||
/* Song biography popup. */
|
||||
function showSongInfo(song_id)
|
||||
{
|
||||
console.log('Song information for ID: '+song_id);
|
||||
|
||||
// All Song ID hashes are uniform length.
|
||||
if (song_id.length != 32)
|
||||
return false;
|
||||
|
||||
var info_url = DF_BaseUrl+'/song/index/id/'+song_id;
|
||||
modalPopup(info_url, {
|
||||
'width': 600,
|
||||
'minWidth': 600,
|
||||
'maxWidth': 600,
|
||||
'height': 500,
|
||||
'minHeight': 500,
|
||||
'maxHeight': 500,
|
||||
'onComplete': function() {
|
||||
cleanUpSongInfo(); // Loaded in remote URL.
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* Clock synchronization. */
|
||||
var clock_timeout;
|
||||
var clock_interval = 60000;
|
||||
|
||||
function updateTime()
|
||||
{
|
||||
clearTimeout(clock_timeout);
|
||||
|
||||
var new_current_time = moment().utcOffset(PVL_UtcOffset).format('h:mmA');
|
||||
$('.current_time').text(new_current_time);
|
||||
|
||||
clock_timeout = setTimeout('updateTime()', clock_interval);
|
||||
}
|
||||
|
||||
/* Fancybox (or iFrame if fancybox isn't available). */
|
||||
function modalPopup(popup_url, params)
|
||||
{
|
||||
closeAllDropdowns();
|
||||
|
||||
params = $.extend({
|
||||
'type': 'ajax',
|
||||
'href': popup_url,
|
||||
'width': 600,
|
||||
'height': 500
|
||||
}, params);
|
||||
|
||||
console.log(params);
|
||||
|
||||
// Detect iframe.
|
||||
if (window!=window.top || !$.fn.fancybox)
|
||||
window.open(popup_url,'PVLModalPopup','menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height='+params.height+',width='+params.width);
|
||||
else
|
||||
$.fancybox.open(params);
|
||||
}
|
||||
|
||||
function intOrZero(number)
|
||||
{
|
||||
return parseInt(number) || 0;
|
||||
}
|
||||
|
||||
function getUnixTimestamp()
|
||||
{
|
||||
return Math.round((new Date()).getTime() / 1000);
|
||||
}
|
||||
|
||||
function addParameter(url, parameterName, parameterValue, atStart)
|
||||
{
|
||||
replaceDuplicates = true;
|
||||
if(url.indexOf('#') > 0){
|
||||
var cl = url.indexOf('#');
|
||||
urlhash = url.substring(url.indexOf('#'),url.length);
|
||||
} else {
|
||||
urlhash = '';
|
||||
cl = url.length;
|
||||
}
|
||||
sourceUrl = url.substring(0,cl);
|
||||
|
||||
var urlParts = sourceUrl.split("?");
|
||||
var newQueryString = "";
|
||||
|
||||
if (urlParts.length > 1)
|
||||
{
|
||||
var parameters = urlParts[1].split("&");
|
||||
for (var i=0; (i < parameters.length); i++)
|
||||
{
|
||||
var parameterParts = parameters[i].split("=");
|
||||
if (!(replaceDuplicates && parameterParts[0] == parameterName))
|
||||
{
|
||||
if (newQueryString == "")
|
||||
newQueryString = "?";
|
||||
else
|
||||
newQueryString += "&";
|
||||
newQueryString += parameterParts[0] + "=" + (parameterParts[1]?parameterParts[1]:'');
|
||||
}
|
||||
}
|
||||
}
|
||||
if (newQueryString == "")
|
||||
newQueryString = "?";
|
||||
|
||||
if(atStart){
|
||||
newQueryString = '?'+ parameterName + "=" + parameterValue + (newQueryString.length>1?'&'+newQueryString.substring(1):'');
|
||||
} else {
|
||||
if (newQueryString !== "" && newQueryString != '?')
|
||||
newQueryString += "&";
|
||||
newQueryString += parameterName + "=" + (parameterValue?parameterValue:'');
|
||||
}
|
||||
return urlParts[0] + newQueryString + urlhash;
|
||||
}
|
||||
|
||||
function processMultiRows()
|
||||
{
|
||||
// Add support for multiple rows for all divisible-by-12 columns.
|
||||
_.forEach([2, 3, 4, 6, 12], function(j) {
|
||||
|
||||
var num_per_row = 12 / j;
|
||||
|
||||
$('.row-multiple').each(function() {
|
||||
var i = 0;
|
||||
|
||||
$(this).find('.span'+j).removeClass('start-of-row');
|
||||
$(this).find('.span'+j+':visible').each(function() {
|
||||
i++;
|
||||
if (num_per_row == 1 || i % num_per_row == 1)
|
||||
$(this).addClass('start-of-row');
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function closeAllDropdowns()
|
||||
{
|
||||
$('.dropdown.open').removeClass('open');
|
||||
$('.btn-group.open').removeClass('open');
|
||||
}
|
|
@ -1,232 +0,0 @@
|
|||
/**
|
||||
* DF Core Layout jQuery Functions
|
||||
*/
|
||||
|
||||
var is_compact;
|
||||
var is_narrow;
|
||||
|
||||
$(function() {
|
||||
/* Auto-header navigation. */
|
||||
$('div.navbar a.here').closest('li').addClass('active');
|
||||
|
||||
$('div.navbar div.nav-collapse > ul').addClass('nav');
|
||||
$('ul.nav li > ul').each(function() {
|
||||
$(this).closest('li').addClass('dropdown');
|
||||
$(this).prev('a').attr('href', '#').attr('data-toggle', 'dropdown').addClass('dropdown-toggle').append(' <b class="caret"></b>');
|
||||
$(this).addClass('dropdown-menu');
|
||||
});
|
||||
|
||||
$('div.navbar.navbar-unloaded').removeClass('navbar-unloaded');
|
||||
|
||||
/* Register global AJAX handler. */
|
||||
$.ajaxSetup({ global: true });
|
||||
|
||||
$(document.body).ajaxComplete(function(e) {
|
||||
initPage(e.target);
|
||||
});
|
||||
|
||||
/* Adding classes for resizing */
|
||||
handleResize();
|
||||
$(window).resize(handleResize);
|
||||
|
||||
initPage($(document.body));
|
||||
});
|
||||
|
||||
function handleResize()
|
||||
{
|
||||
var width = $(window).width();
|
||||
is_compact = (width < 768);
|
||||
is_narrow = (width < 980);
|
||||
}
|
||||
|
||||
/* Page initialization function. */
|
||||
function initPage(page) {
|
||||
|
||||
/* Clean up display of forms. */
|
||||
$(page).find('form.df-form').not('.df-form-loaded').each(function() {
|
||||
$(this).find('input[type="submit"],input[type="reset"],button')
|
||||
.not('.mid-form')
|
||||
.addClass('btn')
|
||||
.wrapAll('<div class="form-actions" />');
|
||||
|
||||
$(this).find('button[type="submit"],input[type="submit"]')
|
||||
.addClass('btn-primary');
|
||||
|
||||
var input_lists = $(this).find('input[type="checkbox"],input[type="radio"]');
|
||||
if (input_lists.length > 0)
|
||||
{
|
||||
input_lists.closest('label').contents().filter(function() {
|
||||
return this.nodeType == 3;
|
||||
}).before(' ').wrap('<span />');
|
||||
}
|
||||
|
||||
$(this).find('fieldset legend + span.help-block').each(function() {
|
||||
$(this).prev('legend').append('<br><small>'+$(this).html()+'</small>');
|
||||
$(this).remove();
|
||||
});
|
||||
|
||||
$(this).find('span.error').closest('div.clearfix').addClass('error');
|
||||
|
||||
// Repair smart quotes and other error-causing Unicode elements.
|
||||
$(this).submit(function(e) {
|
||||
$(this).find('input[type="text"],textarea').each(function() {
|
||||
var s = $(this).val();
|
||||
|
||||
s = s.replace( /\u2018|\u2019|\u201A|\uFFFD/g, "'" );
|
||||
s = s.replace( /\u201c|\u201d|\u201e/g, '"' );
|
||||
s = s.replace( /\u02C6/g, '^' );
|
||||
s = s.replace( /\u2039/g, '<' );
|
||||
s = s.replace( /\u203A/g, '>' );
|
||||
s = s.replace( /\u2013/g, '-' );
|
||||
s = s.replace( /\u2014/g, '--' );
|
||||
s = s.replace( /\u2026/g, '...' );
|
||||
s = s.replace( /\u00A9/g, '(c)' );
|
||||
s = s.replace( /\u00AE/g, '(r)' );
|
||||
s = s.replace( /\u2122/g, 'TM' );
|
||||
s = s.replace( /\u00BC/g, '1/4' );
|
||||
s = s.replace( /\u00BD/g, '1/2' );
|
||||
s = s.replace( /\u00BE/g, '3/4' );
|
||||
s = s.replace(/[\u02DC|\u00A0]/g, " ");
|
||||
|
||||
$(this).val(s);
|
||||
});
|
||||
});
|
||||
|
||||
$(this).addClass('df-form-loaded');
|
||||
});
|
||||
|
||||
/* Bootstrap 2.0 forward compatibility */
|
||||
$(page).find('.datatable').addClass('table table-bordered');
|
||||
$(page).find('form .actions').addClass('form-actions');
|
||||
|
||||
$(page).find('.btn.primary,.btn.blue').addClass('btn-primary');
|
||||
$(page).find('.btn.warning,.btn.yellow').addClass('btn-warning');
|
||||
$(page).find('.btn.danger,.btn.red').addClass('btn-danger');
|
||||
$(page).find('.btn.success,btn.green').addClass('btn-success');
|
||||
$(page).find('.btn.small').addClass('btn-small');
|
||||
$(page).find('.btn.large').addClass('btn-large');
|
||||
|
||||
$(page).find('.alert-message').addClass('alert');
|
||||
$(page).find('.block-message').addClass('alert-block');
|
||||
$(page).find('.alert.info,.alert.blue').addClass('alert-info');
|
||||
$(page).find('.alert.danger,.alert.red').addClass('alert-danger');
|
||||
$(page).find('.alert.success,alert.green').addClass('alert-success');
|
||||
|
||||
/* Form validation. */
|
||||
if (jQuery.fn.validate)
|
||||
{
|
||||
$(page).find('form.validate').validate();
|
||||
}
|
||||
|
||||
/* Tooltips */
|
||||
if (jQuery.fn.tooltip)
|
||||
{
|
||||
$(page).find('a[rel=tooltip]').tooltip({placement: 'right', html: true});
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
$(page).find('div.pagination li.disabled, div.pagination li.active').click(function(e) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
|
||||
/* Automatically add zebra-stripes to tables and lists.
|
||||
* Note that 0-based indexing requires that the "even" and "odd" accessors be switched. */
|
||||
$(page).find('table.datatable.zebra tbody tr:nth-child(odd)').removeClass('odd even').addClass('odd');
|
||||
$(page).find('table.datatable.zebra tbody tr:nth-child(even)').removeClass('odd even').addClass('even');
|
||||
|
||||
$(page).find('dl.zebra:odd,fieldset.zebra:odd').addClass('odd');
|
||||
$(page).find('dl.zebra:even,fieldset.zebra:even').addClass('even');
|
||||
|
||||
/* Wrappers for confirmation functions. */
|
||||
$(page).find('.confirm-action,.confirm-delete,.btn.warning').click(function(e) {
|
||||
var thistitle = $(this).attr('title');
|
||||
|
||||
if (thistitle)
|
||||
var message = 'Are you sure you want to '+thistitle+'?';
|
||||
else
|
||||
var message = 'Are you sure you want to complete this action?';
|
||||
|
||||
if (!confirm(message))
|
||||
{
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
/* Disable submit button to prevent double submissions */
|
||||
$(page).find('form').submit(function(){
|
||||
if (!$(this).hasClass('no-disable'))
|
||||
$(this).find('input[type=submit],button[type=submit]').attr('disabled', 'disabled').addClass('disabled').val('Working...');
|
||||
});
|
||||
|
||||
/* Suppress the backspace key. */
|
||||
$(page).find('select').keypress(function(event) { return cancelBackspace(event) });
|
||||
$(page).find('select').keydown(function(event) { return cancelBackspace(event) });
|
||||
|
||||
/* Apply "equal heights" rules */
|
||||
$(page).find('div.equal-heights').each(function() {
|
||||
var elements = $(this).find('div[class^=span]');
|
||||
elements.equalHeight();
|
||||
$(window).resize(function() {
|
||||
elements.equalHeight();
|
||||
});
|
||||
});
|
||||
|
||||
/* Form validation. */
|
||||
if (jQuery.fn.fancybox)
|
||||
{
|
||||
var height = screen.height/2;
|
||||
|
||||
$(page).find('.fancybox').fancybox({
|
||||
maxWidth : 1280,
|
||||
maxHeight : 720,
|
||||
autoSize : true,
|
||||
fitToView : true,
|
||||
width : height * 16/9,
|
||||
height : height,
|
||||
aspectRatio : true,
|
||||
arrows : false,
|
||||
closeClick : false,
|
||||
closeBtn : true,
|
||||
openEffect : 'none',
|
||||
closeEffect : 'none',
|
||||
helpers : { media : {} }
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* Prevents the backspace key from navigating backwards on dropdown forms. */
|
||||
function cancelBackspace(event) {
|
||||
if (event.keyCode == 8) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
(function($) {
|
||||
|
||||
/* Make all elements in a group have the same height. */
|
||||
$.fn.extend({
|
||||
equalHeight: function() {
|
||||
if (is_compact)
|
||||
{
|
||||
$(this).height('auto');
|
||||
}
|
||||
else
|
||||
{
|
||||
var tallest = 0;
|
||||
$(this).each(function() {
|
||||
$(this).height('auto');
|
||||
|
||||
var thisHeight = $(this).height();
|
||||
if(thisHeight > tallest) {
|
||||
tallest = thisHeight;
|
||||
}
|
||||
});
|
||||
|
||||
$(this).height(tallest);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
|
@ -1,190 +0,0 @@
|
|||
(function (root, factory) {
|
||||
|
||||
'use strict';
|
||||
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD environment
|
||||
define('notify', [], function () {
|
||||
return factory(root, document);
|
||||
});
|
||||
} else if (typeof exports === 'object') {
|
||||
// CommonJS environment
|
||||
module.exports = factory(root, document);
|
||||
} else {
|
||||
// Browser environment
|
||||
root.Notify = factory(root, document);
|
||||
}
|
||||
|
||||
}(window, function (w, d) {
|
||||
|
||||
'use strict';
|
||||
|
||||
function isFunction (item) {
|
||||
return typeof item === 'function';
|
||||
}
|
||||
|
||||
function Notify(title, options) {
|
||||
|
||||
if (typeof title !== 'string') {
|
||||
throw new Error('Notify(): first arg (title) must be a string.');
|
||||
}
|
||||
|
||||
this.title = title;
|
||||
|
||||
this.options = {
|
||||
icon: '',
|
||||
body: '',
|
||||
tag: '',
|
||||
notifyShow: null,
|
||||
notifyClose: null,
|
||||
notifyClick: null,
|
||||
notifyError: null,
|
||||
permissionGranted: null,
|
||||
permissionDenied: null,
|
||||
timeout: null
|
||||
};
|
||||
|
||||
this.permission = null;
|
||||
|
||||
if (!Notify.isSupported) {
|
||||
return;
|
||||
}
|
||||
|
||||
//User defined options for notification content
|
||||
if (typeof options === 'object') {
|
||||
|
||||
for (var i in options) {
|
||||
if (options.hasOwnProperty(i)) {
|
||||
this.options[i] = options[i];
|
||||
}
|
||||
}
|
||||
|
||||
//callback when notification is displayed
|
||||
if (isFunction(this.options.notifyShow)) {
|
||||
this.onShowCallback = this.options.notifyShow;
|
||||
}
|
||||
|
||||
//callback when notification is closed
|
||||
if (isFunction(this.options.notifyClose)) {
|
||||
this.onCloseCallback = this.options.notifyClose;
|
||||
}
|
||||
|
||||
//callback when notification is clicked
|
||||
if (isFunction(this.options.notifyClick)) {
|
||||
this.onClickCallback = this.options.notifyClick;
|
||||
}
|
||||
|
||||
//callback when notification throws error
|
||||
if (isFunction(this.options.notifyError)) {
|
||||
this.onErrorCallback = this.options.notifyError;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// true if the browser supports HTML5 Notification
|
||||
Notify.isSupported = 'Notification' in w;
|
||||
|
||||
// true if the permission is not granted
|
||||
Notify.needsPermission = !(Notify.isSupported && Notification.permission === 'granted');
|
||||
|
||||
// asks the user for permission to display notifications. Then calls the callback functions is supplied.
|
||||
Notify.requestPermission = function (onPermissionGrantedCallback, onPermissionDeniedCallback) {
|
||||
if (!Notify.isSupported) {
|
||||
return;
|
||||
}
|
||||
w.Notification.requestPermission(function (perm) {
|
||||
switch (perm) {
|
||||
case 'granted':
|
||||
if (isFunction(onPermissionGrantedCallback)) {
|
||||
onPermissionGrantedCallback();
|
||||
}
|
||||
break;
|
||||
case 'denied':
|
||||
if (isFunction(onPermissionDeniedCallback)) {
|
||||
onPermissionDeniedCallback();
|
||||
}
|
||||
break;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
Notify.prototype.show = function () {
|
||||
|
||||
if (!Notify.isSupported) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.myNotify = new Notification(this.title, {
|
||||
'body': this.options.body,
|
||||
'tag' : this.options.tag,
|
||||
'icon' : this.options.icon
|
||||
});
|
||||
|
||||
if (this.options.timeout && !isNaN(this.options.timeout)) {
|
||||
setTimeout(this.close.bind(this), this.options.timeout * 1000);
|
||||
}
|
||||
|
||||
this.myNotify.addEventListener('show', this, false);
|
||||
this.myNotify.addEventListener('error', this, false);
|
||||
this.myNotify.addEventListener('close', this, false);
|
||||
this.myNotify.addEventListener('click', this, false);
|
||||
};
|
||||
|
||||
Notify.prototype.onShowNotification = function (e) {
|
||||
if (this.onShowCallback) {
|
||||
this.onShowCallback(e);
|
||||
}
|
||||
};
|
||||
|
||||
Notify.prototype.onCloseNotification = function (e) {
|
||||
if (this.onCloseCallback) {
|
||||
this.onCloseCallback(e);
|
||||
}
|
||||
this.destroy();
|
||||
};
|
||||
|
||||
Notify.prototype.onClickNotification = function (e) {
|
||||
if (this.onClickCallback) {
|
||||
this.onClickCallback(e);
|
||||
}
|
||||
};
|
||||
|
||||
Notify.prototype.onErrorNotification = function (e) {
|
||||
if (this.onErrorCallback) {
|
||||
this.onErrorCallback(e);
|
||||
}
|
||||
this.destroy();
|
||||
};
|
||||
|
||||
Notify.prototype.destroy = function () {
|
||||
this.myNotify.removeEventListener('show', this, false);
|
||||
this.myNotify.removeEventListener('error', this, false);
|
||||
this.myNotify.removeEventListener('close', this, false);
|
||||
this.myNotify.removeEventListener('click', this, false);
|
||||
};
|
||||
|
||||
Notify.prototype.close = function () {
|
||||
this.myNotify.close();
|
||||
};
|
||||
|
||||
Notify.prototype.handleEvent = function (e) {
|
||||
switch (e.type) {
|
||||
case 'show':
|
||||
this.onShowNotification(e);
|
||||
break;
|
||||
case 'close':
|
||||
this.onCloseNotification(e);
|
||||
break;
|
||||
case 'click':
|
||||
this.onClickNotification(e);
|
||||
break;
|
||||
case 'error':
|
||||
this.onErrorNotification(e);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
return Notify;
|
||||
|
||||
}));
|
|
@ -1,42 +0,0 @@
|
|||
/**
|
||||
* Ponyville Live!
|
||||
* Podcast Episode Management
|
||||
*/
|
||||
|
||||
$(function() {
|
||||
|
||||
$('a.podcast-episode').each(function() {
|
||||
|
||||
var link_href = $(this).attr('href');
|
||||
|
||||
if (link_href.indexOf('youtube') != -1)
|
||||
{
|
||||
$(this).addClass('fancybox fancybox.media');
|
||||
}
|
||||
else if (link_href.indexOf('soundcloud') != -1)
|
||||
{
|
||||
$(this).addClass('fancybox fancybox.iframe');
|
||||
}
|
||||
else
|
||||
{
|
||||
$(this).attr('target', '_blank');
|
||||
}
|
||||
|
||||
// Trigger AJAX call to log play on video, even if played modally or launched in new page.
|
||||
$(this).on('click', function(e) {
|
||||
var analytics_url = $(this).data('log');
|
||||
|
||||
if (analytics_url)
|
||||
{
|
||||
jQuery.ajax({
|
||||
'type': 'GET',
|
||||
'url': analytics_url,
|
||||
'dataType': 'json'
|
||||
}).done(function(return_data) {
|
||||
console.log(return_data);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
});
|
|
@ -1,835 +0,0 @@
|
|||
/**
|
||||
* Ponyville Live!
|
||||
* Radio Player Script
|
||||
*/
|
||||
|
||||
var volume = 70;
|
||||
var nowplaying_song,
|
||||
nowplaying_song_id,
|
||||
nowplaying_url,
|
||||
nowplaying_station,
|
||||
np_cache;
|
||||
|
||||
var vote_ratelimit = false;
|
||||
|
||||
var is_playing,
|
||||
jp_is_playing;
|
||||
|
||||
var socket;
|
||||
|
||||
$(function() {
|
||||
|
||||
// Check webstorage for existing volume preference.
|
||||
if (store.enabled && store.get('pvlive_player_volume') !== undefined)
|
||||
volume = store.get('pvlive_player_volume', 70);
|
||||
|
||||
$('.nowplaying-status').hide();
|
||||
|
||||
$('.station').click(function(e) {
|
||||
if (!$(this).closest('.station').hasClass('playing'))
|
||||
{
|
||||
e.preventDefault();
|
||||
playStation($(this).attr('id'));
|
||||
}
|
||||
});
|
||||
|
||||
// Toggle display of the "Playback History" pane.
|
||||
$('.station .btn-show-history').click(function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
$(this).closest('.station').find('.station-history').slideToggle();
|
||||
});
|
||||
|
||||
// "Like" links.
|
||||
$('.station .vote-wrapper a').click(function(e)
|
||||
{
|
||||
e.preventDefault();
|
||||
|
||||
// Vote rate limiting.
|
||||
if (vote_ratelimit)
|
||||
return false;
|
||||
|
||||
vote_ratelimit = true;
|
||||
|
||||
// Action to call remotely.
|
||||
if ($(this).hasClass('btn-active'))
|
||||
var vote_function = 'clearvote';
|
||||
else if ($(this).hasClass('btn-like'))
|
||||
var vote_function = 'like';
|
||||
else
|
||||
var vote_function = 'dislike';
|
||||
|
||||
// Trigger AJAX call.
|
||||
var songhist_id = intOrZero($(this).closest('.station').data('historyid'));
|
||||
|
||||
if (songhist_id == 0)
|
||||
return false;
|
||||
|
||||
/*
|
||||
var remote_url;
|
||||
if (typeof DF_ApiUrl !== 'undefined' && DF_ApiUrl != '')
|
||||
remote_url = DF_ApiUrl+'/song/'+vote_function;
|
||||
else
|
||||
*/
|
||||
var remote_url = DF_BaseUrl+'/api/song/'+vote_function;
|
||||
|
||||
jQuery.ajax({
|
||||
'type': 'GET',
|
||||
'url': remote_url,
|
||||
'dataType': 'json',
|
||||
'data': {
|
||||
'sh_id': songhist_id,
|
||||
'client': 'pvlwebapp'
|
||||
},
|
||||
'xhrFields': {
|
||||
'withCredentials': true
|
||||
}
|
||||
}).done(function(return_data) {
|
||||
vote_ratelimit = false;
|
||||
console.log(return_data);
|
||||
});
|
||||
|
||||
// Update local graphics and text.
|
||||
var score_display = $(this).closest('.vote-wrapper').find('.nowplaying-score');
|
||||
var score_original = intOrZero(score_display.data('original'));
|
||||
|
||||
if (vote_function == 'clearvote')
|
||||
{
|
||||
$(this).removeClass('btn-active');
|
||||
score_display.text(score_original);
|
||||
}
|
||||
else
|
||||
{
|
||||
$(this).siblings('a').removeClass('btn-active');
|
||||
$(this).addClass('btn-active');
|
||||
|
||||
if (vote_function == 'like')
|
||||
var new_score = score_original + 1;
|
||||
else
|
||||
var new_score = score_original - 1;
|
||||
|
||||
score_display.text(new_score);
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
// Social links.
|
||||
$('.station .btn-share-station').click(function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
closeAllDropdowns();
|
||||
|
||||
var shareLink = document.URL;
|
||||
|
||||
var nowplaying_title = $(this).closest('.station').find('.nowplaying-artist').text();
|
||||
var nowplaying_artist = $(this).closest('.station').find('.nowplaying-title').text();
|
||||
if (nowplaying_artist)
|
||||
var shareTitle = '"'+nowplaying_title+'" by '+nowplaying_artist;
|
||||
else
|
||||
var shareTitle = '"'+nowplaying_title+'"';
|
||||
|
||||
var station_name = $(this).closest('.station').data('name');
|
||||
shareTitle = 'I\'m tuned in to '+shareTitle+' on '+station_name+'. Check it out!';
|
||||
|
||||
var shareMedia = $(this).closest('.station').find('.station-image').prop('src');
|
||||
|
||||
if ($(this).hasClass('btn-share-facebook'))
|
||||
{
|
||||
window.open('//www.facebook.com/share.php?s=100&p[url]=' + encodeURIComponent(shareLink) + '&p[images][0]=' + encodeURIComponent(shareMedia) + '&p[title]=' + encodeURIComponent(shareTitle),'Facebook','menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');
|
||||
}
|
||||
else if ($(this).hasClass('btn-share-twitter'))
|
||||
{
|
||||
window.open('//twitter.com/home?status=' + encodeURIComponent(shareTitle) + '+' + encodeURIComponent(shareLink),'Twitter','menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');
|
||||
}
|
||||
});
|
||||
|
||||
// Song profile link.
|
||||
$('.station .song-info, .station .btn-song-info').on('click', function(e) {
|
||||
if ($(this).closest('.station').hasClass('playing'))
|
||||
{
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
var song_id = $(this).closest('.station').data('songid');
|
||||
if (song_id != "")
|
||||
showSongInfo(song_id);
|
||||
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
/* Upcoming Schedule button. */
|
||||
$('.nowplaying-onair, .btn-station-schedule').on('click', function(e) {
|
||||
if ($(this).closest('.station').hasClass('playing'))
|
||||
{
|
||||
e.preventDefault();
|
||||
|
||||
var station_id = $(this).closest('.station').data('id');
|
||||
showStationSchedule(station_id);
|
||||
}
|
||||
});
|
||||
|
||||
// "Browse Stations" link.
|
||||
$('#btn_browse_stations').click(function(e) {
|
||||
playInPopUp(0);
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
/* Switch Stream button. */
|
||||
$('.btn-switch-stream').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
// Stop the current playing song.
|
||||
stopAllPlayers();
|
||||
|
||||
var station = $(this).closest('.station');
|
||||
|
||||
var stream_id = $(this).closest('li').attr('rel');
|
||||
station.data('streamid', stream_id);
|
||||
station.removeData('songid');
|
||||
|
||||
nowplaying_song_id = null;
|
||||
nowplaying_song = null;
|
||||
|
||||
// Force stream metadata switch.
|
||||
processNowPlaying();
|
||||
|
||||
// Play the new stream URL.
|
||||
playStation(station.attr('id'));
|
||||
|
||||
// Persist the stream change for future page loads.
|
||||
jQuery.ajax({
|
||||
'type': 'POST',
|
||||
'url': DF_BaseUrl+'/profile/stream',
|
||||
'dataType': 'text',
|
||||
'data': {
|
||||
'station': station.data('id'),
|
||||
'stream': stream_id
|
||||
}
|
||||
}).done(function(return_data) {
|
||||
console.log('Persist stream preference: '+return_data);
|
||||
});
|
||||
});
|
||||
|
||||
/* Websocket Interaction */
|
||||
|
||||
socket = io(pvlnode_remote_url, {path: pvlnode_remote_path});
|
||||
|
||||
socket.on('connect', function(){});
|
||||
socket.on('disconnect', function(){});
|
||||
|
||||
socket.on('nowplaying', function(e) {
|
||||
console.log('Nowplaying updated.');
|
||||
|
||||
np_cache = e;
|
||||
processNowPlaying();
|
||||
|
||||
console.log(np_cache);
|
||||
|
||||
// Send message to iframe listeners.
|
||||
top.postMessage({
|
||||
type: 'nowplaying',
|
||||
body: JSON.stringify(e)
|
||||
}, '*');
|
||||
});
|
||||
|
||||
socket.on('schedule.event_upcoming', function(e) {
|
||||
console.log(e);
|
||||
|
||||
var station_name = e.station.name;
|
||||
var station_image = e.station.image_url;
|
||||
var station_id = 'station_'+ e.station.shortcode;
|
||||
|
||||
// Only show events for visible stations.
|
||||
if ($('#'+station_id).length == 0)
|
||||
return false;
|
||||
|
||||
var event_name = e.event.title;
|
||||
var event_url = e.event.web_url;
|
||||
|
||||
notify(station_image, event_name, 'Coming up on '+station_name, {
|
||||
tag: 'event_upcoming',
|
||||
timeout: 15
|
||||
});
|
||||
|
||||
// Send message to iframe listeners.
|
||||
top.postMessage({
|
||||
type: 'event_upcoming',
|
||||
body: JSON.stringify(e)
|
||||
}, '*');
|
||||
});
|
||||
|
||||
socket.on('podcast.new_episode', function(e) {
|
||||
console.log(e);
|
||||
|
||||
// Don't show on embedded pages.
|
||||
if (window.self !== window.top)
|
||||
return false;
|
||||
|
||||
var podcast_name = e.podcast.name;
|
||||
var podcast_image = e.podcast.image_url;
|
||||
|
||||
var episode_name = e.episode.title;
|
||||
var episode_url = e.episode.web_url;
|
||||
|
||||
notify(podcast_image, podcast_name, 'New episode available:\n'+episode_name, {
|
||||
tag: 'podcast_episode',
|
||||
timeout: 15
|
||||
});
|
||||
|
||||
// Send message to iframe listeners.
|
||||
top.postMessage({
|
||||
type: 'podcast_episode',
|
||||
body: JSON.stringify(e)
|
||||
}, '*');
|
||||
});
|
||||
|
||||
// Autoplay registration.
|
||||
if (typeof pvl_autoplay_station !== "undefined") {
|
||||
var autoplay_triggered = false;
|
||||
|
||||
socket.on('nowplaying', function(e) {
|
||||
if (!autoplay_triggered) {
|
||||
autoplay_triggered = true;
|
||||
playStation($('.station[data-id="'+pvl_autoplay_station+'"]').attr('id'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Remote volume parameter registration.
|
||||
if (typeof pvl_autoplay_volume !== "undefined") {
|
||||
volume = pvl_autoplay_volume;
|
||||
}
|
||||
});
|
||||
|
||||
function processNowPlaying()
|
||||
{
|
||||
var listener_total = 0;
|
||||
var listeners_by_type = [];
|
||||
|
||||
_.each(np_cache, function(station_info, station_id)
|
||||
{
|
||||
var category = station_info.station.category;
|
||||
var listeners = 0;
|
||||
|
||||
if (category == 'video')
|
||||
listeners = processVideoNowPlayingRow(station_info, station_id);
|
||||
else
|
||||
listeners = processAudioNowPlayingRow(station_info, station_id);
|
||||
|
||||
listener_total += listeners;
|
||||
|
||||
if (typeof(listeners_by_type[category]) == 'undefined')
|
||||
listeners_by_type[category] = 0;
|
||||
|
||||
listeners_by_type[category] += listeners;
|
||||
});
|
||||
|
||||
// Aggregate listener totals.
|
||||
for(type_name in listeners_by_type)
|
||||
{
|
||||
$('#nowplaying-listeners-'+type_name).html('<i class="icon-user"></i> '+listeners_by_type[type_name]);
|
||||
}
|
||||
$('#nowplaying-listeners-total').html('<i class="icon-user"></i> '+listener_total);
|
||||
|
||||
if ($('.video-channel.online').length > 0)
|
||||
{
|
||||
$('.video-listing').show();
|
||||
processMultiRows();
|
||||
}
|
||||
else
|
||||
{
|
||||
$('.video-listing').hide();
|
||||
}
|
||||
}
|
||||
|
||||
function processAudioNowPlayingRow(station_info, station_id)
|
||||
{
|
||||
var station = $('#station_'+station_id);
|
||||
var station_exists = (station.length != 0);
|
||||
var listener_total = 0;
|
||||
|
||||
if (!station_exists)
|
||||
return 0;
|
||||
|
||||
var stream_id = parseInt(station.data('streamid'));
|
||||
var stream = _(station_info.streams).find({'id': stream_id });
|
||||
|
||||
if (typeof stream == 'undefined')
|
||||
{
|
||||
station.hide();
|
||||
return 0;
|
||||
}
|
||||
|
||||
// Set stream URL.
|
||||
station.data('stream', stream.url);
|
||||
station.data('type', stream.type);
|
||||
|
||||
// Highlight active stream.
|
||||
station.find('.stream-switcher ul li').removeClass('active');
|
||||
station.find('.stream-switcher ul li[rel="'+stream_id+'"]').addClass('active');
|
||||
|
||||
// Format title.
|
||||
var song_tooltip = '';
|
||||
|
||||
if (!stream.current_song.title)
|
||||
{
|
||||
station.find('.nowplaying-artist').text(stream.current_song.text);
|
||||
station.find('.nowplaying-title').text('');
|
||||
|
||||
song_tooltip += stream.current_song.text;
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.nowplaying-artist').text(stream.current_song.title);
|
||||
station.find('.nowplaying-title').text(stream.current_song.artist);
|
||||
|
||||
song_tooltip += stream.current_song.title + "\n" + stream.current_song.artist;
|
||||
}
|
||||
|
||||
if (_.size(stream.current_song.external) > 0)
|
||||
{
|
||||
station.find('.song-info-button').show();
|
||||
|
||||
song_tooltip += "\n" + 'More Info Available';
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.song-info-button').hide();
|
||||
}
|
||||
|
||||
// Set hover tooltip for song.
|
||||
station.find('.song-info').attr('title', song_tooltip);
|
||||
|
||||
// Show stream info if non-default.
|
||||
if (station.data('defaultstream') != stream_id)
|
||||
{
|
||||
station.find('.genre-info').hide();
|
||||
station.find('.stream-info').html('<i class="icon-code-fork"></i> '+stream.name).show();
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.genre-info').show();
|
||||
station.find('.stream-info').hide();
|
||||
}
|
||||
|
||||
// Trigger notification of song change.
|
||||
if (station.hasClass('playing'))
|
||||
{
|
||||
if (stream.current_song.id != nowplaying_song_id && jp_is_playing) {
|
||||
notify(station.data('image'), station_info.station.name, stream.current_song.text, { tag: 'nowplaying' });
|
||||
}
|
||||
|
||||
nowplaying_song = stream.current_song.text;
|
||||
nowplaying_song_id = stream.current_song.id;
|
||||
}
|
||||
|
||||
// Post listener count.
|
||||
var station_listeners = intOrZero(station_info.listeners.current);
|
||||
|
||||
if (station_listeners >= 0)
|
||||
{
|
||||
listener_total += station_listeners;
|
||||
station.find('.nowplaying-listeners').show().html('<i class="icon-user"></i> '+station_listeners);
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.nowplaying-listeners').hide();
|
||||
}
|
||||
|
||||
// Post listener count for each stream.
|
||||
_(station_info.streams).forEach(function(stream_row)
|
||||
{
|
||||
var stream_listeners = intOrZero(stream_row.listeners.current);
|
||||
|
||||
if (stream_row.status == 'online')
|
||||
station.find('li[rel="'+stream_row.id+'"]').show();
|
||||
else
|
||||
station.find('li[rel="'+stream_row.id+'"]').hide();
|
||||
|
||||
station.find('li[rel="'+stream_row.id+'"] .nowplaying-stream-listeners').html('<i class="icon-user"></i>'+stream_listeners);
|
||||
});
|
||||
|
||||
// Style offline/online stations properly.
|
||||
if (stream.status == 'offline')
|
||||
{
|
||||
station.addClass('offline');
|
||||
|
||||
if (station.data('inactive') == 'hide')
|
||||
station.hide();
|
||||
}
|
||||
else
|
||||
{
|
||||
station.removeClass('offline');
|
||||
|
||||
if (!station.is(':visible'))
|
||||
station.show();
|
||||
}
|
||||
|
||||
// Set event data.
|
||||
var event_info;
|
||||
|
||||
if (station_info.event.title)
|
||||
{
|
||||
event_info = station_info.event;
|
||||
station.find('.nowplaying-onair').show().html('<i class="icon-star"></i> On Air: '+event_info.title);
|
||||
}
|
||||
else if (station_info.event_upcoming.title)
|
||||
{
|
||||
event_info = station_info.event_upcoming;
|
||||
station.find('.nowplaying-onair').show().html('<i class="icon-star"></i> In '+intOrZero(event_info.minutes_until)+' mins: '+event_info.title);
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.nowplaying-onair').empty().hide();
|
||||
}
|
||||
|
||||
// Set station history.
|
||||
if (stream.song_history)
|
||||
{
|
||||
var history_block = '';
|
||||
var i = 1;
|
||||
|
||||
_(stream.song_history).forEach(function(history_row) {
|
||||
var history_song;
|
||||
if (history_row.song.title != '')
|
||||
history_song = history_row.song.artist+' - '+history_row.song.title;
|
||||
else
|
||||
history_song = history_row.song.text;
|
||||
|
||||
history_block += '<div>#'+i+': <a href="#" onclick="showSongInfo(\''+history_row.song.id+'\'); return false;">'+history_song+'</a></div>';
|
||||
i++;
|
||||
});
|
||||
|
||||
station.find('.station-history').html(history_block);
|
||||
}
|
||||
|
||||
var current_song_id = station.data('songid');
|
||||
var song_id = stream.current_song.id;
|
||||
|
||||
// Detect a change in song.
|
||||
if (current_song_id != song_id)
|
||||
{
|
||||
station.find('.vote-wrapper a').removeClass('btn-active');
|
||||
|
||||
var song_score = intOrZero(stream.current_song.score);
|
||||
station.find('.nowplaying-score').data('original', song_score).text(song_score);
|
||||
}
|
||||
|
||||
station.data('songid', song_id);
|
||||
|
||||
var song_history_id = intOrZero(stream.current_song.sh_id);
|
||||
station.data('historyid', song_history_id);
|
||||
|
||||
return listener_total;
|
||||
}
|
||||
|
||||
function processVideoNowPlayingRow(station_info, station_id)
|
||||
{
|
||||
var listener_total = 0;
|
||||
|
||||
_(station_info.streams).forEach(function(stream_info) {
|
||||
var station = $('#channel_' + station_id + '_' + stream_info.id);
|
||||
var station_exists = (station.length != 0);
|
||||
|
||||
if (!station_exists)
|
||||
return 0;
|
||||
|
||||
// Post listener count.
|
||||
var station_listeners = intOrZero(stream_info.meta.listeners);
|
||||
|
||||
if (station_listeners >= 0)
|
||||
{
|
||||
listener_total += station_listeners;
|
||||
station.find('.nowplaying-listeners').show().html('<i class="icon-user"></i> ' + station_listeners);
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.nowplaying-listeners').hide();
|
||||
}
|
||||
|
||||
if (stream_info.on_air.thumbnail)
|
||||
{
|
||||
station.find('img.video-thumbnail').attr('src', stream_info.on_air.thumbnail);
|
||||
}
|
||||
|
||||
// Style offline/online stations properly.
|
||||
if (stream_info.meta.status == 'offline')
|
||||
{
|
||||
station.removeClass('online offline').addClass('offline').hide();
|
||||
}
|
||||
else
|
||||
{
|
||||
if (!station.is(':visible'))
|
||||
{
|
||||
notify(station_info.station.image_url, station_info.station.name, 'Stream online!', {tag: 'nowplaying'});
|
||||
}
|
||||
|
||||
station.removeClass('online offline').addClass('online').show();
|
||||
}
|
||||
|
||||
// Set event data.
|
||||
var event_info;
|
||||
|
||||
if (station_info.event.title)
|
||||
{
|
||||
event_info = station_info.event;
|
||||
station.find('.nowplaying-onair').show().find('.nowplaying-inner').html('<i class="icon-star"></i> On Air: ' + event_info.title);
|
||||
}
|
||||
else if (station_info.event_upcoming.title)
|
||||
{
|
||||
event_info = station_info.event_upcoming;
|
||||
station.find('.nowplaying-onair').show().find('.nowplaying-inner').html('<i class="icon-star"></i> In ' + intOrZero(event_info.minutes_until) + ' mins: ' + event_info.title);
|
||||
}
|
||||
else
|
||||
{
|
||||
station.find('.nowplaying-onair').empty().hide();
|
||||
}
|
||||
});
|
||||
|
||||
return listener_total;
|
||||
}
|
||||
|
||||
function playStation(id)
|
||||
{
|
||||
var station = $('#'+id);
|
||||
|
||||
var stream_type = station.data('type');
|
||||
var stream_url = station.data('stream');
|
||||
nowplaying_url = stream_url;
|
||||
|
||||
var currently_playing = station.hasClass('playing');
|
||||
|
||||
if (currently_playing)
|
||||
{
|
||||
stopAllPlayers();
|
||||
}
|
||||
else
|
||||
{
|
||||
if (stream_url && stream_type)
|
||||
{
|
||||
stopAllPlayers();
|
||||
|
||||
station.find('.station-player-container').append('<div id="pvl-jplayer"></div><div id="pvl-jplayer-controls"></div>');
|
||||
$('#pvl-jplayer-controls').append($('#pvl-jplayer-controls-image').html());
|
||||
|
||||
$("#pvl-jplayer").jPlayer({
|
||||
ready: function (event) {
|
||||
ready = true;
|
||||
startPlayer(nowplaying_url);
|
||||
},
|
||||
pause: function() {
|
||||
stopAllPlayers();
|
||||
},
|
||||
play: function() {
|
||||
jp_is_playing = true;
|
||||
},
|
||||
suspend: function(event) {
|
||||
console.log('Stream Suspended');
|
||||
|
||||
jp_is_playing = false;
|
||||
},
|
||||
error: function(event) {
|
||||
var error_details = event.jPlayer.error;
|
||||
console.log('Error: '+error_details.message+' - '+error_details.hint);
|
||||
jp_is_playing = false;
|
||||
|
||||
// Auto-replay if Media URL load failure.
|
||||
if (error_details.message == 'Media URL could not be loaded.')
|
||||
startPlayer(nowplaying_url);
|
||||
else
|
||||
stopAllPlayers();
|
||||
},
|
||||
volumechange: function(event) {
|
||||
volume = Math.round(event.jPlayer.options.volume * 100);
|
||||
|
||||
// Persist to local webstorage if enabled.
|
||||
if (store.enabled)
|
||||
store.set('pvlive_player_volume', volume);
|
||||
},
|
||||
wmode: 'window',
|
||||
swfPath: DF_ContentPath+'/jplayer/jquery.jplayer.swf',
|
||||
solution: (canPlayMp3()) ? 'html, flash' : 'flash',
|
||||
supplied: 'mp3',
|
||||
preload: 'none',
|
||||
volume: (volume/100),
|
||||
muted: false,
|
||||
backgroundColor: '#000000',
|
||||
cssSelectorAncestor: '#pvl-jplayer-controls',
|
||||
errorAlerts: false,
|
||||
warningAlerts: false
|
||||
});
|
||||
|
||||
station.addClass('playing');
|
||||
nowplaying_station = id;
|
||||
|
||||
$('#tunein_player').data('current_station', station.data('id'));
|
||||
|
||||
// Force a reload of the "now playing" data.
|
||||
processNowPlaying();
|
||||
|
||||
// Log in Google Analytics
|
||||
ga('send', 'event', 'Station', 'Play', station.data('name'));
|
||||
}
|
||||
else
|
||||
{
|
||||
$('#player').text('Error: This stream is not currently active. Please select another stream to continue.');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var check_interval;
|
||||
|
||||
function startPlayer()
|
||||
{
|
||||
var stream = {
|
||||
title: "Ponyville Live!",
|
||||
mp3: getPlaybackUrl()
|
||||
};
|
||||
|
||||
$("#pvl-jplayer").jPlayer("setMedia", stream).jPlayer("play");
|
||||
|
||||
is_playing = true;
|
||||
check_interval = setInterval('checkPlayer()', 1500);
|
||||
}
|
||||
|
||||
function getPlaybackUrl()
|
||||
{
|
||||
var playback_url = addParameter(nowplaying_url, 'played_at', getUnixTimestamp());
|
||||
console.log('Playback URL: '+playback_url);
|
||||
|
||||
return playback_url;
|
||||
}
|
||||
|
||||
function checkPlayer()
|
||||
{
|
||||
if (is_playing && !jp_is_playing)
|
||||
{
|
||||
clearInterval(check_interval);
|
||||
startPlayer();
|
||||
}
|
||||
}
|
||||
|
||||
function stopAllPlayers()
|
||||
{
|
||||
if ($("#pvl-jplayer").length > 0 && is_playing)
|
||||
{
|
||||
try
|
||||
{
|
||||
$('#pvl-jplayer').jPlayer('stop');
|
||||
}
|
||||
catch(e) {}
|
||||
|
||||
try
|
||||
{
|
||||
$('#pvl-jplayer').jPlayer("clearMedia").jPlayer("destroy");
|
||||
}
|
||||
catch(e) {}
|
||||
}
|
||||
|
||||
is_playing = false;
|
||||
nowplaying_station = null;
|
||||
|
||||
$('.station .station-player-container').empty();
|
||||
$('.station-history').hide();
|
||||
|
||||
$('.station').removeClass('playing');
|
||||
|
||||
$('#tunein_player').removeData('current_station');
|
||||
}
|
||||
|
||||
function canPlayMp3()
|
||||
{
|
||||
if (isIE())
|
||||
return false;
|
||||
|
||||
if (isSteam())
|
||||
return false;
|
||||
|
||||
var a = document.createElement('audio');
|
||||
var can_play_mp3 = !!(a.canPlayType && a.canPlayType('audio/mpeg;').replace(/no/, ''));
|
||||
return can_play_mp3;
|
||||
}
|
||||
|
||||
function isIE () {
|
||||
var myNav = navigator.userAgent.toLowerCase();
|
||||
return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
|
||||
}
|
||||
|
||||
function isSteam() {
|
||||
var myNav = navigator.userAgent.toLowerCase();
|
||||
return (myNav.indexOf('gameoverlay') != -1) ? true : false;
|
||||
}
|
||||
|
||||
function playInPopUp(station_id) {
|
||||
var current_station = $('#tunein_player').data('current_station');
|
||||
|
||||
if (station_id == 'current')
|
||||
station_id = current_station;
|
||||
|
||||
if (current_station)
|
||||
stopAllPlayers();
|
||||
|
||||
if (station_id !== undefined)
|
||||
orig_url += '/id/'+station_id;
|
||||
|
||||
// Force mobile page.
|
||||
orig_url = '//ponyvillelive.com/mobile';
|
||||
|
||||
window.open(orig_url, 'pvl_player', 'height=600,width=400,status=yes,scrollbars=yes', true);
|
||||
}
|
||||
|
||||
/* Station schedule popup. */
|
||||
function showStationSchedule(station_id)
|
||||
{
|
||||
console.log('Station Upcoming Schedule: '+station_id);
|
||||
|
||||
var url = DF_BaseUrl+'/index/upcoming/id/'+station_id;
|
||||
modalPopup(url, {
|
||||
'width': 400,
|
||||
'minWidth': 400,
|
||||
'maxWidth': 400,
|
||||
'maxHeight': 500
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Utility Functions
|
||||
*/
|
||||
|
||||
function notify(image, title, description, opts)
|
||||
{
|
||||
// Defaults (including title/desc parameters).
|
||||
var options = {
|
||||
tag: 'pvlnotify',
|
||||
icon: image,
|
||||
body: description,
|
||||
timeout: 5,
|
||||
notifyClose: null,
|
||||
notifyClick: null
|
||||
};
|
||||
|
||||
// Merge options.
|
||||
for (var i in opts) {
|
||||
if (opts.hasOwnProperty(i)) {
|
||||
options[i] = opts[i];
|
||||
}
|
||||
}
|
||||
|
||||
if (DF_AppEnv != 'production') {
|
||||
var dev_env_name = DF_AppEnv.charAt(0).toUpperCase() + DF_AppEnv.slice(1);
|
||||
title = '('+dev_env_name+') '+title;
|
||||
}
|
||||
|
||||
// Always request permission, skip to granted if already done.
|
||||
Notify.requestPermission(function() {
|
||||
|
||||
console.log([title, options]);
|
||||
|
||||
var notice = new Notify(title, options);
|
||||
notice.show();
|
||||
|
||||
});
|
||||
}
|
|
@ -1,106 +0,0 @@
|
|||
/*
|
||||
* Load Main Bootstrap LESS files
|
||||
*/
|
||||
|
||||
@import '../vendors/bower_components/bootstrap/less/bootstrap';
|
||||
|
||||
/*
|
||||
* LESS Plugins
|
||||
*/
|
||||
@import 'inc/less-plugins/for';
|
||||
|
||||
|
||||
/*
|
||||
* Variable and Mixin
|
||||
*/
|
||||
|
||||
@import 'inc/variables';
|
||||
@import 'inc/mixin';
|
||||
|
||||
/*
|
||||
* Load Font
|
||||
*/
|
||||
@import 'inc/font';
|
||||
|
||||
/*
|
||||
* Vendors
|
||||
*/
|
||||
@import '../vendors/weather-icons/weather-icons';
|
||||
@import '../vendors/fileinput/fileinput';
|
||||
@import '../vendors/bower_components/material-shadows/material-shadows';
|
||||
// @import '../vendors/bower_components/Waves/src/less/waves';
|
||||
|
||||
/*
|
||||
* Load Website related LESS files
|
||||
*/
|
||||
@import 'inc/generics';
|
||||
@import 'inc/bootstrap-overrides';
|
||||
@import 'inc/base';
|
||||
@import 'inc/list';
|
||||
@import 'inc/header';
|
||||
@import 'inc/sidebar';
|
||||
@import 'inc/dropdown';
|
||||
@import 'inc/listview';
|
||||
@import 'inc/progress-bar';
|
||||
@import 'inc/chat';
|
||||
@import 'inc/tabs';
|
||||
@import 'inc/card';
|
||||
@import 'inc/chart';
|
||||
@import 'inc/widgets';
|
||||
@import 'inc/table';
|
||||
@import 'inc/todo';
|
||||
@import 'inc/button';
|
||||
@import 'inc/form';
|
||||
@import 'inc/pagination';
|
||||
@import 'inc/popover';
|
||||
@import 'inc/wizard';
|
||||
@import 'inc/alert';
|
||||
@import 'inc/media';
|
||||
@import 'inc/modal';
|
||||
@import 'inc/panel';
|
||||
@import 'inc/tooltip';
|
||||
@import 'inc/breadcrumb';
|
||||
@import 'inc/messages';
|
||||
@import 'inc/404';
|
||||
@import 'inc/login';
|
||||
@import 'inc/profile';
|
||||
@import 'inc/photos';
|
||||
@import 'inc/contacts';
|
||||
@import 'inc/shadow';
|
||||
@import 'inc/misc';
|
||||
@import 'inc/ie-warning';
|
||||
@import 'inc/footer';
|
||||
@import 'inc/pricing-table';
|
||||
@import 'inc/invoice';
|
||||
@import 'inc/wall';
|
||||
@import 'inc/skin';
|
||||
@import 'inc/preloader';
|
||||
|
||||
@import 'inc/print';
|
||||
|
||||
/*
|
||||
* Vendor Overrides
|
||||
*/
|
||||
@import 'inc/vendor-overrides/mediaelement';
|
||||
@import 'inc/vendor-overrides/fullcalendar';
|
||||
@import 'inc/vendor-overrides/bootgrid';
|
||||
@import 'inc/vendor-overrides/bootstrap-select';
|
||||
@import 'inc/vendor-overrides/chosen';
|
||||
@import 'inc/vendor-overrides/noUiSlider';
|
||||
@import 'inc/vendor-overrides/farbtastic';
|
||||
@import 'inc/vendor-overrides/summernote';
|
||||
@import 'inc/vendor-overrides/bootstrap-datetimepicker';
|
||||
@import 'inc/vendor-overrides/fileinput';
|
||||
@import 'inc/vendor-overrides/light-gallery';
|
||||
// @import 'inc/vendor-overrides/waves';
|
||||
@import 'inc/vendor-overrides/sweetalert';
|
||||
@import 'inc/vendor-overrides/typeahead';
|
||||
@import 'inc/vendor-overrides/malihu-custom-scrollbar';
|
||||
|
||||
/*
|
||||
* Custom Pages
|
||||
*/
|
||||
|
||||
@import 'pages/legacy';
|
||||
@import 'pages/files';
|
||||
@import 'pages/radio';
|
|
@ -0,0 +1,111 @@
|
|||
/*
|
||||
* Load Main Bootstrap LESS files
|
||||
*/
|
||||
|
||||
@import '../vendors/bower_components/bootstrap/less/bootstrap';
|
||||
|
||||
/*
|
||||
* LESS Plugins
|
||||
*/
|
||||
@import 'dark/less-plugins/for';
|
||||
|
||||
|
||||
/*
|
||||
* Variable and Mixin
|
||||
*/
|
||||
|
||||
@import 'dark/variables';
|
||||
@import 'dark/mixin';
|
||||
|
||||
/*
|
||||
* Load Font
|
||||
*/
|
||||
@import 'dark/font';
|
||||
|
||||
/*
|
||||
* Vendors
|
||||
*/
|
||||
@import '../vendors/weather-icons/weather-icons';
|
||||
@import '../vendors/fileinput/fileinput';
|
||||
@import '../vendors/bower_components/material-shadows/material-shadows';
|
||||
/* @import '../vendors/bower_components/Waves/src/less/waves'; */
|
||||
|
||||
/*
|
||||
* Load Website related LESS files
|
||||
*/
|
||||
@import 'dark/generics';
|
||||
@import 'dark/bootstrap-overrides';
|
||||
@import 'dark/base';
|
||||
@import 'dark/list';
|
||||
@import 'dark/header';
|
||||
@import 'dark/sidebar';
|
||||
@import 'dark/dropdown';
|
||||
@import 'dark/list-group';
|
||||
@import 'dark/progress-bar';
|
||||
@import 'dark/chat';
|
||||
@import 'dark/tabs';
|
||||
@import 'dark/card';
|
||||
@import 'dark/chart';
|
||||
@import 'dark/widgets';
|
||||
@import 'dark/table';
|
||||
@import 'dark/todo';
|
||||
@import 'dark/button';
|
||||
@import 'dark/form';
|
||||
@import 'dark/pagination';
|
||||
@import 'dark/popover';
|
||||
@import 'dark/wizard';
|
||||
@import 'dark/alert';
|
||||
@import 'dark/media';
|
||||
@import 'dark/modal';
|
||||
@import 'dark/panel';
|
||||
@import 'dark/tooltip';
|
||||
@import 'dark/breadcrumb';
|
||||
@import 'dark/messages';
|
||||
@import 'dark/404';
|
||||
@import 'dark/login';
|
||||
@import 'dark/profile';
|
||||
@import 'dark/photos';
|
||||
@import 'dark/contacts';
|
||||
@import 'dark/shadow';
|
||||
@import 'dark/misc';
|
||||
@import 'dark/ie-warning';
|
||||
@import 'dark/footer';
|
||||
@import 'dark/pricing-table';
|
||||
@import 'dark/invoice';
|
||||
@import 'dark/wall';
|
||||
/* @import 'dark/skin'; */
|
||||
@import 'dark/preloader';
|
||||
|
||||
@import 'dark/print';
|
||||
|
||||
/*
|
||||
* Vendor Overrides
|
||||
*/
|
||||
@import 'dark/vendor-overrides/mediaelement';
|
||||
@import 'dark/vendor-overrides/fullcalendar';
|
||||
@import 'dark/vendor-overrides/bootgrid';
|
||||
@import 'dark/vendor-overrides/bootstrap-select';
|
||||
@import 'dark/vendor-overrides/chosen';
|
||||
@import 'dark/vendor-overrides/noUiSlider';
|
||||
@import 'dark/vendor-overrides/farbtastic';
|
||||
@import 'dark/vendor-overrides/summernote';
|
||||
@import 'dark/vendor-overrides/bootstrap-datetimepicker';
|
||||
@import 'dark/vendor-overrides/fileinput';
|
||||
@import 'dark/vendor-overrides/light-gallery';
|
||||
|
||||
/* @import 'dark/vendor-overrides/waves'; */
|
||||
|
||||
@import 'dark/vendor-overrides/sweetalert';
|
||||
@import 'dark/vendor-overrides/typeahead';
|
||||
@import 'dark/vendor-overrides/malihu-custom-scrollbar';
|
||||
|
||||
/**
|
||||
* App Page Overrides
|
||||
*/
|
||||
|
||||
@import 'pages/header';
|
||||
@import 'pages/sidebar';
|
||||
|
||||
@import 'pages/legacy';
|
||||
@import 'pages/files';
|
||||
@import 'pages/radio';
|
|
@ -0,0 +1,66 @@
|
|||
.four-zero {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.fz-block {
|
||||
background: @card-bg;
|
||||
border-radius: 2px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -150px;
|
||||
text-align: center;
|
||||
padding: 25px;
|
||||
height: 300px;
|
||||
width: 500px;
|
||||
left: 50%;
|
||||
margin-left: -250px;
|
||||
|
||||
h2 {
|
||||
font-size: 130px;
|
||||
line-height: 100%;
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
width: ~"calc(100% - 40px)";
|
||||
left: 20px;
|
||||
margin-left: 0;
|
||||
height: 260px;
|
||||
margin-top: -130px;
|
||||
|
||||
h2 {
|
||||
font-size: 90px;
|
||||
}
|
||||
}
|
||||
|
||||
small {
|
||||
display: block;
|
||||
font-size: 26px;
|
||||
margin-top: -10px
|
||||
}
|
||||
}
|
||||
|
||||
.fzb-links {
|
||||
margin-top: 20px;
|
||||
|
||||
& > a {
|
||||
font-size: 16px;
|
||||
display: inline-block;
|
||||
color: @text-color;
|
||||
margin: 0 1px;
|
||||
line-height: 30px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: rgba(0, 0, 0, 0.09);
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
.alert {
|
||||
padding-left: 30px;
|
||||
font-size: 13px;
|
||||
|
||||
span {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&:not(.alert-dismissible) {
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
&.alert-dismissable {
|
||||
padding-right: 44px;
|
||||
}
|
||||
|
||||
&.growl-animated {
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
}
|
||||
|
||||
.alert-default {
|
||||
.alert-variant(#fff; #fff; @text-dark);
|
||||
}
|
||||
|
||||
.alert-link {
|
||||
color: #fff !important;
|
||||
}
|
|
@ -4,7 +4,8 @@
|
|||
|
||||
*,
|
||||
*:active,
|
||||
*:hover {
|
||||
*:hover,
|
||||
*:focus {
|
||||
outline: none !important;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
@ -12,18 +13,28 @@
|
|||
html {
|
||||
overflow-x: ~"hidden\0/";
|
||||
-ms-overflow-style: none;
|
||||
|
||||
&:not(.ie9) {
|
||||
body {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
&.ismobile * {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
html, body {
|
||||
min-height: 100vh;
|
||||
}
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
body {
|
||||
font-weight: 400;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
audio, video {
|
||||
audio, video {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
@ -31,10 +42,6 @@ p {
|
|||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
|
||||
small {
|
||||
font-size: 12px;
|
||||
|
@ -45,33 +52,38 @@ h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
|
|||
position: relative;
|
||||
padding-bottom: @footer-height;
|
||||
padding-top: @header-height + 30;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.sidebar-toggled {
|
||||
#main {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
&.c-alt {
|
||||
&.container-alt {
|
||||
max-width: 1170px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) and (max-width: @screen-md-max) {
|
||||
#content {
|
||||
#content {
|
||||
&:not(.content-alt) {
|
||||
@media (min-width: (@screen-lg-min + 80)) {
|
||||
padding-left: @sidebar-left-width + 15;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: (@screen-sm-min)) and (max-width: (@screen-md-max + 80)) {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
&.sw-toggled {
|
||||
#content {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
padding-left: @sidebar-left-width;
|
||||
}
|
||||
&.content-alt {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
|
||||
& > .container {
|
||||
@media (min-width: @screen-lg-min) {
|
||||
width: ~"calc(100% - 30px)";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,6 +1,6 @@
|
|||
/*
|
||||
* Media - Overriding the Media object to 3.2 version in order to prevent issues like text overflow.
|
||||
*/
|
||||
/*------------------------------------------------------------------------------------------------------------
|
||||
Media - Overriding the Media object to 3.2 version in order to prevent issues like text overflow.
|
||||
--------------------------------------------------------------------------------------------------------------*/
|
||||
.media {
|
||||
.clearfix();
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
.breadcrumb {
|
||||
border-bottom: 1px solid rgba(255,255,255,0.04);
|
||||
border-radius: 0;
|
||||
margin-top: -27px;
|
||||
margin-bottom: 50px;
|
||||
|
||||
@media(min-width: (@screen-lg-min + 80)) {
|
||||
padding: 10px 33px 11px 300px;
|
||||
}
|
||||
|
||||
@media(max-width: (@screen-md-max + 80)) {
|
||||
padding: 10px 33px 11px;
|
||||
}
|
||||
|
||||
& > li {
|
||||
|
||||
& > a {
|
||||
color: @text-color;
|
||||
|
||||
&:hover {
|
||||
color: @breadcrumb-active-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,125 @@
|
|||
.btn {
|
||||
border: 0;
|
||||
text-transform: uppercase;
|
||||
|
||||
|
||||
&[class*="bgm-"]:not(.bgm-white) {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.caret {
|
||||
margin-top: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group, .btn-group-vertical {
|
||||
.btn,
|
||||
.btn:active,
|
||||
.btn:focus,
|
||||
.btn-group {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-xs {
|
||||
.button-size(2px; @padding-xs-horizontal; 11px; @line-height-small; @border-radius-small);
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
text-decoration: none;
|
||||
border-radius: 2px;
|
||||
color: @text-color;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-inverse {
|
||||
.button-variant(#fff, #454545, transparent);
|
||||
}
|
||||
|
||||
.btn-icon {
|
||||
border-radius: 50%;
|
||||
width: 40px;
|
||||
line-height: 42px;
|
||||
height: 40px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
|
||||
.zmdi {
|
||||
font-size: 17px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-icon-text {
|
||||
& > .zmdi {
|
||||
font-size: 15px;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
margin-top: 2px;
|
||||
line-height: 100%;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-float {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
line-height: 46px !important;
|
||||
|
||||
&:not(.m-btn) {
|
||||
position: absolute !important;
|
||||
}
|
||||
|
||||
i {
|
||||
font-size: 23px;
|
||||
.transition(all);
|
||||
.transition-duration(500ms);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
i {
|
||||
.rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.bgm-white):not(.bgm-gray):not(.btn-default) {
|
||||
& > i {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
&.bgm-white,
|
||||
&.bgm-gray {
|
||||
& > i {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.open .btn {
|
||||
outline: none !important;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
|
||||
|
||||
&:focus, &:active {
|
||||
outline: none !important;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*----------------------------------------
|
||||
Material Design Add button
|
||||
------------------------------------------*/
|
||||
.m-btn {
|
||||
z-index: 1;
|
||||
bottom: 40px;
|
||||
right: 40px;
|
||||
position: fixed !important;
|
||||
}
|
|
@ -0,0 +1,69 @@
|
|||
.card {
|
||||
position: relative;
|
||||
background: @card-bg;
|
||||
box-shadow: @card-shadow;
|
||||
margin-bottom: @grid-gutter-width;
|
||||
|
||||
.card-header {
|
||||
position: relative;
|
||||
padding: 23px 25px;
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
line-height: 100%;
|
||||
font-size: 17px;
|
||||
font-weight: 400;
|
||||
|
||||
small {
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
line-height: 160%;
|
||||
}
|
||||
}
|
||||
|
||||
&.ch-alt {
|
||||
background-color: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
&[class*="bgm-"] {
|
||||
h2, h2 small {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
z-index: 2;
|
||||
top: 15px;
|
||||
}
|
||||
|
||||
.btn-float {
|
||||
right: 25px;
|
||||
bottom: -23px;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
a.card-header {
|
||||
display: block;
|
||||
}
|
||||
|
||||
a.ch-alt:hover {
|
||||
background-color: rgba(255, 255, 255, 0.055);
|
||||
}
|
||||
|
||||
.card-body {
|
||||
&.card-padding {
|
||||
padding: 25px 27px;
|
||||
}
|
||||
|
||||
&.card-padding-sm {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-header:not(.ch-alt):not([class*="bgm-"]) + .card-padding {
|
||||
padding-top: 0;
|
||||
}
|
|
@ -13,16 +13,19 @@
|
|||
}
|
||||
|
||||
.mini-charts-item {
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
|
||||
box-shadow: @card-shadow;
|
||||
position: relative;
|
||||
margin-bottom: 30px;
|
||||
background-color: @card-bg;
|
||||
|
||||
.chart {
|
||||
padding: 15px;
|
||||
padding: 19px;
|
||||
float: left;
|
||||
|
||||
|
||||
&.chart-pie {
|
||||
margin: 0 20px;
|
||||
padding: 14px 11px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -36,7 +39,6 @@
|
|||
line-height: 100%;
|
||||
font-size: 22px;
|
||||
font-weight: 300;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
& > small {
|
||||
|
@ -62,9 +64,9 @@
|
|||
.transition-duration(500ms);
|
||||
.backface-visibility(hidden);
|
||||
content: "";
|
||||
width: 113px;
|
||||
width: 105px;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,0.1);
|
||||
background: rgba(255,255,255,0.04);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
|
@ -81,9 +83,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Sparkline Tooltip
|
||||
*/
|
||||
/*------------------------------
|
||||
Sparkline Tooltip
|
||||
-------------------------------*/
|
||||
#jqstooltip {
|
||||
min-width: 21px;
|
||||
min-height: 23px;
|
||||
|
@ -91,7 +93,6 @@
|
|||
border: 0;
|
||||
background: #fff;
|
||||
box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
|
||||
background-color: #fff;
|
||||
|
||||
.jqsfield {
|
||||
font-size: 12px;
|
||||
|
@ -106,9 +107,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Easy Pie Charts
|
||||
*/
|
||||
/*------------------------------
|
||||
Easy Pie Charts
|
||||
-------------------------------*/
|
||||
|
||||
.epc-item {
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
|
||||
|
@ -149,10 +150,6 @@
|
|||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.pie-title {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.main-pie) {
|
||||
|
@ -176,9 +173,9 @@
|
|||
|
||||
}
|
||||
|
||||
/*
|
||||
* Recet Items Table Chart
|
||||
*/
|
||||
/*------------------------------
|
||||
Recent Items Table Chart
|
||||
-------------------------------*/
|
||||
#recent-items-chart {
|
||||
width: ~"calc(100% + 19px)";
|
||||
height: 150px;
|
||||
|
@ -187,9 +184,9 @@
|
|||
|
||||
}
|
||||
|
||||
/*
|
||||
* Flot Chart
|
||||
*/
|
||||
/*------------------------------
|
||||
Flot Chart
|
||||
-------------------------------*/
|
||||
[class*="flot-chart"] {
|
||||
width: 100%;
|
||||
display: block;
|
||||
|
@ -238,6 +235,7 @@
|
|||
|
||||
.legendLabel {
|
||||
padding: 0 8px 0 3px;
|
||||
color: @text-color;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,79 @@
|
|||
#chat {
|
||||
padding: 20px 0 5px;
|
||||
width: @sidebar-right-width;
|
||||
right: -(@sidebar-right-width + 20);
|
||||
box-shadow: 0 0 30px #0E1215;
|
||||
|
||||
&.toggled {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.chat-search {
|
||||
padding: 20px 20px 15px 20px;
|
||||
|
||||
.form-control {
|
||||
background-repeat: no-repeat;
|
||||
background-position: left center;
|
||||
padding-left: 30px;
|
||||
background-color: transparent;
|
||||
|
||||
.placeholder(rgba(255, 255, 255, 0.3));
|
||||
|
||||
&:focus {
|
||||
padding: 0 30px 0 0;
|
||||
|
||||
& + .zmdi-search {
|
||||
left: ~"calc(100% - 15px)";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-control, .zmdi-search {
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
|
||||
.zmdi-search {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 6px;
|
||||
font-size: 20px;
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
.lg-body {
|
||||
height: ~"calc(100% - 70px)";
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------------------
|
||||
Chat Status Icons
|
||||
-------------------------------*/
|
||||
[class*="chat-status"] {
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
top: -3px;
|
||||
right: 12px;
|
||||
border: 2px solid #FFF;
|
||||
}
|
||||
|
||||
/* Simple Mixin */
|
||||
.chat-status(@color) {
|
||||
box-shadow: 0 0 0 1px @color;
|
||||
background: @color;
|
||||
}
|
||||
|
||||
.chat-status-online {
|
||||
.chat-status(#1EC01E);
|
||||
}
|
||||
|
||||
.chat-status-offline {
|
||||
.chat-status(#E73F3F);
|
||||
}
|
||||
|
||||
.chat-status-busy {
|
||||
.chat-status(#FFA500);
|
||||
}
|
|
@ -0,0 +1,71 @@
|
|||
.contacts {
|
||||
&:not(.c-profile) {
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
& > [class*="col-"] {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.c-item {
|
||||
border-radius: 2px;
|
||||
margin-bottom: 24px;
|
||||
background-color: rgba(255,255,255,0.04);
|
||||
|
||||
.ci-avatar {
|
||||
display: block;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
border-radius: 2px 2px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ci-avatar {
|
||||
margin: -1px -1px 0;
|
||||
}
|
||||
|
||||
.c-info {
|
||||
text-align: center;
|
||||
margin-top: 15px;
|
||||
padding: 0 5px;
|
||||
|
||||
strong {
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
small {
|
||||
margin-top: 3px;
|
||||
color: @text-muted;
|
||||
}
|
||||
|
||||
strong,
|
||||
small {
|
||||
.text-overflow();
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.c-footer {
|
||||
margin-top: 18px;
|
||||
|
||||
& > button {
|
||||
padding: 7px 10px;
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
|
||||
& > i {
|
||||
font-size: 16px;
|
||||
vertical-align: middle;
|
||||
margin-top: -3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,56 @@
|
|||
.dropdown:not([data-animation]) .dropdown-menu {
|
||||
.animated(fadeIn, 300ms);
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: @dropdown-shadow;
|
||||
padding: 10px 0;
|
||||
border-radius: 3px;
|
||||
top: -1px;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
color: @text-dark;
|
||||
|
||||
& > li > a {
|
||||
padding: 10px 20px;
|
||||
.transition(background-color);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
|
||||
&[class*="bgm-"] {
|
||||
& > li > a {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropup {
|
||||
.dropdown-menu {
|
||||
bottom: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
.dm-icon {
|
||||
& > li > a > .zmdi {
|
||||
line-height: 100%;
|
||||
vertical-align: top;
|
||||
font-size: 18px;
|
||||
width: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu-lg {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.dropdown-header {
|
||||
padding: 3px 17px;
|
||||
margin-top: 10px;
|
||||
color: #b1b1b1;
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.btn-group.open .dropdown-toggle {
|
||||
box-shadow: none;
|
||||
}
|
|
@ -0,0 +1,29 @@
|
|||
/*--------------------
|
||||
Roboto Light
|
||||
---------------------*/
|
||||
.font-face(roboto, 'Roboto-Light-webfont', 300, normal);
|
||||
|
||||
|
||||
/*--------------------
|
||||
Roboto Regular
|
||||
---------------------*/
|
||||
.font-face(roboto, 'Roboto-Regular-webfont', 400, normal);
|
||||
|
||||
|
||||
/*--------------------
|
||||
Roboto Medium
|
||||
---------------------*/
|
||||
.font-face(roboto, 'Roboto-Medium-webfont', 500, normal);
|
||||
|
||||
|
||||
/*--------------------
|
||||
Roboto Bold
|
||||
---------------------*/
|
||||
.font-face(roboto, 'Roboto-Bold-webfont', 700, normal);
|
||||
|
||||
|
||||
/*--------------------
|
||||
Satisfy
|
||||
---------------------*/
|
||||
.font-face(satisfy, 'satisfy', 400, normal);
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
#footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: @footer-height;
|
||||
color: #a2a2a2;
|
||||
padding-top: 35px;
|
||||
padding-bottom: 15px;
|
||||
.opacity(0.5);
|
||||
|
||||
@media (min-width: (@screen-lg-min + 80)) {
|
||||
padding-left: @sidebar-left-width;
|
||||
}
|
||||
|
||||
.f-menu {
|
||||
display: block;
|
||||
width: 100%;
|
||||
.list-inline();
|
||||
margin-top: 8px;
|
||||
|
||||
& > li > a {
|
||||
color: #a2a2a2;
|
||||
|
||||
&:hover {
|
||||
color: #777;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-toggled {
|
||||
#footer {
|
||||
display: none;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,497 @@
|
|||
label {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/*-----------------------------------
|
||||
Reset Focus and Active shadows
|
||||
------------------------------------*/
|
||||
input:active,
|
||||
input:focus {
|
||||
outline: 0;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
box-shadow: none !important;
|
||||
resize: none;
|
||||
|
||||
&:active,
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&:not(.fc-alt) {
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-top: 0;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
padding: 0;
|
||||
|
||||
&.auto-size {
|
||||
padding-top: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.form-control-alt {
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
|
||||
&:focus {
|
||||
border-color: #d6d6d6;
|
||||
}
|
||||
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
||||
/*------------------------
|
||||
Checkbox and Radio
|
||||
-------------------------*/
|
||||
.input-helper:before,
|
||||
.input-helper:after,
|
||||
.checkbox label:before,
|
||||
.radio label:before,
|
||||
.radio-inline:before,
|
||||
.checkbox-inline:before {
|
||||
.transition(all);
|
||||
.transition-duration(250ms);
|
||||
}
|
||||
|
||||
.checkbox, .radio {
|
||||
padding-top: 0 !important;
|
||||
|
||||
label {
|
||||
display: block;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
input {
|
||||
top: 0;
|
||||
left: 0;
|
||||
margin-left: 0 !important;
|
||||
z-index: 1;
|
||||
cursor: pointer;
|
||||
.opacity(0);
|
||||
margin-top: 0;
|
||||
|
||||
&:checked + .input-helper {
|
||||
&:before {
|
||||
border-color: @off-white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input-helper {
|
||||
|
||||
&:before, &:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
}
|
||||
|
||||
&:before {
|
||||
left: 0;
|
||||
border: 2px solid rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
.opacity(0.6);
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
input {
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
|
||||
&:checked + .input-helper {
|
||||
&:before {
|
||||
background-color: @off-white;
|
||||
}
|
||||
|
||||
&:after {
|
||||
.opacity(1);
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input-helper {
|
||||
&:before {
|
||||
top: 0;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
.opacity(0);
|
||||
.scale(0);
|
||||
content: '\f26b';
|
||||
font-family: @font-icon-md;
|
||||
position: absolute;
|
||||
font-size: 13px;
|
||||
left: 2px;
|
||||
top: 1px;
|
||||
color: @card-bg;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.radio {
|
||||
input {
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
|
||||
&:checked + .input-helper {
|
||||
&:after {
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input-helper {
|
||||
&:before {
|
||||
top: -1px;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
&:after {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
background: @off-white ;
|
||||
border-radius: 50%;
|
||||
top: 4px;
|
||||
left: 5px;
|
||||
.scale(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-inline,
|
||||
.radio-inline {
|
||||
vertical-align: top;
|
||||
margin-top: 0;
|
||||
padding-left: 25px;
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
Select
|
||||
--------------------------*/
|
||||
html:not(.ie9) {
|
||||
.select {
|
||||
position: relative;
|
||||
|
||||
.select-bg();
|
||||
|
||||
&:not(.fg-line):before {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&.fg-line:before {
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Input Group Addon
|
||||
--------------------------*/
|
||||
.input-group {
|
||||
&:not(.input-group-lg):not(.input-group-sm) .input-group-addon {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
border-width: 0px 0px 1px 0px;
|
||||
min-width: 42px;
|
||||
|
||||
& > .zmdi {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
Input Feilds
|
||||
--------------------------*/
|
||||
.fg-line {
|
||||
position: relative;
|
||||
vertical-align: top;
|
||||
|
||||
&:not(.form-group) {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
&:disabled {
|
||||
color: rgba(255,255,255,0.3);
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.disabled):after,
|
||||
&:not(.readonly):after {
|
||||
position: absolute;
|
||||
z-index: 3;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 2px;
|
||||
width: 100%;
|
||||
content: "";
|
||||
.scale(0);
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
|
||||
&:not([class*=has-]):after {
|
||||
background: @off-white;
|
||||
}
|
||||
|
||||
&.readonly .form-control {
|
||||
color: #9d9d9d;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&.fg-toggled {
|
||||
&:after {
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fg-line-alt {
|
||||
&:not([class*=has-]):after {
|
||||
background: @m-blue;
|
||||
}
|
||||
}
|
||||
|
||||
.fg-float {
|
||||
margin-top: 2px;
|
||||
position: relative;
|
||||
|
||||
.form-control {
|
||||
position: relative;
|
||||
background: transparent;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.fg-label {
|
||||
.transition(all);
|
||||
.transition-duration(200ms);
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
font-weight: 400;
|
||||
color: @off-white;
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
left: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.fg-toggled .fg-label {
|
||||
top: -20px;
|
||||
font-size: 11px;
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
|
||||
.control-label {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
Toggle Switch
|
||||
--------------------------*/
|
||||
.ts-color(@color){
|
||||
input {
|
||||
&:not(:disabled) {
|
||||
&:checked {
|
||||
& + .ts-helper {
|
||||
background: fade(@color, 50%);
|
||||
|
||||
&:before {
|
||||
background: @color;
|
||||
}
|
||||
|
||||
&:active {
|
||||
&:before {
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.28), 0 0 0 20px fade(@color, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toggle-switch {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
.user-select(none);
|
||||
|
||||
.ts-label {
|
||||
display: inline-block;
|
||||
margin: 0 20px 0 0;
|
||||
vertical-align: top;
|
||||
-webkit-transition: color 0.56s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: color 0.56s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
.ts-helper {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 40px;
|
||||
height: 16px;
|
||||
border-radius: 8px;
|
||||
background: rgba(255, 255, 255, 0.07);
|
||||
-webkit-transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: #fafafa;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.28);
|
||||
border-radius: 50%;
|
||||
webkit-transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.disabled) {
|
||||
.ts-helper {
|
||||
&:active {
|
||||
&:before {
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.28), 0 0 0 20px rgba(128,128,128,0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 46px;
|
||||
margin: 0 0 0 -4px;
|
||||
height: 24px;
|
||||
.opacity(0);
|
||||
cursor: pointer;
|
||||
|
||||
&:checked {
|
||||
& + .ts-helper {
|
||||
&:before {
|
||||
left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:not([data-ts-color]){
|
||||
.ts-color(@m-teal);
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
.opacity(0.6);
|
||||
}
|
||||
|
||||
&[data-ts-color="red"] {
|
||||
.ts-color(@m-red);
|
||||
}
|
||||
|
||||
&[data-ts-color="blue"] {
|
||||
.ts-color(@m-blue);
|
||||
}
|
||||
|
||||
&[data-ts-color="amber"] {
|
||||
.ts-color(@m-amber);
|
||||
}
|
||||
|
||||
&[data-ts-color="purple"] {
|
||||
.ts-color(@m-purple);
|
||||
}
|
||||
|
||||
&[data-ts-color="pink"] {
|
||||
.ts-color(@m-pink);
|
||||
}
|
||||
|
||||
&[data-ts-color="lime"] {
|
||||
.ts-color(@m-lime);
|
||||
}
|
||||
|
||||
&[data-ts-color="cyan"] {
|
||||
.ts-color(@m-cyan);
|
||||
}
|
||||
|
||||
&[data-ts-color="green"] {
|
||||
.ts-color(@m-green);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
Validation
|
||||
--------------------------*/
|
||||
.checkbox-fgline-validation(@color) {
|
||||
.checkbox .input-helper {
|
||||
&:before {
|
||||
border-color: lighten(@color, 20%);
|
||||
}
|
||||
|
||||
&:after {
|
||||
border-bottom-color: lighten(@color, 10%);;
|
||||
border-left-color: lighten(@color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.fg-line:after {
|
||||
background: @color;
|
||||
}
|
||||
|
||||
}
|
||||
.has-error {
|
||||
.checkbox-fgline-validation(@m-red);
|
||||
}
|
||||
|
||||
.has-success {
|
||||
.checkbox-fgline-validation(@m-green);
|
||||
}
|
||||
|
||||
.has-warning {
|
||||
.checkbox-fgline-validation(@m-orange);
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
IE 9 Placeholder
|
||||
--------------------------*/
|
||||
.ie9-placeholder {
|
||||
color: #888 !important;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/*-----------------------------------
|
||||
Fix Textarea Scrollbar in IE9
|
||||
------------------------------------*/
|
||||
.ie9 {
|
||||
textarea {
|
||||
overflow: auto !important;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,158 @@
|
|||
/*---------------------------------------------------------------------------
|
||||
Generate Margin Class
|
||||
margin, margin-top, margin-bottom, margin-left, margin-right
|
||||
----------------------------------------------------------------------------*/
|
||||
.margin (@label, @size: 1, @key:1) when (@size =< 30){
|
||||
.m-@{key} {
|
||||
margin: @size !important;
|
||||
}
|
||||
|
||||
.m-t-@{key} {
|
||||
margin-top: @size !important;
|
||||
}
|
||||
|
||||
.m-b-@{key} {
|
||||
margin-bottom: @size !important;
|
||||
}
|
||||
|
||||
.m-l-@{key} {
|
||||
margin-left: @size !important;
|
||||
}
|
||||
|
||||
.m-r-@{key} {
|
||||
margin-right: @size !important;
|
||||
}
|
||||
|
||||
.margin(@label - 5; @size + 5; @key + 5);
|
||||
}
|
||||
|
||||
.margin(25, 0px, 0);
|
||||
|
||||
|
||||
/*---------------------------------------------------------------------------
|
||||
Generate Padding Class
|
||||
padding, padding-top, padding-bottom, padding-left, padding-right
|
||||
----------------------------------------------------------------------------*/
|
||||
.padding (@label, @size: 1, @key:1) when (@size =< 30){
|
||||
.p-@{key} {
|
||||
padding: @size !important;
|
||||
}
|
||||
|
||||
.p-t-@{key} {
|
||||
padding-top: @size !important;
|
||||
}
|
||||
|
||||
.p-b-@{key} {
|
||||
padding-bottom: @size !important;
|
||||
}
|
||||
|
||||
.p-l-@{key} {
|
||||
padding-left: @size !important;
|
||||
}
|
||||
|
||||
.p-r-@{key} {
|
||||
padding-right: @size !important;
|
||||
}
|
||||
|
||||
.padding(@label - 5; @size + 5; @key + 5);
|
||||
}
|
||||
|
||||
.padding(25, 0px, 0);
|
||||
|
||||
|
||||
/*---------------------------------------------------------------------------
|
||||
Generate Font-Size Classes (8px - 20px)
|
||||
----------------------------------------------------------------------------*/
|
||||
.font-size (@label, @size: 8, @key:10) when (@size =< 20){
|
||||
.f-@{key} {
|
||||
font-size: @size !important;
|
||||
}
|
||||
|
||||
.font-size(@label - 1; @size + 1; @key + 1);
|
||||
}
|
||||
|
||||
.font-size(20, 8px, 8);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Font Weight
|
||||
--------------------------*/
|
||||
.f-300 { font-weight: 300 !important; }
|
||||
.f-400 { font-weight: 400 !important; }
|
||||
.f-500 { font-weight: 500 !important; }
|
||||
.f-700 { font-weight: 700 !important; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Position
|
||||
--------------------------*/
|
||||
.p-relative { position: relative !important; }
|
||||
.p-absolute { position: absolute !important; }
|
||||
.p-fixed { position: fixed !important; }
|
||||
.p-static { position: static !important; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Overflow
|
||||
--------------------------*/
|
||||
.o-hidden { overflow: hidden !important; }
|
||||
.o-visible { overflow: visible !important; }
|
||||
.o-auto { overflow: auto !important; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Display
|
||||
--------------------------*/
|
||||
.d-block { display: block !important; }
|
||||
.di-block { display: inline-block !important; }
|
||||
|
||||
|
||||
/*-------------------------------
|
||||
Material Background Colors
|
||||
--------------------------------*/
|
||||
@array: c-white bgm-white @m-white, c-black bgm-black @m-black, c-brown bgm-brown @m-brown, c-pink bgm-pink @m-pink, c-red bgm-red @m-red, c-blue bgm-blue @m-blue, c-purple bgm-purple @m-purple, c-deeppurple bgm-deeppurple @m-deeppurple, c-lightblue bgm-lightblue @m-lightblue, c-cyan bgm-cyan @m-cyan, c-teal bgm-teal @m-teal, c-green bgm-green @m-green, c-lightgreen bgm-lightgreen @m-lightgreen, c-lime bgm-lime @m-lime, c-yellow bgm-yellow @m-yellow, c-amber bgm-amber @m-amber, c-orange bgm-orange @m-orange, c-deeporange bgm-deeporange @m-deeporange, c-gray bgm-gray @m-gray, c-bluegray bgm-bluegray @m-bluegray, c-indigo bgm-indigo @m-indigo;
|
||||
|
||||
.for(@array); .-each(@value) {
|
||||
@name: extract(@value, 1);
|
||||
@name2: extract(@value, 2);
|
||||
@color: extract(@value, 3);
|
||||
&.@{name2} {
|
||||
background-color: @color !important;
|
||||
}
|
||||
|
||||
&.@{name} {
|
||||
color: @color !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Background Colors
|
||||
--------------------------*/
|
||||
.bg-black-trp { background-color: rgba(0,0,0,0.1) !important; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Border
|
||||
--------------------------*/
|
||||
.b-0 { border: 0 !important; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
width
|
||||
--------------------------*/
|
||||
.w-100 { width: 100% !important; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Border Radius
|
||||
--------------------------*/
|
||||
.brd-2 { border-radius: 2px; }
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Gray Filter
|
||||
--------------------------*/
|
||||
.gray-filter {
|
||||
.gray-filter();
|
||||
}
|
|
@ -0,0 +1,387 @@
|
|||
/*--------------------------------------------------
|
||||
Common header classes & IDs
|
||||
Do not remove this
|
||||
---------------------------------------------------*/
|
||||
.h-inner {
|
||||
list-style: none;
|
||||
padding: 17px 0;
|
||||
margin-bottom: 0;
|
||||
position: relative;
|
||||
|
||||
& > li {
|
||||
&:not(.pull-right) {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hi-logo {
|
||||
a {
|
||||
color: @off-white;
|
||||
text-transform: uppercase;
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.hi-trigger {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
margin-left: -5px;
|
||||
display: none;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
border-radius: 50%;
|
||||
background: @card-bg;
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
.scale(0);
|
||||
z-index: 0;
|
||||
margin-top: -22px;
|
||||
margin-left: -22px;
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
&:before {
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hi-menu {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
margin: 0 1px;
|
||||
vertical-align: top;
|
||||
min-width: 50px;
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
position: static !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.dropdown-menu-lg {
|
||||
padding: 0;
|
||||
|
||||
.lg-body {
|
||||
min-height: 350px;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
& > a {
|
||||
color: @off-white;
|
||||
display: block;
|
||||
text-align: center;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
|
||||
& > .him-icon {
|
||||
font-size: 24px;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
& > .him-label {
|
||||
line-height: 35px;
|
||||
white-space: nowrap;
|
||||
padding: 0 10px;
|
||||
font-size: @font-size-base + 1;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
& > .him-counts {
|
||||
position: absolute;
|
||||
font-style: normal;
|
||||
background: #C13228;
|
||||
padding: 1px 5px;
|
||||
border-radius: 2px;
|
||||
right: 7px;
|
||||
top: -3px;
|
||||
font-size: 10px;
|
||||
line-height: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&.toggled > a,
|
||||
&:hover > a {
|
||||
background-color: rgba(255,255,255,0.04);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
.dropdown-menu-lg {
|
||||
width: ~"calc(100% - 28px)" !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
right: 14px;
|
||||
top: 55px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.him-notification {
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: ~"calc(100% - 70px)";
|
||||
background: url(../img/notifications.png) no-repeat center;
|
||||
.transition(all);
|
||||
.transition-duration(400ms);
|
||||
.scale-rotate(0, -180deg);
|
||||
.opacity(0);
|
||||
top: 42px;
|
||||
}
|
||||
|
||||
&.empty:before {
|
||||
.scale-rotate(1, 0deg);
|
||||
.opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
/* Full Screen */
|
||||
:-webkit-full-screen [data-ma-action="fullscreen"] { display: none; }
|
||||
:-moz-full-screen [data-ma-action="fullscreen"] { display: none; }
|
||||
:-ms-fullscreen [data-ma-action="fullscreen"] { display: none; }
|
||||
:full-screen [data-ma-action="fullscreen"] { display: none; }
|
||||
:fullscreen [data-ma-action="fullscreen"] { display: none; }
|
||||
|
||||
/* ----------------------------- End common header classes and IDs------------------------------------- */
|
||||
|
||||
|
||||
|
||||
/*--------------------------------------------------
|
||||
For header type 1 only
|
||||
You may remove these if you opt header 2
|
||||
---------------------------------------------------*/
|
||||
#header {
|
||||
background-color: @header-bg;
|
||||
min-height: @header-height;
|
||||
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
|
||||
.user-select(none);
|
||||
|
||||
position: fixed;
|
||||
z-index: 11;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 20px;
|
||||
|
||||
@media(max-width: @screen-xs-max) {
|
||||
padding: 0px 8px;
|
||||
}
|
||||
|
||||
.hi-logo a {
|
||||
padding: 7px 10px;
|
||||
}
|
||||
|
||||
.ma-backdrop {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.hi-trigger {
|
||||
@media(max-width: (@screen-md-max + 80)) {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
&.search-toggled {
|
||||
.h-search-wrap {
|
||||
top: 0;
|
||||
.opacity(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.h-search-wrap {
|
||||
position: absolute;
|
||||
top: -65px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: @header-height;
|
||||
background: @header-bg;
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
.opacity(0);
|
||||
z-index: 10;
|
||||
|
||||
input[type="text"] {
|
||||
border: 0;
|
||||
height: 40px;
|
||||
padding: 0 10px 0 55px;
|
||||
font-size: 18px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
color: @text-dark;
|
||||
}
|
||||
|
||||
.hsw-close {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
font-size: 23px;
|
||||
font-style: normal;
|
||||
width: 45px;
|
||||
text-align: center;
|
||||
border-radius: 2px 0px 0px 2px;
|
||||
cursor: pointer;
|
||||
left: 15px;
|
||||
height: 40px;
|
||||
padding-top: 9px;
|
||||
color: @header-bg;
|
||||
|
||||
&:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
right: 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hsw-inner {
|
||||
position: relative;
|
||||
padding: 15px;
|
||||
max-width: 700px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* ----------------------------- End header type 1 ------------------------------------- */
|
||||
|
||||
|
||||
|
||||
/*--------------------------------------------------
|
||||
For Header type 2 only
|
||||
You may remove these if you opt header 1
|
||||
---------------------------------------------------*/
|
||||
|
||||
#header-alt {
|
||||
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
|
||||
position: relative;
|
||||
margin-bottom: -50px;
|
||||
z-index: 10;
|
||||
background-color: @header-bg;
|
||||
padding: 15px 10px 0 35px;
|
||||
|
||||
@media (min-width: @screen-md-min) {
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: rgba(0,0,0,0.08);
|
||||
width: 100%;
|
||||
height: 49px;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
padding: 5px 5px 0 25px;
|
||||
}
|
||||
|
||||
.hi-trigger {
|
||||
top: -7px;
|
||||
left: -15px;
|
||||
|
||||
@media (max-width: @screen-sm-max) {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.ma-backdrop {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.ha-search {
|
||||
margin-bottom: 25px;
|
||||
padding-right: 25px;
|
||||
|
||||
input[type="text"] {
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-bottom: 1px solid @input-border;
|
||||
font-size: 15px;
|
||||
font-weight: 300;
|
||||
padding: 6px 0 6px 30px;
|
||||
|
||||
.placeholder(@off-white);
|
||||
|
||||
&.ie9-placeholder {
|
||||
color: @off-white !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fg-line {
|
||||
max-width: 500px;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: '\f1c3';
|
||||
font-family: @font-icon-md;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 1px;
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ha-menu {
|
||||
@media(min-width: @screen-md-min) {
|
||||
& > ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
&:not(.active) > a {
|
||||
color: rgba(255,255,255,0.3);
|
||||
}
|
||||
|
||||
&.active > a {
|
||||
color: @off-white;
|
||||
box-shadow: inset 0px -2px 0 0px @off-white;
|
||||
}
|
||||
|
||||
& > a {
|
||||
text-transform: uppercase;
|
||||
padding: 15px 12px;
|
||||
display: block;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
min-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: @screen-sm-max) {
|
||||
display: none;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,24 @@
|
|||
.invoice {
|
||||
min-width: 1100px;
|
||||
max-width: 1170px;
|
||||
}
|
||||
|
||||
.i-logo {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.i-info {
|
||||
background-color: rgba(255,255,255,0.04);
|
||||
}
|
||||
|
||||
.i-table {
|
||||
.highlight {
|
||||
background-color: #eee;
|
||||
border-bottom: 1px solid darken(#eee, 3%);
|
||||
}
|
||||
|
||||
td.highlight {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,108 @@
|
|||
.list-group {
|
||||
margin-bottom: 0;
|
||||
|
||||
.list-group-item {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 15px 25px;
|
||||
|
||||
& > .checkbox.pull-left {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.lg-odd-white {
|
||||
.list-group-item:nth-child(odd) {
|
||||
background-color: @list-group-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&.lg-even-white {
|
||||
.list-group-item:nth-child(even) {
|
||||
background-color: @list-group-hover-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lg-header {
|
||||
text-align: center;
|
||||
padding: 15px 10px 13px;
|
||||
line-height: 100%;
|
||||
text-transform: uppercase;
|
||||
border-bottom: 1px solid #F0F0F0;
|
||||
font-weight: 500;
|
||||
color: #4C4C4C;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.lgi-img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.lgi-heading {
|
||||
color: @off-white;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.lgi-heading,
|
||||
.lgi-text {
|
||||
.text-overflow();
|
||||
}
|
||||
|
||||
.lgi-text {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.lgi-checkbox {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.lgi-attrs {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
border: 1px solid @input-border;
|
||||
margin: 2px 2px 2px 0;
|
||||
padding: 2px 5px;
|
||||
font-size: 12px;
|
||||
color: @text-muted;
|
||||
|
||||
& > a {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-group-light {
|
||||
.list-group-item {
|
||||
&:hover {
|
||||
background-color: rgba(0,0,0,0.05);
|
||||
}
|
||||
}
|
||||
|
||||
.lgi-heading {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.lgi-text {
|
||||
color: #A9A9A9;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,144 @@
|
|||
.login-content {
|
||||
min-height: 100vh;
|
||||
text-align: center;
|
||||
|
||||
&:before {
|
||||
display: inline-block;
|
||||
content: '';
|
||||
height: 100vh;
|
||||
width: 1px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.lc-block {
|
||||
max-width: 500px;
|
||||
padding: 20px 0;
|
||||
width: 80%;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
|
||||
&:not(.toggled) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
.animated(fadeInUp, 300ms);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
&:not(.lc-block-alt) {
|
||||
.lcb-form {
|
||||
padding: 35px 55px 35px 25px;
|
||||
}
|
||||
|
||||
.btn-login {
|
||||
top: 50%;
|
||||
margin-top: -43px;
|
||||
right: -25px;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
margin: 5px 0 0 42px;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.lcb-form {
|
||||
background: @card-bg;
|
||||
box-shadow: @card-shadow;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------
|
||||
Login Navigation
|
||||
------------------------------*/
|
||||
.lcb-navigation {
|
||||
margin-top: 15px;
|
||||
|
||||
a, a span {
|
||||
.transition(width);
|
||||
.transition-duration(200ms);
|
||||
}
|
||||
|
||||
a {
|
||||
color: @text-color;
|
||||
display: inline-block;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
margin: 0 1px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 20px;
|
||||
vertical-align: top;
|
||||
white-space: nowrap;
|
||||
text-align: left;
|
||||
|
||||
i {
|
||||
width: 30px;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
span {
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
line-height: 29px;
|
||||
margin-left: -3px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
span {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-ma-block="#l-register"]:hover {
|
||||
width: 95px;
|
||||
}
|
||||
|
||||
&[data-ma-block="#l-forget-password"]:hover {
|
||||
width: 147px;
|
||||
}
|
||||
|
||||
&[data-ma-block="#l-login"]:hover {
|
||||
width: 85px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-----------------------------
|
||||
Lockscreen
|
||||
------------------------------*/
|
||||
.lc-block-alt {
|
||||
.lcb-form {
|
||||
padding: 70px 35px 60px;
|
||||
}
|
||||
|
||||
.btn-login {
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
margin-left: -25px;
|
||||
}
|
||||
}
|
||||
|
||||
.lcb-user {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 50%;
|
||||
border: 4px solid @off-white;
|
||||
position: absolute;
|
||||
top: -35px;
|
||||
left: 50%;
|
||||
margin-left: -50px;
|
||||
box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.18);
|
||||
}
|
|
@ -0,0 +1,128 @@
|
|||
.thumbnail {
|
||||
a&:hover,
|
||||
a&:focus,
|
||||
a&.active {
|
||||
border-color: #484848;
|
||||
}
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
Lightbox
|
||||
-------------------------*/
|
||||
.lightbox {
|
||||
.lightbox-item {
|
||||
overflow: hidden;
|
||||
|
||||
& > img {
|
||||
.transition(all);
|
||||
.transition-duration(200ms);
|
||||
width: 100%;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
.scale-rotate(1.35, 10deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[data-src] {
|
||||
.clearfix();
|
||||
}
|
||||
|
||||
.lightbox-item:not(.p-item) {
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Carousel
|
||||
--------------------------*/
|
||||
.carousel {
|
||||
.carousel-control {
|
||||
.transition(all);
|
||||
.transition-duration(250ms);
|
||||
.opacity(0);
|
||||
|
||||
.zmdi {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
line-height: 100%;
|
||||
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
font-size: 60px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-top: -30px;
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-sm-max) {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-top: -12px;
|
||||
margin-left: -12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.carousel-control {
|
||||
.opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-caption {
|
||||
background: rgba(0,0,0,0.6);
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding-bottom: 50px;
|
||||
|
||||
& > h3 {
|
||||
color: #fff;
|
||||
margin: 0 0 5px;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
& > p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-sm-max) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-indicators {
|
||||
margin: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 0 0 6px;
|
||||
background: rgba(0,0,0,0.6);
|
||||
|
||||
li {
|
||||
border-radius: 0;
|
||||
width: 15px;
|
||||
border: 0;
|
||||
background: #fff;
|
||||
height: 3px;
|
||||
margin: 0;
|
||||
.transition(all);
|
||||
.transition-duration(250ms);
|
||||
|
||||
&.active {
|
||||
width: 25px;
|
||||
height: 3px;
|
||||
background: @m-orange;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,227 @@
|
|||
.messages {
|
||||
border: 1px solid @card-bg;
|
||||
height: ~"calc(100vh - 130px)";
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
header {
|
||||
min-height: 55px;
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*-----------------------------------
|
||||
Sidebar
|
||||
------------------------------------*/
|
||||
.m-sidebar {
|
||||
width: 300px;
|
||||
border-right: 1px solid @card-bg;
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
background: @body-bg;
|
||||
|
||||
@media(max-width: @screen-xs-max) {
|
||||
width: 60px;
|
||||
|
||||
.list-group-item {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.ms-time {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: @card-bg;
|
||||
padding: 20px;
|
||||
|
||||
h2 {
|
||||
line-height: 100%;
|
||||
font-size: 15px;
|
||||
margin: 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.lgi-heading {
|
||||
max-width: 120px;
|
||||
}
|
||||
|
||||
.list-group {
|
||||
height: ~"calc(100% - 130px)";
|
||||
}
|
||||
|
||||
/* Scrollbar fix */
|
||||
.mCSB_scrollTools {
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
.ms-time {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 25px;
|
||||
color: rgba(255,255,255,0.2);
|
||||
}
|
||||
|
||||
.ms-search {
|
||||
padding: 20px 25px;
|
||||
position: relative;
|
||||
|
||||
.zmdi-search {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 8px;
|
||||
font-size: 20px;
|
||||
|
||||
}
|
||||
|
||||
input {
|
||||
padding-left: 25px !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*-----------------------------------
|
||||
Body
|
||||
------------------------------------*/
|
||||
.m-body {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
@media(min-width: @screen-sm-min) {
|
||||
padding-left: 300px;
|
||||
}
|
||||
|
||||
@media(max-width: @screen-xs-max) {
|
||||
padding-left: 60px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.mb-header {
|
||||
background-color: @card-bg;
|
||||
box-shadow: 0px -1px 0px 1px rgba(255,255,255,0.04);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.mbh-user {
|
||||
padding: 12px 20px;
|
||||
|
||||
& > img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
float: left;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.mb-list {
|
||||
height: ~"calc(100% - 55px)";
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mbl-messages {
|
||||
padding: 50px 50px 0;
|
||||
height: ~"calc(100vh - 259px)";
|
||||
overflow-x: hidden;
|
||||
|
||||
@media(max-width: @screen-xs-max) {
|
||||
padding: 20px 20px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mblm-item {
|
||||
position: relative;
|
||||
margin-bottom: 10px;
|
||||
|
||||
& > div {
|
||||
display: inline-block;
|
||||
max-width: 70%;
|
||||
padding: 15px 20px;
|
||||
border-radius: 2px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
small {
|
||||
display: block;
|
||||
color: @text-muted;
|
||||
padding: 5px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.mblm-item-left > div {
|
||||
background-color: @card-bg;
|
||||
}
|
||||
|
||||
.mblm-item-right {
|
||||
text-align: right;
|
||||
|
||||
& > div {
|
||||
background-color: @off-white;
|
||||
color: @text-dark;
|
||||
}
|
||||
}
|
||||
|
||||
.mblmi-img {
|
||||
margin: -10px -15px;
|
||||
|
||||
img {
|
||||
max-width: 250px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.mbl-compose {
|
||||
background-color: @card-bg;
|
||||
height: 70px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 15px 65px 15px 15px;
|
||||
|
||||
textarea {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border-radius: 2px;
|
||||
border: 0;
|
||||
resize: none;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
padding: 5px 10px;
|
||||
color: @text-color;
|
||||
.transition(background-color);
|
||||
.transition-duration(300ms);
|
||||
|
||||
&:focus {
|
||||
background-color: @off-white;
|
||||
color: @text-dark;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
position: absolute;
|
||||
top: 14px;
|
||||
right: 15px;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
font-size: 25px;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,333 @@
|
|||
/*--------------------------------------------------
|
||||
Block Header
|
||||
Used for Heading outside the Cards.
|
||||
---------------------------------------------------*/
|
||||
.block-header {
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
padding: 0 22px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-sm-max) {
|
||||
padding: 0 18px;
|
||||
}
|
||||
|
||||
margin-bottom: 25px;
|
||||
position: relative;
|
||||
|
||||
& > h2 {
|
||||
font-size: 15px;
|
||||
margin: 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
|
||||
& > small {
|
||||
display: block;
|
||||
text-transform: none;
|
||||
margin-top: 8px;
|
||||
margin-bottom: 20px;
|
||||
color: @headings-small-color;
|
||||
line-height: 140%;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: -5px;
|
||||
z-index: 4;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Actions
|
||||
--------------------------*/
|
||||
.actions {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
z-index: 3;
|
||||
margin: 0;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
& > li > a,
|
||||
& > a {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
padding-top: 5px;
|
||||
border-radius: 50%;
|
||||
margin: 0 2px;
|
||||
|
||||
& > i {
|
||||
color: rgba(255,255,255,0.5);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(255,255,255,0.07);
|
||||
|
||||
& > i {
|
||||
color: @off-white
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.actions-alt {
|
||||
& > li {
|
||||
& > a {
|
||||
& > i {
|
||||
color: #adadad;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(0,0,0,0.07);
|
||||
|
||||
& > i {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Collapse Menu Icons
|
||||
--------------------------*/
|
||||
.line-wrap {
|
||||
width: 18px;
|
||||
height: 12px;
|
||||
margin: 12px 17px;
|
||||
cursor: pointer;
|
||||
|
||||
&, .line {
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
|
||||
.line{
|
||||
width: 18px;
|
||||
height: 2px;
|
||||
background-color: #fff;
|
||||
|
||||
&.center {
|
||||
margin: 3px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toggled {
|
||||
.line-wrap {
|
||||
.rotate(180deg);
|
||||
|
||||
.line {
|
||||
&.top {
|
||||
width: 12px;
|
||||
transform: translateX(8px) translateY(1px) rotate(45deg);
|
||||
-webkit-transform: translateX(8px) translateY(1px) rotate(45deg);
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
width: 12px;
|
||||
transform: translateX(8px) translateY(-1px) rotate(-45deg);
|
||||
-webkit-transform: translateX(8px) translateY(-1px) rotate(-45deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Load More
|
||||
--------------------------*/
|
||||
.load-more {
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
|
||||
a {
|
||||
padding: 8px 10px 6px;
|
||||
display: inline-block;
|
||||
background-color: @off-white;
|
||||
border-radius: 2px;
|
||||
white-space: nowrap;
|
||||
color: #333;
|
||||
|
||||
i {
|
||||
font-size: 20px;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
margin-top: -2px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
View More
|
||||
--------------------------*/
|
||||
.view-more {
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 10px 10px 11px;
|
||||
line-height: 100%;
|
||||
font-size: 11px;
|
||||
margin-top: 20px;
|
||||
text-transform: uppercase;
|
||||
|
||||
&:not(.view-more-light) {
|
||||
color: @text-muted;
|
||||
|
||||
&:hover {
|
||||
color: @off-white;
|
||||
}
|
||||
}
|
||||
|
||||
&.view-more-light {
|
||||
color: #828282;
|
||||
|
||||
&:hover {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Page Loader
|
||||
--------------------------*/
|
||||
.page-loader {
|
||||
background: #1E262B;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
|
||||
.preloader {
|
||||
width: 50px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -25px;
|
||||
top: 50%;
|
||||
margin-top: -55px;
|
||||
.animated(fadeIn, 3000ms);
|
||||
|
||||
p {
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
left: -9px;
|
||||
top: 22px;
|
||||
color: rgba(255,255,255,0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------------
|
||||
Action Header
|
||||
-----------------------------------------*/
|
||||
.action-header {
|
||||
padding: 25px 30px;
|
||||
line-height: 100%;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
min-height: 65px;
|
||||
background-color: rgba(255, 255, 255, 0.04);
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
right: 17px;
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
|
||||
.ah-label {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.ah-search {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 11;
|
||||
background-color: #454E53;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ahs-input {
|
||||
border: 0;
|
||||
padding: 0 26px;
|
||||
height: 100%;
|
||||
font-size: 15px;
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
line-height: 60px;
|
||||
color: #fff;
|
||||
|
||||
.placeholder(@off-white);
|
||||
}
|
||||
|
||||
.ahs-close {
|
||||
font-style: normal;
|
||||
position: absolute;
|
||||
top: 23px;
|
||||
right: 25px;
|
||||
font-size: 17px;
|
||||
line-height: 100%;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
background: @off-white;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
color: #333;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------
|
||||
Backdrop
|
||||
-----------------------------------*/
|
||||
.ma-backdrop {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ma-backdrop-alt {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
|
||||
/*----------------------------------
|
||||
Avatar
|
||||
-----------------------------------*/
|
||||
[class*="avatar-img"] {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.avatar-img {
|
||||
width: 42px;
|
||||
}
|
|
@ -0,0 +1,184 @@
|
|||
/*-------------------------
|
||||
Font Face
|
||||
--------------------------*/
|
||||
.font-face(@family, @name, @weight: 300, @style){
|
||||
@font-face{
|
||||
font-family: @family;
|
||||
src:url('../fonts/@{family}/@{name}.eot');
|
||||
src:url('../fonts/@{family}/@{name}.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/@{family}/@{name}.woff') format('woff'),
|
||||
url('../fonts/@{family}/@{name}.ttf') format('truetype'),
|
||||
url('../fonts/@{family}/@{name}.svg#icon') format('svg');
|
||||
font-weight: @weight;
|
||||
font-style: @style;
|
||||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------
|
||||
Background Repeat + Position
|
||||
---------------------------------------------------*/
|
||||
.bg-option(@repeat: no-repeat, @position: center) {
|
||||
background-repeat: @repeat;
|
||||
background-position: @position;
|
||||
}
|
||||
|
||||
|
||||
/*--------------------------------------------------
|
||||
CSS Animations based on animate.css
|
||||
---------------------------------------------------*/
|
||||
.animated(@name, @duration) {
|
||||
-webkit-animation-name: @name;
|
||||
animation-name: @name;
|
||||
-webkit-animation-duration: @duration;
|
||||
animation-duration: @duration;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
|
||||
/*--------------------------------------------------
|
||||
CSS Transform - Scale and Rotate
|
||||
---------------------------------------------------*/
|
||||
.scale-rotate(@scale, @rotate) {
|
||||
-webkit-transform: scale(@scale) rotate(@rotate);
|
||||
-ms-transform: scale(@scale) rotate(@rotate);
|
||||
-o-transform: scale(@scale) rotate(@rotate);
|
||||
transform: scale(@scale) rotate(@rotate);
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
User Select
|
||||
--------------------------*/
|
||||
.user-select (@val) {
|
||||
-webkit-touch-callout: @val;
|
||||
-webkit-user-select: @val;
|
||||
-khtml-user-select: @val;
|
||||
-moz-user-select: @val;
|
||||
-ms-user-select: @val;
|
||||
user-select: @val;
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Background Image Cover
|
||||
--------------------------*/
|
||||
.bg-cover(@image) {
|
||||
background-image: url(@image);
|
||||
background-repeat: no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.bg-cover-inline() {
|
||||
background-repeat: no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Tab Focus
|
||||
--------------------------*/
|
||||
.tab-focus() {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
|
||||
/*--------------------------------------------------
|
||||
Override Bootstrap Button Mixin
|
||||
---------------------------------------------------*/
|
||||
.button-variant(@color; @background; @border) {
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus,
|
||||
&:active,
|
||||
.open > .dropdown-toggle& {
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: transparent;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus {
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: transparent
|
||||
}
|
||||
}
|
||||
&:active,
|
||||
&.active,
|
||||
.open > .dropdown-toggle& {
|
||||
background-image: none;
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus,
|
||||
&:active {
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
color: @background;
|
||||
background-color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Scale 3d
|
||||
--------------------------*/
|
||||
.scale3d(...) {
|
||||
@process: ~`(function(e){return e=e||"1, 1, 1"})((function(){var e="@{arguments}";return e=e.replace(/^\[|\]$/g,"")})())`;
|
||||
-webkit-transform: scale3d(@process);
|
||||
-moz-transform: scale3d(@process);
|
||||
-ms-transform: scale3d(@process);
|
||||
-o-transform: scale3d(@process);
|
||||
transform: scale3d(@process);
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Select BG
|
||||
--------------------------*/
|
||||
.select-bg() {
|
||||
&:before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
content: "";
|
||||
height: ~"calc(100% - 2px)";
|
||||
width: 30px;
|
||||
background-position: right ~"calc(100% - 7px)";
|
||||
background-repeat: no-repeat;
|
||||
.img-retina('../img/select.png', '../img/select@2x.png', 12px, 12px);
|
||||
pointer-events: none;
|
||||
z-index: 5;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Filter Grayscale
|
||||
--------------------------*/
|
||||
.gray-filter() {
|
||||
filter: gray;
|
||||
filter: grayscale(100%);
|
||||
filter: url(../img/desaturate.svg#greyscale);
|
||||
}
|
|
@ -0,0 +1,33 @@
|
|||
.modal {
|
||||
color: @text-muted-dark;
|
||||
|
||||
.modal-content {
|
||||
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.31);
|
||||
border-radius: 3px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 23px 26px;
|
||||
}
|
||||
|
||||
.modal-title {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
padding: 0 26px 10px;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
.btn-link {
|
||||
font-size: 14px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
|
||||
&:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,52 @@
|
|||
.pagination {
|
||||
border-radius: 0;
|
||||
|
||||
& > li {
|
||||
margin: 0 2px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
& > a,
|
||||
& > span {
|
||||
border-radius: 50% !important;
|
||||
padding: 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 38px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
|
||||
& > .zmdi {
|
||||
font-size: 22px;
|
||||
line-height: 39px;
|
||||
}
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
.opacity(0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*-------------------------
|
||||
Listview Pagination
|
||||
--------------------------*/
|
||||
.lg-pagination {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Pager
|
||||
--------------------------*/
|
||||
.pager li > a, .pager li > span {
|
||||
padding: 5px 10px 6px;
|
||||
color: @pagination-color;
|
||||
}
|
|
@ -0,0 +1,91 @@
|
|||
.panel {
|
||||
box-shadow: none;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
& > a {
|
||||
padding: 10px 15px;
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-collapse {
|
||||
margin-bottom: 10px !important;
|
||||
|
||||
.panel-heading {
|
||||
position: relative;
|
||||
|
||||
&:before,
|
||||
&:after,
|
||||
.panel-title > a:before,
|
||||
.panel-title > a:after {
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
.backface-visibility(hidden);
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
& > a {
|
||||
padding: 8px 5px 16px 30px;
|
||||
color: rgba(255,255,255,0.5);
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 2px;
|
||||
width: 100%;
|
||||
content: "";
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
font-family: @font-icon-md;
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
top: 3px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "\f278";
|
||||
.scale(1);
|
||||
}
|
||||
|
||||
&:after {
|
||||
.scale(0);
|
||||
content: "\f273";
|
||||
}
|
||||
|
||||
&.active {
|
||||
.panel-title > a {
|
||||
color: #fff;
|
||||
|
||||
&:before {
|
||||
background: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
}
|
||||
|
||||
&:before {
|
||||
.scale(0);
|
||||
}
|
||||
|
||||
&:after {
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.panel-body {
|
||||
border-top: 0 !important;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,71 @@
|
|||
.photos {
|
||||
margin: 2px 0 0;
|
||||
|
||||
.lightbox {
|
||||
margin: 0 -8px;
|
||||
}
|
||||
|
||||
&:not(.p-timeline) {
|
||||
[data-src] {
|
||||
padding: 3px;
|
||||
.transition(all);
|
||||
.transition-duration(150ms);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.p-timeline {
|
||||
position: relative;
|
||||
padding-left: 80px;
|
||||
margin-bottom: 75px;
|
||||
|
||||
[data-src] {
|
||||
float: left;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
margin: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
|
||||
&:last-child .pt-line:before {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.ptb-title {
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.pt-line {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
line-height: 14px;
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
&:before {
|
||||
width: 1px;
|
||||
height: ~"calc(100% + 62px)";
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
top: 15px;
|
||||
right: -20px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
top: 2px;
|
||||
right: -26px;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,24 @@
|
|||
.popover {
|
||||
box-shadow: 0 2px 30px rgba(0, 0, 0, 0.2);
|
||||
color: @text-muted-dark;
|
||||
}
|
||||
|
||||
.popover-title {
|
||||
border-bottom: 0;
|
||||
padding: 20px 20px 15px;
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
color: #333;
|
||||
|
||||
& + .popover-content {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.popover-content {
|
||||
padding: 20px;
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,68 @@
|
|||
.pt-inner {
|
||||
text-align: center;
|
||||
|
||||
.pti-header {
|
||||
padding: 45px 10px 70px;
|
||||
position: relative;
|
||||
margin-bottom: 15px;
|
||||
|
||||
& > h2 {
|
||||
margin: 0;
|
||||
line-height: 100%;
|
||||
font-weight: 100;
|
||||
font-size: 50px;
|
||||
|
||||
small {
|
||||
letter-spacing: 0;
|
||||
vertical-align: top;
|
||||
font-size: 16px;
|
||||
font-weight: 100;
|
||||
}
|
||||
}
|
||||
|
||||
.ptih-title {
|
||||
background-color: rgba(255,255,255,0.04);
|
||||
padding: 8px 10px 9px;
|
||||
text-transform: uppercase;
|
||||
margin: 0 -10px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.pti-body {
|
||||
padding: 0 23px;
|
||||
|
||||
.ptib-item {
|
||||
padding: 15px 0;
|
||||
font-weight: 400;
|
||||
|
||||
&:not(:last-child) {
|
||||
border-bottom: 1px solid @input-border;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pti-footer {
|
||||
padding: 10px 20px 30px;
|
||||
margin-top: 20px;
|
||||
|
||||
& > a {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
line-height: 60px;
|
||||
font-size: 30px;
|
||||
background-color: @off-white;
|
||||
color: @text-dark;
|
||||
|
||||
&:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
|
@ -18,9 +18,9 @@
|
|||
display: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* INVOICE
|
||||
*/
|
||||
/*-------------------------
|
||||
Invoice
|
||||
--------------------------*/
|
||||
|
||||
.invoice {
|
||||
padding: 30px !important;
|
|
@ -0,0 +1,365 @@
|
|||
#profile-main {
|
||||
min-height: 500px;
|
||||
position: relative;
|
||||
|
||||
.pm-overview {
|
||||
background: rgba(255,255,255,0.04);
|
||||
overflow-y: auto;
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) and (max-width: 1200px) {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.pm-body {
|
||||
@media (min-width: 1200px) {
|
||||
padding-left: 300px;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) and (max-width: 1200px) {
|
||||
padding-left: 250px;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.pmo-pic {
|
||||
position: relative;
|
||||
margin: 20px;
|
||||
|
||||
img {
|
||||
@media(min-width: @screen-sm-min) {
|
||||
width: 100%;
|
||||
border-radius: 2px 2px 0 0;
|
||||
}
|
||||
|
||||
@media(max-width: @screen-xs-max) {
|
||||
width: 180px;
|
||||
display: inline-block;
|
||||
height: 180px;
|
||||
border-radius: 50%;
|
||||
border: 4px solid #fff;
|
||||
.z-depth(2);
|
||||
}
|
||||
}
|
||||
|
||||
.pmo-stat {
|
||||
border-radius: 0 0 2px 2px;
|
||||
text-align: center;
|
||||
padding: 30px 5px 0;
|
||||
|
||||
@media(min-width: @screen-sm-min) {
|
||||
background: @off-white;
|
||||
padding-bottom: 15px;
|
||||
color: @text-dark;
|
||||
|
||||
h2 {
|
||||
color: @text-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pmop-edit {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.38);
|
||||
text-align: center;
|
||||
padding: 10px 10px 11px;
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
i {
|
||||
font-size: 18px;
|
||||
vertical-align: middle;
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
width: 100%;
|
||||
.opacity(0);
|
||||
|
||||
i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.pmop-edit {
|
||||
.opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
.pmop-message {
|
||||
position: absolute;
|
||||
bottom: 27px;
|
||||
left: 50%;
|
||||
margin-left: -25px;
|
||||
|
||||
.dropdown-menu {
|
||||
padding: 5px 0 55px;
|
||||
left: -90px;
|
||||
width: 228px;
|
||||
height: 150px;
|
||||
top: -74px;
|
||||
.transform-origin(center);
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 95px;
|
||||
border: 0;
|
||||
resize: none;
|
||||
padding: 10px 19px;
|
||||
}
|
||||
|
||||
button {
|
||||
bottom: 5px;
|
||||
left: 88px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pmb-block {
|
||||
margin-bottom: 20px;
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
padding: 40px 42px 0;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
padding: 30px 20px 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.pmbb-header {
|
||||
margin-bottom: 25px;
|
||||
position: relative;
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-weight: 100;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.pmbb-edit {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pmbb-edit,
|
||||
.pmbb-view {
|
||||
.animated(fadeIn, 1000ms);
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
.pmbb-edit {
|
||||
display: block;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
padding: 23px 30px;
|
||||
}
|
||||
|
||||
.pmbb-view {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pmo-block {
|
||||
padding: 25px;
|
||||
|
||||
& > h2 {
|
||||
font-size: 16px;
|
||||
margin: 0 0 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.pmo-items {
|
||||
.pmob-body {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
padding: 4px;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pmo-contact {
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
padding: 8px 0 8px 35px;
|
||||
|
||||
i {
|
||||
font-size: 18px;
|
||||
vertical-align: top;
|
||||
line-height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pmo-map {
|
||||
margin: 20px -21px -18px;
|
||||
display: block;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.p-header {
|
||||
position: relative;
|
||||
margin: 0 -7px;
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
top: -18px;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.p-menu {
|
||||
list-style: none;
|
||||
padding: 0 5px;
|
||||
margin: 0 0 30px;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
& > a {
|
||||
display: block;
|
||||
padding: 5px 20px 5px 0;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
font-size: 15px;
|
||||
color: rgba(255,255,255,0.4);
|
||||
|
||||
& > i {
|
||||
margin-right: 4px;
|
||||
font-size: 20px;
|
||||
vertical-align: middle;
|
||||
margin-top: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
&.active > a {
|
||||
color: @off-white;
|
||||
}
|
||||
|
||||
&:not(.active) > a:hover {
|
||||
color: rgba(255,255,255,0.7);
|
||||
}
|
||||
}
|
||||
|
||||
.pm-search {
|
||||
@media(max-width: @screen-sm-max) {
|
||||
margin: 20px 2px 30px;
|
||||
display: block;
|
||||
|
||||
input[type="text"] {
|
||||
width: 100%;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pms-inner {
|
||||
margin: -2px 0 0;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
||||
i {
|
||||
vertical-align: top;
|
||||
font-size: 20px;
|
||||
line-height: 100%;
|
||||
position: absolute;
|
||||
left: 9px;
|
||||
top: 8px;
|
||||
cursor: pointer;
|
||||
color: rgba(255,255,255,0.4);
|
||||
}
|
||||
|
||||
input[type="text"] {
|
||||
height: 35px;
|
||||
border-radius: 2px;
|
||||
padding: 0 10px 0 40px;
|
||||
background: transparent;
|
||||
|
||||
@media(min-width: @screen-sm-min) {
|
||||
border: 1px solid transparent;
|
||||
width: 50px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
|
||||
&:focus {
|
||||
border-color: @input-border;
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
border: 1px solid @input-border;
|
||||
}
|
||||
|
||||
&:not(:focus) {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,228 @@
|
|||
.sidebar {
|
||||
position: fixed;
|
||||
background: @card-bg;
|
||||
height: ~"calc(100% - 65px)";
|
||||
top: @header-height;
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
z-index: 10;
|
||||
overflow-y: auto;
|
||||
box-shadow: @card-shadow;
|
||||
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
width: @sidebar-left-width;
|
||||
|
||||
@media(max-width: (@screen-md-max + 80)) {
|
||||
.translate3d(-@sidebar-left-width, 0, 0);
|
||||
box-shadow: 0 0 30px #0E1215;
|
||||
|
||||
&.toggled {
|
||||
.translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-alt {
|
||||
top: 0;
|
||||
height: 100%;
|
||||
|
||||
.translate3d(-@sidebar-left-width, 0, 0);
|
||||
|
||||
&.toggled {
|
||||
.translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.main-menu {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
|
||||
a {
|
||||
.transition(color);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.active > a,
|
||||
a.active {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
& > li {
|
||||
& > a {
|
||||
display: block;
|
||||
position: relative;
|
||||
color: rgba(255, 255, 255, 0.65);
|
||||
|
||||
& > i {
|
||||
position: absolute;
|
||||
left: 25px;
|
||||
font-size: 20px;
|
||||
top: 0;
|
||||
width: 25px;
|
||||
text-align: center;
|
||||
padding: 13px 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.mm-profile) > a {
|
||||
padding: 14px 20px 14px 65px;
|
||||
}
|
||||
|
||||
& > a:hover,
|
||||
&.active > a {
|
||||
background-color: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mm-profile {
|
||||
& > a {
|
||||
display: block;
|
||||
padding: 20px;
|
||||
color: #fff;
|
||||
|
||||
& > img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
padding-right: 0 !important;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.13);
|
||||
margin-top: 3px;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
.media-body {
|
||||
padding: 2px 10px 0px 15px;
|
||||
|
||||
small {
|
||||
display: block;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-menu {
|
||||
a {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
& > a {
|
||||
position: relative;
|
||||
|
||||
&:before, &:after {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -11px;
|
||||
font-family: @font-icon-md;
|
||||
font-size: 17px;
|
||||
right: 15px;
|
||||
.transition(all);
|
||||
.transition-duration(250ms);
|
||||
.backface-visibility(hidden);
|
||||
.opacity(0);
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "\f278";
|
||||
.scale(1);
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "\f273";
|
||||
.scale(0);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
&:before,
|
||||
&:after {
|
||||
.opacity(0.7);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.toggled,
|
||||
&.active {
|
||||
& > a {
|
||||
&:before,
|
||||
&:after {
|
||||
.opacity(0.7);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
& > a {
|
||||
&:before {
|
||||
content: "\f278";
|
||||
.scale(0);
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "\f273";
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
display: none;
|
||||
padding: 0;
|
||||
|
||||
& > li {
|
||||
& > a {
|
||||
padding: 8px 20px 8px 65px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
&:first-child > a {
|
||||
padding-top: 14px;
|
||||
}
|
||||
|
||||
&:last-child > a {
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
ul {
|
||||
font-size: 12px;
|
||||
margin: 10px 0;
|
||||
background-color: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
& > ul {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
For Stupid IE9
|
||||
--------------------------*/
|
||||
.ie9 {
|
||||
#sidebar {
|
||||
@media(max-width: (@screen-md-max + 80)) {
|
||||
display: none;
|
||||
|
||||
&.toggled {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-alt {
|
||||
display: none;
|
||||
|
||||
&.toggled {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,89 @@
|
|||
.table {
|
||||
margin-bottom: 0;
|
||||
|
||||
& > thead > tr > th {
|
||||
background-color: rgba(255, 255, 255, 0.04);
|
||||
vertical-align: middle;
|
||||
font-weight: 500;
|
||||
border-width: 1px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
&.table-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
& > thead > tr,
|
||||
& > tbody > tr,
|
||||
& > tfoot > tr {
|
||||
& > th, & > td {
|
||||
&:first-child {
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
& > tbody, & > tfoot {
|
||||
& > tr {
|
||||
&.active,
|
||||
&.warning,
|
||||
&.succes,
|
||||
&.danger {
|
||||
& > td {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child > td > {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-striped {
|
||||
td, th {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.table-bordered {
|
||||
border-bottom: 0;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
|
||||
& > tbody > tr {
|
||||
& > td, & > th {
|
||||
border-bottom: 0;
|
||||
border-left: 0;
|
||||
|
||||
&:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
& > thead > tr > th {
|
||||
border-left: 0;
|
||||
|
||||
&:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-vmiddle {
|
||||
td {
|
||||
vertical-align: middle !important;
|
||||
}
|
||||
}
|
||||
|
||||
.table-responsive {
|
||||
border: 0;
|
||||
}
|
||||
|
|
@ -0,0 +1,86 @@
|
|||
.tab-nav {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
white-space: nowrap;
|
||||
margin: 0;
|
||||
overflow: auto;
|
||||
box-shadow: inset 0 -2px 0 0 rgba(255, 255, 255, 0.1);
|
||||
width: 100%;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
& > a {
|
||||
display: inline-block;
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
text-transform: uppercase;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
.transition(all);
|
||||
.transition-duration(250ms);
|
||||
font-weight: 500;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
height: 2px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
.transition(all);
|
||||
.transition-duration(250ms);
|
||||
.scale(0);
|
||||
background: @off-white;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-sm-min) {
|
||||
padding: 15px 8px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
& > a {
|
||||
color: #fff;
|
||||
|
||||
&:after {
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.tab-nav-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
&.tn-justified {
|
||||
& > li {
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&.tn-icon {
|
||||
& > li {
|
||||
.zmdi {
|
||||
font-size: 22px;
|
||||
line-height: 100%;
|
||||
min-height: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
padding: 20px 0;
|
||||
}
|
|
@ -0,0 +1,139 @@
|
|||
#todo {
|
||||
font-family: 'satisfy', cursive;
|
||||
|
||||
.card-header {
|
||||
padding: 28px 35px 20px;
|
||||
|
||||
h2 {
|
||||
font-size: 25px;
|
||||
|
||||
small {
|
||||
font-size: 18px;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
font-size: 18px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
padding: 0;
|
||||
|
||||
.actions {
|
||||
margin-top: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
.input-helper {
|
||||
&:before,
|
||||
&:after {
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
input:checked + i + span {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.t-add,
|
||||
.ta-block,
|
||||
.ta-btn {
|
||||
.transition(all);
|
||||
.backface-visibility(hidden);
|
||||
.transition-duration(250ms);
|
||||
}
|
||||
|
||||
.t-add {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
background: #fff;
|
||||
top: -25px;
|
||||
right: 23px;
|
||||
max-height: 300px;
|
||||
|
||||
.ta-block {
|
||||
overflow: hidden;
|
||||
.opacity(0);
|
||||
|
||||
textarea {
|
||||
padding: 25px 25px 45px;
|
||||
resize: none;
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
color: @m-amber;
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
border: 0;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.toggled) {
|
||||
overflow: hidden;
|
||||
|
||||
.ta-btn {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
font-size: 23px;
|
||||
color: @text-dark;
|
||||
line-height: 51px;
|
||||
}
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
width: ~"calc(100% - 47px)";
|
||||
height: ~"calc(100% - 25px)";
|
||||
border-radius: 2px;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
box-shadow: 0 5px 8px rgba(0, 0, 0, 0.2);
|
||||
overflow: visible;
|
||||
|
||||
.ta-btn {
|
||||
.scale(0);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ta-block {
|
||||
.opacity(1);
|
||||
|
||||
.tab-actions {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
border-top: 1px solid #EEE;
|
||||
z-index: 1;
|
||||
|
||||
& > a {
|
||||
font-size: 25px;
|
||||
padding: 0 6px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
line-height: 48px;
|
||||
display: inline-block;
|
||||
color: @text-dark;
|
||||
|
||||
&:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,4 +1,4 @@
|
|||
.tooltip-inner {
|
||||
border-radius: 1px;
|
||||
padding: 3px 10px 5px;
|
||||
padding: 8px 15px 8px;
|
||||
}
|
|
@ -0,0 +1,337 @@
|
|||
/*-------------------------
|
||||
Font Icon Family
|
||||
--------------------------*/
|
||||
@font-icon-md: 'Material-Design-Iconic-Font';
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Grid System
|
||||
--------------------------*/
|
||||
@container-large-desktop: 100%;
|
||||
@container-tablet: 100%;
|
||||
@container-desktop: 100%;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Typography
|
||||
--------------------------*/
|
||||
@body-bg: #222c32;
|
||||
@text-color: rgba(255,255,255,0.7);
|
||||
@font-family-sans-serif: roboto;
|
||||
@font-size-base: 13px;
|
||||
@link-hover-decoration: none;
|
||||
@headings-color: @off-white;
|
||||
@headings-small-color: rgba(255, 255, 255, 0.4);
|
||||
@text-muted: @headings-small-color;
|
||||
@link-color: @m-cyan;
|
||||
@link-hover-color: lighten(@m-cyan, 10%);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Border Radius
|
||||
--------------------------*/
|
||||
@border-radius-base: 2px;
|
||||
@border-radius-large: 4px;
|
||||
@border-radius-small: 2px;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Tabs
|
||||
--------------------------*/
|
||||
@nav-tabs-border-color: #fff;
|
||||
@nav-tabs-active-link-hover-border-color: #fff;
|
||||
@nav-tabs-active-link-hover-bg: transparent;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Form
|
||||
--------------------------*/
|
||||
@input-border: rgba(255,255,255,0.06);
|
||||
@input-color: @off-white;
|
||||
@input-border-radius: 0;
|
||||
@input-border-radius-large: 0px;
|
||||
@input-height-large: 40px;
|
||||
@input-height-base: 35px;
|
||||
@input-height-small: 30px;
|
||||
@input-border-focus: rgba(255,255,255,0.06);
|
||||
@input-bg: transparent;
|
||||
@input-color-placeholder: rgba(255,255,255,0.4);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Table
|
||||
--------------------------*/
|
||||
@table-bg: transparent;
|
||||
@table-border-color: rgba(255, 255, 255, 0.02);
|
||||
@table-cell-padding: 15px;
|
||||
@table-condensed-cell-padding: 10px;
|
||||
@table-bg-accent: rgba(255, 255, 255, 0.02);
|
||||
@table-bg-active: rgba(255, 255, 255, 0.02);
|
||||
@table-bg-hover: @table-bg-accent;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Input Group
|
||||
--------------------------*/
|
||||
@input-group-addon-bg: transparent;
|
||||
@input-group-addon-border-color: transparent;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Pagination
|
||||
--------------------------*/
|
||||
@pagination-bg: rgba(255,255,255,0.1);
|
||||
@pagination-border: transparent;
|
||||
@pagination-color: @off-white;
|
||||
@pagination-active-bg: #fff;
|
||||
@pagination-active-border: transparent;
|
||||
@pagination-active-color: #313C42;
|
||||
@pagination-disabled-bg: rgba(255, 255, 255, 0.1);
|
||||
@pagination-disabled-border: transparent;
|
||||
@pagination-disabled-color: rgba(255,255,255,0.5);
|
||||
@pagination-hover-color: @off-white;
|
||||
@pagination-hover-bg: rgba(255,255,255,0.2);
|
||||
@pagination-hover-border: transparent;
|
||||
@pager-border-radius: 5px;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Popover
|
||||
--------------------------*/
|
||||
@popover-fallback-border-color: transparent;
|
||||
@popover-border-color: transparent;
|
||||
@zindex-popover: 10;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Dropdown
|
||||
--------------------------*/
|
||||
@dropdown-fallback-border: transparent;
|
||||
@dropdown-border: transparent;
|
||||
@dropdown-divider-bg: '';
|
||||
@dropdown-link-hover-bg: rgba(0,0,0,0.075);
|
||||
@dropdown-link-color: #333;
|
||||
@dropdown-link-hover-color: #333;
|
||||
@dropdown-link-disabled-color: #e4e4e4;
|
||||
@dropdown-divider-bg: rgba(0,0,0,0.08);
|
||||
@dropdown-link-active-color: #333;
|
||||
@dropdown-link-active-bg: rgba(0, 0, 0, 0.075);
|
||||
@zindex-dropdown: 9;
|
||||
@dropdown-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Thumbnail
|
||||
--------------------------*/
|
||||
@thumbnail-bg: #333C42;
|
||||
@thumbnail-caption-padding: 10px 15px;
|
||||
@thumbnail-border: #333C42;
|
||||
@thumbnail-padding: 3px;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Alerts
|
||||
--------------------------*/
|
||||
@alert-success-border: transparent;
|
||||
@alert-info-border: transparent;
|
||||
@alert-warning-border: transparent;
|
||||
@alert-danger-border: transparent;
|
||||
@alert-inverse-border: transparent;
|
||||
|
||||
@alert-success-bg: @m-green;
|
||||
@alert-info-bg: @m-blue;
|
||||
@alert-warning-bg: @m-amber;
|
||||
@alert-danger-bg: @m-red;
|
||||
@alert-inverse-bg: #333;
|
||||
|
||||
@alert-success-text: #fff;
|
||||
@alert-info-text: #fff;
|
||||
@alert-warning-text: #fff;
|
||||
@alert-danger-text: #fff;
|
||||
@alert-inverse-text: #fff;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Form Validations
|
||||
--------------------------*/
|
||||
@state-success-text: lighten(@m-green, 8%);
|
||||
@state-warning-text: lighten(@m-orange, 8%);
|
||||
@state-danger-text: lighten(@m-red, 8%);
|
||||
|
||||
@state-success-bg: lighten(@m-green, 8%);
|
||||
@state-warning-bg: lighten(@m-orange, 8%);
|
||||
@state-danger-bg: lighten(@m-red, 8%);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Buttons
|
||||
--------------------------*/
|
||||
@border-radius-base: 2px;
|
||||
@border-radius-large: 2px;
|
||||
@border-radius-small: 2px;
|
||||
@btn-font-weight: 400;
|
||||
@btn-default-bg: @off-white;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Carousel
|
||||
--------------------------*/
|
||||
@carousel-caption-color: #fff;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Modal
|
||||
--------------------------*/
|
||||
@modal-content-fallback-border-color: transparent;
|
||||
@modal-content-border-color: transparent;
|
||||
@modal-backdrop-bg: #000;
|
||||
@modal-header-border-color: transparent;
|
||||
@modal-title-line-height: transparent;
|
||||
@modal-footer-border-color: transparent;
|
||||
@zindex-modal-background: 11;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Tooltips
|
||||
--------------------------*/
|
||||
@tooltip-bg: @off-white;
|
||||
@tooltip-opacity: 1;
|
||||
@tooltip-color: @text-dark;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Popover
|
||||
--------------------------*/
|
||||
@zindex-popover: 9;
|
||||
@popover-title-bg: #fff;
|
||||
@popover-border-color: #fff;
|
||||
@popover-fallback-border-color: #fff;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Breadcrumbs
|
||||
--------------------------*/
|
||||
@breadcrumb-bg: transparent;
|
||||
@breadcrumb-padding-horizontal: 20px;
|
||||
@breadcrumb-color: @text-color;
|
||||
@breadcrumb-active-color: #7c7c7c;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Jumbotron
|
||||
--------------------------*/
|
||||
@jumbotron-bg: rgba(255, 255, 255, 0.04);
|
||||
|
||||
|
||||
/* ------------------------
|
||||
List Group
|
||||
--------------------------*/
|
||||
@list-group-bg: transparent;
|
||||
@list-group-border: #f4f4f4;
|
||||
@list-group-active-color: #000;
|
||||
@list-group-active-bg: rgba(255, 255, 255, 0.04);
|
||||
@list-group-active-border: @list-group-border;
|
||||
@list-group-disabled-color: #B5B4B4;
|
||||
@list-group-disabled-bg: #fff;
|
||||
@list-group-disabled-text-color: #B5B4B4;
|
||||
@list-group-hover-bg: rgba(255, 255, 255, 0.02);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Badges
|
||||
--------------------------*/
|
||||
@badge-color: @text-dark;
|
||||
@badge-bg: @off-white;
|
||||
@badge-border-radius: 2px;
|
||||
@badge-font-weight: 400;
|
||||
@badge-active-color: @text-dark;
|
||||
@badge-active-bg: #fff;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Material Colors
|
||||
--------------------------*/
|
||||
@m-white: #fff;
|
||||
@m-black: #000000;
|
||||
@m-blue: #2196F3;
|
||||
@m-red: #F44336;
|
||||
@m-purple: #9C27B0;
|
||||
@m-deeppurple: #673AB7;
|
||||
@m-lightblue: #03A9F4;
|
||||
@m-cyan: #00BCD4;
|
||||
@m-teal: #009688;
|
||||
@m-green: #4CAF50;
|
||||
@m-lightgreen: #8BC34A;
|
||||
@m-lime: #CDDC39;
|
||||
@m-yellow: #FFEB3B;
|
||||
@m-amber: #FFC107;
|
||||
@m-orange: #FF9800;
|
||||
@m-deeporange: #FF5722;
|
||||
@m-gray: #9E9E9E;
|
||||
@m-bluegray: #607D8B;
|
||||
@m-indigo: #3F51B5;
|
||||
@m-pink: #E91E63;
|
||||
@m-brown: #795548;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Bootstrap Branding
|
||||
--------------------------*/
|
||||
@brand-primary: @m-blue;
|
||||
@brand-success: @m-green;
|
||||
@brand-info: @m-cyan;
|
||||
@brand-warning: @m-orange;
|
||||
@brand-danger: @m-red;
|
||||
@app-gray: #F7F7F7;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Progress Bar
|
||||
--------------------------*/
|
||||
@progress-bg: rgba(255, 255, 255, 0.1);
|
||||
@progress-bar-bg: @off-white;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Colors
|
||||
--------------------------*/
|
||||
@ace: #F7F7F7;
|
||||
@off-white: #D8DADA;
|
||||
@text-dark: #2b343a;
|
||||
@text-muted-dark: #7D7D7D;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Blocks
|
||||
--------------------------*/
|
||||
@sidebar-left-width: 268px;
|
||||
@sidebar-right-width: 280px;
|
||||
@footer-height: 110px;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Header
|
||||
--------------------------*/
|
||||
@header-bg: #1E262B;
|
||||
@header-height: 70px;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Card
|
||||
--------------------------*/
|
||||
@card-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||
@card-bg: #2b343a;
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Code
|
||||
--------------------------*/
|
||||
@code-color: @text-color;
|
||||
@code-bg: rgba(255, 255, 255, 0.04);
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Panel
|
||||
--------------------------*/
|
||||
@panel-bg: transparent;
|
||||
@panel-heading-padding: 0;
|
|
@ -0,0 +1,141 @@
|
|||
.bootgrid-footer .infoBar, .bootgrid-header .actionBar {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.bootgrid-footer .search, .bootgrid-header .search {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.bootgrid-header {
|
||||
padding: 0 25px 10px;
|
||||
|
||||
.search {
|
||||
border: 1px solid @input-border;
|
||||
|
||||
.form-control, .input-group-addon {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.glyphicon-search {
|
||||
vertical-align: top;
|
||||
padding: 9px 10px 0;
|
||||
|
||||
&:before {
|
||||
content: "\f1c3";
|
||||
font-family: @font-icon-md;
|
||||
font-size: 17px;
|
||||
vertical-align: top;
|
||||
line-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: @screen-xs-min) {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-min) {
|
||||
width: 100%;
|
||||
padding-right: 90px;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
box-shadow: none;
|
||||
|
||||
.btn-group {
|
||||
border: 1px solid @input-border;
|
||||
|
||||
.btn {
|
||||
height: 35px;
|
||||
box-shadow: none !important;
|
||||
background: transparent;
|
||||
color: @off-white;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
.dropdown-item {
|
||||
color: #747474;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
left: 0;
|
||||
margin-top: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.caret {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.zmdi {
|
||||
line-height: 100%;
|
||||
font-size: 18px;
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-min) {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
color: @text-dark;
|
||||
margin: 10px 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.bootgrid-table th > .column-header-anchor {
|
||||
color: @off-white;
|
||||
}
|
||||
|
||||
.bootgrid-table th:active, .bootgrid-table th:hover {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.bootgrid-table th > .column-header-anchor > .icon {
|
||||
top: 0;
|
||||
font-size: 20px;
|
||||
line-height: 100%;
|
||||
}
|
||||
|
||||
.bootgrid-footer {
|
||||
.col-sm-6 {
|
||||
padding: 10px 30px 20px;
|
||||
|
||||
@media (max-width: @screen-sm-min) {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.infoBar {
|
||||
@media (max-width: @screen-sm-min) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.infos {
|
||||
border: 1px solid @input-border;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
padding: 7px 30px;
|
||||
font-size: 12px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select-cell {
|
||||
.checkbox {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.command-edit, .command-delete {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.bootgrid-table td.loading, .bootgrid-table td.no-results {
|
||||
background-color: @card-bg;
|
||||
}
|
|
@ -0,0 +1,205 @@
|
|||
.bootstrap-datetimepicker-widget {
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
width: auto !important;
|
||||
|
||||
&:after, &:before { display: none !important; }
|
||||
|
||||
table td {
|
||||
text-shadow: none;
|
||||
|
||||
span {
|
||||
margin: 0;
|
||||
color: @off-white;
|
||||
|
||||
&:hover { background: transparent; }
|
||||
}
|
||||
}
|
||||
|
||||
.glyphicon { font-family: @font-icon-md; font-size: 18px; }
|
||||
.glyphicon-chevron-left:before { content: "\f2ff"; }
|
||||
.glyphicon-chevron-right:before { content: "\f301"; }
|
||||
.glyphicon-time:before { content: "\f337"; }
|
||||
.glyphicon-calendar:before { content: "\f32e"; }
|
||||
.glyphicon-chevron-up:before { content: "\f1e5"; }
|
||||
.glyphicon-chevron-down:before { content: "\f1e4"; }
|
||||
|
||||
a[data-action] {
|
||||
color: #1F292F !important;
|
||||
}
|
||||
}
|
||||
|
||||
.timepicker-picker {
|
||||
.btn { box-shadow: none !important; }
|
||||
|
||||
table {
|
||||
tbody tr + tr:not(:last-child) {
|
||||
background: #1F292F;
|
||||
color: #fff;
|
||||
|
||||
td {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn,
|
||||
.btn:hover {
|
||||
background: #fff;
|
||||
color: @card-bg !important;
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker {
|
||||
table {
|
||||
thead {
|
||||
tr {
|
||||
th {
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
|
||||
.glyphicon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
line-height: 29px;
|
||||
}
|
||||
|
||||
&:hover .glyphicon {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
th {
|
||||
background: #1F292F;
|
||||
padding: 20px 0;
|
||||
|
||||
&:hover {
|
||||
background: #1F292F;
|
||||
}
|
||||
|
||||
&.picker-switch {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
th {
|
||||
&:first-child { padding-left: 20px; }
|
||||
&:last-child { padding-right: 20px; }
|
||||
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
&:not(:only-child) {
|
||||
background: darken(#1F292F, 3%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
tr {
|
||||
&:last-child {
|
||||
td {
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
&:first-child {
|
||||
padding-left: 13px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-right: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
|
||||
&.day {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
line-height: 20px;
|
||||
color: #333;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
|
||||
&:hover {
|
||||
background: none;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
border-radius: 50%;
|
||||
margin-bottom: -33px;
|
||||
display: inline-block;
|
||||
background: transparent;
|
||||
position: static;
|
||||
text-shadow: none;
|
||||
border-bottom-color: transparent !important;
|
||||
}
|
||||
|
||||
&.old, &.new {
|
||||
color: #CDCDCD;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.today):not(.active) {
|
||||
&:hover:before {
|
||||
background: #F0F0F0;
|
||||
}
|
||||
}
|
||||
|
||||
&.today {
|
||||
color: #333;
|
||||
|
||||
&:before {
|
||||
background-color: #E2E2E2;
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #fff;
|
||||
|
||||
&:before {
|
||||
background-color: #1F292F;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.datepicker-months .month,
|
||||
.datepicker-years .year,
|
||||
.timepicker-minutes .minute,
|
||||
.timepicker-hours .hour {
|
||||
border-radius: 50%;
|
||||
|
||||
&:not(.active) {
|
||||
&:hover {
|
||||
background: #F0F0F0;
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #1F292F;
|
||||
}
|
||||
}
|
||||
|
||||
.timepicker-minutes .minute,
|
||||
.timepicker-hours .hour {
|
||||
padding: 0;
|
||||
}
|
|
@ -0,0 +1,103 @@
|
|||
.bootstrap-select {
|
||||
.dropdown-toggle:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
.bs-caret {
|
||||
display: none;
|
||||
}
|
||||
|
||||
& > .btn-default {
|
||||
background: none !important;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
border-radius: 0;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
color: @off-white;
|
||||
|
||||
&:hover {
|
||||
color: @off-white;
|
||||
}
|
||||
|
||||
.select-bg();
|
||||
}
|
||||
|
||||
.bs-searchbox {
|
||||
padding: 5px 5px 5px 40px;
|
||||
position: relative;
|
||||
background: #f7f7f7;
|
||||
margin-top: -10px;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 1px;
|
||||
width: 40px;
|
||||
height: 100%;
|
||||
content: "\f1c3";
|
||||
font-family: @font-icon-md;
|
||||
font-size: 25px;
|
||||
padding: 4px 0 0 15px;
|
||||
color: #313C42;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: @text-dark;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn-group {
|
||||
.dropdown-menu {
|
||||
li {
|
||||
a.opt {
|
||||
padding-left: 17px;
|
||||
}
|
||||
}
|
||||
|
||||
.no-results {
|
||||
padding: 8px 8px 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.check-mark {
|
||||
margin-top: -5px !important;
|
||||
font-size: 19px;
|
||||
.transition(all);
|
||||
.transition-duration(200ms);
|
||||
.scale(0);
|
||||
display: block !important;
|
||||
position: absolute;
|
||||
top: 11px;
|
||||
right: 15px;
|
||||
|
||||
&:before {
|
||||
content: "\f26b";
|
||||
font-family: @font-icon-md;
|
||||
}
|
||||
}
|
||||
|
||||
.selected {
|
||||
.check-mark {
|
||||
.scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.notify {
|
||||
bottom: 0 !important;
|
||||
margin: 0 !important;
|
||||
width: 100% !important;
|
||||
border: 0 !important;
|
||||
background: @m-red !important;
|
||||
color: #fff !important;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
|
@ -3,44 +3,30 @@
|
|||
box-shadow: @dropdown-shadow;
|
||||
margin-top: 1px;
|
||||
border: 0;
|
||||
left: 0;
|
||||
.scale(0);
|
||||
.opacity(0);
|
||||
.transform-origin(top left);
|
||||
.transition(transform opacity);
|
||||
.transition-duration(250ms);
|
||||
top: 0;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
&.chosen-with-drop {
|
||||
.chosen-drop {
|
||||
.scale(1);
|
||||
.opacity(1);
|
||||
}
|
||||
|
||||
.chosen-single:after {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.chosen-results {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
max-height: 300px;
|
||||
|
||||
|
||||
li {
|
||||
padding: 10px 17px;
|
||||
width: 100%;
|
||||
|
||||
|
||||
&.highlighted {
|
||||
background: @dropdown-link-hover-bg;
|
||||
color: @dropdown-link-hover-color;
|
||||
}
|
||||
|
||||
|
||||
&.result-selected {
|
||||
background: transparent;
|
||||
color: @text-color;
|
||||
position: relative;
|
||||
|
||||
color: #444;
|
||||
|
||||
&:before {
|
||||
content: "\f26b";
|
||||
font-family: @font-icon-md;
|
||||
|
@ -48,14 +34,15 @@
|
|||
right: 15px;
|
||||
top: 10px;
|
||||
font-size: 19px;
|
||||
color: @card-bg;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&.group-result {
|
||||
&:not(:first-child) {
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
|
||||
color: #B2B2B2;
|
||||
font-weight: normal;
|
||||
padding: 16px 15px 6px;
|
||||
|
@ -66,7 +53,8 @@
|
|||
}
|
||||
|
||||
.chosen-container-single {
|
||||
.chosen-single {
|
||||
|
||||
.chosen-single {
|
||||
border-radius: 0;
|
||||
overflow: visible;
|
||||
height: 34px;
|
||||
|
@ -76,30 +64,20 @@
|
|||
border-bottom: 1px solid @input-border;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
width: 0;
|
||||
background: @m-blue;
|
||||
height: 2px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -1px;
|
||||
.transition(width);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
|
||||
color: @off-white;
|
||||
text-transform: none;
|
||||
|
||||
.select-bg();
|
||||
|
||||
div b {
|
||||
.img-retina('../img/select.png', '../img/select@2x.png', 12px, 12px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: right 12px;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.chosen-search {
|
||||
padding: 5px 5px 5px 40px;
|
||||
background: @ace;
|
||||
|
||||
background: #F7F7F7;
|
||||
|
||||
&:before {
|
||||
content: "\f1c3";
|
||||
font-family: @font-icon-md;
|
||||
|
@ -109,14 +87,16 @@
|
|||
width: 40px;
|
||||
height: 100%;
|
||||
font-size: 25px;
|
||||
padding: 5px 0 0 15px;
|
||||
padding: 5px 0 0 15px;
|
||||
color: @card-bg;
|
||||
}
|
||||
|
||||
|
||||
input[type=text] {
|
||||
border: 0;
|
||||
height: 35px;
|
||||
line-height: 1.42857143;
|
||||
background: none;
|
||||
background-image: none !important;
|
||||
color: @card-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -127,47 +107,52 @@
|
|||
}
|
||||
|
||||
.chosen-container-multi {
|
||||
|
||||
.chosen-choices {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-bottom: 1px solid @input-border;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
|
||||
|
||||
li {
|
||||
&.search-choice {
|
||||
border-radius: 2px;
|
||||
margin: 4px 4px 0 0;
|
||||
background: darken(@ace, 5%);
|
||||
background: rgba(266,255,255,0.1);
|
||||
padding: 5px 23px 5px 8px;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
|
||||
.search-choice-close {
|
||||
background-image: none;
|
||||
|
||||
&:before {
|
||||
display: inline-block;
|
||||
font-family: @font-icon-md;
|
||||
content: "\f135";
|
||||
position: relative;
|
||||
top: 1px;
|
||||
color: #9C9C9C;
|
||||
z-index: 2;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
color: @off-white;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
|
||||
&.search-field {
|
||||
input[type=text] {
|
||||
padding: 0;
|
||||
height: 31px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-choice-close {
|
||||
cursor: pointer;
|
||||
|
||||
&:before {
|
||||
display: inline-block;
|
||||
font-family: @font-icon-md;
|
||||
content: "\f135";
|
||||
position: relative;
|
||||
top: 1px;
|
||||
color: @off-white;
|
||||
z-index: 2;
|
||||
background: #454F55;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
select.chosen {
|
||||
display: none;
|
||||
}
|
|
@ -0,0 +1,25 @@
|
|||
.cp-container {
|
||||
position: relative;
|
||||
|
||||
& > .input-group {
|
||||
|
||||
input.cp-value {
|
||||
color: @off-white !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
padding: 20px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
i.cp-value {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 2px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 15px;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,55 @@
|
|||
.fileinput {
|
||||
position: relative;
|
||||
padding-right: 35px;
|
||||
|
||||
.close {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
font-size: 12px;
|
||||
float: none;
|
||||
opacity: 1;
|
||||
font-weight: 500;
|
||||
border: 1px solid rgba(255,255,255,0.4);
|
||||
width: 19px;
|
||||
text-align: center;
|
||||
height: 19px;
|
||||
line-height: 16px;
|
||||
border-radius: 50%;
|
||||
right: 0;
|
||||
color: @text-color;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.btn-file {
|
||||
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
padding: 0 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.fileinput-preview {
|
||||
width: 200px;
|
||||
height: 150px;
|
||||
position: relative;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
border: 0;
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-top: -13px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fileinput-exists .close {
|
||||
visibility: visible;
|
||||
}
|
|
@ -0,0 +1,319 @@
|
|||
#fc-actions {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
right: 12px;
|
||||
|
||||
& > li > a > i {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.fc {
|
||||
td, th {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
th {
|
||||
font-weight: 400;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
table {
|
||||
background: transparent;
|
||||
|
||||
tr {
|
||||
& > td:first-child {
|
||||
border-left-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-day-number {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
#calendar-widget {
|
||||
|
||||
.fc-toolbar {
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
color: @off-white;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-day-number {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fc-day-grid-event {
|
||||
margin: 1px 3px 1px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.ui-widget-header th,
|
||||
.ui-widget-header {
|
||||
border-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#calendar {
|
||||
|
||||
.fc-view-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
height: 300px;
|
||||
.bg-cover('../img/cal-header.jpg');
|
||||
background-position: inherit;
|
||||
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
height: 50px;
|
||||
width: 100%;
|
||||
background: rgba(0, 0, 0, 0.36);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.fc-center {
|
||||
margin-top: 238px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ui-button {
|
||||
margin-top: 3px;
|
||||
|
||||
span {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&:hover span {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-sm-max) {
|
||||
height: 200px;
|
||||
|
||||
.fc-center {
|
||||
margin-top: 138px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-day-number {
|
||||
@media screen and (min-width: @screen-sm-max) {
|
||||
font-size: 25px;
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
|
||||
padding-left: 10px !important;
|
||||
color: #CCC;
|
||||
text-align: left !important;
|
||||
|
||||
}
|
||||
|
||||
.fc-day-header {
|
||||
color: #333 !important;
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
|
||||
.fc-day-grid-event {
|
||||
margin: 1px 9px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-day-header {
|
||||
font-size: 0;
|
||||
padding-bottom: 20px !important;
|
||||
|
||||
&:first-letter {
|
||||
font-size: 14px;
|
||||
color: #c2c2c2;
|
||||
text-align: left;
|
||||
border-bottom-width: 0;
|
||||
border-right-color: #eee;
|
||||
padding: 10px 12px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-today {
|
||||
color: @m-amber;
|
||||
}
|
||||
|
||||
.fc-toolbar {
|
||||
margin-bottom: 0;
|
||||
padding: 20px 17px 19px;
|
||||
position: relative;
|
||||
|
||||
h2 {
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
.ui-button {
|
||||
border: 0;
|
||||
background: 0 0;
|
||||
padding: 0;
|
||||
outline: none !important;
|
||||
text-align: center;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
|
||||
&:hover {
|
||||
background: #fff;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
& > span {
|
||||
position: relative;
|
||||
font-family: @font-icon-md;
|
||||
font-size: 24px;
|
||||
line-height: 100%;
|
||||
width: 30px;
|
||||
display: block;
|
||||
margin-top: 2px;
|
||||
|
||||
|
||||
&:before {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&.ui-icon-circle-triangle-w:before {
|
||||
content: "\f2fa";
|
||||
}
|
||||
|
||||
&.ui-icon-circle-triangle-e:before {
|
||||
content: "\f2fb";
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fc-event {
|
||||
padding: 0;
|
||||
font-size: 11px;
|
||||
border-radius: 2px;
|
||||
border: 0;
|
||||
background-color: rgba(255,255,255,0.1);
|
||||
|
||||
.fc-title {
|
||||
padding: 2px 8px;
|
||||
display: block;
|
||||
.text-overflow();
|
||||
}
|
||||
|
||||
.fc-time {
|
||||
float: left;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
padding: 2px 6px;
|
||||
margin: 0 0 0 -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-view, .fc-view > table {
|
||||
border: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.fc-view > table > tbody > tr > .ui-widget-content {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
div.fc-row {
|
||||
margin-right: 0 !important;
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
|
||||
.fc-today {
|
||||
color: @m-amber !important;
|
||||
}
|
||||
|
||||
/* Even Tag Color */
|
||||
.event-tag {
|
||||
margin-top: 5px;
|
||||
|
||||
& > span {
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-right: 3px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
.opacity(0.8);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
&:before {
|
||||
font-family: @font-icon-md;
|
||||
content: "\f26b";
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 3px;
|
||||
width: 100%;
|
||||
font-size: 17px;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
hr.fc-divider {
|
||||
border-width: 1px;
|
||||
border-color: #eee;
|
||||
}
|
||||
|
||||
.fc-day-grid-container.fc-scroller {
|
||||
height: auto !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
/* Even Tag Color */
|
||||
.event-tag {
|
||||
margin-top: 5px;
|
||||
|
||||
& > span {
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-right: 3px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
.opacity(0.8);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
&:before {
|
||||
font-family: @font-icon-md;
|
||||
content: "\f26b";
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 3px;
|
||||
width: 100%;
|
||||
font-size: 17px;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,111 @@
|
|||
.lg-outer {
|
||||
.lg-thumb-outer {
|
||||
background-color: #1D1D1D;
|
||||
}
|
||||
|
||||
.lg-thumb-item {
|
||||
border-radius: 50%;
|
||||
width: 60px !important;
|
||||
display: inline-block;
|
||||
height: 60px;
|
||||
border: 0;
|
||||
float: none;
|
||||
margin: 0 5px;
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0 0px 4px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.lg-image {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.lg-toogle-thumb {
|
||||
border-radius: 50%;
|
||||
color: #333;
|
||||
height: 51px;
|
||||
width: 51px;
|
||||
line-height: 41px;
|
||||
background-color: #fff;
|
||||
.transition(all);
|
||||
.transition-duration(800ms);
|
||||
|
||||
&:hover {
|
||||
.rotate(360deg);
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.lg-thumb-open) .lg-toogle-thumb {
|
||||
top: -70px;
|
||||
}
|
||||
|
||||
&.lg-thumb-open .lg-toogle-thumb {
|
||||
top: -26px;
|
||||
}
|
||||
}
|
||||
|
||||
.lg-thumb.group {
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.lg-slide {
|
||||
em {
|
||||
font-style: normal;
|
||||
|
||||
h3 {
|
||||
color: #fff;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.video-cont {
|
||||
.z-depth(2);
|
||||
}
|
||||
}
|
||||
|
||||
.lg-outer .lg-item {
|
||||
background-image: none !important;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
border: 2px solid rgba(255,255,255,0.1);
|
||||
border-right-color: #fff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
.animation-name(loader);
|
||||
.animation-duration(1000ms);
|
||||
.animation-iteration-count(infinite);
|
||||
.animation-timing-function(linear);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes loader {
|
||||
0% {
|
||||
.rotate(0deg)
|
||||
}
|
||||
100% {
|
||||
.rotate(360deg)
|
||||
}
|
||||
}
|
||||
|
||||
.loading > i {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
-webkit-transform: translateZ(0);
|
||||
-ms-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
-webkit-animation: loader 1.1s infinite linear;
|
||||
animation: loader 1.1s infinite linear;
|
||||
border-left-color: #fff;
|
||||
border-style: solid;
|
||||
}
|
|
@ -13,15 +13,19 @@
|
|||
&.mCSB_scrollTools_horizontal {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.mCSB_draggerContainer {
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
|
||||
.mCS-minimal-dark {
|
||||
&.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
|
||||
background: rgba(0,0,0,0.4);
|
||||
background: #6b7175;
|
||||
}
|
||||
|
||||
&.mCSB_scrollTools_onDrag .mCSB_dragger .mCSB_dragger_bar {
|
||||
background: rgba(0,0,0,0.5) !important;
|
||||
background: #6b7175 !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
.mejs-container {
|
||||
outline: none;
|
||||
|
||||
.mejs-controls {
|
||||
background: #1E262B;
|
||||
height: 50px;
|
||||
padding: 10px 5px 0;
|
||||
|
||||
div {
|
||||
height: 5px;
|
||||
}
|
||||
|
||||
div.mejs-time-rail {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0;
|
||||
width: 100% !important;
|
||||
|
||||
.mejs-time-total {
|
||||
margin: 0;
|
||||
width: 100% !important;
|
||||
background: #1E262B;
|
||||
}
|
||||
|
||||
.mejs-time-loaded {
|
||||
background: #4f5f6a;
|
||||
}
|
||||
|
||||
.mejs-time-current {
|
||||
background: @off-white;
|
||||
}
|
||||
|
||||
.mejs-time-buffering {
|
||||
background: #1E262B;
|
||||
}
|
||||
|
||||
span:not(.mejs-time-float), a {
|
||||
border-radius: 0;
|
||||
height: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.mejs-button {
|
||||
button {
|
||||
background-color: #1E262B;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background-position: center;
|
||||
|
||||
&:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.mejs-volume-button {
|
||||
position: absolute;
|
||||
right: 35px;
|
||||
}
|
||||
|
||||
.mejs-play button {
|
||||
.img-retina('../img/icons/play.png', '../img/icons/play@2x.png', 15px, 15px);
|
||||
}
|
||||
|
||||
.mejs-pause button {
|
||||
.img-retina('../img/icons/pause.png', '../img/icons/pause@2x.png', 15px, 15px);
|
||||
}
|
||||
|
||||
.mejs-mute button {
|
||||
.img-retina('../img/icons/speaker.png', '../img/icons/speaker@2x.png', 15px, 15px);
|
||||
}
|
||||
|
||||
.mejs-unmute button {
|
||||
.img-retina('../img/icons/speaker-2.png', '../img/icons/speaker-2@2x.png', 15px, 15px);
|
||||
}
|
||||
|
||||
.mejs-fullscreen-button {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
button {
|
||||
.img-retina('../img/icons/fullscreen.png', '../img/icons/fullscreen@2x.png', 15px, 15px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,56 @@
|
|||
.noUi-target {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.noUi-background {
|
||||
background: #212B31;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.noUi-horizontal {
|
||||
height: 3px;
|
||||
|
||||
.noUi-handle {
|
||||
top: -8px;
|
||||
}
|
||||
}
|
||||
|
||||
.noUi-vertical {
|
||||
width: 3px;
|
||||
}
|
||||
|
||||
.noUi-connect {
|
||||
background: @off-white;
|
||||
}
|
||||
|
||||
.noUi-horizontal,
|
||||
.noUi-vertical {
|
||||
.noUi-handle {
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
border: 0;
|
||||
border-radius: 100%;
|
||||
box-shadow: none;
|
||||
.transition(box-shadow);
|
||||
.transition-duration(200ms);
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.noUi-active {
|
||||
box-shadow: 0 0 0 13px rgba(0,0,0,0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.noUi-tooltip {
|
||||
border: 0;
|
||||
background: #212B31;
|
||||
padding: 5px 10px;
|
||||
}
|
|
@ -0,0 +1,206 @@
|
|||
.note-editor,
|
||||
.note-popover {
|
||||
.note-toolbar,
|
||||
.popover-content {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 10px 0 15px;
|
||||
text-align: center;
|
||||
|
||||
& > .btn-group {
|
||||
display: inline-block;
|
||||
float: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.note-palette-title {
|
||||
margin: 0 !important;
|
||||
padding: 10px 0 !important;
|
||||
font-size: 13px !important;
|
||||
text-align: center !important;
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
.note-color-reset {
|
||||
padding: 0 0 10px !important;
|
||||
margin: 0 !important;
|
||||
background: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.note-color {
|
||||
.dropdown-menu {
|
||||
min-width: 335px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.fa {
|
||||
font-style: normal;
|
||||
font-size: 20px;
|
||||
vertical-align: middle;
|
||||
|
||||
&:before {
|
||||
font-family: @font-icon-md;
|
||||
}
|
||||
|
||||
&.fa-magic:before {
|
||||
content: "\f16a";
|
||||
}
|
||||
|
||||
&.fa-bold:before {
|
||||
content: "\f23d";
|
||||
}
|
||||
|
||||
&.fa-italic:before {
|
||||
content: "\f245";
|
||||
}
|
||||
|
||||
&.fa-underline:before {
|
||||
content: "\f24f";
|
||||
}
|
||||
|
||||
&.fa-font:before {
|
||||
content: "\f242";
|
||||
}
|
||||
|
||||
&.fa-list-ul:before {
|
||||
content: "\f247";
|
||||
}
|
||||
|
||||
&.fa-list-ol:before {
|
||||
content: "\f248";
|
||||
}
|
||||
|
||||
&.fa-align-left:before {
|
||||
content: "\f23b";
|
||||
}
|
||||
|
||||
&.fa-align-right:before {
|
||||
content: "\f23c";
|
||||
}
|
||||
|
||||
&.fa-align-center:before {
|
||||
content: "\f239";
|
||||
}
|
||||
|
||||
&.fa-align-justify:before {
|
||||
content: "\f23a";
|
||||
}
|
||||
|
||||
&.fa-indent:before {
|
||||
content: "\f244";
|
||||
}
|
||||
|
||||
&.fa-outdent:before {
|
||||
content: "\f243";
|
||||
}
|
||||
|
||||
&.fa-text-height:before {
|
||||
content: "\f246";
|
||||
}
|
||||
|
||||
&.fa-table:before {
|
||||
content: "\f320";
|
||||
}
|
||||
|
||||
&.fa-link:before {
|
||||
content: "\f18e";
|
||||
}
|
||||
|
||||
&.fa-picture-o:before {
|
||||
content: "\f17f";
|
||||
}
|
||||
|
||||
&.fa-minus:before {
|
||||
content: "\f22f";
|
||||
}
|
||||
|
||||
&.fa-arrows-alt:before {
|
||||
content: "\f16d";
|
||||
}
|
||||
|
||||
&.fa-code:before {
|
||||
content: "\f13a";
|
||||
}
|
||||
|
||||
&.fa-question:before {
|
||||
content: "\f1f5";
|
||||
}
|
||||
|
||||
&.fa-eraser:before {
|
||||
content: "\f23f";
|
||||
}
|
||||
|
||||
&.fa-square:before {
|
||||
content: "\f279";
|
||||
}
|
||||
|
||||
&.fa-circle-o:before {
|
||||
content: "\f26c";
|
||||
}
|
||||
|
||||
&.fa-times:before {
|
||||
content: "\f136";
|
||||
}
|
||||
}
|
||||
|
||||
.note-air-popover {
|
||||
.arrow {
|
||||
left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.note-editor {
|
||||
overflow: visible;
|
||||
border: 0;
|
||||
|
||||
.btn {
|
||||
height: 40px;
|
||||
background-color: #2B343A;
|
||||
color: rgba(255, 255, 255, 0.56);
|
||||
|
||||
&:hover,
|
||||
&.active {
|
||||
background: #222C32;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.note-toolbar {
|
||||
background: #333C42;
|
||||
}
|
||||
|
||||
.note-editing-area {
|
||||
.note-editable {
|
||||
color: @text-color;
|
||||
padding: 20px 23px;
|
||||
background-color: #3A4348;
|
||||
}
|
||||
|
||||
.note-codable {
|
||||
background-color: @body-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.note-statusbar {
|
||||
background-color: #4B5257;
|
||||
|
||||
.note-resizebar {
|
||||
height: 5px;
|
||||
|
||||
.note-icon-bar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
.btn {
|
||||
background-color: #fff;
|
||||
color: @text-dark;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,39 @@
|
|||
.sweet-alert {
|
||||
border-radius: 2px;
|
||||
padding: 35px;
|
||||
color: @text-dark;
|
||||
font-family: @font-family-base;
|
||||
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: #333;
|
||||
line-height: 100%;
|
||||
margin: 0 0 15px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 13px;
|
||||
color: @text-muted-dark;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 6px 12px;
|
||||
font-size: 13px;
|
||||
border-radius: 2px;
|
||||
box-shadow: none !important;
|
||||
margin: 26px 1px 0 1px;
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.sa-icon {
|
||||
margin-top: 0;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
|
@ -1,25 +1,18 @@
|
|||
.twitter-typeahead {
|
||||
width: 100%;
|
||||
|
||||
|
||||
.tt-menu {
|
||||
min-width: 200px;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
|
||||
display: block !important;
|
||||
z-index: 2 !important;
|
||||
.scale(0);
|
||||
.opacity(0);
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
.backface-visibility(hidden);
|
||||
.transform-origin(top left);
|
||||
|
||||
display: none;
|
||||
.animated(fadeIn, 300ms);
|
||||
|
||||
&.tt-open:not(.tt-empty) {
|
||||
.scale(1);
|
||||
.opacity(1);
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.tt-suggestion {
|
||||
padding: 8px 17px;
|
||||
color: #333;
|
||||
|
@ -30,7 +23,7 @@
|
|||
.tt-cursor {
|
||||
background-color: rgba(0,0,0,0.075);
|
||||
}
|
||||
|
||||
|
||||
.tt-hint {
|
||||
color: #818181 !important;
|
||||
}
|
|
@ -0,0 +1,198 @@
|
|||
/*-------------------------------
|
||||
Post
|
||||
--------------------------------*/
|
||||
.wp-text {
|
||||
border: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
resize: none !important;
|
||||
padding: 20px 25px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
.wp-media {
|
||||
background: rgba(255,255,255,.04);
|
||||
border: 1px solid #E4E4E4;
|
||||
padding: 12px 15px;
|
||||
margin: 10px 20px 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.wp-actions {
|
||||
padding: 10px 15px 10px 20px;
|
||||
background-color: rgba(255,255,255,.04);
|
||||
}
|
||||
|
||||
.wpa-media-list {
|
||||
& > a {
|
||||
font-size: 20px;
|
||||
margin-right: 8px;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
|
||||
&:hover {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------------
|
||||
Post Listings
|
||||
--------------------------------*/
|
||||
.wis-numbers {
|
||||
float: left;
|
||||
|
||||
& > span {
|
||||
margin-right: -1px;
|
||||
padding: 7px 12px;
|
||||
border: 1px solid #3D474E;
|
||||
float: left;
|
||||
font-weight: 500;
|
||||
|
||||
& > i {
|
||||
line-height: 100%;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
top: 3px;
|
||||
font-size: 15px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: @m-green;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.wis-commentors {
|
||||
float: right;
|
||||
|
||||
& > a {
|
||||
display: inline-block;
|
||||
margin-left: 2px;
|
||||
|
||||
& > img {
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
border-radius: 50%;
|
||||
|
||||
&:hover {
|
||||
.opacity(0.85);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------------
|
||||
Post Gallery
|
||||
--------------------------------*/
|
||||
.wi-preview {
|
||||
text-align: center;
|
||||
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
margin: 0 -23px 20px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-sm-max) {
|
||||
margin: 0 -16px 20px;
|
||||
}
|
||||
|
||||
.wip-item {
|
||||
display: block;
|
||||
float: left;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border: 2px solid @card-bg;
|
||||
.bg-cover-inline();
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
.opacity(0.9);
|
||||
}
|
||||
|
||||
& > img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:first-child:nth-last-child(2),
|
||||
&:first-child:nth-last-child(2) ~ div {
|
||||
width: 50%;
|
||||
padding-bottom: 40%;
|
||||
}
|
||||
|
||||
&:first-child:nth-last-child(3),
|
||||
&:first-child:nth-last-child(3) ~ div,
|
||||
&:first-child:nth-last-child(4),
|
||||
&:first-child:nth-last-child(4) ~ div:not(:last-child),
|
||||
&:first-child:nth-last-child(5),
|
||||
&:first-child:nth-last-child(5) ~ div:not(:nth-last-of-type(-n+2)),
|
||||
&:first-child:nth-last-child(6),
|
||||
&:first-child:nth-last-child(6) ~ div,
|
||||
&:first-child:nth-last-child(7) ~ div:nth-last-of-type(-n+3) {
|
||||
width: 33.333333%;
|
||||
padding-bottom: 30%;
|
||||
}
|
||||
|
||||
&:first-child:nth-last-child(5) ~ div:nth-last-of-type(-n+2) {
|
||||
width: 50%;
|
||||
padding-bottom: 40%;
|
||||
}
|
||||
|
||||
&:first-child:nth-last-child(7),
|
||||
&:first-child:nth-last-child(7) ~ div:not(:nth-last-of-type(-n+3)),
|
||||
&:first-child:nth-last-child(n+8),
|
||||
&:first-child:nth-last-child(n+8) ~ div {
|
||||
width: 25%;
|
||||
padding-bottom: 22%;
|
||||
}
|
||||
|
||||
&:only-child,
|
||||
&:first-child:nth-last-child(4) ~ div:nth-child(4) {
|
||||
width: 100%;
|
||||
padding-bottom: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------------
|
||||
Post Comments
|
||||
--------------------------------*/
|
||||
.wi-comments {
|
||||
background: rgba(255,255,255,.02);
|
||||
|
||||
.list-group {
|
||||
margin-bottom: -10px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.wic-form {
|
||||
padding: 20px 23px;
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
resize: none;
|
||||
border: 1px solid @input-border;
|
||||
padding: 12px 15px;
|
||||
height: 45px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&.toggled {
|
||||
textarea {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.wicf-actions {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.wicf-actions {
|
||||
margin-top: 10px;
|
||||
display: none;
|
||||
}
|
|
@ -0,0 +1,454 @@
|
|||
.dw-item {
|
||||
position: relative;
|
||||
min-height: 400px;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: @card-shadow;
|
||||
background-color: @card-bg;
|
||||
}
|
||||
|
||||
.dwi-header {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dwi-header-img {
|
||||
.bg-cover-inline();
|
||||
height: 155px;
|
||||
}
|
||||
|
||||
.dw-footer {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dwih-title {
|
||||
padding: 12px 20px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Site Visits
|
||||
--------------------------*/
|
||||
#site-visits {
|
||||
.dwi-header {
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 38px;
|
||||
|
||||
canvas {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.dwih-title {
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.sv-item {
|
||||
small {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-weight: normal;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
margin-top: 5px;
|
||||
.opacity(0.7);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Best Selling Item
|
||||
--------------------------*/
|
||||
#best-selling {
|
||||
.dwi-header {
|
||||
.dwih-title {
|
||||
padding-bottom: 30px;
|
||||
top: 0;
|
||||
#gradient > .vertical(rgba(0,0,0,0.6); rgba(0,0,0,0));
|
||||
}
|
||||
|
||||
.bs-main {
|
||||
padding: 15px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
#gradient > .vertical(rgba(0,0,0,0); rgba(0,0,0,0.6));
|
||||
|
||||
& > h2 {
|
||||
font-size: 20px;
|
||||
margin: 5px 0 0 0;
|
||||
line-height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Weather
|
||||
--------------------------*/
|
||||
#weather-widget {
|
||||
padding: 20px 20px 0;
|
||||
|
||||
.weather-status {
|
||||
font-size: 40px;
|
||||
line-height: 100%;
|
||||
}
|
||||
|
||||
.weather-icon {
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
height: 150px;
|
||||
.bg-option();
|
||||
.opacity(0.8);
|
||||
|
||||
/* Weather Icons */
|
||||
.wi-item(@icon) {
|
||||
.img-retina('../img/icons/weather/@{icon}.png', '../img/icons/weather/@{icon}@2x.png', 125px, 125px);
|
||||
}
|
||||
|
||||
&.wi-0 { .wi-item(0); }
|
||||
&.wi-1 { .wi-item(1); }
|
||||
&.wi-2 { .wi-item(2); }
|
||||
&.wi-3 { .wi-item(3); }
|
||||
&.wi-4 { .wi-item(2); }
|
||||
&.wi-5 { .wi-item(5); }
|
||||
&.wi-6 { .wi-item(5); }
|
||||
&.wi-7 { .wi-item(5); }
|
||||
&.wi-8 { .wi-item(5); }
|
||||
&.wi-9 { .wi-item(9); }
|
||||
&.wi-10 { .wi-item(5); }
|
||||
&.wi-11 { .wi-item(9); }
|
||||
&.wi-12 { .wi-item(9); }
|
||||
&.wi-13 { .wi-item(9); }
|
||||
&.wi-14 { .wi-item(9); }
|
||||
&.wi-15 { .wi-item(5); }
|
||||
&.wi-16 { .wi-item(9); }
|
||||
&.wi-17 { .wi-item(5); }
|
||||
&.wi-18 { .wi-item(18); }
|
||||
&.wi-19 { .wi-item(19); }
|
||||
&.wi-20 { .wi-item(19); }
|
||||
&.wi-21 { .wi-item(19); }
|
||||
&.wi-22 { .wi-item(19); }
|
||||
&.wi-23 { .wi-item(19); }
|
||||
&.wi-24 { .wi-item(24); }
|
||||
&.wi-25 { .wi-item(24); }
|
||||
&.wi-26 { .wi-item(26); }
|
||||
&.wi-27 { .wi-item(27); }
|
||||
&.wi-28 { .wi-item(28); }
|
||||
&.wi-29 { .wi-item(27); }
|
||||
&.wi-30 { .wi-item(28); }
|
||||
&.wi-31 { .wi-item(31); }
|
||||
&.wi-32 { .wi-item(32); }
|
||||
&.wi-33 { .wi-item(31); }
|
||||
&.wi-34 { .wi-item(32); }
|
||||
&.wi-35 { .wi-item(5); }
|
||||
&.wi-36 { .wi-item(32); }
|
||||
&.wi-37 { .wi-item(2); }
|
||||
&.wi-38 { .wi-item(2); }
|
||||
&.wi-39 { .wi-item(2); }
|
||||
&.wi-40 { .wi-item(5); }
|
||||
&.wi-41 { .wi-item(5); }
|
||||
&.wi-42 { .wi-item(9); }
|
||||
&.wi-43 { .wi-item(5); }
|
||||
&.wi-44 { .wi-item(27); }
|
||||
&.wi-45 { .wi-item(2); }
|
||||
&.wi-46 { .wi-item(18); }
|
||||
&.wi-47 { .wi-item(2); }
|
||||
}
|
||||
|
||||
.weather-info {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 3px 0 0 0;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
padding: 2px 10px 3px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.dw-footer {
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.weather-list {
|
||||
font-size: 16px;
|
||||
.text-overflow();
|
||||
|
||||
& > span {
|
||||
margin-right: 7px;
|
||||
display: inline-block;
|
||||
line-height: 40px;
|
||||
vertical-align: top;
|
||||
|
||||
.wli-icon(@icon) {
|
||||
background-image: url('../img/icons/weather/@{icon}.png');
|
||||
}
|
||||
|
||||
&.weather-list-icon {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
.bg-option();
|
||||
background-size: 30px 30px;
|
||||
|
||||
&.wi-0 { .wli-icon(0); }
|
||||
&.wi-1 { .wli-icon(1); }
|
||||
&.wi-2 { .wli-icon(2); }
|
||||
&.wi-3 { .wli-icon(3); }
|
||||
&.wi-4 { .wli-icon(2); }
|
||||
&.wi-5 { .wli-icon(5); }
|
||||
&.wi-6 { .wli-icon(5); }
|
||||
&.wi-7 { .wli-icon(5); }
|
||||
&.wi-8 { .wli-icon(5); }
|
||||
&.wi-9 { .wli-icon(9); }
|
||||
&.wi-10 { .wli-icon(5); }
|
||||
&.wi-11 { .wli-icon(9); }
|
||||
&.wi-12 { .wli-icon(9); }
|
||||
&.wi-13 { .wli-icon(9); }
|
||||
&.wi-14 { .wli-icon(9); }
|
||||
&.wi-15 { .wli-icon(5); }
|
||||
&.wi-16 { .wli-icon(9); }
|
||||
&.wi-17 { .wli-icon(5); }
|
||||
&.wi-18 { .wli-icon(18); }
|
||||
&.wi-19 { .wli-icon(19); }
|
||||
&.wi-20 { .wli-icon(19); }
|
||||
&.wi-21 { .wli-icon(19); }
|
||||
&.wi-22 { .wli-icon(19); }
|
||||
&.wi-23 { .wli-icon(19); }
|
||||
&.wi-24 { .wli-icon(24); }
|
||||
&.wi-25 { .wli-icon(24); }
|
||||
&.wi-26 { .wli-icon(26); }
|
||||
&.wi-27 { .wli-icon(27); }
|
||||
&.wi-28 { .wli-icon(28); }
|
||||
&.wi-29 { .wli-icon(27); }
|
||||
&.wi-30 { .wli-icon(28); }
|
||||
&.wi-31 { .wli-icon(31); }
|
||||
&.wi-32 { .wli-icon(32); }
|
||||
&.wi-33 { .wli-icon(31); }
|
||||
&.wi-34 { .wli-icon(32); }
|
||||
&.wi-35 { .wli-icon(5); }
|
||||
&.wi-36 { .wli-icon(32); }
|
||||
&.wi-37 { .wli-icon(2); }
|
||||
&.wi-38 { .wli-icon(2); }
|
||||
&.wi-39 { .wli-icon(2); }
|
||||
&.wi-40 { .wli-icon(5); }
|
||||
&.wi-41 { .wli-icon(5); }
|
||||
&.wi-42 { .wli-icon(9); }
|
||||
&.wi-43 { .wli-icon(5); }
|
||||
&.wi-44 { .wli-icon(27); }
|
||||
&.wi-45 { .wli-icon(2); }
|
||||
&.wi-46 { .wli-icon(18); }
|
||||
&.wi-47 { .wli-icon(2); }
|
||||
}
|
||||
|
||||
& > i {
|
||||
line-height: 100%;
|
||||
font-size: 39px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Profile View
|
||||
--------------------------*/
|
||||
.profile-view {
|
||||
text-align: center;
|
||||
.pv-header {
|
||||
position: relative;
|
||||
height: 145px;
|
||||
width: 100%;
|
||||
.bg-cover('../img/headers/sm/4.png');
|
||||
|
||||
& > .pv-main {
|
||||
border-radius: 50%;
|
||||
width: 130px;
|
||||
position: absolute;
|
||||
height: 130px;
|
||||
bottom: -50px;
|
||||
left: 50%;
|
||||
margin-left: -65px;
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
}
|
||||
}
|
||||
|
||||
.pv-body {
|
||||
margin-top: 70px;
|
||||
padding: 0 20px 20px;
|
||||
|
||||
& > h2 {
|
||||
margin: 0;
|
||||
line-height: 100%;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
& > small {
|
||||
display: block;
|
||||
margin: 10px 0 15px;
|
||||
}
|
||||
|
||||
.pv-contact,
|
||||
.pv-follow {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
& > li {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.pv-follow {
|
||||
margin: 20px -20px;
|
||||
padding: 10px;
|
||||
background-color: rgba(255, 255, 255, 0.04);
|
||||
|
||||
& > li {
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.pv-contact {
|
||||
& > li {
|
||||
margin: 0 5px;
|
||||
|
||||
& > .zmdi {
|
||||
line-height: 100%;
|
||||
vertical-align: text-bottom;
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.pv-main {
|
||||
.scale(1.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Picture List
|
||||
--------------------------*/
|
||||
.picture-list {
|
||||
.pl-body {
|
||||
padding: 2px;
|
||||
|
||||
[class*="col-"] {
|
||||
padding: 2px;
|
||||
|
||||
& > a {
|
||||
display: block;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.clearfix();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Social
|
||||
--------------------------*/
|
||||
.go-social {
|
||||
.card-body {
|
||||
padding: 0 15px 20px;
|
||||
|
||||
[class*="col-"] {
|
||||
padding: 12px;
|
||||
|
||||
img {
|
||||
.transition(all);
|
||||
.transition-duration(200ms);
|
||||
.backface-visibility(hidden);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
img {
|
||||
.scale(1.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Rating
|
||||
--------------------------*/
|
||||
.rating-list {
|
||||
padding: 0 0 20px;
|
||||
|
||||
.rl-star {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 4px;
|
||||
|
||||
.zmdi {
|
||||
font-size: 20px;
|
||||
|
||||
&:not(.active) {
|
||||
color: rgba(255,255,255,0.1);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: @off-white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.media {
|
||||
.zmdi-star {
|
||||
line-height: 100%;
|
||||
font-size: 22px;
|
||||
color: @off-white;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
left: 6px;
|
||||
}
|
||||
|
||||
.media-body {
|
||||
padding: 7px 10px 0 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*-------------------------
|
||||
Calendar
|
||||
--------------------------*/
|
||||
.cwh-year {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.cwh-day {
|
||||
font-size: 25px;
|
||||
line-height: 100%;
|
||||
}
|
|
@ -0,0 +1,13 @@
|
|||
.fw-container {
|
||||
.tab-content {
|
||||
padding: 25px 0;
|
||||
}
|
||||
|
||||
.fw-footer {
|
||||
text-align: center;
|
||||
margin: 30px 0 0;
|
||||
width: 100%;
|
||||
border-top: 2px solid rgba(255, 255, 255, 0.1);
|
||||
padding: 15px 0;
|
||||
}
|
||||
}
|
|
@ -1,91 +0,0 @@
|
|||
.four-zero-content {
|
||||
padding: 20px;
|
||||
|
||||
background: #FFFFFF url('../img/hexbg.png') center center;
|
||||
background-size: cover;
|
||||
|
||||
&:before {
|
||||
height: 50%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
|
||||
.four-zero {
|
||||
background: @m-blue;
|
||||
box-shadow: 0 1px 11px rgba(0, 0, 0, 0.27);
|
||||
border-radius: 2px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -150px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
height: 300px;
|
||||
width: 500px;
|
||||
left: 50%;
|
||||
margin-left: -250px;
|
||||
|
||||
h2 {
|
||||
font-size: 130px;
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
width: ~"calc(100% - 40px)";
|
||||
left: 20px;
|
||||
margin-left: 0;
|
||||
height: 260px;
|
||||
margin-top: -130px;
|
||||
|
||||
h2 {
|
||||
font-size: 90px;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
line-height: 100%;
|
||||
color: #fff;
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
small {
|
||||
display: block;
|
||||
font-size: 26px;
|
||||
margin-top: -10px
|
||||
}
|
||||
|
||||
|
||||
footer {
|
||||
background: rgba(0,0,0,0.13);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
|
||||
& > a {
|
||||
font-size: 21px;
|
||||
display: inline-block;
|
||||
color: #FFF;
|
||||
margin: 0 1px;
|
||||
line-height: 40px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: rgba(0, 0, 0, 0.09);
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
.transition(all);
|
||||
.transition-duration(300ms);
|
||||
|
||||
&:hover {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,73 +0,0 @@
|
|||
//
|
||||
// Alerts
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Base styles
|
||||
// -------------------------
|
||||
|
||||
.alert {
|
||||
padding: @alert-padding;
|
||||
margin-bottom: @line-height-computed;
|
||||
border: 1px solid transparent;
|
||||
border-radius: @alert-border-radius;
|
||||
|
||||
// Headings for larger alerts
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
// Specified for the h4 to prevent conflicts of changing @headings-color
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
// Provide class for links that match alerts
|
||||
.alert-link {
|
||||
font-weight: @alert-link-font-weight;
|
||||
}
|
||||
|
||||
// Improve alignment and spacing of inner content
|
||||
> p,
|
||||
> ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
> p + p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
// Dismissible alerts
|
||||
//
|
||||
// Expand the right padding and account for the close button's positioning.
|
||||
|
||||
.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0.
|
||||
.alert-dismissible {
|
||||
padding-right: (@alert-padding + 20);
|
||||
|
||||
// Adjust close link position
|
||||
.close {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
right: -21px;
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
// Alternate styles
|
||||
//
|
||||
// Generate contextual modifier classes for colorizing the alert.
|
||||
|
||||
.alert-success {
|
||||
.alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
.alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
|
||||
}
|
||||
|
||||
.alert-warning {
|
||||
.alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
|
||||
}
|
||||
|
||||
.alert-danger {
|
||||
.alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
|
||||
}
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue