Browse Source

Move to less

Benjamin Van Ryseghem 10 years ago
parent
commit
0fd5586b05
3 changed files with 557 additions and 766 deletions
  1. 110 766
      css/helios-niflheim.css
  2. 446 0
      css/helios-niflheim.less
  3. 1 0
      support/helios.js

File diff suppressed because it is too large
+ 110 - 766
css/helios-niflheim.css


+ 446 - 0
css/helios-niflheim.less

@@ -0,0 +1,446 @@
+body[id="helios"] {
+	&.niflheim {
+		background: #eeeeee url('/images/squared_metal-dark.png') repeat;
+
+		.btn-group > .dropdown-menu {
+			background-color: #666;
+			border-color: #888;
+			padding: 2px 8px;
+		}
+	
+		.btn-group > .dropdown-menu a {
+			// todo: remove
+/*			position: absolute;*/
+		
+			height: 100%;
+		
+			// todo: remove
+/*			width: 100%;*/
+		}
+	
+		.btn-group > .dropdown-menu a {
+		  color: #fffffb;
+		}
+	
+		// todo: check if it can be removed
+/*		.navbar-fixed-top ul {
+		  width: 100%;
+		}*/
+
+		.navbar-fixed-top i.close {
+		  background-image: url('../images/close-dark.png');
+		}
+
+		.navbar-fixed-top .navbar-inner {
+		  border-bottom: 1px solid #222;
+		  border-top: 1px solid #222;
+		  box-shadow: inset 0px 1px 0px #777;
+		  background: #4d5052;
+		}
+
+		::-webkit-scrollbar {  
+		  width: 14px;
+		  height: 14px;
+		}  
+
+		::-webkit-scrollbar-corner {
+		  background-color: transparent;
+		}
+
+		::-webkit-scrollbar-track {  
+		  background-color: transparent;
+		}  
+
+		.focused ::-webkit-scrollbar-thumb {
+		  background-color: #4c4c4c;
+		}
+
+		.focused ::-webkit-scrollbar-thumb:hover {
+		  background-color: #3a3a3a;
+		}
+
+		::-webkit-scrollbar-thumb {
+		  background-color: #585858;
+		  border: 3px solid transparent;
+		  border-radius: 9px;
+		  background-clip: content-box;
+		}  
+
+		::-webkit-scrollbar-thumb:hover {  
+		  background-color: #707070;
+		}
+
+		.new_tab  a  b {
+		  border-top: 4px solid #a7a7a7;
+		}
+
+		.navbar .nav > li > a {
+		  border-right: 1px solid #222;
+		  box-shadow: none;
+		}
+	
+		.navbar .nav > li > a:hover {
+		  color: #f00;
+		  background-image: linear-gradient(top, #666, #454648);
+		  background-image: -webkit-linear-gradient(top, #666, #454648);
+		  background-image: -moz-linear-gradient(top, #666, #454648);
+		  background-image: -o-linear-gradient(top, #666, #454648);
+		}
+	
+		.navbar .nav > .active > a,
+		.navbar .nav > .active > a:hover,
+		.navbar .nav > .active > a:focus,
+		.navbar .nav .ui-sortable-helper a {
+		  color: #ddd;
+		  background-image: linear-gradient(top, #666, #454648);
+		  background-image: -webkit-linear-gradient(top, #666, #454648);
+		  background-image: -moz-linear-gradient(top, #666, #454648);
+		  background-image: -o-linear-gradient(top, #666, #454648);
+		  text-shadow: none;
+		  box-shadow: inset -1px 0px 1px -1px #eee, inset 1px 1px 1px -1px #eee;
+		  border-right: 1px solid #222;
+		}
+	
+		.navbar-fixed-top li.inactive{
+		  opacity: 0.6;
+		  background: #4d5052;
+		  box-shadow: none;
+		}
+
+		.navbar-fixed-top li.inactive span{
+		  text-shadow: none;
+		  color: #ccc;
+		}
+	
+		.nav-pills.nav-stacked > li > a {
+		  color: #b8c4cf;
+		}
+
+		.focused .nav-pills.nav-stacked > li > a {
+		  color: #ddd;
+		}
+	
+		.nav-pills > .active > a {
+		  background-color: #222B3C;
+		  color: #fffffb !important;
+		}
+		.focused .nav-pills {
+		  background-color: #585858;
+		}
+	
+		.focused .nav-pills > .active > a,
+		.nav-pills > .active > a:hover,
+		.dropdown-menu li > a:hover,
+		.dropdown-menu li > a:focus,
+		.dropdown-submenu:hover > a,
+		.dropdown-menu .active > a,
+		.dropdown-menu .active > a:hover,
+		.CodeMirror-hint-active {
+			background: #305f9f;
+		}
+		
+		.CodeMirror {
+			position: initial;
+			height: 100%;
+			width: initial;
+		}
+	
+		.welcome {
+			color: #fffffb;
+			text-shadow: none;
+		}
+
+		[class^="icon-"], body[id="helios"][class*=" icon-"]{
+			opacity: 0.68;
+			background-image: url("../bower_components/bootstrap/img/glyphicons-halflings-white.png");
+		}
+
+		.welcome h2 {
+			text-align: center;
+	  
+			// todo: remove
+/*			color: #666;*/
+		}
+	
+		.welcome button {
+			// todo: remove 
+/*			background: #eee;*/
+
+			margin: 10px;
+			padding: 20px;
+			height: auto;
+			width: 150px;
+		}
+	
+		.tool_container .panes .pane {
+			background: #444;
+		}
+	
+		.tool_container .splitter.vertical {
+			border-left: 1px solid #525252;
+		}
+	
+		.tool_container .splitter.horizontal {
+			border-top: 1px solid #666;
+		}
+	
+		//todo: remove
+		/*.tool_container .pane .nav-pills i.package {
+			background-image: url('../images/package.png');
+		}*/
+
+		.tool_container .list-label {
+			border-bottom: 1px solid #525252;
+			background-image: linear-gradient(top, #585858, #323232);
+			background-image: -webkit-linear-gradient(top, #585858, #323232);
+			background-image: -moz-linear-gradient(top, #585858, #323232);
+			background-image: -o-linear-gradient(top, #585858, #323232);
+			color: #ccc;
+		
+			font-weight: normal;
+			text-shadow: none;
+		}
+	
+		.transcript-container .list-label {
+		  border-top: none;
+		}
+	
+		.tool_container .pane_actions,
+		.tool_container .buttons_bar {
+			border-top: 1px solid #222;
+			background-image: linear-gradient(top, #585858, #323232);
+			background-image: -webkit-linear-gradient(top, #585858, #323232);
+			background-image: -moz-linear-gradient(top, #585858, #323232);
+			background-image: -o-linear-gradient(top, #585858, #323232);
+		}
+
+		.tool_container .panes .pane .pane_actions label {
+			test-shadow: none;
+			color: #d3d3d3;
+		}
+	
+		.tool_container .panes .pane .pane_actions .btn {
+		  border: 1px;
+		  text-shadow: none;
+		  margin-top: -1px;
+		  color: #929292
+		}
+
+		.tool_container .panes .pane .pane_actions .btn-group .btn.active {
+			color: #d3d3d3;
+			text-shadow: none;
+			box-shadow: inset 0px 0px 2px 0px #323232;
+			border-radius: 4px;
+			background: #666;
+			background-image: linear-gradient(top, #454545, #252525);
+			background-image: -webkit-linear-gradient(top, #454545, #252525);
+			background-image: -moz-linear-gradient(top, #454545, #252525);
+			background-image: -o-linear-gradient(top, #454545, #252525);
+		}
+	
+		.tool_container .panes .pane .class_side .nav-pills {
+			background: #38404a;
+		}
+
+		.key_helper {
+			background: #444;
+			box-shadow: 0 0 80px 2px #222;
+			border: 1px solid #777;
+		}
+	
+		.key_helper .command {
+		  color: #ccc;
+		}
+
+		.key_helper .command strong {
+			display: inline-block;
+			min-width: 1.4em;
+			text-align: center;
+			background-color: #eee;
+			color: #2b658b;
+		}
+	
+		.key_helper #binding-helper-main {
+			background: #444;
+		}
+
+		.key_helper .action {
+			vertical-align: middle;
+		}
+	
+		.key_helper .selected {
+			background-image: linear-gradient(top, #484848, #323232);
+			background-image: -webkit-linear-gradient(top, #484848, #323232);
+			background-image: -moz-linear-gradient(top, #585858, #323232);
+			background-image: -o-linear-gradient(top, #585858, #323232);
+			text-shadow: none;
+			border-bottom: 1px solid #585858;
+			color: #ccc
+		}
+	
+		.growl {
+			background-image: -webkit-linear-gradient(#505050, #3c3c3c);
+			background-image: -moz-linear-gradient(#505050, #3c3c3c);
+			background-image: -o-linear-gradient(#505050, #3c3c3c);
+			background-image: linear-gradient(#888, #666);
+			box-shadow: 0 0 3px #777;
+			color: #ccc;
+			text-shadow: none;
+		}
+	
+		.button {
+			color: #d3d3d3;
+			border-radius: 3px !important;
+			border: 1px solid #383838;
+			background-image: linear-gradient(top, #454545, #252525);
+			background-image: -webkit-linear-gradient(top, #454545, #252525);
+			background-image: -moz-linear-gradient(top, #454545, #252525);
+			background-image: -o-linear-gradient(top, #454545, #252525);
+		}
+
+		.button.default {
+			color: #d3d3d3;
+			border: 1px solid #585858;
+			background-image: linear-gradient(top, #549ceb, #12374f);
+			background-image: -webkit-linear-gradient(top, #549ceb, #12374f);
+			background-image: -moz-linear-gradient(top, #549ceb, #12374f);
+			background-image: -o-linear-gradient(top, #549ceb, #12374f);
+		}
+
+		.dialog .button {
+			color: #444;
+			border-radius: 3px !important;
+			background: #ccc;
+			border: 1px solid #9B9B9B;
+			height: 20px;
+			border-radius: 5px;
+			min-width: 68px;
+			padding: 0 10px;
+			text-align: center;
+			margin: 0;
+			margin-left: 10px;
+			background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			font: 13px "Lucida Grande", Lucida, Verdana, sans-serif; 
+		}
+	
+		.dialog .button:hover {
+			cursor: pointer;
+			border: 1px solid rgba(0, 0, 0, 0.6);
+			background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+			background: linear-gradient(bottom, rgba(0, 0, 0, 0.09) 0%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.04) 50.5%, rgba(0, 0, 0, 0.04) 100%) #ffffff;
+		}
+
+		.dialog .button.default {
+		   border-top: 1px solid #535273;
+		  border: 1px solid #4F4D67;
+		  border-bottom: 1px solid #4B4B58;
+		  background: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.3) 50.5%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #b1bdd5;
+		  background: -moz-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.3) 50.5%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #b1bdd5;
+		  background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.3) 50.5%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #b1bdd5;
+		  background: -ms-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.3) 50.5%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #b1bdd5;
+		  background: linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.3) 50.5%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #b1bdd5;
+		  -moz-box-shadow: 0 0 3px rgba(69, 113, 184, 0.8);
+		  -webkit-box-shadow: 0 0 5px rgba(69, 113, 184, 0.44);
+		  box-shadow: 0 0 5px rgba(69, 113, 184, 0.44);
+		}
+
+		.dialog .button.default:hover {
+			cursor: pointer;
+			color: #d3d3d3;
+			border: 1px solid #585858;
+			background-image: linear-gradient(top, #549ceb, #12374f);
+			background-image: -webkit-linear-gradient(top, #549ceb, #12374f);
+			background-image: -moz-linear-gradient(top, #549ceb, #12374f);
+			background-image: -o-linear-gradient(top, #549ceb, #12374f);
+		}
+
+		.button:hover {
+			cursor: pointer;
+			border: 1px solid #444;
+			background-image: linear-gradient(top, #353535, #151515);
+			background-image: -webkit-linear-gradient(top, #353535, #151515);
+			background-image: -moz-linear-gradient(top, #353535, #151515);
+			background-image: -o-linear-gradient(top, #353535, #151515);
+		}
+
+		.button.default:hover {
+			cursor: pointer;
+			border: 1px solid #4F4D67;
+			border-top: 1px solid #535273;
+			border-bottom: 1px solid #4B4B58;
+			color: #0a0000;
+
+			background: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 25%, rgba(255, 255, 255, 0.3) 75%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #549ceb;
+			background: -moz-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 25%, rgba(255, 255, 255, 0.3) 75%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #549ceb;
+			background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 25%, rgba(255, 255, 255, 0.3) 75%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #549ceb;
+			background: -ms-linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 25%, rgba(255, 255, 255, 0.3) 75%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #549ceb;
+			background: linear-gradient(bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.1) 25%, rgba(255, 255, 255, 0.3) 75%, rgba(255, 255, 255, 0.45) 95%, rgba(255, 255, 255, 0.8) 100%) #549ceb;
+			-moz-box-shadow: 0 0 3px rgba(69, 113, 184, 0.8);
+			-webkit-box-shadow: 0 0 5px rgba(69, 113, 184, 0.44);
+			box-shadow: 0 0 5px rgba(69, 113, 184, 0.44);
+		}
+	
+		.doc {
+			background: transparent;
+			color: #ccc;
+		}
+
+		.doc code {
+			color: #d46e69;
+			background-color: #626262;
+			border-color: #888;
+  
+		}
+	
+		.doc .button {
+			background-image: linear-gradient(top, #444, #1d1d1d);
+			background-image: -webkit-linear-gradient(top, #444, #1d1d1d);
+			background-image: -moz-linear-gradient(top, #444, #1d1d1d);
+			background-image: -o-linear-gradient(top, #444, #1d1d1d);
+		}
+
+		.doc .button.default {
+			background-image: linear-gradient(top, #585858, #323232);
+			background-image: -webkit-linear-gradient(top, #585858, #323232);
+			background-image: -moz-linear-gradient(top, #585858, #323232);
+			background-image: -o-linear-gradient(top, #585858, #323232);
+		}
+
+		.doc .button.default:hover {
+			color: #ccc;
+			background-image: linear-gradient(top, #454545, #252525);
+			background-image: -webkit-linear-gradient(top, #454545, #252525);
+			background-image: -moz-linear-gradient(top, #454545, #252525);
+			background-image: -o-linear-gradient(top, #454545, #252525);
+		}
+	
+		.doc .markdown > pre {
+			background-color: #666;
+			border: 1px solid #383838;
+		}
+
+		.doc .inheritance > a {
+			color: #4098ed;
+		}
+
+		.doc .inheritance > a:hover {
+			color: #4098ed;
+		}
+	
+		.transcript textarea {
+			background: #444;
+			color: #b8c4cf;
+		}
+	
+		.hl_debugger .list-label {
+			border-top: 1px solid transparent;
+		}
+	}
+}

+ 1 - 0
support/helios.js

@@ -22,5 +22,6 @@ define([
 	'./codemirror',
 	'./devel-inner', // pre-fetch, dep of ./helios-inner
 	'./helios-inner',
+    'css!amber_css/helios',
 	'css!amber_css/helios-niflheim'
 ], function (smalltalk) { return smalltalk; });

Some files were not shown because too many files changed in this diff