web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

New toolbar colors

Browse Source
This commit is contained in:
yflory
2017-06-20 17:59:11 +02:00
parent fe6a9e5d8d
commit b7a0547b77
8 changed files with 169 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
customize.dist/src/less/toolbar.less
View File

@@ -28,12 +28,47 @@
@toolbar-green: #5cb85c;
box-sizing: border-box;
padding: 0px 6px;
padding: 0px;
//background-color: #BBBBFF;
background-color: @toolbar-default-bg;
color: @toolbar-default-color;
&.pad {
@color: @toolbar-pad-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
&.code {
@color: @toolbar-code-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
&.slide {
@color: @toolbar-slide-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
&.poll {
@color: @toolbar-poll-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
&.whiteboard {
@color: @toolbar-whiteboard-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
&.drive {
@color: @toolbar-drive-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
&.file {
@color: @toolbar-file-bg;
background: linear-gradient(20deg, @color 150px, @toolbar-default-bg 150px);
border-bottom: 2px solid @color;
}
/*
&.pad {
background-color: @toolbar-pad-bg;
color: @toolbar-pad-color;
@@ -62,7 +97,7 @@
background-color: @toolbar-file-bg;
color: @toolbar-file-color;
}
*/
.fa {
font: normal normal normal 14px/1 FontAwesome;
font-family: FontAwesome;
@@ -78,6 +113,17 @@
float: right;
}
.dropdown-bar {
height: 100%;
display: inline-block;
button {
height: 100%;
border-radius: 0;
margin: 0;
}
}
button {
&#shareButton, &.buttonSuccess {
// Bootstrap 4 colors
@@ -421,6 +467,7 @@
position: absolute;
left: 0px;
height: 32px;
background: @toolbar-drive-bg;
a.cryptpad-logo {
cursor: pointer;
@@ -447,6 +494,7 @@
}
}
.cryptpad-user {
height: 100%;
position: absolute;
right: 0;
:not(.cryptpad-lag) span {
@@ -480,6 +528,13 @@
.cryptpad-toolbar-rightside {
height: 32px;
text-align: right;
&> button {
height: 100%;
margin: 0;
border-radius: 0;
padding: 0 10px;
}
}
.cryptpad-toolbar-history {
display: none;

10
customize.dist/src/less/variables.less
View File

@@ -77,19 +77,19 @@
// Toolbar
@toolbar-pad-bg: #1c4fa0;
@toolbar-pad-color: #fff;
@toolbar-slide-bg: #a01c1c;
@toolbar-slide-bg: #e57614;
@toolbar-slide-color: #fff;
@toolbar-code-bg: #ffae00;
@toolbar-code-color: #000;
@toolbar-poll-bg: #006304;
@toolbar-poll-color: #fff;
@toolbar-whiteboard-bg: #570063;
@toolbar-whiteboard-bg: #800080;
@toolbar-whiteboard-color: #fff;
@toolbar-drive-bg: #0087ff;
@toolbar-drive-color: #fff;
@toolbar-file-bg: #ccffa0;
@toolbar-file-color: #000;
@toolbar-default-bg: #fff;
@toolbar-file-bg: #cd2532;
@toolbar-file-color: #fff;
@toolbar-default-bg: #ddd;
@toolbar-default-color: #000;

79
customize.dist/toolbar.css
View File

@@ -103,9 +103,39 @@
}
.cryptpad-toolbar {
box-sizing: border-box;
padding: 0px 6px;
background-color: #fff;
padding: 0px;
background-color: #ddd;
color: #000;
/*
&.pad {
background-color: @toolbar-pad-bg;
color: @toolbar-pad-color;
}
&.code {
background-color: @toolbar-code-bg;
color: @toolbar-code-color;
}
&.slide {
background-color: @toolbar-slide-bg;
color: @toolbar-slide-color;
}
&.poll {
background-color: @toolbar-poll-bg;
color: @toolbar-poll-color;
}
&.whiteboard {
background-color: @toolbar-whiteboard-bg;
color: @toolbar-whiteboard-color;
}
&.drive {
background-color: @toolbar-drive-bg;
color: @toolbar-drive-color;
}
&.file {
background-color: @toolbar-file-bg;
color: @toolbar-file-color;
}
*/
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
@@ -117,32 +147,32 @@
z-index: 9001;
}
.cryptpad-toolbar.pad {
background-color: #1c4fa0;
color: #fff;
background: linear-gradient(20deg, #1c4fa0 150px, #ddd 150px);
border-bottom: 2px solid #1c4fa0;
}
.cryptpad-toolbar.code {
background-color: #ffae00;
color: #000;
background: linear-gradient(20deg, #ffae00 150px, #ddd 150px);
border-bottom: 2px solid #ffae00;
}
.cryptpad-toolbar.slide {
background-color: #a01c1c;
color: #fff;
background: linear-gradient(20deg, #e57614 150px, #ddd 150px);
border-bottom: 2px solid #e57614;
}
.cryptpad-toolbar.poll {
background-color: #006304;
color: #fff;
background: linear-gradient(20deg, #006304 150px, #ddd 150px);
border-bottom: 2px solid #006304;
}
.cryptpad-toolbar.whiteboard {
background-color: #570063;
color: #fff;
background: linear-gradient(20deg, #800080 150px, #ddd 150px);
border-bottom: 2px solid #800080;
}
.cryptpad-toolbar.drive {
background-color: #0087ff;
color: #fff;
background: linear-gradient(20deg, #0087ff 150px, #ddd 150px);
border-bottom: 2px solid #0087ff;
}
.cryptpad-toolbar.file {
background-color: #ccffa0;
color: #000;
background: linear-gradient(20deg, #cd2532 150px, #ddd 150px);
border-bottom: 2px solid #cd2532;
}
.cryptpad-toolbar .fa {
font: normal normal normal 14px/1 FontAwesome;
@@ -151,6 +181,15 @@
.cryptpad-toolbar a {
float: right;
}
.cryptpad-toolbar .dropdown-bar {
height: 100%;
display: inline-block;
}
.cryptpad-toolbar .dropdown-bar button {
height: 100%;
border-radius: 0;
margin: 0;
}
.cryptpad-toolbar button {
border: 1px solid transparent;
border-radius: .25rem;
@@ -502,6 +541,7 @@
position: absolute;
left: 0px;
height: 32px;
background: #0087ff;
}
.cryptpad-toolbar-top .cryptpad-link a.cryptpad-logo {
cursor: pointer;
@@ -525,6 +565,7 @@
cursor: pointer;
}
.cryptpad-toolbar-top .cryptpad-user {
height: 100%;
position: absolute;
right: 0;
}
@@ -554,6 +595,12 @@
height: 32px;
text-align: right;
}
.cryptpad-toolbar-rightside > button {
height: 100%;
margin: 0;
border-radius: 0;
padding: 0 10px;
}
.cryptpad-toolbar-history {
display: none;
text-align: center;