github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-02-18 08:22:46 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve LESS variable skinning (unfinished)

Browse Source
This commit is contained in:
Toby Zerner 2015-02-08 16:00:09 +10:30
parent 24f9e97df4
commit 5d83e51813
4 changed files with 79 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
framework/core/ember/app/styles/config.less
View File

@ -1,21 +1,38 @@
@fl-primary-color: #4d698e;//#E7562E;
@fl-primary-color: #4d698e;
@fl-secondary-color: #edf2f7;
@fl-dark-body: false;
@fl-dark-hdr: false;
// ---------------------------------
// BODY
@fl-body-bg: #fff;
@fl-body-color: #444;
@fl-body-muted-color: hsv(hue(@fl-secondary-color), 18%, 72%); // todo
@fl-body-muted-more-color: #bbb;
@fl-body-heading-color: @fl-body-color;
.define-body-variables(@fl-dark-body);
.define-body-variables(false) {
@fl-body-bg: #fff;
@fl-body-color: #444;
@fl-body-muted-color: hsv(hue(@fl-secondary-color), max(0, saturation(@fl-secondary-color) - 20%), 65%); // todo
@fl-body-muted-more-color: #bbb;
@fl-body-heading-color: @fl-body-color;
@fl-body-control-bg: @fl-secondary-color;
@fl-body-control-color: @fl-body-muted-color;
@fl-body-control-bg: @fl-secondary-color;
@fl-body-control-color: @fl-body-muted-color;
@fl-body-control-primary-bg: @fl-primary-color;
@fl-body-control-primary-color: #fff;
@fl-body-control-primary-bg: @fl-primary-color;
@fl-body-control-primary-color: #fff;
}
.define-body-variables(true) {
@fl-body-bg: #333;
@fl-body-color: #ccc;
@fl-body-muted-color: hsv(hue(@fl-secondary-color), max(0, saturation(@fl-secondary-color) - 20%), 65%); // todo
@fl-body-muted-more-color: #bbb;
@fl-body-heading-color: @fl-body-color;
@fl-body-control-bg: @fl-secondary-color;
@fl-body-control-color: @fl-body-muted-color;
@fl-body-control-primary-bg: @fl-primary-color;
@fl-body-control-primary-color: #fff;
}
// ---------------------------------
// HEADER
@ -32,12 +49,12 @@
@fl-body-hero-color: #fff;
}
.define-hdr-variables(true) {
@fl-hdr-bg: @fl-primary-color;
@fl-hdr-color: #fff;
@fl-hdr-muted-color: fade(#fff, 0.5);
@fl-hdr-control-bg: fade(#000, 0.1);
@fl-hdr-control-color: #fff;
@fl-hdr-bg: @fl-primary-color;
@fl-hdr-color: #fff;
@fl-hdr-muted-color: fade(#fff, 50%);
@fl-hdr-control-bg: fade(#000, 10%);
@fl-hdr-control-color: #fff;
@fl-body-hero-bg: @fl-secondary-color;
@fl-body-hero-color: @fl-body-muted-color;
}
}

12
framework/core/ember/app/styles/flarum/discussion.less
View File

@ -118,11 +118,19 @@
margin-bottom: 10px;
color: @fl-body-muted-color;
& > ul {
list-style-type: none;
padding: 0;
margin: 0;
& > li {
display: inline;
}
}
& .user {
margin: 0;
display: inline;
font-weight: bold;
font-size: 16px;
font-size: 15px;
&, & a {
color: @fl-body-heading-color;
}
@ -229,4 +237,4 @@
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
opacity: 0.99;
}
}
}

4
framework/core/ember/app/styles/flarum/index.less
View File

@ -136,7 +136,7 @@
}
& .discussion-summary {
& .title {
font-size: 15px;
font-size: 14px;
}
& .count strong {
font-size: 18px;
@ -213,7 +213,7 @@
}
& .title {
margin: 0 0 5px;
font-size: 16px;
font-size: 15px;
line-height: 1.3;
&, & a {
font-weight: normal;

35
framework/core/ember/app/styles/flarum/layout.less
View File

@ -27,6 +27,35 @@ body {
.scrolled & {
.box-shadow(0 2px 6px rgba(0, 0, 0, 0.15));
}
& when (@fl-dark-hdr = true) {
&, & .btn-link {
color: @fl-hdr-control-color;
}
& .form-control {
background: @fl-hdr-control-bg;
border: 0;
color: @fl-hdr-control-color;
.placeholder(@fl-hdr-control-color);
&:focus {
background: fadein(@fl-hdr-control-bg, 5%);
}
}
& .search-input:before {
color: @fl-hdr-control-color;
}
& .btn-default, & .btn-default:hover {
background: @fl-hdr-control-bg;
color: @fl-hdr-control-color;
}
& .btn-default.active, .open > .dropdown-toggle.btn-default {
background: fadein(@fl-hdr-control-bg, 5%);
}
& .btn-naked {
background: transparent;
}
}
}
.header-controls {
margin: 0;
@ -113,6 +142,10 @@ body {
margin: 0;
font-size: 22px;
font-weight: normal;
& when (@fl-dark-hdr = true) {
color: @fl-body-color;
}
}
.hero p {
margin: 10px 0 0;
@ -155,4 +188,4 @@ body {
& > li {
margin-left: 15px;
}
}
}