Added new original theme

public/res/constants.js

@@ -65,6 +65,7 @@ define([], function() {
     constants.THEME_LIST = {
         "default": "Default",
         "gray": "Gray",
+        "original": "Original",
         "night": "Night",
         "school": "School",
     };

public/res/styles/main.less

@@ -43,6 +43,7 @@
 // Panel buttons
 @panel-button-bg-color: #FFF;
 @panel-button-border-fade: 80%;
+@panel-button-box-shadow: ~"0 0 1px rgba(0,0,0,.5)";
 @panel-border-color: fade(@primary-desaturated, 10%);
 
 @error-border: #FF6161;
@@ -55,12 +56,13 @@
 @menu-panel-width: 280px;
 @document-panel-width: 340px;
 @jgrowl-width: 260px;
-@resizer-size: 35px;
+@resizer-size: 30px;
 
 /* Bootstrap */
 @body-bg: @secondary-bg-light;
 @text-color: @secondary-color-darkest;
 @link-color: desaturate(#0080FF, 25%);
+@link-hover-color: darken(@link-color, 20%);
 @input-bg: @secondary-bg-lighter;
 @input-border: @secondary-border-color;
 @input-height-base: 38px;
@@ -81,7 +83,7 @@
 @dropdown-link-color: @secondary-color-darkest;
 @dropdown-link-hover-color: darken(@primary-desaturated, 25%);
 @dropdown-link-hover-bg: @btn-default-hover-bg;
-@dropdown-header-color: fade(@secondary-color, 50%);
+@dropdown-header-color: fade(@secondary-color, 60%);
 @dropdown-link-disabled-color: @disabled-color;
 @dropdown-divider-bg: @dropdown-border;
 @list-group-link-color: @secondary-color-darkest;
@@ -101,6 +103,7 @@
 @btn-primary-color: @secondary-color-darker;
 @btn-primary-bg: @primary-bg;
 @btn-primary-border: fade(@secondary, 5%);
+@btn-primary-hover-bg: mix(@primary-desaturated, @btn-primary-bg, 7.5%);
 @btn-success-color: darken(@primary-desaturated, 25%);
 @btn-success-bg: @transparent;
 @btn-success-border: @transparent;
@@ -188,24 +191,6 @@ a {
     .transition(~"background-color ease-in-out .15s, color ease-in-out .15s, border-color ease-in-out .15s");
 }
 
-.list-group .nav {
-	border-left: 10px solid @primary-bg;
-	margin-left: 15px;
-	> li > a {
-        border-top: 1px solid @transparent;
-        border-bottom: 1px solid @transparent;
-        &:hover,
-        &:focus {
-    	    border-top-color: @list-group-hover-border-color;
-    	    border-bottom-color: @list-group-hover-border-color;
-        }
-    	&.active {
-    	    border-top-color: @list-group-active-border;
-    	    border-bottom-color: @list-group-active-border;
-    	}
-	}
-}
-
 .nav-pills > li {
     > a {
         border: 1px solid @transparent;
@@ -275,7 +260,7 @@ a {
     .open &.dropdown-toggle {
     	color: darken(@secondary, 30%);
     	border-color: fade(@secondary, 10%);
-    	background-color: mix(@primary-desaturated, @btn-primary-bg, 7.5%) !important; // important to override .nav > li > a:hover
+    	background-color: @btn-primary-hover-bg !important; // important to override .nav > li > a:hover
     }
 }
 
@@ -299,7 +284,7 @@ a {
     .info-tooltip &,
     .open &.dropdown-toggle {
     	color: darken(@secondary, 30%);
-    	border-color: fade(@secondary, 10%);
+    	border-color: fade(@secondary, 8%);
     	background-color: @secondary-bg !important; // important to override .nav > li > a:hover
     }
 }
@@ -523,7 +508,8 @@ a {
         border-radius: 8px;
 		position: absolute;
 		margin-top: 6px;
-        .box-shadow(~"0 0 1px rgba(0,0,0,.5)");
+        .transition(~"border-width ease-in-out .15s, left ease-in-out 0.15s, right ease-in-out 0.15s, background-color ease-in-out 0.15s");
+        .box-shadow(@panel-button-box-shadow);
         &:active {
             .box-shadow(~"inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 1px rgba(0,0,0,.5)");
         }
@@ -550,7 +536,19 @@ a {
 	margin-left: (-@menu-panel-width - 15);
     .transition(~"margin-left ease-in-out 0.35s");
 	.sub-menu {
-		background-color: @list-group-bg;
+        background-color: @secondary-bg-lighter;
+        padding-bottom: 20px;
+        .box-shadow(~"inset 1px 0 1px rgba(0,0,0,.05), inset 2px 2px 6px rgba(0,0,0,.075)");
+        .nav {
+            padding-top: 20px;
+            > li > a {
+                padding-left: 30px;
+                &:hover,
+                &:focus {
+                    background-color: @transparent;
+                }
+            }
+        }
 	}
 	&.in {
         margin-left: 0;
@@ -562,7 +560,6 @@ a {
 	    right: -50px;
 		z-index: -1;
 		padding: 0 10px 0 50px;
-        .transition(~"border-width ease-in-out .15s, right ease-in-out 0.15s");
 	}
     .collapse-button:hover, &.in .collapse-button, &.collapsing .collapse-button {
         right: -55px;
@@ -571,11 +568,6 @@ a {
 		background-color: @secondary-bg-light;
 		padding-top: 6px;
 		border-right: 1px solid @secondary-border-color-light;
-		& > .nav > li > a {
-		    &:hover, &:active {
-        		background-color: inherit;
-		    }
-		}
 	}
 }
 
@@ -594,7 +586,6 @@ a {
 	    left: -50px;
 		padding: 0 50px 0 3px;
 		z-index: -1;
-        .transition(~"border-width ease-in-out .15s, left ease-in-out 0.15s");
 		i.icon-folder-open {
        		font-size: 19px;
        		padding-bottom: 1px;
@@ -871,9 +862,11 @@ a {
 		& > li.active > a {
 			&, &:hover, &:focus {
 				color: @btn-primary-color;
-				background-color: @btn-primary-bg;
+				background-color: @modal-content-bg;
-				border-color: @btn-primary-border;
+				border-color: @modal-header-border-color;
 				border-bottom-color: @transparent;
+                margin-bottom: -1px;
+                padding: 10px 15px 11px;
 			}
 		}
 	}
@@ -993,18 +986,18 @@ a {
 		box-sizing: initial;
 	}
 
-	.ace_marker-layer .ace_active-line {
-	    background-color: fade(@primary-desaturated, 5%);
-	}
-	
 	.ace_cursor {
 	    color: darken(@primary-desaturated, 30%);
 	}
 	
-	.ace_print-margin {
+    .ace_print-margin-layer {
-		background-color: fade(@primary-desaturated, 5%);
+		display: none;
 	}
     
+    .ace_marker-layer .ace_bracket {
+        display: none;
+    }
+	
 	.ace_markup.ace_heading {
 		color: @tertiary-color-darker;
 		font-weight: bold;
@@ -1021,7 +1014,6 @@ a {
 	
 	.ace_meta.ace_tag {
 		color: @tertiary-color-dark;
-		font-style: italic;
 		font-weight: bold;
 		background-color: @code-bg;
 	}
@@ -1044,7 +1036,6 @@ a {
 	
 	.ace_string {
 		color: @tertiary-color-dark;
-		font-style: italic;
 		background-color: @code-bg;
 	}
 	

public/res/themes/original.less

@@ -0,0 +1,136 @@
+@import "../styles/main.less";
+
+/*
+@primary: #FFF;
+@primary-bg: #444;
+@secondary-bg: darken(@primary-bg, 4%);
+@secondary-bg-light: darken(@primary-bg, 13%);
+@secondary-bg-lighter: darken(@primary-bg, 15%);
+@secondary-border-color: darken(@primary-desaturated, 70%);
+@secondary-border-color-light: darken(@primary-desaturated, 75%);
+@secondary-border-color-lighter: darken(@primary-desaturated, 80%);
+@tertiary-bg: darken(@primary-bg, 15%);
+@tertiary-color-darker: @primary;
+@tertiary-color-dark: darken(@primary, 12.5%);
+@tertiary-color: darken(@primary, 37.5%);
+@panel-button-bg-color: #aaa;
+
+@link-color: #f73;
+@input-border: @primary-bg;
+@input-bg: #111;
+@blockquote-bg: fade(#fff, 5%);
+@code-bg: fade(#fff, 10%);
+@pre-bg: #bbb;
+@pre-border-color: darken(@pre-bg, 30%);
+@blockquote-border-color: fade(#fff, 8%);
+@modal-backdrop-bg: #444;
+@dropdown-border: @primary-bg;
+
+@kbd-bg-color: @pre-bg;
+@kbd-border-color: fade(@text-color, 40%);
+
+.form-control:focus {
+    .box-shadow(~"inset 0 1px 1px rgba(255, 255, 255, 0), 0 0 12px rgba(255, 255, 255, 1)");
+}
+
+.ace-tm {
+	.ace_cursor {
+		border-left-color: #fff;
+	}
+}	
+*/
+
+@primary: #a0a0a0;
+@navbar-default-bg: #474747;
+@btn-default-hover-bg: fade(@primary, 14%);
+@btn-primary-bg: #e2e2e2;
+@btn-primary-hover-bg: darken(@btn-primary-bg, 4%);
+//@btn-primary-color: #bbb;
+//@btn-primary-hover-bg: fade(@primary, 25%);
+@btn-success-color: #C0C0C0;
+@btn-success-hover-bg: darken(@navbar-default-bg, 10%);
+@panel-button-bg-color: #E6E6E6;
+@panel-button-box-shadow: ~"0 0 1px rgba(255,255,255,0.75)";
+@input-bg: #fff;
+
+
+@list-group-border: @transparent;
+@list-group-active-border: @transparent;
+@list-group-hover-border-color: @transparent;
+/*
+@list-group-link-color: @btn-success-color;
+@list-group-bg: lighten(@navbar-default-bg, 2%);
+@list-group-active-color: lighten(@btn-success-color, 20%);
+@list-group-active-bg: darken(@navbar-default-bg, 2%);
+@list-group-hover-bg: @btn-success-hover-bg;
+*/
+
+
+@tertiary-bg: #fcfcfc;
+@secondary-bg: #ededed;
+@secondary-bg-light: #f6f6f6;
+@secondary-bg-lighter: @tertiary-bg;
+@secondary-border-color: #e2e2e2;
+@secondary-border-color-light: #eee;
+@secondary-border-color-lighter: #eee;
+
+
+// Navbar buttons
+.btn-success {
+    border-width: 0;
+    &:hover,
+    &:focus,
+    &:active,
+    .open &.dropdown-toggle {
+    	color: #fff;
+    }
+}
+
+
+.dropdown-menu > .disabled > a,
+.list-group-item.active {
+    &,
+    &:hover,
+    &:focus {
+        background-color: lighten(@navbar-default-bg, 8%);
+        color: #fff;
+        .box-shadow(inset -1px 2px 4px rgba(0,0,0,0.25));
+    }
+}
+
+.ace-tm {
+	.ace_cursor {
+		border-left-color: #555;
+	}
+}	
+
+.ui-layout-resizer-north {
+	background-color: fade(@navbar-default-bg, 50%);
+    border-bottom: 0;
+    //.box-shadow(~"0 0 1px 1px rgba(0,0,0,0.15), 0 3px 8px rgba(0,0,0,0.15)");
+}
+
+.resizer-decorator {
+	.ui-layout-resizer-east & {
+        border-left: 1px solid fade(@secondary, 4%);
+	}
+	.ui-layout-resizer-south & {
+        border-top: 1px solid fade(@secondary, 4%);
+	}
+}
+
+.menu-panel, .document-panel {
+    .collapse-button:hover, &.in .collapse-button, &.collapsing .collapse-button {
+       	background-color: lighten(@panel-button-bg-color, 10%);
+    }
+}
+/*
+.menu-panel {
+	.sub-menu {
+		background-color: @navbar-default-bg;
+	}
+    .panel-content {
+        background-color: @navbar-default-bg;
+    }
+}
+*/

public/res/themes/school.less

@@ -56,12 +56,13 @@
 	    background-image: url("../img/school-line.png");
 		background-repeat: repeat;
 	}
-	.ace_marker-layer .ace_active-line {
+
-		background-color: fade(@blue-ink, 5%);
+    .ace_print-margin-layer {
-	}
+		display: block;
-	.ace_print-margin {
+        .ace_print-margin {
-		background-color: fade(@red-ink, 50%);
+            background-color: fade(@red-ink, 50%);
-	}
+        }
+    }
         	
 	.ace_markup.ace_heading {
 		color: @black-ink;