Upgrade to Bootstrap 3

This commit is contained in:
benweet 2013-08-21 00:40:19 +02:00
parent ad584c1162
commit 8c785a1185
13 changed files with 220 additions and 523 deletions

View File

@ -99,12 +99,14 @@ define([
}
// Load settings in settings dialog
var $themeInputElt = undefined;
function loadSettings() {
// Layout orientation
utils.setInputRadio("radio-layout-orientation", settings.layoutOrientation);
// Theme
utils.setInputValue("#input-settings-theme", localStorage.theme || 'default');
utils.setInputValue($themeInputElt, localStorage.theme || 'default');
$themeInputElt.change();
// Lazy rendering
utils.setInputChecked("#input-settings-lazy-rendering", settings.lazyRendering);
// Editor font family
@ -131,7 +133,7 @@ define([
// Layout orientation
newSettings.layoutOrientation = utils.getInputRadio("radio-layout-orientation");
// Theme
var theme = utils.getInputValue("#input-settings-theme");
var theme = utils.getInputValue($themeInputElt);
// Lazy Rendering
newSettings.lazyRendering = utils.getInputChecked("#input-settings-lazy-rendering");
// Editor font family
@ -574,7 +576,7 @@ define([
$(this).find(".modal-footer a:last").click();
}
});
// Configure Mousetrap
mousetrap.stopCallback = function(e, element, combo) {
return uiLocked || isMenuPanelShown || isDocumentPanelShown || isModalShown || $(element).is("input, select, textarea:not(#wmd-input)");
@ -614,6 +616,30 @@ define([
window.location.reload();
}
});
// Hot theme switcher in the settings
var currentTheme = localStorage.theme || 'default';
function applyTheme(theme) {
theme = theme || 'default';
if(currentTheme != theme) {
var themeModule = "less!styles/" + theme;
// Undefine the module in RequireJS
requirejs.undef(themeModule);
// Then reload the style
require([
themeModule + ".less"
]);
currentTheme = theme;
}
}
$themeInputElt = $("#input-settings-theme");
$themeInputElt.on("change", function() {
applyTheme(this.value);
});
$(".action-apply-theme").click("change", function() {
applyTheme(localStorage.theme);
});
// Import settings
$(".action-import-settings").click(function(e) {
$("#input-file-import-settings").click();

View File

@ -47,6 +47,7 @@ define([
var liEltList = undefined;
var sortFunction = undefined;
var selectFileDesc = undefined;
var selectedLi = undefined;
var buildSelector = function() {
var liListHtml = _.chain(fileSystem).sortBy(sortFunction).reduce(function(result, fileDesc) {
return result + _.template(liEltTmpl, {
@ -64,6 +65,7 @@ define([
var fileDesc = fileSystem[$liElt.data('fileIndex')];
liEltMap[fileDesc.fileIndex] = $liElt;
$liElt.find("a").click(function() {
selectedLi = undefined;
if(!$liElt.hasClass("disabled")) {
fileMgr.selectFile(fileDesc);
}
@ -127,7 +129,6 @@ define([
}), dropdownElt));
var $dropdownElt = $(dropdownElt).dropdown();
var shortcutLi = undefined;
var documentPanelTogglerElt = $('.document-panel .collapse-button');
documentPanelTogglerElt.prop("title", _.template("<%= title %> <%= shortcutPrevious %> <%= shortcutNext %>", {
title: documentPanelTogglerElt.prop("title"),
@ -138,30 +139,30 @@ define([
// Handle key shortcut
var shortcutPrevious = documentSelector.config.shortcutPrevious.toLowerCase();
mousetrap.bind(shortcutPrevious, function() {
if(shortcutLi === undefined) {
if(selectedLi === undefined) {
$dropdownElt.dropdown('toggle');
shortcutLi = liEltMap[selectFileDesc.fileIndex];
selectedLi = liEltMap[selectFileDesc.fileIndex];
}
var liIndex = _.indexOf(liEltList, shortcutLi) - 1;
var liIndex = _.indexOf(liEltList, selectedLi) - 1;
if(liIndex === -2) {
liIndex = -1;
}
shortcutLi = liEltList[(liIndex + liEltList.length) % liEltList.length];
selectedLi = liEltList[(liIndex + liEltList.length) % liEltList.length];
_.defer(function() {
shortcutLi.find("a").focus();
selectedLi.find("a").focus();
});
return false;
});
var shortcutNext = documentSelector.config.shortcutNext.toLowerCase();
mousetrap.bind(documentSelector.config.shortcutNext.toLowerCase(), function() {
if(shortcutLi === undefined) {
if(selectedLi === undefined) {
$dropdownElt.dropdown('toggle');
shortcutLi = liEltMap[selectFileDesc.fileIndex];
selectedLi = liEltMap[selectFileDesc.fileIndex];
}
var liIndex = _.indexOf(liEltList, shortcutLi) + 1;
shortcutLi = liEltList[liIndex % liEltList.length];
var liIndex = _.indexOf(liEltList, selectedLi) + 1;
selectedLi = liEltList[liIndex % liEltList.length];
_.defer(function() {
shortcutLi.find("a").focus();
selectedLi.find("a").focus();
});
return false;
});
@ -173,9 +174,8 @@ define([
shortcutSelect1,
shortcutSelect2
], function() {
if(shortcutLi !== undefined) {
shortcutLi.find("a").click();
shortcutLi = undefined;
if(selectedLi !== undefined) {
selectedLi.find("a").click();
}
}, "keyup");
};

View File

@ -47,7 +47,7 @@ define([
}
}
options = options || {};
iconClass = iconClass || "icon-info-sign";
iconClass = iconClass || "icon-info-circled";
jGrowl("<i class='icon-white " + iconClass + "'></i> " + _.escape(message), options);
}
@ -58,10 +58,10 @@ define([
notifications.onError = function(error) {
logger.error(error);
if(_.isString(error)) {
showMessage(error, "icon-warning-sign");
showMessage(error, "icon-attention");
}
else if(_.isObject(error)) {
showMessage(error.message, "icon-warning-sign");
showMessage(error.message, "icon-attention");
}
};

View File

@ -949,7 +949,7 @@
</div>
<div class="modal-footer">
<a href="#" class="btn btn-default" data-dismiss="modal">Cancel</a>
<a href="#" class="btn btn-default action-apply-theme" data-dismiss="modal">Cancel</a>
<a href="#" class="btn btn-primary action-apply-settings"
data-dismiss="modal">OK</a>
</div>

View File

@ -1,356 +0,0 @@
/**
* jGrowl 1.2.11
*
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
*
* Written by Stan Lemon <stosh1985@gmail.com>
* Last updated: 2013.02.14
*
* jGrowl is a jQuery plugin implementing unobtrusive userland notifications. These
* notifications function similarly to the Growl Framework available for
* Mac OS X (http://growl.info).
*
* To Do:
* - Move library settings to containers and allow them to be changed per container
*
* Changes in 1.2.11
* - Fix artifacts left behind by the shutdown method and text-cleanup
*
* Changes in 1.2.10
* - Fix beforeClose to be called in click event
*
* Changes in 1.2.9
* - Fixed BC break in jQuery 2.0 beta
*
* Changes in 1.2.8
* - Fixes for jQuery 1.9 and the MSIE6 check, note that with jQuery 2.0 support
* jGrowl intends to drop support for IE6 altogether
*
* Changes in 1.2.6
* - Fixed js error when a notification is opening and closing at the same time
*
* Changes in 1.2.5
* - Changed wrapper jGrowl's options usage to "o" instead of $.jGrowl.defaults
* - Added themeState option to control 'highlight' or 'error' for jQuery UI
* - Ammended some CSS to provide default positioning for nested usage.
* - Changed some CSS to be prefixed with jGrowl- to prevent namespacing issues
* - Added two new options - openDuration and closeDuration to allow
* better control of notification open and close speeds, respectively
* Patch contributed by Jesse Vincet.
* - Added afterOpen callback. Patch contributed by Russel Branca.
*
* Changes in 1.2.4
* - Fixed IE bug with the close-all button
* - Fixed IE bug with the filter CSS attribute (special thanks to gotwic)
* - Update IE opacity CSS
* - Changed font sizes to use "em", and only set the base style
*
* Changes in 1.2.3
* - The callbacks no longer use the container as context, instead they use the actual notification
* - The callbacks now receive the container as a parameter after the options parameter
* - beforeOpen and beforeClose now check the return value, if it's false - the notification does
* not continue. The open callback will also halt execution if it returns false.
* - Fixed bug where containers would get confused
* - Expanded the pause functionality to pause an entire container.
*
* Changes in 1.2.2
* - Notification can now be theme rolled for jQuery UI, special thanks to Jeff Chan!
*
* Changes in 1.2.1
* - Fixed instance where the interval would fire the close method multiple times.
* - Added CSS to hide from print media
* - Fixed issue with closer button when div { position: relative } is set
* - Fixed leaking issue with multiple containers. Special thanks to Matthew Hanlon!
*
* Changes in 1.2.0
* - Added message pooling to limit the number of messages appearing at a given time.
* - Closing a notification is now bound to the notification object and triggered by the close button.
*
* Changes in 1.1.2
* - Added iPhone styled example
* - Fixed possible IE7 bug when determining if the ie6 class shoudl be applied.
* - Added template for the close button, so that it's content could be customized.
*
* Changes in 1.1.1
* - Fixed CSS styling bug for ie6 caused by a mispelling
* - Changes height restriction on default notifications to min-height
* - Added skinned examples using a variety of images
* - Added the ability to customize the content of the [close all] box
* - Added jTweet, an example of using jGrowl + Twitter
*
* Changes in 1.1.0
* - Multiple container and instances.
* - Standard $.jGrowl() now wraps $.fn.jGrowl() by first establishing a generic jGrowl container.
* - Instance methods of a jGrowl container can be called by $.fn.jGrowl(methodName)
* - Added glue preferenced, which allows notifications to be inserted before or after nodes in the container
* - Added new log callback which is called before anything is done for the notification
* - Corner's attribute are now applied on an individual notification basis.
*
* Changes in 1.0.4
* - Various CSS fixes so that jGrowl renders correctly in IE6.
*
* Changes in 1.0.3
* - Fixed bug with options persisting across notifications
* - Fixed theme application bug
* - Simplified some selectors and manipulations.
* - Added beforeOpen and beforeClose callbacks
* - Reorganized some lines of code to be more readable
* - Removed unnecessary this.defaults context
* - If corners plugin is present, it's now customizable.
* - Customizable open animation.
* - Customizable close animation.
* - Customizable animation easing.
* - Added customizable positioning (top-left, top-right, bottom-left, bottom-right, center)
*
* Changes in 1.0.2
* - All CSS styling is now external.
* - Added a theme parameter which specifies a secondary class for styling, such
* that notifications can be customized in appearance on a per message basis.
* - Notification life span is now customizable on a per message basis.
* - Added the ability to disable the global closer, enabled by default.
* - Added callbacks for when a notification is opened or closed.
* - Added callback for the global closer.
* - Customizable animation speed.
* - jGrowl now set itself up and tears itself down.
*
* Changes in 1.0.1:
* - Removed dependency on metadata plugin in favor of .data()
* - Namespaced all events
*/
(function($) {
/** Compatibility holdover for 1.9 to check IE6 **/
var $ie6 = (function(){
return false === $.support.boxModel && $.support.objectAll && $.support.leadingWhitespace;
})();
/** jGrowl Wrapper - Establish a base jGrowl Container for compatibility with older releases. **/
$.jGrowl = function( m , o ) {
// To maintain compatibility with older version that only supported one instance we'll create the base container.
if ( $('#jGrowl').size() == 0 )
$('<div id="jGrowl"></div>').addClass( (o && o.position) ? o.position : $.jGrowl.defaults.position ).appendTo('body');
// Create a notification on the container.
$('#jGrowl').jGrowl(m,o);
};
/** Raise jGrowl Notification on a jGrowl Container **/
$.fn.jGrowl = function( m , o ) {
if ( $.isFunction(this.each) ) {
var args = arguments;
return this.each(function() {
var self = this;
/** Create a jGrowl Instance on the Container if it does not exist **/
if ( $(this).data('jGrowl.instance') == undefined ) {
$(this).data('jGrowl.instance', $.extend( new $.fn.jGrowl(), { notifications: [], element: null, interval: null } ));
$(this).data('jGrowl.instance').startup( this );
}
/** Optionally call jGrowl instance methods, or just raise a normal notification **/
if ( $.isFunction($(this).data('jGrowl.instance')[m]) ) {
$(this).data('jGrowl.instance')[m].apply( $(this).data('jGrowl.instance') , $.makeArray(args).slice(1) );
} else {
$(this).data('jGrowl.instance').create( m , o );
}
});
};
};
$.extend( $.fn.jGrowl.prototype , {
/** Default JGrowl Settings **/
defaults: {
pool: 0,
header: '',
group: '',
sticky: false,
position: 'top-right',
glue: 'after',
theme: 'default',
themeState: 'highlight',
corners: '10px',
check: 250,
life: 3000,
closeDuration: 'normal',
openDuration: 'normal',
easing: 'swing',
closer: true,
closeTemplate: '&times;',
closerTemplate: '<div>[ close all ]</div>',
log: function(e,m,o) {},
beforeOpen: function(e,m,o) {},
afterOpen: function(e,m,o) {},
open: function(e,m,o) {},
beforeClose: function(e,m,o) {},
close: function(e,m,o) {},
animateOpen: {
opacity: 'show'
},
animateClose: {
opacity: 'hide'
}
},
notifications: [],
/** jGrowl Container Node **/
element: null,
/** Interval Function **/
interval: null,
/** Create a Notification **/
create: function( message , o ) {
var o = $.extend({}, this.defaults, o);
/* To keep backward compatibility with 1.24 and earlier, honor 'speed' if the user has set it */
if (typeof o.speed !== 'undefined') {
o.openDuration = o.speed;
o.closeDuration = o.speed;
}
this.notifications.push({ message: message , options: o });
o.log.apply( this.element , [this.element,message,o] );
},
render: function( notification ) {
var self = this;
var message = notification.message;
var o = notification.options;
// Support for jQuery theme-states, if this is not used it displays a widget header
o.themeState = (o.themeState == '') ? '' : 'ui-state-' + o.themeState;
var notification = $('<div/>')
.addClass('jGrowl-notification ' + o.themeState + ' ui-corner-all' + ((o.group != undefined && o.group != '') ? ' ' + o.group : ''))
.append($('<div/>').addClass('jGrowl-close').html(o.closeTemplate))
.append($('<div/>').addClass('jGrowl-header').html(o.header))
.append($('<div/>').addClass('jGrowl-message').html(message))
.data("jGrowl", o).addClass(o.theme).children('div.jGrowl-close').bind("click.jGrowl", function() {
$(this).parent().trigger('jGrowl.beforeClose');
})
.parent();
/** Notification Actions **/
$(notification).bind("mouseover.jGrowl", function() {
$('div.jGrowl-notification', self.element).data("jGrowl.pause", true);
}).bind("mouseout.jGrowl", function() {
$('div.jGrowl-notification', self.element).data("jGrowl.pause", false);
}).bind('jGrowl.beforeOpen', function() {
if ( o.beforeOpen.apply( notification , [notification,message,o,self.element] ) != false ) {
$(this).trigger('jGrowl.open');
}
}).bind('jGrowl.open', function() {
if ( o.open.apply( notification , [notification,message,o,self.element] ) != false ) {
if ( o.glue == 'after' ) {
$('div.jGrowl-notification:last', self.element).after(notification);
} else {
$('div.jGrowl-notification:first', self.element).before(notification);
}
$(this).animate(o.animateOpen, o.openDuration, o.easing, function() {
// Fixes some anti-aliasing issues with IE filters.
if ($.support.opacity === false)
this.style.removeAttribute('filter');
if ( $(this).data("jGrowl") != null ) // Happens when a notification is closing before it's open.
$(this).data("jGrowl").created = new Date();
$(this).trigger('jGrowl.afterOpen');
});
}
}).bind('jGrowl.afterOpen', function() {
o.afterOpen.apply( notification , [notification,message,o,self.element] );
}).bind('jGrowl.beforeClose', function() {
if ( o.beforeClose.apply( notification , [notification,message,o,self.element] ) != false )
$(this).trigger('jGrowl.close');
}).bind('jGrowl.close', function() {
// Pause the notification, lest during the course of animation another close event gets called.
$(this).data('jGrowl.pause', true);
$(this).animate(o.animateClose, o.closeDuration, o.easing, function() {
if ( $.isFunction(o.close) ) {
if ( o.close.apply( notification , [notification,message,o,self.element] ) !== false )
$(this).remove();
} else {
$(this).remove();
}
});
}).trigger('jGrowl.beforeOpen');
/** Optional Corners Plugin **/
if ( o.corners != '' && $.fn.corner != undefined ) $(notification).corner( o.corners );
/** Add a Global Closer if more than one notification exists **/
if ( $('div.jGrowl-notification:parent', self.element).size() > 1 &&
$('div.jGrowl-closer', self.element).size() == 0 && this.defaults.closer != false ) {
$(this.defaults.closerTemplate).addClass('jGrowl-closer ' + this.defaults.themeState + ' ui-corner-all').addClass(this.defaults.theme)
.appendTo(self.element).animate(this.defaults.animateOpen, this.defaults.speed, this.defaults.easing)
.bind("click.jGrowl", function() {
$(this).siblings().trigger("jGrowl.beforeClose");
if ( $.isFunction( self.defaults.closer ) ) {
self.defaults.closer.apply( $(this).parent()[0] , [$(this).parent()[0]] );
}
});
};
},
/** Update the jGrowl Container, removing old jGrowl notifications **/
update: function() {
$(this.element).find('div.jGrowl-notification:parent').each( function() {
if ( $(this).data("jGrowl") != undefined && $(this).data("jGrowl").created != undefined &&
($(this).data("jGrowl").created.getTime() + parseInt($(this).data("jGrowl").life)) < (new Date()).getTime() &&
$(this).data("jGrowl").sticky != true &&
($(this).data("jGrowl.pause") == undefined || $(this).data("jGrowl.pause") != true) ) {
// Pause the notification, lest during the course of animation another close event gets called.
$(this).trigger('jGrowl.beforeClose');
}
});
if ( this.notifications.length > 0 &&
(this.defaults.pool == 0 || $(this.element).find('div.jGrowl-notification:parent').size() < this.defaults.pool) )
this.render( this.notifications.shift() );
if ( $(this.element).find('div.jGrowl-notification:parent').size() < 2 ) {
$(this.element).find('div.jGrowl-closer').animate(this.defaults.animateClose, this.defaults.speed, this.defaults.easing, function() {
$(this).remove();
});
}
},
/** Setup the jGrowl Notification Container **/
startup: function(e) {
this.element = $(e).addClass('jGrowl').append('<div class="jGrowl-notification"></div>');
this.interval = setInterval( function() {
$(e).data('jGrowl.instance').update();
}, parseInt(this.defaults.check));
if ($ie6) {
$(this.element).addClass('ie6');
}
},
/** Shutdown jGrowl, removing it and clearing the interval **/
shutdown: function() {
$(this.element).removeClass('jGrowl')
.find('div.jGrowl-notification').trigger('jGrowl.close')
.parent().empty()
},
close: function() {
$(this.element).find('div.jGrowl-notification').each(function(){
$(this).trigger('jGrowl.beforeClose');
});
}
});
/** Reference the Defaults Object for compatibility with older versions of jGrowl **/
$.jGrowl.defaults = $.fn.jGrowl.prototype.defaults;
})(jQuery);

View File

@ -17,7 +17,7 @@ requirejs.config({
"jquery": "libs/jquery",
"underscore": "libs/underscore",
"crel": "libs/crel",
"jgrowl": "libs/jgrowl",
"jgrowl": "libs/jgrowl/jquery.jgrowl",
"mousetrap": "libs/mousetrap",
"toMarkdown": "libs/to-markdown",
"text": "libs/text",
@ -59,8 +59,8 @@ requirejs.config({
],
'libs/Markdown.Extra': [
'libs/Markdown.Converter',
'libs/prettify',
'libs/highlight.pack',
'libs/prettify/prettify',
'libs/highlight/highlight.pack',
],
'libs/Markdown.Editor': [
'libs/Markdown.Converter'

View File

@ -1,59 +1,80 @@
@import "../libs/bootstrap/less/bootstrap.less";
@import "../libs/fontello/css/fontello.css"
@import "../../css/jgrowl.css"
@import "../../css/prettify.css"
@import "../../css/highlight.css"
@import "../libs/jgrowl/jquery.jgrowl.css"
@import "../libs/prettify/prettify.css"
@import "../libs/highlight/highlight.css"
@bg-light: #f2f2f2;
@preview-bg-light: #e8e8e8;
@bg-navbar-hover: @body-bg;
@navbar-text-color: #666;
@text-inv: #fff;
@text-light: #888;
/* Colors */
@transparent: fade(#000, 0%);
@primary-bg: #ddd;
@primary-bg-light: lighten(@primary-bg, 4%);
@primary-bg-lighter: lighten(@primary-bg, 8%);
@secondary-bg: #888;
@secondary-bg-light: lighten(@secondary-bg, 7%);
@secondary-bg-dark: darken(@secondary-bg, 7%);
@primary-color: #333;
@primary-color-light: lighten(@primary-color, 13%);
@primary-color-lighter: lighten(@primary-color, 20%);
@primary-color-inv: #fff;
@bg-navbar-hover: @primary-bg-lighter;
@error-border: #ff8661;
@panel-button-color: #777;
@disabled-color: #ccc;
@panel-button-color: @primary-color-lighter;
@panel-bg: @primary-bg-lighter;
@panel-border-color: @primary-bg-light;
@folder-color: @primary-color-light;
@jgrowl-bg-color: @secondary-bg-dark;
/* Sizes */
@menu-panel-width: 280px;
@document-panel-width: 350px;
@panel-bg: @bg-navbar-hover;
@folder-color: #555;
@transparent: fade(#000, 0%);
@jgrowl-width: 260px;
/* Bootstrap */
@body-bg: #f5f5f5;
@input-border: #ddd;
@body-bg: @primary-bg-lighter;
@text-color: @primary-color;
@input-border: @primary-bg;
@input-height-base: 38px;
@dropdown-border: #ddd;
@pre-border-color: #ddd;
@navbar-bg: #ddd;
@dropdown-border: @primary-bg;
@pre-border-color: @primary-bg;
@navbar-bg: @primary-bg;
@navbar-border: @transparent;
@nav-disabled-link-color: #ccc;
@nav-disabled-link-hover-color: #bbb;
@nav-link-hover-bg: @primary-bg-lighter;
@nav-disabled-link-color: @disabled-color;
@nav-disabled-link-hover-color: @disabled-color;
@nav-tabs-border-color: @transparent;
@dropdown-link-hover-bg: #888;
@dropdown-link-active-color: #fff;
@list-group-link-color: #333;
@dropdown-link-color: @primary-color;
@dropdown-link-hover-bg: @secondary-bg;
@dropdown-link-active-color: @primary-color-inv;
@list-group-link-color: @primary-color;
@list-group-border: @transparent;
@list-group-active-bg: @dropdown-link-hover-bg;
@input-color-placeholder: #ccc;
@btn-default-color: #333;
@list-group-hover-bg: @primary-bg-lighter;
@input-color-placeholder: @disabled-color;
@btn-default-color: @primary-color;
@btn-default-bg: @transparent;
@btn-default-border: @transparent;
@btn-primary-color: #fff;
@btn-primary-bg: #888;
@btn-default-hover-bg: fade(#000, 5%);
@btn-primary-color: @primary-color-inv;
@btn-primary-bg: @secondary-bg;
@btn-primary-border: @transparent;
@btn-success-color: #555;
@btn-primary-hover-bg: darken(@secondary-bg, 8%);
@btn-success-color: @primary-color-light;
@btn-success-bg: @navbar-bg;
@btn-success-border: @transparent;
@btn-info-bg: @body-bg;
@btn-info-border: @transparent;
@gray-lighter: @body-bg;
@modal-header-border-color: @preview-bg-light;
@modal-content-border-color: @preview-bg-light;
@modal-footer-border-color: @preview-bg-light;
@modal-content-separator-color: #eee;
@modal-backdrop-bg: #999;
@modal-header-border-color: @primary-bg-light;
@modal-content-border-color: @primary-bg-light;
@modal-footer-border-color: @primary-bg-light;
@modal-content-separator-color: @primary-bg-lighter;
@modal-backdrop-bg: @secondary-bg-light;
@blockquote-border-color: fade(#000, 5%);
@code-color: @primary-color;
@code-bg: fade(#000, 5%);
@tooltip-max-width: 220px;
@close-color: @primary-color;
body {
@ -110,11 +131,12 @@ body {
}
.btn-default:hover {
background-color: fade(#000, 5%);
background-color: @btn-default-hover-bg;
}
.btn-primary:hover {
color: @btn-primary-color;
background-color: @btn-primary-hover-bg;
}
.btn-success:hover {
@ -155,15 +177,15 @@ body {
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(128, 128, 128, 0.6)");
}
.help-block {
font-size: 12px;
}
.modal textarea.error,.modal input.error {
.form-control.error {
border-color: @error-border;
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255, 134, 97, 0.6)");
}
.help-block {
font-size: 12px;
}
// Input add-on
.input-group-addon {
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
@ -244,7 +266,7 @@ body {
padding: 4px 15px;
font-size: 20px;
font-weight: 200;
color: @navbar-text-color;
color: @primary-color-light;
max-width: 400px;
overflow: hidden;
i {
@ -322,7 +344,7 @@ body {
}
.panel-content {
padding-top: 6px;
border-right: 5px solid @preview-bg-light;
border-right: 5px solid @panel-border-color;
}
}
@ -353,7 +375,7 @@ body {
.panel-content {
background-color: @list-group-bg;
padding-top: 80px;
border-left: 5px solid @preview-bg-light;
border-left: 5px solid @panel-border-color;
.icon-layers {
font-size: 135%;
}
@ -364,7 +386,7 @@ body {
margin: -10px 25px 0;
padding: 20px 5px 10px 15px;
z-index: 3;
border: 1px solid @preview-bg-light;
border: 1px solid @primary-bg-light;
border-top: 0;
border-radius: 6px;
.form-control {
@ -531,14 +553,14 @@ body {
position: initial;
}
&.open .btn{
background-color: @preview-bg-light;
background-color: @primary-bg-light;
i {
color: @btn-success-color
}
}
}
.dropdown-menu {
background-color: @preview-bg-light;
background-color: @primary-bg-light;
padding-bottom: 20px;
}
@ -584,6 +606,8 @@ body {
border: 0;
border-radius: inherit;
background: @modal-content-bg;
border-bottom: 1px solid @modal-content-separator-color;
.box-shadow(none);
}
.accordion-heading {
@ -631,13 +655,13 @@ body {
& > li > a {
&:hover, &:focus {
background-color: @bg-light;
background-color: @btn-default-hover-bg;
}
}
& > li.active > a {
&, &:hover, &:focus {
color: @text-inv;
color: @primary-color-inv;
background-color: @btn-primary-bg;
border-color: @btn-primary-bg;
}
@ -736,11 +760,6 @@ body {
* Markdown
*********************/
code {
color: #333333;
background-color: fade(#000, 5%);
}
a code {
color: inherit;
}
@ -764,11 +783,12 @@ hr {
margin: 30px 0;
}
/*****************************
* Editor
*****************************/
#wmd-input {
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
.box-shadow(none);
}
#wmd-input,#md-section-helper {
@ -776,6 +796,23 @@ hr {
border: none !important;
}
#md-section-helper {
position: absolute;
top: -100px;
height: 1px;
padding: 0 6px;
overflow-y: scroll;
z-index: -1;
.gecko & {
/* Firefox doesn't show the scrollbar if height is less than 40px */
height: 40px;
}
.opera & {
/* Opera needs to have the textarea in the viewport to evaluate its size correctly */
top: 0;
}
}
.preview-container {
overflow: auto;
}
@ -918,12 +955,6 @@ div.dropdown-menu textarea {
float: left;
}
/*
.nav>li>a:hover,.nav>li>a:focus {
background-color: @bg-light;
}
*/
.tooltip-inner {
text-align: left;
}
@ -1018,49 +1049,48 @@ input[type="file"] {
height: 120px;
}
#md-section-helper {
position: absolute;
top: -100px;
height: 1px;
padding: 0 6px;
overflow-y: scroll;
z-index: -1;
/********************
* jGrowl
********************/
div.jGrowl {
z-index: 1040;
font-size: inherit;
div.jGrowl-notification, div.jGrowl-closer {
background-color: @jgrowl-bg-color;
width: @jgrowl-width;
margin: 20px 30px;
padding: 15px 20px;
-ms-filter: none;
filter: none;
border-radius: 5px;
}
div.jGrowl-notification {
min-height: 80px;
}
}
.lock-ui {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1050;
}
.gecko #md-section-helper {
/* Firefox doesn't show the scrollbar if height is less than 40px */
height: 40px;
/*******************
* Viewer
*******************/
.viewer {
#navbar {
position: fixed;
}
.navbar-inner {
background-color: rgba(215, 215, 215, 0.75) !important;
}
#preview-contents {
max-width: 1024px;
margin: 50px auto;
}
.btn-group {
margin-right: 0;
margin-left: 0;
}
}
.opera #md-section-helper {
/* Opera needs to have the textarea in the viewport to evaluate size correctly */
top: 0;
}
/* Viewer */
.viewer #navbar {
position: fixed;
}
.viewer .navbar-inner {
background-color: rgba(215, 215, 215, 0.75) !important;
}
.viewer #preview-contents {
max-width: 1024px;
margin: 50px auto;
}
.viewer .btn-group {
margin-right: 0;
margin-left: 0;
}

View File

@ -1,48 +1,44 @@
@import "main.less"
@bg-light: #f2f2f2;
@preview-bg-light: #444;
@bg-navbar-hover: #333;
@navbar-text-color: #999;
@text-inv: #fff;
@text-light: #888;
@error-border: #ff8661;
@panel-button-color: #999;
@panel-bg: #222;
@folder-color: #aaa;
@primary-bg: #444;
@primary-bg-light: darken(@primary-bg, 7%);
@primary-bg-lighter: darken(@primary-bg, 13%);
@secondary-bg: #444;
@secondary-bg-light: darken(@secondary-bg, 7%);
@secondary-bg-dark: lighten(@secondary-bg, 7%);
@primary-color: #fff;
@primary-color-light: darken(@primary-color, 13%);
@primary-color-lighter: darken(@primary-color, 20%);
@primary-color-inv: #fff;
@disabled-color: #999;
/* Bootstrap */
@body-bg: #222;
@text-color: #fff;
@bg-navbar-hover: @secondary-bg-dark;
@panel-border-color: @primary-bg;
@link-color: #f73;
@input-color: #fff;
@input-border: #444;
@input-color: @primary-color;
@input-border: @primary-bg;
@input-bg: #111;
@dropdown-border: #ddd;
@pre-border-color: #ddd;
@navbar-bg: #444;
@nav-link-hover-bg: #444;
@nav-disabled-link-color: #ccc;
@nav-disabled-link-hover-color: #bbb;
@dropdown-link-hover-bg: #888;
@dropdown-link-active-color: #fff;
@list-group-link-color: #fff;
@list-group-active-bg: @dropdown-link-hover-bg;
@list-group-hover-bg: #444;
@list-group-bg: #333;
@input-color-placeholder: #ccc;
@btn-default-color: #fff;
@btn-primary-color: #fff;
@btn-primary-bg: #555;
@btn-success-color: #bbb;
@btn-info-bg: @body-bg;
@gray-lighter: @body-bg;
@modal-content-bg: #333;
@modal-content-separator-color: #444;
@modal-backdrop-bg: #000;
@list-group-bg: @primary-bg-light;
@list-group-hover-bg: @primary-bg;
@code-bg: fade(#fff, 10%);
@modal-content-bg: @primary-bg-light;
@modal-header-border-color: @primary-bg;
@modal-content-border-color: @primary-bg;
@modal-footer-border-color: @primary-bg;
@modal-content-separator-color: @primary-bg;
@nav-link-hover-bg: @primary-bg;
@list-group-hover-bg: @primary-bg;
@btn-default-hover-bg: fade(#fff, 8%);
@btn-primary-hover-bg: lighten(@secondary-bg, 8%);
@blockquote-border-color: fade(#fff, 8%);
@close-color: #fff;
@modal-backdrop-bg: #000;
@dropdown-border: @primary-bg;
@dropdown-bg: @primary-bg-light;
.form-control:focus {
.box-shadow(~"inset 0 1px 1px rgba(255, 255, 255, 0), 0 0 8px rgba(255, 255, 255, 0.75)");
}
/*
input[readonly], select[readonly], textarea[readonly] {

View File

@ -13,6 +13,7 @@
},
include: [
'less!styles/default.less',
'less!styles/blue-gray.less',
'less!styles/night.less',
],
excludeShallow: [