summaryrefslogtreecommitdiffstats
path: root/pyload/web/app/styles
diff options
context:
space:
mode:
Diffstat (limited to 'pyload/web/app/styles')
-rw-r--r--pyload/web/app/styles/default/accounts.less6
-rw-r--r--pyload/web/app/styles/default/admin.less17
-rw-r--r--pyload/web/app/styles/default/base.less163
-rw-r--r--pyload/web/app/styles/default/common.less90
-rw-r--r--pyload/web/app/styles/default/dashboard.less331
-rw-r--r--pyload/web/app/styles/default/main.less11
-rw-r--r--pyload/web/app/styles/default/settings.less121
-rw-r--r--pyload/web/app/styles/default/style.less366
-rw-r--r--pyload/web/app/styles/font.css37
9 files changed, 1142 insertions, 0 deletions
diff --git a/pyload/web/app/styles/default/accounts.less b/pyload/web/app/styles/default/accounts.less
new file mode 100644
index 000000000..9b45b64b3
--- /dev/null
+++ b/pyload/web/app/styles/default/accounts.less
@@ -0,0 +1,6 @@
+@import "common";
+
+.logo-select {
+ width: 20px;
+ height: 20px;
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/default/admin.less b/pyload/web/app/styles/default/admin.less
new file mode 100644
index 000000000..92524c153
--- /dev/null
+++ b/pyload/web/app/styles/default/admin.less
@@ -0,0 +1,17 @@
+@import "common";
+
+/*
+ Admin
+*/
+
+#btn_newuser {
+ float: right;
+}
+
+#user_permissions {
+ float: right;
+}
+
+.userperm {
+ width: 115px;
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/default/base.less b/pyload/web/app/styles/default/base.less
new file mode 100644
index 000000000..bd318127e
--- /dev/null
+++ b/pyload/web/app/styles/default/base.less
@@ -0,0 +1,163 @@
+@import "common";
+
+/*
+ General
+*/
+
+* {
+ margin: 0;
+}
+
+html, body {
+ height: 100%;
+}
+
+body {
+ margin: 0;
+ padding: 0;
+ font-family: 'Abel', sans-serif;
+ font-size: 16px;
+ background: url("../../images/default/bgpattern.png") repeat scroll 0 0 transparent;
+}
+
+h1, h2, h3 {
+ margin: 0;
+ padding: 0;
+ font-weight: normal;
+}
+
+a {
+ text-decoration: none;
+ color: @blue;
+}
+
+a:hover {
+ text-decoration: none;
+ color: @emph;
+}
+
+#wrap {
+ min-height: 100%;
+}
+
+#content {
+ padding-bottom: @footer-height;
+}
+
+#content-container:before {
+ display: block;
+ content: " ";
+ height: @header-height;
+}
+
+/*
+ Additional Responsive Class for larger desktop
+*/
+
+.visible-large-screen {
+ display: inherit !important;
+}
+
+@media (max-width: @large-screen) {
+ .visible-large-screen {
+ display: none !important;
+ }
+}
+
+.btn-blue {
+ background-color: hsl(206, 49%, 35%) !important;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom, from(#5493c4), to(#2d5f84));
+ background-image: -moz-linear-gradient(top, #5493c4, #2d5f84);
+ background-image: -ms-linear-gradient(top, #5493c4, #2d5f84);
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5493c4), color-stop(100%, #2d5f84));
+ background-image: -webkit-linear-gradient(top, #5493c4, #2d5f84);
+ background-image: -o-linear-gradient(top, #5493c4, #2d5f84);
+ background-image: linear-gradient(#5493c4, #2d5f84);
+ border-color: #2d5f84 #2d5f84 hsl(206, 49%, 30%);
+ color: #fff !important;
+ text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33);
+ -webkit-font-smoothing: antialiased;
+
+ .caret {
+ border-bottom-color: #FFFFFF;
+ border-top-color: #FFFFFF;
+ }
+
+}
+
+.btn-yellow {
+ background-color: hsl(46, 100%, 57%) !important;
+ background-repeat: repeat-x;
+ background-image: -khtml-gradient(linear, left top, left bottom, from(#ffe389), to(#fecb23));
+ background-image: -moz-linear-gradient(top, #ffe389, #fecb23);
+ background-image: -ms-linear-gradient(top, #ffe389, #fecb23);
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe389), color-stop(100%, #fecb23));
+ background-image: -webkit-linear-gradient(top, #ffe389, #fecb23);
+ background-image: -o-linear-gradient(top, #ffe389, #fecb23);
+ background-image: linear-gradient(#ffe389, #fecb23);
+ border-color: #fecb23 #fecb23 hsl(46, 100%, 52%);
+ color: #333 !important;
+ text-shadow: 0 1px 1px rgba(255, 255, 255, 0.33);
+ -webkit-font-smoothing: antialiased;
+
+ .caret {
+ border-bottom-color: #FFFFFF;
+ border-top-color: #FFFFFF;
+ }
+}
+
+.icon-8x {
+ font-size: 8em;
+}
+
+// Will not work well in buttons/navs, would require more rules
+.icon-larger {
+ vertical-align: -10%;
+ font-size: 1.5em;
+}
+
+/*
+ Modal Overlay
+*/
+#modal-overlay {
+ content: " ";
+ height: 100%;
+ width: 100%;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: -moz-radial-gradient(center, ellipse cover, rgba(236, 208, 66, 0) 0%, rgba(40, 119, 171, 0.9) 100%);
+ background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(236, 208, 66, 0)), color-stop(100%, rgba(40, 119, 171, 0.9)));
+ background: -webkit-radial-gradient(center, ellipse cover, rgba(236, 208, 66, 0) 0%, rgba(40, 119, 171, 0.9) 100%);
+ background: -o-radial-gradient(center, ellipse cover, rgba(236, 208, 66, 0) 0%, rgba(40, 119, 171, 0.9) 100%);
+ background: -ms-radial-gradient(center, ellipse cover, rgba(236, 208, 66, 0) 0%, rgba(40, 119, 171, 0.9) 100%);
+ background: radial-gradient(center, ellipse cover, rgba(236, 208, 66, 0) 0%, rgba(40, 119, 171, 0.9) 100%);
+ z-index: 100;
+ opacity: 0;
+}
+
+div.modal-header {
+ border-top-left-radius: 4px;
+ border-top-right-radius: 4px;
+ background-color: @blueDark;
+ color: #FFFFFF;
+
+ .close {
+ color: @light;
+ }
+
+}
+
+.select2-container {
+ min-width: 220px; // same as other input fields
+}
+
+div.modal-body {
+ max-height: 100%;
+}
+
+div.modal {
+ width: 600px;
+
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/default/common.less b/pyload/web/app/styles/default/common.less
new file mode 100644
index 000000000..338ed38e7
--- /dev/null
+++ b/pyload/web/app/styles/default/common.less
@@ -0,0 +1,90 @@
+/*
+ Definitions
+*/
+
+
+/*
+ Threshold for slightly larger screen
+*/
+@large-screen: 1150px;
+
+@header-height: 70px;
+@actionbar-height: 40px;
+@footer-height: 66px;
+
+@light: #ffffff;
+@dark: #333333;
+
+@grey: #757575;
+@greyLight: #E5E5E5;
+@greyLighter: #F5F5F5;
+@greyDark: #444444;
+@greyDarker: #111113;
+
+@yellow: #ffd856;
+@yellowLighter: lighten(spin(@yellow, 10), 20%);
+@yellowLightest: lighten(spin(@yellow, 15), 30%);
+@yellowDark: darken(@yellow, 10%);
+
+@blue: #3571a2;
+@blueLight: lighten(spin(@blue, 5), 10%);
+@blueLighter: lighten(spin(@blue, 10), 20%);
+@blueLightest: lighten(spin(@blue, 20), 40%);
+@blueDark: darken(spin(@blue, -5), 10%);
+@blueDarker: darken(spin(@blue, -10), 20%);
+
+@green: #468847;
+@greenLight: lighten(spin(@green, 5), 10%);
+@greenDark: darken(spin(@green, -5), 10%);
+
+@red: #b94a48;
+@redLight: lighten(spin(@red, 5), 10%);
+@redDark: darken(spin(@red, -5), 10%);
+
+@emph: #FF7637;
+
+
+/*
+ Mixins
+*/
+
+.gradient(@origin: left, @start: #ffffff, @stop: #000000) {
+ background-color: @start;
+ background-image: -webkit-linear-gradient(@origin, @start, @stop);
+ background-image: -moz-linear-gradient(@origin, @start, @stop);
+ background-image: -o-linear-gradient(@origin, @start, @stop);
+ background-image: -ms-linear-gradient(@origin, @start, @stop);
+ background-image: linear-gradient(@origin, @start, @stop);
+}
+
+.transition(@prop: all, @time: 0.25s, @ease: linear) {
+ -webkit-transition: @prop @time @ease;
+ -moz-transition: @prop @time @ease;
+ -o-transition: @prop @time @ease;
+ -ms-transition: @prop @time @ease;
+ transition: @prop @time @ease;
+}
+
+.stripes(@color, @color2: rgba(255, 255, 255, 0.15)) {
+ background-color: @color;
+ background-image: -webkit-linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent);
+ background-image: -moz-linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent);
+ -webkit-background-size: 40px 40px;
+ -moz-background-size: 40px 40px;
+ -o-background-size: 40px 40px;
+ background-size: 40px 40px;
+}
+.stripes-animated {
+ -webkit-animation: progress-bar-stripes 2s linear infinite;
+ -moz-animation: progress-bar-stripes 2s linear infinite;
+ -ms-animation: progress-bar-stripes 2s linear infinite;
+ -o-animation: progress-bar-stripes 2s linear infinite;
+ animation: progress-bar-stripes 2s linear infinite;
+}
+
+
+.default-shadow {
+ box-shadow: 0 0 5px @dark;
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/default/dashboard.less b/pyload/web/app/styles/default/dashboard.less
new file mode 100644
index 000000000..ab61ba29b
--- /dev/null
+++ b/pyload/web/app/styles/default/dashboard.less
@@ -0,0 +1,331 @@
+@import "common";
+
+/*
+ Dashboard
+*/
+
+#dashboard ul {
+ margin: 0;
+ list-style: none;
+}
+
+.sidebar-header {
+ font-size: 25px;
+ line-height: 25px;
+ margin: 4px 0;
+ border-bottom: 1px dashed @grey;
+}
+
+/*
+ Packages
+*/
+
+.package-list {
+ list-style: none;
+ margin-left: 0;
+}
+
+@frame-top: 20px;
+@frame-bottom: 18px;
+
+.package-frame {
+ position: absolute;
+ top: -@frame-top;
+ left: -@frame-top / 2;
+ right: -@frame-top / 2;
+ bottom: -@frame-bottom + 2px; // + size of visible bar
+ z-index: -1; // lies under package
+ border: 1px solid @grey;
+ border-radius: 5px;
+ box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.75);
+}
+
+.package-view {
+ padding-bottom: 4px;
+ margin: 8px 0;
+ position: relative;
+ overflow: hidden;
+
+ -webkit-hyphens: auto;
+ -moz-hyphens: auto;
+ hyphens: auto;
+
+ i {
+ cursor: pointer;
+ }
+
+ & > i {
+ vertical-align: middle;
+ }
+
+ .progress {
+ position: absolute;
+ height: @frame-bottom;
+ line-height: @frame-bottom;
+ font-size: 12px;
+ text-align: center;
+ border-radius: 0;
+ border-bottom-left-radius: 5px;
+ border-bottom-right-radius: 5px;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin-bottom: 0;
+ background-image: none;
+ color: @light;
+ background-color: @yellow;
+ }
+
+ .bar-info {
+ background-image: none;
+ background-color: @blue;
+ }
+
+ &:hover {
+ overflow: visible;
+ z-index: 10;
+
+ .package-frame {
+ background-color: @light;
+ }
+ }
+
+ &.ui-selected:hover {
+ color: @light;
+
+ .package-frame {
+ background-color: @dark;
+ }
+
+ }
+}
+
+.package-name {
+ cursor: pointer;
+}
+
+.package-indicator {
+ position: absolute;
+ top: 0;
+ right: 0;
+ float: right;
+ color: @blue;
+ text-shadow: @yellowDark 1px 1px;
+ height: @frame-top;
+ line-height: @frame-top;
+
+ & > i:hover {
+ color: @green;
+ }
+
+ .dropdown-menu {
+ text-shadow: none;
+ }
+
+ .tooltip {
+ text-shadow: none;
+ width: 100%;
+ }
+
+ .btn-move {
+ color: @green;
+ display: none;
+ }
+
+}
+
+.ui-files-selected .btn-move {
+ display: inline;
+}
+
+// Tag area with different effect on hover
+.tag-area {
+ position: absolute;
+ top: -2px;
+ left: 0;
+
+ .badge {
+ font-size: 11px;
+ line-height: 11px;
+ }
+
+ .badge i {
+ cursor: pointer;
+ &:hover:before {
+ content: "\f024"; // show Remove icon
+ }
+ }
+
+ .badge-ghost {
+ visibility: hidden;
+ cursor: pointer;
+ opacity: 0.5;
+ }
+
+ &:hover .badge-ghost {
+ visibility: visible;
+ }
+
+}
+
+/*
+ File View
+*/
+
+.file-list {
+ list-style: none;
+ margin: 0;
+}
+
+@file-height: 22px;
+
+.file-view {
+ position: relative;
+ padding: 0 4px;
+ border-top: 1px solid #dddddd;
+ line-height: @file-height;
+
+ &:first-child {
+ border-top: none;
+ }
+
+ &:hover, &.ui-selected:hover {
+ border-radius: 5px;
+ .gradient(top, @blue, @blueLight);
+ color: @light;
+ }
+
+ &.ui-selected {
+ .gradient(top, @yellow, @yellowDark);
+ color: @dark;
+ border-color: @greenDark;
+
+ .file-row.downloading .bar {
+ .gradient(top, @green, @greenLight);
+ }
+
+ }
+
+ img { // plugin logo
+ margin-top: -2px;
+ padding: 0 2px;
+ height: @file-height;
+ width: @file-height;
+ }
+
+ .icon-chevron-down:hover {
+ cursor: pointer;
+ color: @yellow;
+ }
+
+}
+
+.file-row {
+ min-height: 0 !important;
+// padding-left: 5px;
+ padding-top: 4px;
+ padding-bottom: 4px;
+
+ // TODO: better styling for filestatus
+ &.second {
+// border-radius: 4px;
+// background: @light;
+ font-size: small;
+ font-weight: bold;
+// box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.75);
+// .default-shadow;
+ }
+
+ &.third {
+ margin-left: 0;
+ position: relative;
+ font-size: small;
+ }
+
+ .dropdown-menu {
+ font-size: medium;
+ }
+}
+
+/*
+ TODO: more colorful states
+ better fileView design
+*/
+
+.file-row.finished {
+// .gradient(top, @green, @greenLight);
+// color: @light;
+ color: @green;
+}
+
+.file-row.failed {
+// .gradient(top, @red, @redLight);
+// color: @light;
+ color: @red;
+}
+
+.file-row.downloading {
+
+ .progress {
+ height: @file-height;
+ background: @light;
+ margin: 0;
+ }
+
+ .bar {
+ text-align: left;
+ .gradient(top, @yellow, @yellowDark);
+ color: @dark;
+ }
+
+}
+
+/*
+FANCY CHECKBOXES
+*/
+.file-view .checkbox {
+ width: 20px;
+ height: 21px;
+ background: url(../../images/default/checks_sheet.png) left top no-repeat;
+ cursor: pointer;
+}
+
+.file-view.ui-selected .checkbox {
+ background: url(../../images/default/checks_sheet.png) -21px top no-repeat;
+}
+
+/*
+ Actionbar
+*/
+
+.form-search {
+ position: relative;
+
+ .dropdown-menu {
+ min-width: 100%;
+ position: absolute;
+ right: 0;
+ left: auto;
+ }
+
+}
+
+li.finished > a, li.finished:hover > a {
+ background-color: @green;
+ color: @light;
+
+ .caret, .caret:hover {
+ border-bottom-color: @light !important;
+ border-top-color: @light !important;
+ }
+}
+
+li.failed > a, li.failed:hover > a {
+ background-color: @red;
+ color: @light;
+
+ .caret, .caret:hover {
+ border-bottom-color: @light !important;
+ border-top-color: @light !important;
+ }
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/default/main.less b/pyload/web/app/styles/default/main.less
new file mode 100644
index 000000000..15d9943f8
--- /dev/null
+++ b/pyload/web/app/styles/default/main.less
@@ -0,0 +1,11 @@
+@import "bootstrap/less/bootstrap";
+@import "bootstrap/less/responsive";
+@import "font-awesome/build/assets/font-awesome/less/font-awesome";
+
+@FontAwesomePath: "../../fonts";
+
+@import "style";
+@import "dashboard";
+@import "settings";
+@import "accounts";
+@import "admin";
diff --git a/pyload/web/app/styles/default/settings.less b/pyload/web/app/styles/default/settings.less
new file mode 100644
index 000000000..34bfcb92a
--- /dev/null
+++ b/pyload/web/app/styles/default/settings.less
@@ -0,0 +1,121 @@
+@import "common";
+
+/*
+ Settings
+*/
+.settings-menu {
+ background-color: #FFF;
+ box-shadow: 0 0 5px #000; // border: 10px solid #EEE;
+
+ .nav-header {
+ background: @blueDark;
+ color: @light;
+ }
+
+ li > a, .nav-header {
+ margin-left: -16px;
+ margin-right: -16px;
+ text-shadow: none;
+ }
+
+ i {
+ margin-top: 0;
+ }
+
+ .plugin, .addon {
+ a {
+ padding-left: 28px;
+ background-position: 4px 2px;
+ background-repeat: no-repeat;
+ background-size: 20px 20px;
+ }
+
+ .icon-remove {
+ display: none;
+ }
+
+ &:hover {
+ i {
+ display: block;
+ }
+ }
+
+ }
+
+ .addon {
+ div {
+ font-size: small;
+ }
+ .addon-on {
+ color: @green;
+ }
+
+ .addon-off {
+ color: @red;
+ }
+
+ }
+
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+
+ .nav > li > a:hover {
+ color: @blueDark;
+ }
+}
+
+.setting-box {
+ border: 10px solid @blueDark;
+ box-shadow: 0 0 5px @dark; // .gradient(bottom, @yellowLightest, @light);
+ overflow: hidden;
+
+ .page-header {
+ margin: 0;
+
+ .btn {
+ float: right;
+ margin-top: 5px;
+ }
+
+ .popover {
+ font-size: medium;
+ }
+
+ }
+
+ // Bit wider control labels
+ .control-label {
+ width: 180px;
+ }
+ .controls {
+ margin-left: 200px;
+ }
+ .form-actions {
+ padding-left: 200px;
+ }
+
+}
+
+/*
+ Plugin select
+*/
+
+.plugin-select {
+ background-position: left 2px;
+ background-repeat: no-repeat;
+ background-size: 20px 20px;
+ padding-left: 24px;
+
+ font-weight: bold;
+ span {
+ line-height: 14px;
+ font-size: small;
+ font-weight: normal;
+ }
+
+}
+
+.logo-select {
+ width: 20px;
+ height: 20px;
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/default/style.less b/pyload/web/app/styles/default/style.less
new file mode 100644
index 000000000..6fb5a4857
--- /dev/null
+++ b/pyload/web/app/styles/default/style.less
@@ -0,0 +1,366 @@
+@import "default/base";
+
+
+/*
+ Header
+*/
+
+header { // background-color: @greyDark;
+ .gradient(to bottom, #222222, #111111);
+ height: @header-height;
+ position: fixed;
+ top: 0;
+ vertical-align: top;
+ width: 100%;
+ z-index: 10;
+ color: #ffffff;
+
+ a {
+ color: #ffffff;
+ }
+ .container-fluid, .row-fluid {
+ height: @header-height;
+ }
+
+}
+
+@header-inner-height: @header-height - 16px;
+
+// centered header element
+.centered {
+ height: @header-inner-height;
+ margin: 8px 0;
+}
+
+header:before {
+ position: absolute;
+ content: ' ';
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ background-color: transparent;
+ z-index: -1;
+ .default-shadow;
+}
+
+header span.title {
+ color: white;
+ float: left;
+ font-family: SansationRegular, sans-serif;
+ font-size: 40px;
+ line-height: @header-height;
+ cursor: default;
+}
+
+header .logo {
+ float: left;
+ margin-right: 10px;
+ margin-top: 10px;
+ width: 105px;
+ height: 107px;
+ background: url("../../images/default/logo.png") no-repeat;
+}
+
+.header-block {
+ .centered;
+ float: left;
+ line-height: @header-inner-height / 3; // 3 rows
+ font-size: small;
+}
+
+.status-block {
+ min-width: 15%;
+}
+
+.header-btn {
+ float: right;
+ position: relative;
+ .centered;
+
+ .lower {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin-left: 0;
+
+ button {
+ width: 100% / 3; // 3 buttons
+ }
+
+ }
+}
+
+#progress-area {
+ .centered;
+ position: relative;
+ margin-top: 8px;
+ line-height: 16px;
+
+ #progress-info {
+ padding-left: 2px;
+ }
+
+ .sub {
+ font-size: small;
+ padding: 0 2px;
+ }
+
+ .popover { // display: block;
+ max-width: none;
+ width: 120%;
+ left: -60%; // Half of width
+ margin-left: 50%;
+ top: 100%;
+ }
+
+ .popover-title, .popover-content {
+ color: @greyDark;
+ }
+
+ .icon-list {
+ cursor: pointer;
+ margin-right: 2px; // same as globalprogress margin
+
+ &:hover {
+ color: @yellow;
+ }
+ }
+ .close {
+ line-height: 14px;
+ }
+}
+
+.progress-list {
+ list-style: none;
+ margin: 0;
+ font-size: small;
+
+ li {
+ background-repeat: no-repeat;
+ background-size: 32px 32px;
+ background-position: 0px 8px;
+ padding-left: 40px;
+
+ &:not(:last-child) {
+ margin-bottom: 5px;
+ padding-bottom: 5px;
+ border-bottom: 1px dashed @greyLight;
+ }
+
+ .progress {
+ height: 8px;
+ margin-bottom: 0;
+
+ .bar {
+ .gradient(bottom, @blue, @blueLight);
+ }
+ }
+ }
+}
+
+#globalprogress {
+ background-color: @greyDark;
+ background-image: none;
+ height: 8px;
+ margin: 4px 0;
+ border-radius: 8px;
+ border: 2px solid @grey;
+
+ .bar {
+ color: @dark;
+ background-image: none;
+ background-color: @yellow;
+
+ &.running {
+ width: 100%;
+ .stripes(@yellowLighter, @yellowDark);
+ }
+ }
+}
+
+.speedgraph-container {
+ // Allows speedgraph to take up remaining space
+ display: block;
+ overflow: hidden;
+ padding: 0 8px;
+
+ #speedgraph {
+ float: right;
+ width: 100%;
+ .centered;
+// height: @header-height - 16px;
+// margin: 8px 0;
+ font-family: sans-serif;
+ }
+}
+
+.header-area {
+ display: none; // hidden by default
+ position: absolute;
+ bottom: -28px;
+ line-height: 18px;
+ top: @header-height;
+ padding: 4px 10px 6px 10px;
+ text-align: center;
+ border-radius: 0 0 6px 6px;
+ color: @light;
+ background-color: @greyDark;
+ .default-shadow;
+}
+
+#notification-area {
+ .header-area;
+ left: 140px;
+
+ .badge {
+ vertical-align: top;
+ }
+
+ .btn-query, .btn-notification {
+ cursor: pointer;
+ }
+}
+
+#selection-area {
+ .header-area;
+ left: 50%;
+ min-width: 15%;
+
+ i {
+ cursor: pointer;
+
+ &:hover {
+ color: @yellow;
+ }
+ }
+
+}
+
+/*
+ Actionbar
+*/
+
+.nav > li > a:hover {
+ color: @blue;
+}
+
+.actionbar {
+ padding-bottom: 3px;
+ margin-bottom: 0;
+ border-bottom: 1px dashed @grey;
+
+ height: @actionbar-height;
+
+ padding-top: 2px;
+ margin-bottom: 5px;
+
+}
+
+.actionbar > li > a {
+ margin-top: 4px;
+}
+
+.actionbar .breadcrumb {
+ margin: 0;
+ padding-top: 10px;
+ padding-bottom: 0;
+
+ .active {
+ color: @grey;
+ }
+
+}
+
+.actionbar form {
+ margin-top: 6px;
+ margin-bottom: 0;
+}
+
+.actionbar input, .actionbar button {
+ padding-top: 2px;
+ padding-bottom: 2px;
+}
+
+.actionbar .dropdown-menu i {
+ margin-top: 4px;
+ padding-right: 5px;
+}
+
+/*
+ Login
+*/
+.login {
+ vertical-align: middle;
+ border: 2px solid @dark;
+ padding: 15px 50px;
+ font-size: 17px;
+ border-radius: 15px;
+ -moz-border-radius: 15px;
+ -webkit-border-radius: 15px;
+}
+
+
+/*
+ Footer
+*/
+footer { // Same gradient as navbar
+ .gradient(top, #222222, #111111);
+ color: @grey;
+ min-height: @footer-height;
+ margin-top: -@footer-height;
+ position: relative;
+ width: 100%;
+ line-height: 16px;
+ z-index: 10;
+}
+
+footer:before {
+ position: absolute;
+ content: ' ';
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ background-color: transparent;
+ box-shadow: 0 0 5px black;
+ z-index: -1;
+}
+
+footer hr {
+ margin: 4px 0;
+ border-top-color: @greyDarker;
+ border-bottom-color: @greyDark;
+}
+
+footer .span2 {
+ font-size: 12px;
+ padding-top: 12px;
+ padding-bottom: 12px;
+}
+
+// This is the copyright span
+footer .offset1 {
+ padding-top: 8px;
+ padding-bottom: 0;
+}
+
+footer .copyright {
+ background: url(../../images/default/logo_grey.png) no-repeat;
+ background-size: 40px 40px;
+ background-position: 12px center;
+ height: 40px;
+ padding-left: 40px;
+ padding-top: 10px;
+ text-align: center;
+}
+
+footer h2 {
+ color: @light;
+ font-family: SansationLight, sans-serif;
+ font-size: 16px;
+ font-weight: normal;
+ line-height: 16px;
+ margin: 0;
+} \ No newline at end of file
diff --git a/pyload/web/app/styles/font.css b/pyload/web/app/styles/font.css
new file mode 100644
index 000000000..ee117d43b
--- /dev/null
+++ b/pyload/web/app/styles/font.css
@@ -0,0 +1,37 @@
+/**
+ * @file
+ * Font styling
+ */
+
+@font-face {
+ font-family: 'SansationRegular';
+ src: url('../fonts/Sansation_Regular-webfont.eot');
+ src: url('../fonts/Sansation_Regular-webfont.eot?#iefix') format('embedded-opentype'),
+ url('../fonts/Sansation_Regular-webfont.woff') format('woff'),
+ url('../fonts/Sansation_Regular-webfont.ttf') format('truetype'),
+ url('../fonts/Sansation_Regular-webfont.svg#SansationRegular') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'SansationLight';
+ src: url('../fonts/Sansation_Light-webfont.eot');
+ src: url('../fonts/Sansation_Light-webfont.eot?#iefix') format('embedded-opentype'),
+ url('../fonts/Sansation_Light-webfont.woff') format('woff'),
+ url('../fonts/Sansation_Light-webfont.ttf') format('truetype'),
+ url('../fonts/Sansation_Light-webfont.svg#SansationLight') format('svg');
+ font-weight: normal;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'SansationBold';
+ src: url('../fonts/Sansation_Bold-webfont.eot');
+ src: url('../fonts/Sansation_Bold-webfont.eot?#iefix') format('embedded-opentype'),
+ url('../fonts/Sansation_Bold-webfont.woff') format('woff'),
+ url('../fonts/Sansation_Bold-webfont.ttf') format('truetype'),
+ url('../fonts/Sansation_Bold-webfont.svg#SansationBold') format('svg');
+ font-weight: normal;
+ font-style: normal;
+} \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-24 12:19:49 +0100