Merge remote-tracking branch 'origin/master'
commit
bcf8d54ff3
|
@ -5,14 +5,49 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-inner-text (@base) {
|
.navbar-inner-text (@base) {
|
||||||
text-shadow: 0 1px 0 lighten(@base, 15%);
|
text-shadow: 0 1px 0 contrast(@base, lighten(@base, 15%), darken(@base, 15%));
|
||||||
color: contrast(@base, #333333, #f2f2f2);
|
color: @text-color;
|
||||||
|
@caret-color: average(@base, @text-color);
|
||||||
|
@caret-hover-color: average(@caret-color, @text-color);
|
||||||
|
|
||||||
|
.caret {
|
||||||
|
border-bottom-color: @caret-color;
|
||||||
|
border-top-color: @caret-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover .caret, &:focus .caret {
|
||||||
|
border-bottom-color: @caret-hover-color;
|
||||||
|
border-top-color: @caret-hover-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.brand (@color, @dark, @light) when (@color = @dark) {
|
||||||
|
span {
|
||||||
|
background-image: url(../img/tentacle-20x20.png);
|
||||||
|
|
||||||
|
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
|
||||||
|
background-image: url(../img/tentacle-20x20@2x.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.brand (@color, @dark, @light) when (@color = @light) {
|
||||||
|
span {
|
||||||
|
background-image: url(../img/tentacle-20x20-light.png);
|
||||||
|
|
||||||
|
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
|
||||||
|
background-image: url(../img/tentacle-20x20-light@2x.png);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-inner-color (@base) {
|
.navbar-inner-color (@base) {
|
||||||
@top: lighten(@base, 25%);
|
@top: lighten(@base, 25%);
|
||||||
@bottom: darken(@base, 15%);
|
@bottom: darken(@base, 15%);
|
||||||
|
|
||||||
|
@text-color-light: #f2f2f2;
|
||||||
|
@text-color-dark: #333333;
|
||||||
|
@text-color: contrast(@base, @text-color-dark, @text-color-light);
|
||||||
|
|
||||||
background-color: @base; /* fallback color if gradients are not supported */
|
background-color: @base; /* fallback color if gradients are not supported */
|
||||||
background-image: -webkit-linear-gradient(top, @top, @bottom); /* For Chrome and Safari */
|
background-image: -webkit-linear-gradient(top, @top, @bottom); /* For Chrome and Safari */
|
||||||
background-image: -moz-linear-gradient(top, @top, @bottom); /* For old Fx (3.6 to 15) */
|
background-image: -moz-linear-gradient(top, @top, @bottom); /* For old Fx (3.6 to 15) */
|
||||||
|
@ -24,6 +59,10 @@ body {
|
||||||
.navbar-inner-text(@base);
|
.navbar-inner-text(@base);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.brand {
|
||||||
|
.brand(@text-color, @text-color-dark, @text-color-light);
|
||||||
|
}
|
||||||
|
|
||||||
.nav {
|
.nav {
|
||||||
li.dropdown.open>.dropdown-toggle, li.dropdown.active>.dropdown-toggle, li.dropdown.open.active>.dropdown-toggle {
|
li.dropdown.open>.dropdown-toggle, li.dropdown.active>.dropdown-toggle, li.dropdown.open.active>.dropdown-toggle {
|
||||||
// invert for dropdown
|
// invert for dropdown
|
||||||
|
@ -65,9 +104,16 @@ body {
|
||||||
@base: #7728FF;
|
@base: #7728FF;
|
||||||
.navbar-inner-color(@base);
|
.navbar-inner-color(@base);
|
||||||
}
|
}
|
||||||
|
&.black {
|
||||||
|
@base: #383838;
|
||||||
|
.navbar-inner-color(@base);
|
||||||
|
}
|
||||||
|
|
||||||
.brand img {
|
.brand span {
|
||||||
vertical-align: bottom;
|
background-size: 20px 20px;
|
||||||
|
background-position: left center;
|
||||||
|
padding-left: 24px;
|
||||||
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 780 B |
Binary file not shown.
After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
After Width: | Height: | Size: 1.4 KiB |
File diff suppressed because one or more lines are too long
|
@ -1316,7 +1316,7 @@ function SettingsViewModel(loginStateViewModel, usersViewModel) {
|
||||||
self.appearance_color = ko.observable(undefined);
|
self.appearance_color = ko.observable(undefined);
|
||||||
|
|
||||||
/* I did attempt to allow arbitrary gradients but cross browser support via knockout or jquery was going to be horrible */
|
/* I did attempt to allow arbitrary gradients but cross browser support via knockout or jquery was going to be horrible */
|
||||||
self.appearance_available_colors = ko.observable(["default", "red", "orange", "yellow", "green", "blue", "violet"]);
|
self.appearance_available_colors = ko.observable(["default", "red", "orange", "yellow", "green", "blue", "violet", "black"]);
|
||||||
|
|
||||||
self.printer_movementSpeedX = ko.observable(undefined);
|
self.printer_movementSpeedX = ko.observable(undefined);
|
||||||
self.printer_movementSpeedY = ko.observable(undefined);
|
self.printer_movementSpeedY = ko.observable(undefined);
|
||||||
|
|
|
@ -35,7 +35,7 @@
|
||||||
<div id="navbar" class="navbar navbar-fixed-top">
|
<div id="navbar" class="navbar navbar-fixed-top">
|
||||||
<div class="navbar-inner" data-bind="css: appearance.color">
|
<div class="navbar-inner" data-bind="css: appearance.color">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<a class="brand" href="#"><img src="{{ url_for('static', filename='img/tentacle-20x20.png') }}"> <span data-bind="text: appearance.brand">OctoPrint</span></a>
|
<a class="brand" href="#"> <span data-bind="text: appearance.brand">OctoPrint</span></a>
|
||||||
<div class="nav-collapse">
|
<div class="nav-collapse">
|
||||||
<ul class="nav pull-right">
|
<ul class="nav pull-right">
|
||||||
<li style="display: none;" data-bind="visible: loginState.isAdmin">
|
<li style="display: none;" data-bind="visible: loginState.isAdmin">
|
||||||
|
@ -575,7 +575,8 @@
|
||||||
{% include 'settings.jinja2' %}
|
{% include 'settings.jinja2' %}
|
||||||
{% include 'dialogs.jinja2' %}
|
{% include 'dialogs.jinja2' %}
|
||||||
|
|
||||||
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
|
<!--<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>-->
|
||||||
|
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery/jquery.min.js') }}"></script>
|
||||||
<script type="text/javascript" src="{{ url_for('static', filename='js/modernizr.custom.js') }}"></script>
|
<script type="text/javascript" src="{{ url_for('static', filename='js/modernizr.custom.js') }}"></script>
|
||||||
<script type="text/javascript" src="{{ url_for('static', filename='js/underscore.js') }}"></script>
|
<script type="text/javascript" src="{{ url_for('static', filename='js/underscore.js') }}"></script>
|
||||||
<script type="text/javascript" src="{{ url_for('static', filename='js/knockout.js') }}"></script>
|
<script type="text/javascript" src="{{ url_for('static', filename='js/knockout.js') }}"></script>
|
||||||
|
|
Loading…
Reference in New Issue