1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-08-02 02:26:57 +03:00

Updated styles for auth and books views.

Also added sourcemaps to gulp sass build
This commit is contained in:
Dan Brown
2017-08-26 13:24:55 +01:00
parent 3da8c01c1f
commit 8fcbe44d3e
24 changed files with 291 additions and 229 deletions

View File

@ -195,7 +195,13 @@
font-weight: 400;
text-transform: uppercase;
}
.body {
.body, p.empty-text {
padding: $-m;
}
}
.well {
background-color: #F8F8F8;
padding: $-m;
border: 1px solid #DDD;
}

View File

@ -2,9 +2,10 @@
@mixin generate-button-colors($textColor, $backgroundColor) {
background-color: $backgroundColor;
color: $textColor;
text-transform: uppercase;
&:hover {
background-color: lighten($backgroundColor, 8%);
box-shadow: $bs-med;
//box-shadow: $bs-med;
text-decoration: none;
color: $textColor;
}
@ -26,16 +27,16 @@ $button-border-radius: 2px;
text-decoration: none;
font-size: $fs-m;
line-height: 1.4em;
padding: $-xs $-m;
padding: $-xs*1.3 $-m;
margin: $-xs $-xs $-xs 0;
display: inline-block;
border: none;
font-weight: 500;
font-weight: 400;
outline: 0;
border-radius: $button-border-radius;
cursor: pointer;
transition: all ease-in-out 120ms;
box-shadow: 0 0.5px 1.5px 0 rgba(0, 0, 0, 0.21);
box-shadow: 0;
@include generate-button-colors(#EEE, $primary);
}
@ -51,13 +52,39 @@ $button-border-radius: 2px;
@include generate-button-colors(#EEE, $secondary);
}
&.muted {
@include generate-button-colors(#EEE, #888);
@include generate-button-colors(#EEE, #AAA);
}
&.muted-light {
@include generate-button-colors(#666, #e4e4e4);
}
}
.button.outline {
background-color: transparent;
color: #888;
border: 1px solid #DDD;
&:hover, &:focus, &:active {
box-shadow: none;
background-color: #EEE;
}
&.page {
border-color: $color-page;
color: $color-page;
&:hover, &:focus, &:active {
background-color: $color-page;
color: #FFF;
}
}
&.chapter {
border-color: $color-chapter;
color: $color-chapter;
&:hover, &:focus, &:active {
background-color: $color-chapter;
color: #FFF;
}
}
}
.text-button {
@extend .link;
background-color: transparent;

View File

@ -2,14 +2,13 @@
.input-base {
background-color: #FFF;
border-radius: 3px;
border: 1px solid #CCC;
border: 1px solid #D4D4D4;
display: inline-block;
font-size: $fs-s;
padding: $-xs;
color: #222;
padding: $-xs*1.5;
color: #666;
width: 250px;
max-width: 100%;
//-webkit-appearance:none;
&.neg, &.invalid {
border: 1px solid $negative;
}
@ -84,8 +83,9 @@ label {
display: block;
line-height: 1.4em;
font-size: 0.94em;
font-weight: 500;
color: #666;
font-weight: 400;
color: #999;
text-transform: uppercase;
padding-bottom: 2px;
margin-bottom: 0.2em;
&.inline {
@ -186,28 +186,15 @@ input:checked + .toggle-switch {
}
.inline-input-style {
border: 2px dotted #BBB;
display: block;
width: 100%;
padding: $-xs $-s;
}
.title-input .input {
width: 100%;
}
.title-input label, .description-input label{
margin-top: $-m;
color: #666;
padding: $-s;
}
.title-input input[type="text"] {
@extend h1;
@extend .inline-input-style;
margin-top: 0;
padding-right: 0;
width: 100%;
color: #444;
font-size: 2em;
}
.title-input.page-title {

View File

@ -9,6 +9,9 @@ html {
&.flexbox {
overflow-y: hidden;
}
&.shaded {
background-color: #F2F2F2;
}
}
body {

View File

@ -239,6 +239,9 @@
.left + .right {
margin-left: 30px + $-s;
}
&:last-of-type {
border-bottom: 0;
}
}
ul.pagination {
@ -291,9 +294,6 @@ ul.pagination {
h4 {
margin: 0;
}
p {
margin: $-xs 0 0 0;
}
hr {
margin: 0;
}
@ -310,7 +310,7 @@ ul.pagination {
}
}
.card .entity-list-item {
.card .entity-list-item, .card .activity-list-item {
padding-left: $-m;
padding-right: $-m;
}
@ -323,9 +323,11 @@ ul.pagination {
.entity-item-snippet {
display: none;
}
p {
.entity-list-item p {
font-size: $fs-m * 0.8;
padding-top: $-xs;
}
p {
margin: 0;
}
> p.empty-text {

View File

@ -2,7 +2,7 @@
* Fonts
*/
body, button, input, select, label {
body, button, input, select, label, textarea {
font-family: $text;
}
.Codemirror, pre, #markdown-editor-input, .editor-toolbar, .code-base {

View File

@ -217,22 +217,15 @@ $btt-size: 40px;
}
.center-box {
margin: $-xl auto 0 auto;
padding: $-m $-xxl $-xl $-xxl;
margin: $-xxl auto 0 auto;
width: 420px;
max-width: 100%;
display: inline-block;
text-align: left;
vertical-align: top;
//border: 1px solid #DDD;
input {
width: 100%;
}
&.login {
background-color: #EEE;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
border: 1px solid #DDD;
}
}