Cachet is now a Laravel 5 app
This commit is contained in:
Joseph Cohen
@@ -0,0 +1,256 @@
|
||||
$(function() {
|
||||
// Ajax Setup
|
||||
$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
|
||||
var token;
|
||||
if (! options.crossDomain) {
|
||||
token = $('meta[name="token"]').attr('content');
|
||||
if (token) {
|
||||
return jqXHR.setRequestHeader('X-CSRF-Token', token);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$.ajaxSetup({
|
||||
statusCode: {
|
||||
401: function () {
|
||||
window.location.href = '/';
|
||||
},
|
||||
403: function () {
|
||||
window.location.href = '/';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Prevent double form submission
|
||||
$('form').submit(function() {
|
||||
var $form = $(this);
|
||||
$form.find(':submit').prop('disabled', true);
|
||||
});
|
||||
|
||||
// Mock the DELETE form requests.
|
||||
$('[data-method]').not(".disabled").append(function() {
|
||||
var methodForm = "\n";
|
||||
methodForm += "<form action='" + $(this).attr('href') + "' method='POST' style='display:none'>\n";
|
||||
methodForm += " <input type='hidden' name='_method' value='" + $(this).attr('data-method') + "'>\n";
|
||||
if ($(this).attr('data-token')) {
|
||||
methodForm += "<input type='hidden' name='_token' value='" + $(this).attr('data-token') + "'>\n";
|
||||
}
|
||||
methodForm += "</form>\n";
|
||||
return methodForm;
|
||||
})
|
||||
.removeAttr('href')
|
||||
.attr('onclick', ' if ($(this).hasClass(\'confirm-action\')) { if(confirm("Are you sure you want to do this?")) { $(this).find("form").submit(); } } else { $(this).find("form").submit(); }');
|
||||
|
||||
// Messenger config
|
||||
Messenger.options = {
|
||||
extraClasses: 'messenger-fixed messenger-on-top',
|
||||
theme: 'air'
|
||||
};
|
||||
|
||||
// App setup
|
||||
window.CachetHQ = {};
|
||||
|
||||
moment.locale(Global.locale);
|
||||
|
||||
$('abbr.timeago').each(function () {
|
||||
var $el = $(this);
|
||||
$el
|
||||
.livestamp($el.data('timeago'))
|
||||
.tooltip();
|
||||
});
|
||||
|
||||
window.CachetHQ.Notifier = function () {
|
||||
this.notify = function (message, type, options) {
|
||||
type = (typeof type === 'undefined' || type === 'error') ? 'error' : type;
|
||||
|
||||
var defaultOptions = {
|
||||
message: message,
|
||||
type: type,
|
||||
showCloseButton: true
|
||||
};
|
||||
|
||||
options = _.extend(defaultOptions, options);
|
||||
|
||||
Messenger().post(options);
|
||||
};
|
||||
};
|
||||
|
||||
$(".sidebar-toggler").click(function(e) {
|
||||
e.preventDefault();
|
||||
$(".wrapper").toggleClass("toggled");
|
||||
});
|
||||
|
||||
$('.color-code').minicolors({
|
||||
control: 'hue',
|
||||
defaultValue: $(this).val() || '',
|
||||
inline: false,
|
||||
letterCase: 'lowercase',
|
||||
opacity: false,
|
||||
position: 'bottom left',
|
||||
theme: 'bootstrap'
|
||||
});
|
||||
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
|
||||
$('button.close').on('click', function() {
|
||||
$(this).parents('div.alert').addClass('hide');
|
||||
});
|
||||
|
||||
$('form[name=IncidentForm] select[name=incident\\[component_id\\]]').on('change', function() {
|
||||
var $option = $(this).find('option:selected');
|
||||
var $componentStatus = $('#component-status');
|
||||
|
||||
if ($option.val() !== '') {
|
||||
if ($componentStatus.hasClass('hidden')) {
|
||||
$componentStatus.removeClass('hidden');
|
||||
} else {
|
||||
$componentStatus.addClass('hidden');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Date picker.
|
||||
$('input[rel=datepicker]').datetimepicker({
|
||||
format: "DD/MM/YYYY HH:mm",
|
||||
minDate: new Date(), // Don't allow dates before today.
|
||||
sideBySide: true,
|
||||
icons: {
|
||||
time: 'ion-clock',
|
||||
date: 'ion-android-calendar',
|
||||
up: 'ion-ios-arrow-up',
|
||||
down: 'ion-ios-arrow-down',
|
||||
previous: 'ion-ios-arrow-left',
|
||||
next: 'ion-ios-arrow-right',
|
||||
today: 'ion-android-home',
|
||||
clear: 'ion-trash-a',
|
||||
}
|
||||
});
|
||||
|
||||
// Sortable components.
|
||||
var componentList = document.getElementById("component-list");
|
||||
if (componentList) {
|
||||
new Sortable(componentList, {
|
||||
group: "omega",
|
||||
handle: ".drag-handle",
|
||||
onUpdate: function() {
|
||||
// Loop each component, setting the order input to the new order.
|
||||
var $components = $('#component-list .striped-list-item');
|
||||
$.each($components, function(id) {
|
||||
// Order should start from 1 now.
|
||||
$(this).find('input[rel=order]').val(id + 1);
|
||||
});
|
||||
|
||||
// Now POST the form to the internal API.
|
||||
$.ajax({
|
||||
async: true,
|
||||
url: '/dashboard/api/components/order',
|
||||
type: 'POST',
|
||||
data: $('form[name=componentList]').serializeObject(),
|
||||
success: function() {
|
||||
(new CachetHQ.Notifier()).notify('Components updated.', 'success');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Toggle inline component statuses.
|
||||
$('form.component-inline').on('click', 'input[type=radio]', function() {
|
||||
var $form = $(this).parents('form');
|
||||
var formData = $form.serializeObject();
|
||||
|
||||
$.ajax({
|
||||
async: true,
|
||||
url: '/dashboard/api/components/' + formData.component_id,
|
||||
type: 'POST',
|
||||
data: formData,
|
||||
success: function(component) {
|
||||
(new CachetHQ.Notifier()).notify($form.data('messenger'), 'success');
|
||||
},
|
||||
error: function(a, b, c) {
|
||||
(new CachetHQ.Notifier()).notify('Something went wrong updating the component.');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Incident management
|
||||
$('select[name=template]').on('change', function() {
|
||||
var $this = $(this).find('option:selected'),
|
||||
slug = $this.val();
|
||||
|
||||
// Only fetch the template if we've picked one.
|
||||
if (slug) {
|
||||
$.ajax({
|
||||
async: true,
|
||||
dataType: 'json',
|
||||
data: {
|
||||
slug: slug
|
||||
},
|
||||
url: '/dashboard/api/incidents/templates',
|
||||
success: function(tpl) {
|
||||
var $form = $('form[role=form]');
|
||||
$form.find('input[name=incident\\[name\\]]').val(tpl.name);
|
||||
$form.find('textarea[name=incident\\[message\\]]').val(tpl.template);
|
||||
},
|
||||
error: function() {
|
||||
(new CachetHQ.Notifier()).notify('There was an error finding that template.');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Banner removal JS
|
||||
$('#remove-banner').click(function(){
|
||||
$('#banner-view').remove();
|
||||
$('input[name=remove_banner]').val('1');
|
||||
});
|
||||
|
||||
// Setup wizard
|
||||
$('.wizard-next').on('click', function () {
|
||||
var $form = $('#setup-form'),
|
||||
$btn = $(this),
|
||||
current = $btn.data('currentBlock'),
|
||||
next = $btn.data('nextBlock');
|
||||
|
||||
$btn.button('loading');
|
||||
|
||||
// Only validate going forward. If current group is invalid, do not go further
|
||||
if (next > current) {
|
||||
var url = '/setup/step' + current;
|
||||
$.post(url, $form.serializeObject())
|
||||
.done(function(response) {
|
||||
goToStep(current, next);
|
||||
})
|
||||
.fail(function(response) {
|
||||
var errors = _.toArray(response.responseJSON.errors);
|
||||
_.each(errors, function(error) {
|
||||
(new CachetHQ.Notifier()).notify(error);
|
||||
});
|
||||
})
|
||||
.always(function() {
|
||||
$btn.button('reset');
|
||||
});
|
||||
|
||||
return false;
|
||||
} else {
|
||||
goToStep(current, next);
|
||||
$btn.button('reset');
|
||||
}
|
||||
});
|
||||
|
||||
function goToStep(current, next) {
|
||||
// validation was ok. We can go on next step.
|
||||
$('.block-' + current)
|
||||
.removeClass('show')
|
||||
.addClass('hidden');
|
||||
|
||||
$('.block-' + next)
|
||||
.removeClass('hidden')
|
||||
.addClass('show');
|
||||
|
||||
$('.steps .step')
|
||||
.removeClass("active")
|
||||
.filter(":lt(" + (next) + ")")
|
||||
.addClass("active");
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,24 @@
|
||||
body.error-page {
|
||||
background-color: #f3f3f4;
|
||||
|
||||
.middle-box {
|
||||
height: 400px;
|
||||
width: 400px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-top: -250px;
|
||||
margin-left: -200px;
|
||||
z-index: 100;
|
||||
|
||||
h1 {
|
||||
font-size: 9em;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
&.font-bold {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
.uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
// Theme colours.
|
||||
$cachet-base-light: #fff;
|
||||
$cachet-base-medium: #f0f3f4;
|
||||
$cachet-base-dark: #333;
|
||||
|
||||
$cachet-primary: #7ED321;
|
||||
$cachet-secondary: #6DB81C;
|
||||
|
||||
$cachet-link: #7ed321;
|
||||
$cachet-link-hover: #01579b;
|
||||
|
||||
$cachet-gray-light: #e8e8e8;
|
||||
$cachet-gray: #999;
|
||||
$cachet-gray-darker: #666;
|
||||
|
||||
$cachet-icons: #5e5e5e;
|
||||
|
||||
// Statuses
|
||||
$cachet-green: $cachet-primary;
|
||||
$cachet-dark-green: darken($cachet-green, 10%);
|
||||
|
||||
$cachet-blue: #3498db;
|
||||
$cachet-dark-blue: darken($cachet-blue, 10%);
|
||||
|
||||
$cachet-red: #ff6f6f;
|
||||
$cachet-dark-red: darken($cachet-red, 10%);
|
||||
|
||||
$cachet-teal: #0dccc0;
|
||||
$cachet-dark-teal: darken($cachet-teal, 10%);
|
||||
|
||||
$cachet-yellow: #F7CA18;
|
||||
$cachet-dark-yellow: darken($cachet-yellow, 10%);
|
||||
|
||||
$cachet-pink: #b23f73;
|
||||
$cachet-dark-pink: darken($cachet-pink, 10%);
|
||||
|
||||
$cachet-grey: #ecf0f1;
|
||||
$cachet-dark-grey: darken($cachet-grey, 10%);
|
||||
|
||||
$cachet-orange: #FF8800;
|
||||
$dark-orange: darken($cachet-orange, 10%);
|
||||
@@ -0,0 +1,323 @@
|
||||
body.status-page {
|
||||
font-family: 'Open Sans', 'Helevetic Neue', Arial, sans-serif;
|
||||
background-color: #F0F3F4;
|
||||
color: #333333;
|
||||
font-size: 1.4em;
|
||||
font-weight: $base-font-weight;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
hr {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
.tooltip-inner {
|
||||
padding: 8px 12px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.help-icon {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.text-success, .text-component-1 {
|
||||
color: $cachet_green;
|
||||
}
|
||||
|
||||
.text-info, .text-component-2 {
|
||||
color: $cachet_blue;
|
||||
}
|
||||
|
||||
.text-alert, .text-component-3 {
|
||||
color: $cachet_yellow;
|
||||
}
|
||||
|
||||
.text-danger, .text-component-4 {
|
||||
color: $cachet_red;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
margin-bottom: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.app-banner {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.about-app {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 40px;
|
||||
p {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
.alert {
|
||||
border-radius: 0;
|
||||
font-size: 1.2em;
|
||||
&.alert-success {
|
||||
background-color: $cachet_green;
|
||||
border-color: $cachet_dark-green;
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.alert-info {
|
||||
background: $cachet_blue;
|
||||
border-color: $cachet_dark-blue;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
&.alert-danger {
|
||||
background: $cachet_red;
|
||||
border-color: $cachet_dark-red;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
|
||||
.timeline {
|
||||
.content-wrapper {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 40px;
|
||||
font-size: 22px;
|
||||
small {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.panel {
|
||||
.panel-body {
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 4px;
|
||||
font-size: 2em;
|
||||
}
|
||||
h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 4px;
|
||||
font-size: 1.8em;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 4px;
|
||||
font-size: 1.6em;
|
||||
}
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 4px;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
h5 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 4px;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.moment {
|
||||
width: 100%;
|
||||
padding-bottom: 10px;
|
||||
position: relative;
|
||||
&.first {
|
||||
&:before {
|
||||
height: 130%;
|
||||
top: -20px;
|
||||
}
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 23px;
|
||||
top: -20px;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
background: $cachet_gray_light;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 26px;
|
||||
top: 5px;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background: #7266BA;
|
||||
}
|
||||
.status-icon {
|
||||
background: #fff;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #e8e8e8;
|
||||
position: absolute;
|
||||
left: 25px;
|
||||
top: 14px;
|
||||
.icon {
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
left: 11px;
|
||||
|
||||
&.ion-alert {
|
||||
left: 15px;
|
||||
}
|
||||
}
|
||||
&.status-0 {
|
||||
color: $cachet_pink;
|
||||
}
|
||||
&.status-1 {
|
||||
color: $cachet_orange;
|
||||
}
|
||||
&.status-2 {
|
||||
color: $cachet_yellow;
|
||||
}
|
||||
&.status-3 {
|
||||
color: $cachet_blue;
|
||||
}
|
||||
&.status-4 {
|
||||
color: $cachet_green;
|
||||
}
|
||||
}
|
||||
&.last:before {
|
||||
background: #fff;
|
||||
}
|
||||
.panel {
|
||||
margin: 0;
|
||||
border-radius: 2px;
|
||||
|
||||
&.panel-message {
|
||||
border: 1px solid #e8e8e8;
|
||||
.date {
|
||||
color: darken(#c7c7c7, 20%);
|
||||
}
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 1px;
|
||||
display: inline-block;
|
||||
border-top: 15px solid transparent;
|
||||
border-left: 0 solid #e8e8e8;
|
||||
border-right: 15px solid #e8e8e8;
|
||||
border-bottom: 15px solid transparent;
|
||||
content: " ";
|
||||
}
|
||||
|
||||
&:after {
|
||||
position: absolute;
|
||||
top: 17px;
|
||||
left: 2px;
|
||||
display: inline-block;
|
||||
border-top: 14px solid transparent;
|
||||
border-left: 0 solid #fff;
|
||||
border-right: 14px solid #fff;
|
||||
border-bottom: 14px solid transparent;
|
||||
content: " ";
|
||||
}
|
||||
}
|
||||
|
||||
.panel-body {
|
||||
border-top: 1px solid #eee;
|
||||
p {
|
||||
margin: 0;
|
||||
font-size: 1em;
|
||||
// font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.timeline .moment .content {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.list-group {
|
||||
margin-bottom: 20px;
|
||||
padding-left: 0;
|
||||
border-radius: 0;
|
||||
|
||||
.list-group-item {
|
||||
border-radius: 0;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid $cachet_gray_light;
|
||||
font-size: 1.1em;
|
||||
padding: 15px 15px;
|
||||
|
||||
a {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin: 0;
|
||||
font-weight: 400;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
p, time {
|
||||
margin-bottom: 0;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
&.group-name {
|
||||
font-size: 1.2em;
|
||||
background-color: $cachet_gray_light;
|
||||
padding: {
|
||||
top: 0.6em;
|
||||
bottom: 0.6em;
|
||||
}
|
||||
}
|
||||
|
||||
&.sub-component {
|
||||
&:before {
|
||||
@extend .ion;
|
||||
content: $ionicon-var-ios-plus-outline;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
&.break {
|
||||
padding: 1px;
|
||||
background-color: $cachet_gray_light;
|
||||
}
|
||||
}
|
||||
|
||||
&.components {
|
||||
margin-bottom: 30px;
|
||||
p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.badge {
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer.footer {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
color: #777;
|
||||
text-align: center;
|
||||
border-top: 1px solid $cachet_gray_light;
|
||||
background-color: lighten($cachet_gray_light, 5%);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
@import "palette";
|
||||
|
||||
$ionicons-font-path: "../../../fonts" !default;
|
||||
@import "./bower_components/ionicons/scss/ionicons";
|
||||
|
||||
@import "modules/bootstrap";
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@import "helpers";
|
||||
|
||||
// Module overrides
|
||||
@import "modules/tabs";
|
||||
@import "modules/forms";
|
||||
@import "modules/well";
|
||||
|
||||
// Styles for partials
|
||||
@import "partials/base";
|
||||
@import "partials/wrapper";
|
||||
@import "partials/navbar";
|
||||
@import "partials/sidebar";
|
||||
@import "partials/content";
|
||||
@import "partials/modals";
|
||||
|
||||
// Styles for specific page
|
||||
@import "pages/login";
|
||||
@import "pages/setup";
|
||||
@import "pages/dashboard";
|
||||
|
||||
// Styles for plugins
|
||||
@import "plugins/messenger";
|
||||
@import "plugins/animate";
|
||||
@import "plugins/bootstrap-datetimepicker/bootstrap-datetimepicker";
|
||||
|
||||
// Status Page will need to override certain styles.
|
||||
@import "status-page";
|
||||
|
||||
// Error pages can have their own overrides.
|
||||
@import "errors";
|
||||
@@ -0,0 +1,52 @@
|
||||
// Bootstrap variable overrides and custom variables
|
||||
@import "variables";
|
||||
|
||||
// Core variables and mixins
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/variables";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/mixins";
|
||||
|
||||
// Reset and dependencies
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/normalize";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/print";
|
||||
|
||||
// Core CSS
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/scaffolding";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/type";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/code";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/grid";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/tables";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/forms";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/buttons";
|
||||
|
||||
// Components
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/component-animations";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/dropdowns";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/button-groups";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/input-groups";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/navs";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/navbar";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/breadcrumbs";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/pagination";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/pager";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/labels";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/badges";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/jumbotron";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/thumbnails";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/alerts";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/progress-bars";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/media";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/list-group";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/panels";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/responsive-embed";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/wells";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/close";
|
||||
|
||||
// Components w/ JavaScript
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/modals";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/tooltip";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/popovers";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/carousel";
|
||||
|
||||
// Utility classes
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/utilities";
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/responsive-utilities";
|
||||
@@ -0,0 +1,55 @@
|
||||
label {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
resize: none;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.markdown-control {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
position:absolute;
|
||||
display:block;
|
||||
right:0%;
|
||||
bottom:0%;
|
||||
width:40px;
|
||||
height:40px;
|
||||
font-size: 2em;
|
||||
font-family: "Ionicons";
|
||||
content: "\f4e6";
|
||||
}
|
||||
}
|
||||
|
||||
.form-control {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 34px;
|
||||
padding: 6px 12px;
|
||||
font-size: 14px;
|
||||
line-height: 1.42857143;
|
||||
color: #555;
|
||||
background-color: #fff;
|
||||
background-image: none;
|
||||
border: 1px solid #ccc;
|
||||
@include box-shadow(none !important);
|
||||
@include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s);
|
||||
|
||||
&:focus {
|
||||
border-color: #66afe9;
|
||||
}
|
||||
}
|
||||
|
||||
.component-inline {
|
||||
@media (max-width: $screen-xs-max) {
|
||||
.radio-items {
|
||||
text-align: left;
|
||||
.radio-inline {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
div[role=tabpanel] {
|
||||
ul.nav-tabs {
|
||||
border-bottom: 1px solid #d5d8d7;
|
||||
li {
|
||||
a {
|
||||
font-weight: 400;
|
||||
display: inline-block;
|
||||
padding: 10px 25px;
|
||||
border-radius: 0;
|
||||
font-size: 0.9em;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
border: {
|
||||
left: 1px solid #d5d8d7;
|
||||
bottom: 1px solid #d5d8d7;
|
||||
right: 1px solid #d5d8d7;
|
||||
}
|
||||
background-color: white;
|
||||
.tab-pane {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
// Brand colours.
|
||||
$brand-primary: darken(#428bca, 6.5%) !default;
|
||||
$brand-success: $cachet-primary !default;
|
||||
$brand-info: $cachet-blue !default;
|
||||
$brand-warning: $cachet-orange !default;
|
||||
$brand-danger: $cachet-red !default;
|
||||
|
||||
// Default border radius
|
||||
$border-radius-base: 2px !default;
|
||||
$border-radius-large: 4px !default;
|
||||
$border-radius-small: 1px !default;
|
||||
|
||||
//** Tooltip background color
|
||||
$tooltip-bg: #333 !default;
|
||||
$tooltip-opacity: .9 !default;
|
||||
$base-background-color: #f1f1f1;
|
||||
|
||||
$base-font-family: "Lato", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
|
||||
$base-font-weight: 400;
|
||||
$base-letter-spacing: 0.08em;
|
||||
$base-font-size: 15px;
|
||||
$base-line-height: 1.42857143;
|
||||
|
||||
$base-link-color: #ffffff;
|
||||
$base-link-hover-color: #e9e9e9;
|
||||
|
||||
$header-background-color: lighten(#00695C, 10%);
|
||||
$header-border-color: 1px solid darken($header-background-color, 10%);
|
||||
|
||||
$sidebar-transition-speed: .2s;
|
||||
$sidebar-background-color: #F0F3F4;
|
||||
$sidebar-border-color: 1px solid rgba(255, 255, 255, .1);
|
||||
$sidebar-border-shadow: inset 0px -2px 3px rgba(0,0,0,0.25);
|
||||
$sidebar-text-size: 0.9em;
|
||||
$sidebar-text-color: #333;
|
||||
$sidebar-text-active-color: #333;
|
||||
$sidebar-normal-width: 230px;
|
||||
$sidebar-phone-width: 75%;
|
||||
$sidebar-active-color: #00695C;
|
||||
@@ -0,0 +1,3 @@
|
||||
.well {
|
||||
border-radius: 0;
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
.componet-inline-update {
|
||||
@extend .text-right;
|
||||
padding-top: 8px;
|
||||
label {
|
||||
display: initial;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
.login {
|
||||
padding-top: 90px;
|
||||
}
|
||||
|
||||
.login .logo {
|
||||
display: block;
|
||||
margin: 0 auto 30px;
|
||||
}
|
||||
|
||||
.login legend {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
margin: 0 0 30px 0;
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
.setup-page {
|
||||
padding-top: 60px;
|
||||
.logo {
|
||||
display: block;
|
||||
margin: 0 auto 30px;
|
||||
}
|
||||
.steps {
|
||||
@extend .row;
|
||||
margin: 0 auto;
|
||||
border-radius: 2px 2px 0 0;
|
||||
margin-bottom: 20px;
|
||||
.step {
|
||||
@extend .col-xs-4;
|
||||
padding: 20px 0;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
font-size: 13px;
|
||||
&:not(:last-child):after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 31px;
|
||||
left: 55%;
|
||||
display: block;
|
||||
height: 1px;
|
||||
background: #94A1B8;
|
||||
width: 100%;
|
||||
}
|
||||
span {
|
||||
width: 23px;
|
||||
height: 23px;
|
||||
display: block;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
margin-top: 13px;
|
||||
border-radius: 25px;
|
||||
background: $cachet-base-medium;
|
||||
border: 1px solid #94A1B8;
|
||||
-webkit-transition: all 0.2s linear;
|
||||
-moz-transition: all 0.2s linear;
|
||||
-ms-transition: all 0.2s linear;
|
||||
-o-transition: all 0.2s linear;
|
||||
transition: all 0.2s linear;
|
||||
}
|
||||
|
||||
&.active {
|
||||
span {
|
||||
background: $cachet-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.setup-success {
|
||||
text-align: center;
|
||||
i {
|
||||
font-size: 47px;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 25px;
|
||||
font-size: 21px;
|
||||
color: #556579;
|
||||
}
|
||||
.btn {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
body.dashboard {
|
||||
font-family: $base-font-family;
|
||||
font-weight: $base-font-weight;
|
||||
font-size: $base-font-size;
|
||||
letter-spacing: $base-letter-spacing;
|
||||
display: table;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
table-layout: fixed;
|
||||
line-height: $base-line-height;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
.wrapper {
|
||||
padding-left: 0;
|
||||
-webkit-transition: all 0.5s ease;
|
||||
-moz-transition: all 0.5s ease;
|
||||
-o-transition: all 0.5s ease;
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
|
||||
.wrapper.toggled {
|
||||
padding-left: $sidebar-normal-width;;
|
||||
}
|
||||
|
||||
.wrapper.toggled .sidebar {
|
||||
width: $sidebar-normal-width;;
|
||||
}
|
||||
|
||||
.wrapper.toggled .page-content {
|
||||
position: absolute;
|
||||
margin-right: -$sidebar-normal-width;;
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
|
||||
.wrapper {
|
||||
padding-left: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm-max) {
|
||||
.wrapper {
|
||||
padding-left: $sidebar-normal-width;
|
||||
}
|
||||
|
||||
.wrapper.toggled {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.wrapper.toggled .page-content {
|
||||
position: relative;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.alerts {
|
||||
.alert h5 {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
body.dashboard {
|
||||
.page-content {
|
||||
width: 100%;
|
||||
.content-wrapper {
|
||||
padding-top: 20px;
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
&.header-fixed {
|
||||
margin-top: 60px;
|
||||
}
|
||||
}
|
||||
.header {
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
padding: 22px 40px;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
font-size: 1.2em;
|
||||
border-bottom: 1px solid #eee;
|
||||
z-index: 99;
|
||||
&.sub-header {
|
||||
padding: 8px 2px;
|
||||
height: 50px;
|
||||
}
|
||||
&.fixed {
|
||||
position: fixed;
|
||||
padding-left: 270px;
|
||||
}
|
||||
input, button, .btn {
|
||||
position: relative;
|
||||
top: -4px;
|
||||
}
|
||||
input {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
+ .row {
|
||||
margin-top: 23px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #444;
|
||||
margin-top: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-header {
|
||||
font-weight: 300;
|
||||
text-transform: uppercase;
|
||||
a {
|
||||
text-transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.striped-list {
|
||||
.striped-list-item {
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 8px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.user-grid {
|
||||
.user {
|
||||
img {
|
||||
border-radius: 5px;
|
||||
margin-bottom: 15px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.email {
|
||||
color: #444;
|
||||
margin-top: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Header media queries
|
||||
@media (max-width: $screen-xs-max) {
|
||||
.page-content {
|
||||
.content-wrapper {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.header {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
&.fixed {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
|
||||
.page-content {
|
||||
.header.fixed {
|
||||
padding-left: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,64 @@
|
||||
#welcome-modal {
|
||||
.modal-dialog {
|
||||
margin-top: 65px;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
.modal-header {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
padding-bottom: 50px;
|
||||
|
||||
header {
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
font-size: 22px;
|
||||
color: #444;
|
||||
margin-bottom: 23px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 13px;
|
||||
color: #555;
|
||||
margin: 0 auto;
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.go-dashboard {
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.get-started {
|
||||
margin-top: 40px;
|
||||
|
||||
.col-md-4 {
|
||||
text-align: center;
|
||||
padding-bottom: 50px;
|
||||
a {
|
||||
i {
|
||||
font-size: 38px;
|
||||
color: $cachet-secondary;
|
||||
display: block;
|
||||
}
|
||||
|
||||
color: $cachet-gray-darker;
|
||||
display: block;
|
||||
margin-top: 12px;
|
||||
font-size: 13px;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: $cachet-gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
body.dashboard {
|
||||
.navbar {
|
||||
z-index: 999;
|
||||
border-radius: 0px;
|
||||
border: none;
|
||||
border-bottom: $header-border-color;
|
||||
background: $header-background-color;
|
||||
margin: 0;
|
||||
a, a:active, a:visited {
|
||||
color: $base-link-color;
|
||||
&:hover {
|
||||
color: $base-link-hover-color;
|
||||
}
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 15px;
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
&.collapsed span {
|
||||
background-color: $base-link-color;
|
||||
}
|
||||
}
|
||||
.navbar-collapse {
|
||||
background: $header-background-color;
|
||||
}
|
||||
a.navbar-brand {
|
||||
padding: 34px 21px;
|
||||
line-height: 0em;
|
||||
font-size: 1.1em;
|
||||
letter-spacing: 0.04em;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
@media #{$screen-sm-max} {
|
||||
span {
|
||||
padding-right: 10px;
|
||||
&:before {
|
||||
font-family: FontAwesome;
|
||||
content: "\f060";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.nav li a {
|
||||
height: 68px;
|
||||
line-height: 35px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,278 @@
|
||||
body.dashboard {
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
left: $sidebar-normal-width;
|
||||
width: 0;
|
||||
height: 100%;
|
||||
margin-left: -$sidebar-normal-width;
|
||||
overflow-y: auto;
|
||||
background: $sidebar-background-color;
|
||||
@include box-shadow($sidebar-border-shadow);
|
||||
z-index: 1000;
|
||||
-webkit-transition: all 0.5s ease;
|
||||
-moz-transition: all 0.5s ease;
|
||||
-o-transition: all 0.5s ease;
|
||||
transition: all 0.5s ease;
|
||||
|
||||
.sidebar-inner {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: $sidebar-normal-width;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
.profile {
|
||||
padding: 20px 10px;
|
||||
margin-bottom: 0;
|
||||
.dropdown-toggle {
|
||||
text-decoration: none;
|
||||
}
|
||||
.dropdown-menu {
|
||||
top: 108%;
|
||||
}
|
||||
.avatar {
|
||||
width: 60px;
|
||||
margin-right: 10px;
|
||||
img {
|
||||
border-radius: 50%;
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
.profile {
|
||||
&.username {
|
||||
word-break: break-all;
|
||||
color: $sidebar-text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.quick-add-incident {
|
||||
@extend .text-center;
|
||||
padding: 10px;
|
||||
}
|
||||
ul {
|
||||
clear: both;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
font-size: $sidebar-text-size;
|
||||
&:last-child {
|
||||
border-bottom: $sidebar-border-color;
|
||||
}
|
||||
&.active {
|
||||
background: lighten($sidebar-background-color, 2%);
|
||||
a {
|
||||
padding-top: 14px;
|
||||
padding-bottom: 14px;
|
||||
border-top: 1px solid #BED3EA;
|
||||
border-bottom: 1px solid #BED3EA;
|
||||
color: $sidebar-text-active-color;
|
||||
}
|
||||
}
|
||||
a {
|
||||
display: block;
|
||||
padding: 15px;
|
||||
color: $sidebar-text-color;
|
||||
i {
|
||||
font-size: 18px;
|
||||
min-width: 17px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
span {
|
||||
&.label {
|
||||
float: right;
|
||||
margin: 6px 0;
|
||||
&.label-info {
|
||||
background-color: $cachet-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.sub-nav-item {
|
||||
a {
|
||||
padding-left: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom-menu-sidebar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 230px;
|
||||
z-index: 999;
|
||||
ul > li {
|
||||
float: left;
|
||||
display: block;
|
||||
width: 33.333%;
|
||||
border-right: 1px solid #ddd;
|
||||
border-top: 1px solid #ddd;
|
||||
a {
|
||||
display: block;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 6px 0;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar media queries
|
||||
@media (min-width: $screen-xs-max) {
|
||||
.sidebar {
|
||||
width: $sidebar-normal-width;
|
||||
}
|
||||
|
||||
.wrapper.toggled .sidebar {
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
|
||||
.sidebar {
|
||||
width: 80px;
|
||||
left: 150px;
|
||||
margin-left: -150px;
|
||||
.sidebar-inner {
|
||||
width: 80px;
|
||||
.profile .avatar img {
|
||||
width: 40px;
|
||||
}
|
||||
.profile .username-wrapper {
|
||||
@extend .hidden-sm;
|
||||
}
|
||||
.quick-add-incident {
|
||||
.btn {
|
||||
padding: 3px 6px;
|
||||
}
|
||||
i {
|
||||
@extend .visible-sm;
|
||||
font-size: 20px;
|
||||
}
|
||||
span {
|
||||
@extend .hidden-sm;
|
||||
}
|
||||
}
|
||||
& > ul > li > a {
|
||||
text-align: center;
|
||||
& > i {
|
||||
font-size: 25px;
|
||||
}
|
||||
& > span {
|
||||
@extend .hidden-sm;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom-menu-sidebar {
|
||||
@extend .hidden-sm;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-toggler {
|
||||
float: left;
|
||||
padding: 10px;
|
||||
position: relative;
|
||||
top: -15px;
|
||||
left: -5px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
i {
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-sidebar {
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
position: fixed;
|
||||
margin-left: 228px;
|
||||
width: 22%;
|
||||
background: #fcfcfc;
|
||||
border-right: 1px solid #E8ECF1;
|
||||
|
||||
h3 {
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
font-size: 19px;
|
||||
padding: 30px 0;
|
||||
}
|
||||
|
||||
ul.menu {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
a {
|
||||
color: #666;
|
||||
display: block;
|
||||
padding: 13px 30px;
|
||||
font-size: 15px;
|
||||
transition: all 0.2s linear;
|
||||
text-decoration: none;
|
||||
|
||||
&.active {
|
||||
color: $cachet-secondary;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $cachet-secondary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-toggler {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 20px;
|
||||
font-size: 36px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
+ .content-wrapper {
|
||||
top: 0;
|
||||
position: relative;
|
||||
margin-left: 26%;
|
||||
padding-right: 40px !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Sub-sidebar media queries
|
||||
@media (max-width: $screen-xs-max) {
|
||||
.sub-sidebar {
|
||||
position: relative;
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
+ .content-wrapper {
|
||||
margin-left: 0;
|
||||
padding-left: 40px !important;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
|
||||
.sub-sidebar {
|
||||
margin-left: 80px;
|
||||
width: 25%;
|
||||
+ .content-wrapper {
|
||||
padding-left: 45px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
body.dashboard {
|
||||
.wrapper {
|
||||
width: 100%;
|
||||
display: table;
|
||||
height: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
@import "./bower_components/animate-sass/animate";
|
||||
|
||||
body {
|
||||
-webkit-backface-visibility: hidden; // Addresses a small issue in webkit: http://bit.ly/NEdoDq
|
||||
}
|
||||
.animated {
|
||||
@include animate-prefixer(animation-duration, $base-duration);
|
||||
@include animate-prefixer(animation-fill-mode, both);
|
||||
|
||||
&.hinge {
|
||||
@include animate-prefixer(animation-duration, $base-duration * 2);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,459 @@
|
||||
ul.messenger {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
ul.messenger > li {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
ul.messenger.messenger-empty {
|
||||
display: none;
|
||||
}
|
||||
ul.messenger .messenger-message {
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
ul.messenger .messenger-message.messenger-hidden {
|
||||
display: none;
|
||||
}
|
||||
ul.messenger .messenger-message .messenger-phrase, ul.messenger .messenger-message .messenger-actions a {
|
||||
padding-right: 5px;
|
||||
}
|
||||
ul.messenger .messenger-message .messenger-actions {
|
||||
float: right;
|
||||
}
|
||||
ul.messenger .messenger-message .messenger-actions a {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
ul.messenger .messenger-message ul, ul.messenger .messenger-message ol {
|
||||
margin: 10px 18px 0;
|
||||
}
|
||||
ul.messenger.messenger-fixed {
|
||||
position: fixed;
|
||||
z-index: 10000;
|
||||
}
|
||||
ul.messenger.messenger-fixed .messenger-message {
|
||||
min-width: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.messenger.messenger-fixed .message .messenger-actions {
|
||||
float: left;
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-top {
|
||||
top: 20px;
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-bottom {
|
||||
bottom: 20px;
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-top, ul.messenger.messenger-fixed.messenger-on-bottom {
|
||||
left: 50%;
|
||||
width: 600px;
|
||||
margin-left: -300px;
|
||||
}
|
||||
@media (max-width: 960px) {
|
||||
ul.messenger.messenger-fixed.messenger-on-top, ul.messenger.messenger-fixed.messenger-on-bottom {
|
||||
left: 10%;
|
||||
width: 80%;
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-top.messenger-on-right, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-right {
|
||||
right: 20px;
|
||||
left: auto;
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
|
||||
left: 20px;
|
||||
margin-left: 0px;
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-right, ul.messenger.messenger-fixed.messenger-on-left {
|
||||
width: 350px;
|
||||
}
|
||||
ul.messenger.messenger-fixed.messenger-on-right .messenger-actions, ul.messenger.messenger-fixed.messenger-on-left .messenger-actions {
|
||||
float: left;
|
||||
}
|
||||
ul.messenger .messenger-spinner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@-webkit-keyframes ui-spinner-rotate-right {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
-webkit-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes ui-spinner-rotate-left {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
-webkit-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-keyframes ui-spinner-rotate-right {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
-moz-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-moz-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
-moz-transform: rotate(360deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-keyframes ui-spinner-rotate-left {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
-moz-transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-moz-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
-moz-transform: rotate(180deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ui-spinner-rotate-right {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ui-spinner-rotate-left {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.messenger-spinner {
|
||||
position: relative;
|
||||
border-radius: 100%;
|
||||
}
|
||||
ul.messenger.messenger-spinner-active .messenger-spinner .messenger-spinner {
|
||||
display: block;
|
||||
}
|
||||
.messenger-spinner .messenger-spinner-side {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
.messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
|
||||
border-radius: 999px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-moz-animation-iteration-count: infinite;
|
||||
-ms-animation-iteration-count: infinite;
|
||||
-o-animation-iteration-count: infinite;
|
||||
animation-iteration-count: infinite;
|
||||
-webkit-animation-timing-function: linear;
|
||||
-moz-animation-timing-function: linear;
|
||||
-ms-animation-timing-function: linear;
|
||||
-o-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
}
|
||||
.messenger-spinner .messenger-spinner-side-left {
|
||||
left: 0;
|
||||
}
|
||||
.messenger-spinner .messenger-spinner-side-left .messenger-spinner-fill {
|
||||
left: 100%;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
-webkit-animation-name: ui-spinner-rotate-left;
|
||||
-moz-animation-name: ui-spinner-rotate-left;
|
||||
-ms-animation-name: ui-spinner-rotate-left;
|
||||
-o-animation-name: ui-spinner-rotate-left;
|
||||
animation-name: ui-spinner-rotate-left;
|
||||
-webkit-transform-origin: 0 50%;
|
||||
-moz-transform-origin: 0 50%;
|
||||
-ms-transform-origin: 0 50%;
|
||||
-o-transform-origin: 0 50%;
|
||||
transform-origin: 0 50%;
|
||||
}
|
||||
.messenger-spinner .messenger-spinner-side-right {
|
||||
left: 50%;
|
||||
}
|
||||
.messenger-spinner .messenger-spinner-side-right .messenger-spinner-fill {
|
||||
left: -100%;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
-webkit-animation-name: ui-spinner-rotate-right;
|
||||
-moz-animation-name: ui-spinner-rotate-right;
|
||||
-ms-animation-name: ui-spinner-rotate-right;
|
||||
-o-animation-name: ui-spinner-rotate-right;
|
||||
animation-name: ui-spinner-rotate-right;
|
||||
-webkit-transform-origin: 100% 50%;
|
||||
-moz-transform-origin: 100% 50%;
|
||||
-ms-transform-origin: 100% 50%;
|
||||
-o-transform-origin: 100% 50%;
|
||||
transform-origin: 100% 50%;
|
||||
}
|
||||
|
||||
ul.messenger-theme-air {
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
font-family: "Raleway", sans-serif;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message {
|
||||
-webkit-transition: background-color 0.4s;
|
||||
-moz-transition: background-color 0.4s;
|
||||
-o-transition: background-color 0.4s;
|
||||
transition: background-color 0.4s;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-ms-border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
-webkit-box-shadow: inset 0 0 0 1px white, inset 0 2px white, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(0, 0, 0, 0.2);
|
||||
-moz-box-shadow: inset 0 0 0 1px white, inset 0 2px white, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: inset 0 0 0 1px white, inset 0 2px white, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(0, 0, 0, 0.2);
|
||||
border: 0px;
|
||||
background-color: white;
|
||||
position: relative;
|
||||
margin-bottom: 1em;
|
||||
font-size: 13px;
|
||||
color: #666666;
|
||||
font-weight: 500;
|
||||
padding: 10px 30px 11px 46px;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message:hover {
|
||||
background-color: white;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-close {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
color: #888888;
|
||||
opacity: 1;
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
padding: 8px 10px 7px 7px;
|
||||
cursor: pointer;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-close:hover {
|
||||
color: #444444;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-close:active {
|
||||
color: #222222;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-actions {
|
||||
float: none;
|
||||
margin-top: 10px;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-actions a {
|
||||
-webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), inset 0px 1px rgba(255, 255, 255, 0.05);
|
||||
-moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), inset 0px 1px rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), inset 0px 1px rgba(255, 255, 255, 0.05);
|
||||
-webkit-border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
-ms-border-radius: 4px;
|
||||
-o-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
color: #888888;
|
||||
margin-right: 10px;
|
||||
padding: 3px 10px 5px;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-actions a:hover {
|
||||
-webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), inset 0px 1px rgba(255, 255, 255, 0.15);
|
||||
-moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), inset 0px 1px rgba(255, 255, 255, 0.15);
|
||||
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), inset 0px 1px rgba(255, 255, 255, 0.15);
|
||||
color: #444444;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-actions a:active {
|
||||
-webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18), inset 0px 1px rgba(0, 0, 0, 0.05);
|
||||
-moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18), inset 0px 1px rgba(0, 0, 0, 0.05);
|
||||
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18), inset 0px 1px rgba(0, 0, 0, 0.05);
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
color: #444444;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-actions .messenger-phrase {
|
||||
display: none;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message .messenger-message-inner:before {
|
||||
-webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
|
||||
-moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
|
||||
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
-ms-border-radius: 50%;
|
||||
-o-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 17px;
|
||||
display: block;
|
||||
content: " ";
|
||||
top: 50%;
|
||||
margin-top: -8px;
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
z-index: 20;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-success .messenger-message-inner:before {
|
||||
background-color: #5fca4a;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error.messenger-retry-soon .messenger-spinner {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: transparent;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error.messenger-retry-soon .messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
|
||||
background: #dd6a45;
|
||||
-webkit-animation-duration: 20s;
|
||||
-moz-animation-duration: 20s;
|
||||
-ms-animation-duration: 20s;
|
||||
-o-animation-duration: 20s;
|
||||
animation-duration: 20s;
|
||||
opacity: 1;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error.messenger-retry-soon .messenger-spinner:after {
|
||||
content: "";
|
||||
background: white;
|
||||
position: absolute;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
border-radius: 50%;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
display: block;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error.messenger-retry-later .messenger-spinner {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: transparent;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error.messenger-retry-later .messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
|
||||
background: #dd6a45;
|
||||
-webkit-animation-duration: 600s;
|
||||
-moz-animation-duration: 600s;
|
||||
-ms-animation-duration: 600s;
|
||||
-o-animation-duration: 600s;
|
||||
animation-duration: 600s;
|
||||
opacity: 1;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error.messenger-retry-later .messenger-spinner:after {
|
||||
content: "";
|
||||
background: white;
|
||||
position: absolute;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
border-radius: 50%;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
display: block;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-error .messenger-message-inner:before {
|
||||
background-color: #dd6a45;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-message.alert-info .messenger-message-inner:before {
|
||||
background-color: #61c4b8;
|
||||
}
|
||||
ul.messenger-theme-air .messenger-spinner {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 12px;
|
||||
top: 50%;
|
||||
margin-top: -13px;
|
||||
z-index: 999;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
z-index: 10;
|
||||
}
|
||||
+301
@@ -0,0 +1,301 @@
|
||||
// Import boostrap variables including default color palette and fonts
|
||||
@import "./bower_components/bootstrap-sass/assets/stylesheets/bootstrap/_variables";
|
||||
|
||||
.bootstrap-datetimepicker-widget {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 250px;
|
||||
padding: 4px;
|
||||
margin-top: 1px;
|
||||
z-index: 99999 !important;
|
||||
border-radius: $border-radius-base;
|
||||
|
||||
&.timepicker-sbs {
|
||||
width: 600px;
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 7px solid transparent;
|
||||
border-right: 7px solid transparent;
|
||||
border-bottom: 7px solid #ccc;
|
||||
border-bottom-color: rgba(0,0,0,.2);
|
||||
position: absolute;
|
||||
top: -7px;
|
||||
left: 7px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 6px solid transparent;
|
||||
border-right: 6px solid transparent;
|
||||
border-bottom: 6px solid white;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
&.top {
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 7px solid transparent;
|
||||
border-right: 7px solid transparent;
|
||||
border-top: 7px solid #ccc;
|
||||
border-top-color: rgba(0,0,0,.2);
|
||||
position: absolute;
|
||||
bottom: -7px;
|
||||
left: 6px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 6px solid transparent;
|
||||
border-right: 6px solid transparent;
|
||||
border-top: 6px solid white;
|
||||
position: absolute;
|
||||
bottom: -6px;
|
||||
left: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
& .dow {
|
||||
width: 14.2857%;
|
||||
}
|
||||
|
||||
&.pull-right {
|
||||
&:before {
|
||||
left: auto;
|
||||
right: 6px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
left: auto;
|
||||
right: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
>ul {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a[data-action] {
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
a[data-action]:active {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.timepicker-hour, .timepicker-minute, .timepicker-second {
|
||||
width: 54px;
|
||||
font-weight: bold;
|
||||
font-size: 1.2em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
button[data-action] {
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
table[data-hour-format="12"] .separator {
|
||||
width: 4px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.datepicker > div {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.picker-switch {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
text-align: center;
|
||||
border-radius: $border-radius-base;
|
||||
}
|
||||
|
||||
td {
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
width: 54px;
|
||||
|
||||
&.cw {
|
||||
font-size: 10px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
color: $gray-light;
|
||||
}
|
||||
|
||||
&.day {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
&.day:hover,
|
||||
&.hour:hover,
|
||||
&.minute:hover,
|
||||
&.second:hover {
|
||||
background: $gray-lighter;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&.old,
|
||||
&.new {
|
||||
color: $gray-light;
|
||||
}
|
||||
|
||||
&.today {
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
border-left: 7px solid transparent;
|
||||
border-bottom: 7px solid $btn-primary-bg;
|
||||
border-top-color: rgba(0, 0, 0, 0.2);
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
&.active,
|
||||
&.active:hover {
|
||||
background-color: $btn-primary-bg;
|
||||
color: $btn-primary-color;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
}
|
||||
|
||||
&.active.today:before {
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
background: none;
|
||||
color: $gray-light;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
margin: 2px 1.5px;
|
||||
cursor: pointer;
|
||||
border-radius: $border-radius-base;
|
||||
|
||||
&:hover {
|
||||
background: $gray-lighter;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: $btn-primary-bg;
|
||||
color: $btn-primary-color;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
||||
}
|
||||
|
||||
&.old {
|
||||
color: $gray-light;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
background: none;
|
||||
color: $gray-light;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
th {
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
width: 20px;
|
||||
|
||||
&.picker-switch {
|
||||
width: 145px;
|
||||
}
|
||||
|
||||
&.next,
|
||||
&.prev {
|
||||
font-size: $font-size-base * 1.5;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&.disabled:hover {
|
||||
background: none;
|
||||
color: $gray-light;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
thead tr:first-child th {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: $gray-lighter;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.input-group {
|
||||
&.date {
|
||||
.input-group-addon span {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bootstrap-datetimepicker-widget.left-oriented {
|
||||
&:before {
|
||||
left: auto;
|
||||
right: 6px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
left: auto;
|
||||
right: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.bootstrap-datetimepicker-widget ul.list-unstyled li div.timepicker div.timepicker-picker table.table-condensed tbody > tr > td {
|
||||
padding: 0px !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
.bootstrap-datetimepicker-widget.timepicker-sbs {
|
||||
width: 283px;
|
||||
}
|
||||
}
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0,0,0,0);
|
||||
border: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user