github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-04-10 00:56:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

Editor header styling.

Browse source
This commit is contained in:
Paulo Reis 2017-11-13 12:03:28 +00:00
parent 23814d25ac
commit 6913d28abb
9 changed files with 51 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
services/web/public/stylesheets/app/base.less
View file

@ -2,7 +2,7 @@
padding: (@line-height-computed / 4) (@line-height-computed / 2);
background-color: @state-warning-bg;
color: #333;
border-bottom: 1px solid @toolbar-border-color;
border-bottom: 1px solid @common-border-color;
}
.clickable {

4
services/web/public/stylesheets/app/editor.less
View file

@ -250,8 +250,8 @@
.ui-layout-resizer {
width: 6px;
background-color: #f4f4f4;
border-left: 1px solid @toolbar-border-color;
border-right: 1px solid @toolbar-border-color;
border-left: 1px solid @editor-border-color;
border-right: 1px solid @editor-border-color;
.ui-layout-toggler {
color: #999;
font-family: FontAwesome;

4
services/web/public/stylesheets/app/editor/chat.less
View file

@ -126,12 +126,12 @@
height: @new-message-height;
background-color: @gray-lightest;
padding: @line-height-computed / 4;
border-top: 1px solid @toolbar-border-color;
border-top: 1px solid @editor-border-color;
textarea {
overflow: auto;
resize: none;
border-radius: @border-radius-base;
border: 1px solid @toolbar-border-color;
border: 1px solid @editor-border-color;
height: 100%;
width: 100%;
color: @gray-dark;

6
services/web/public/stylesheets/app/editor/history.less
View file

@ -70,7 +70,7 @@
}
aside.change-list {
border-left: 1px solid @toolbar-border-color;
border-left: 1px solid @editor-border-color;
height: 100%;
width: @changesListWidth;
position: absolute;
@ -91,7 +91,7 @@
.day {
background-color: #fafafa;
border-bottom: 1px solid @toolbar-border-color;
border-bottom: 1px solid @editor-border-color;
padding: 4px;
font-weight: bold;
text-align: center;
@ -132,7 +132,7 @@
padding: (@line-height-computed / 4);
padding-left: 38px;
min-height: 38px;
border-bottom: 1px solid @toolbar-border-color;
border-bottom: 1px solid @editor-border-color;
cursor: pointer;
&:hover {
background-color: @gray-lightest;

2
services/web/public/stylesheets/app/editor/search.less
View file

@ -1,6 +1,6 @@
.ace_search {
background-color: @gray-lightest;
border: 1px solid @toolbar-border-color;
border: 1px solid @editor-border-color;
border-top: 0 none;
width: 350px;
overflow: hidden;

17
services/web/public/stylesheets/app/editor/toolbar.less
View file

@ -48,18 +48,18 @@
border: none;
border-radius: 0;
border-right: 1px solid @toolbar-border-color;
color: @link-color;
color: @toolbar-btn-color;
padding: 3px 10px 5px;
font-size: 20px;
&:hover {
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
background-color: darken(white, 10%);
color: @link-hover-color;
text-shadow: @toolbar-btn-hover-text-shadow;
background-color: @toolbar-btn-hover-bg-color;
color: @toolbar-btn-hover-color;
}
&.active, &:active {
color: white;
background-color: @link-color;
.box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.225));
color: @toolbar-btn-active-color;
background-color: @toolbar-btn-active-bg-color;
box-shadow: @toolbar-btn-active-shadow;
}
.label {
top: 4px;
@ -96,7 +96,8 @@
}
&.toolbar-header {
box-shadow: 0 0 2px #ccc;
background-color: @toolbar-header-bg-color;
box-shadow: @toolbar-header-shadow;
position: absolute;
top: 0;
left: 0;

2
services/web/public/stylesheets/app/translations.less
View file

@ -3,7 +3,7 @@
padding: (@line-height-computed / 4) (@line-height-computed / 2);
background-color: @state-warning-bg;
color: #333;
border-bottom: 1px solid @toolbar-border-color;
border-bottom: 1px solid @common-border-color;
text-align:center;
img {

27
services/web/public/stylesheets/core/_common-variables.less
View file

@ -794,6 +794,8 @@
@left-menu-animation-duration: 0.35s;
@toolbar-border-color: @gray-lighter;
@common-border-color: @gray-lighter;
@editor-border-color: @gray-lighter;
@file-tree-droppable-background-color: rgb(252, 231, 199);
@editor-dark-background-color: #333;
@ -876,15 +878,26 @@
@folders-untagged-line-height : 1.7;
// Progress bars
@progress-border-radius : @border-radius-base;
@progress-border-width : 1px;
@progress-bar-shadow : inset 0 -1px 0 rgba(0,0,0,.15);
@progress-border-radius : @border-radius-base;
@progress-border-width : 1px;
@progress-bar-shadow : inset 0 -1px 0 rgba(0,0,0,.15);
// Footer
@footer-link-color : @link-color;
@footer-link-hover-color : @link-hover-color;
@footer-bg-color : transparent;
@footer-padding : 2em;
@footer-link-color : @link-color;
@footer-link-hover-color : @link-hover-color;
@footer-bg-color : transparent;
@footer-padding : 2em;
// Editor header
@toolbar-header-bg-color : transparent;
@toolbar-header-shadow : 0 0 2px #ccc;
@toolbar-btn-color : @link-color;
@toolbar-btn-hover-color : @link-hover-color;
@toolbar-btn-hover-bg-color : @link-hover-color;
@toolbar-btn-hover-text-shadow : 0 1px 0 rgba(0, 0, 0, 0.15);
@toolbar-btn-active-color : white;
@toolbar-btn-active-bg-color : @link-color;
@toolbar-btn-active-shadow : inset 0 3px 5px rgba(0, 0, 0, 0.225);
// Tags
@tag-border-radius : 0.25em;

12
services/web/public/stylesheets/core/ol-variables.less
View file

@ -156,6 +156,18 @@
@footer-link-hover-color : @ol-dark-green;
@footer-padding : 2em 0;
// Editor header
@toolbar-header-bg-color : @ol-blue-gray-6;
@toolbar-header-shadow : none;
@toolbar-btn-color : #FFF;
@toolbar-btn-hover-color : #FFF;
@toolbar-btn-hover-bg-color : @ol-blue-gray-5;
@toolbar-btn-hover-text-shadow : none;
@toolbar-btn-active-color : #FFF;
@toolbar-btn-active-bg-color : @ol-green;
@toolbar-btn-active-shadow : none;
@toolbar-border-color : @ol-blue-gray-5;
//== Colors
//
//## Gray and brand colors for use across Bootstrap.