12 changed files with 0 additions and 2346 deletions
Split View
Diff Options
-
92customize.dist/src/less/bar.less
-
689customize.dist/src/less/cryptpad.less
-
4customize.dist/src/less/dropdown.less
-
30customize.dist/src/less/footer.less
-
193customize.dist/src/less/mixins.less
-
80customize.dist/src/less/sidebar-layout.less
-
1035customize.dist/src/less/toolbar.less
-
96customize.dist/src/less/topbar.less
-
118customize.dist/src/less/variables.less
-
3www/contacts/app-contacts.less
-
3www/todo/app-todo.less
-
3www/worker/app-worker.less
@ -1,92 +0,0 @@ |
|||
/* Bottom Bar */ |
|||
@import (once) "../less2/include/colortheme-all.less"; |
|||
|
|||
.top-bar, .bottom-bar { |
|||
position:fixed; |
|||
height:4%; |
|||
height: 2.5em; |
|||
|
|||
display: inline-block; |
|||
width: 100%; |
|||
background: @base; |
|||
border-top: 1px solid @cp-outline; |
|||
|
|||
a { |
|||
color: @cp-green; |
|||
text-decoration: none; |
|||
} |
|||
p { |
|||
margin: -1px; |
|||
font-family: @colortheme_font; |
|||
|
|||
font-size: 20px; |
|||
display:block; |
|||
margin-left: 10px; |
|||
padding-top:3px; |
|||
color: @fore; |
|||
} |
|||
img { |
|||
margin-right: 4px; |
|||
position: relative; |
|||
} |
|||
|
|||
.big { |
|||
@media screen and (max-width: @media-not-big) { |
|||
display: none; |
|||
} |
|||
@media screen and (min-width: @media-not-small) { |
|||
display: inline-block; |
|||
} |
|||
} |
|||
.small { |
|||
@media screen and (max-width: @media-not-big) { |
|||
display: inline-block; |
|||
} |
|||
@media screen and (min-width: @media-not-small) { |
|||
display: none; |
|||
} |
|||
img { |
|||
height: 1.25em; |
|||
} |
|||
} |
|||
|
|||
} |
|||
.bottom-bar { |
|||
bottom: 0px; |
|||
right: 0px; |
|||
} |
|||
.top-bar { |
|||
top: 0px; |
|||
right: 0px; |
|||
} |
|||
|
|||
.bottom-bar-left { |
|||
display:block; |
|||
float:left; |
|||
padding-left:10px; |
|||
} |
|||
.bottom-bar-left p { |
|||
float: right; |
|||
} |
|||
.bottom-bar-right { |
|||
display:block; |
|||
float:right; |
|||
padding-right:20px |
|||
} |
|||
.bottom-bar-center { |
|||
width: 20%; |
|||
position: absolute; |
|||
left: 40%; |
|||
text-align: center; |
|||
} |
|||
.bottom-bar-heart { |
|||
top: 2px; |
|||
} |
|||
.bottom-bar-xwiki { |
|||
top: 3px; |
|||
} |
|||
.bottom-bar-openpaas { |
|||
top: 3px; |
|||
max-width: 100px; |
|||
} |
|||
|
|||
@ -1,689 +0,0 @@ |
|||
@import "./variables.less"; |
|||
@import "./mixins.less"; |
|||
|
|||
@import "../less2/include/alertify.less"; |
|||
@import "../less2/include/colortheme-all.less"; |
|||
@import "../less2/include/modal.less"; |
|||
@import "../less2/include/font.less"; |
|||
@import "../less2/loading.less"; |
|||
@import "./bar.less"; |
|||
@import "./dropdown.less"; |
|||
@import "./topbar.less"; |
|||
@import "./footer.less"; |
|||
|
|||
@toolbar-green: #5cb85c; |
|||
|
|||
.font_open-sans(); |
|||
|
|||
.alertify_main(); |
|||
|
|||
html.cp, .cp body { |
|||
font-size: .875em; |
|||
background-color: @page-white; //@base; |
|||
color: @fore; |
|||
|
|||
height: 100%; |
|||
} |
|||
.fa { |
|||
cursor: default; // Fix for Edge displaying the text cursor on every icon |
|||
} |
|||
|
|||
.cp { |
|||
|
|||
// add font for tooltips |
|||
.tippy-popper { |
|||
font: 16px @colortheme_font; |
|||
} |
|||
|
|||
// override bootstrap colors |
|||
.btn-primary { |
|||
background-color: @cp-blue; |
|||
&:hover { |
|||
color: #fff; |
|||
background-color: #025aa5; |
|||
border-color: #01549b; |
|||
} |
|||
} |
|||
|
|||
body { |
|||
font-size: 1rem; |
|||
font-weight: 400; |
|||
line-height: 2rem; |
|||
margin: 0; |
|||
} |
|||
|
|||
a.github-corner > svg { |
|||
fill: @cp-blue; |
|||
color: @old-base; |
|||
} |
|||
|
|||
.lato { |
|||
font-family: lato, Helvetica, sans-serif; |
|||
font-size: 1.02em; |
|||
} |
|||
|
|||
.unselectable { |
|||
-webkit-touch-callout: none; |
|||
-webkit-user-select: none; |
|||
-khtml-user-select: none; |
|||
-moz-user-select: none; |
|||
-ms-user-select: none; |
|||
user-select: none; |
|||
} |
|||
|
|||
h1,h2,h3,h4,h5,h6 { |
|||
color: @fore; |
|||
|
|||
font-family: @colortheme_font; |
|||
-webkit-font-feature-settings: 'dlig' 1,'liga' 1,'lnum' 1,'kern' 1; |
|||
-moz-font-feature-settings: 'dlig' 1,'liga' 1,'lnum' 1,'kern' 1; |
|||
font-feature-settings: 'dlig' 1,'liga' 1,'lnum' 1,'kern' 1; |
|||
font-style: normal; |
|||
font-weight: 600; |
|||
margin-top: 0; |
|||
} |
|||
|
|||
h1 { |
|||
line-height: 3rem; |
|||
font-size: 2.05714rem; |
|||
margin-bottom: .21999rem; |
|||
padding-top: .78001rem; |
|||
} |
|||
|
|||
h2 { |
|||
font-size: 1.95312rem; |
|||
margin-bottom: .18358rem; |
|||
padding-top: .81642rem; |
|||
} |
|||
|
|||
h2,h3 { |
|||
line-height: 3rem; |
|||
} |
|||
|
|||
h3 { |
|||
font-size: 1.64571rem; |
|||
margin-bottom: .07599rem; |
|||
padding-top: .92401rem; |
|||
} |
|||
|
|||
h4 { |
|||
font-size: 1.5625rem; |
|||
margin-bottom: .54686rem; |
|||
padding-top: .45314rem; |
|||
} |
|||
|
|||
h5 { |
|||
font-size: 1.25rem; |
|||
margin-bottom: -.56251rem; |
|||
padding-top: .56251rem; |
|||
} |
|||
|
|||
h6 { |
|||
font-size: 1rem; |
|||
margin-bottom: -.65001rem; |
|||
padding-top: .65001rem; |
|||
} |
|||
|
|||
p { |
|||
a:not(.btn) { |
|||
cursor: pointer; |
|||
color: @cp-link; |
|||
|
|||
text-decoration: none; |
|||
|
|||
&:hover { |
|||
color: @cp-link-hover; |
|||
} |
|||
&:visited { |
|||
color: @cp-link-visited; |
|||
} |
|||
} |
|||
} |
|||
a.btn { |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
img { |
|||
height: auto; |
|||
max-width: 100%; |
|||
} |
|||
|
|||
p { |
|||
padding-top: .66001rem; |
|||
margin-top: 0; |
|||
} |
|||
|
|||
p,pre { |
|||
margin-bottom: 1.33999rem; |
|||
} |
|||
|
|||
p, pre, td, a, table, tr { |
|||
.lato; |
|||
} |
|||
|
|||
body.html { |
|||
display:flex; |
|||
flex-flow: column; |
|||
} |
|||
|
|||
// Main page |
|||
.page { |
|||
width: 100%; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
background: @page-white; |
|||
padding: 10px 0;//@main-border-width; |
|||
position: relative; |
|||
|
|||
.info-container { |
|||
color: #121212; |
|||
width: 800px; |
|||
max-width: 100%; |
|||
margin: 0 auto; |
|||
&>div{ |
|||
padding: 10px; |
|||
width: 400px; |
|||
max-width: 100%; |
|||
position: relative; |
|||
display: inline-block; |
|||
vertical-align: middle; |
|||
&:not(.image) { |
|||
@media screen and (max-width: @media-not-big) { |
|||
width: 100%; |
|||
left: 0; |
|||
} |
|||
} |
|||
&.image { |
|||
width:300px; |
|||
text-align: center; |
|||
@media screen and (max-width: @media-not-big) { |
|||
display: none; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
&.first { |
|||
//margin-top: ~"min(calc(100vh - 150px), 650px)"; |
|||
@media screen and (max-width: @media-not-big) { |
|||
//margin-top: 0; |
|||
} |
|||
} |
|||
&.even { |
|||
//background: darken(@base, 1%); |
|||
} |
|||
&.category { |
|||
background: @category-bg; |
|||
} |
|||
|
|||
.app { |
|||
display: inline-block; |
|||
width: 300px; |
|||
vertical-align: middle; |
|||
margin: 0px 25px; |
|||
white-space: normal; |
|||
max-width: ~"calc(50% - 50px)"; |
|||
@media screen and (max-width: 500px) { |
|||
display: block; |
|||
max-width: 100%; |
|||
margin: 0 auto; |
|||
} |
|||
} |
|||
.app-container { |
|||
width: 1400px; |
|||
max-width: 100%; |
|||
margin: 0 auto; |
|||
} |
|||
.app-row { |
|||
display: flex; |
|||
justify-content: center; |
|||
flex-flow: row wrap; |
|||
max-width: 100%; |
|||
margin: 0 auto; |
|||
@media screen and (max-width: 1399px) { |
|||
display: flex; |
|||
} |
|||
img { |
|||
@media screen and (max-width: @media-not-big) { |
|||
display: none; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.left { |
|||
//left: 10%; //@main-border-width; |
|||
} |
|||
.right { |
|||
left: 100px; //@main-border-width; |
|||
} |
|||
|
|||
h1, h2, h3, h4, h5, h6 { |
|||
padding: 0; |
|||
} |
|||
|
|||
@media screen and (max-width: @media-not-big) { |
|||
padding: 10px 5vh; |
|||
} |
|||
|
|||
p { |
|||
font-size: 18px; |
|||
//text-align: justify; |
|||
} |
|||
} |
|||
|
|||
.btn-default { |
|||
&:hover { |
|||
background-color: #d8d8d8; |
|||
} |
|||
} |
|||
|
|||
#main { |
|||
.mainOverlay { |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
background-color: #000; |
|||
opacity: 0.35; |
|||
} |
|||
} |
|||
noscript { |
|||
#noscriptContainer { |
|||
color: black; |
|||
position: absolute; |
|||
top: @topbar-height; |
|||
left: 0; |
|||
bottom: 0; |
|||
right: 0; |
|||
z-index: 2; // noscriptContainer |
|||
#noscript { |
|||
width: 1000px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
height: 100%; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
position: relative; |
|||
font-size: 25px; |
|||
text-align: center; |
|||
color: @main-color; |
|||
} |
|||
} |
|||
} |
|||
#main { |
|||
background: @main-bg; |
|||
background-size: cover; |
|||
background-attachment: fixed; |
|||
background-position: center; |
|||
height: ~"calc(100vh - 115px)"; |
|||
min-height: 450px; |
|||
.hidden { |
|||
display: none !important; |
|||
} |
|||
} |
|||
#main_other { |
|||
padding: 0 @main-border-width; |
|||
background-color: @page-white; |
|||
} |
|||
|
|||
.category { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
#mainBlock { |
|||
flex: 1; |
|||
} |
|||
|
|||
#main, #main_other { |
|||
position: relative; |
|||
left: 0; |
|||
right: 0; |
|||
margin: auto; |
|||
z-index: 1; // #main, #main_other |
|||
|
|||
font-size: medium; |
|||
|
|||
#align-container { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
height: 100%; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
width: 1000px; |
|||
max-width: 90%; |
|||
position: relative; |
|||
} |
|||
|
|||
#main-container { |
|||
display: inline-block; |
|||
} |
|||
|
|||
#userForm .extra { |
|||
p { |
|||
font-size: 28px; |
|||
padding: 15px; |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
#data { |
|||
p { |
|||
margin: 0; |
|||
padding: 0; |
|||
font-size: 28px; |
|||
line-height: 1.5em; |
|||
&.register-explanation { |
|||
font-size: 18px; |
|||
} |
|||
} |
|||
h1, h2 { |
|||
font-weight: normal; |
|||
font-size: 48px; |
|||
line-height: 1.2em; |
|||
color: @main-color; |
|||
padding: 0; |
|||
} |
|||
|
|||
h5 { |
|||
font-size: 1em; |
|||
color: @main-color; |
|||
} |
|||
width: 600px; |
|||
max-width: 60%; |
|||
color: @main-color; |
|||
padding: 0 15px; |
|||
box-sizing: border-box; |
|||
display: inline-block; |
|||
|
|||
#tryit { |
|||
margin-top: 20px; |
|||
margin-bottom: 5px; |
|||
} |
|||
} |
|||
|
|||
#loggedIn { |
|||
float: right; |
|||
color: @main-color; |
|||
display: inline-block; |
|||
width: 350px; |
|||
max-width: 35%; |
|||
text-align: center; |
|||
font-weight: bold; |
|||
button { |
|||
font-weight: bold; |
|||
cursor: pointer; |
|||
} |
|||
p { |
|||
margin: 20px; |
|||
padding: 0; |
|||
font-size: 20px; |
|||
line-height: 1.5em; |
|||
} |
|||
|
|||
} |
|||
|
|||
#userForm { |
|||
float: right; |
|||
display: inline-block; |
|||
width: 400px; |
|||
max-width: 40%; |
|||
padding: 10px; |
|||
box-sizing: border-box; |
|||
font-family: @colortheme_font; |
|||
color: @main-color; |
|||
|
|||
label { |
|||
margin-bottom: 0; |
|||
margin-left: 5px; |
|||
vertical-align: middle; |
|||
} |
|||
|
|||
button { |
|||
font-weight: bold; |
|||
width: 100%; |
|||
cursor: pointer; |
|||
&.half { |
|||
width: ~"calc(50% - 10px)"; |
|||
&:not(.first) { |
|||
float: right; |
|||
} |
|||
} |
|||
} |
|||
|
|||
p { |
|||
margin: 0; |
|||
padding: 0; |
|||
&.buttons { |
|||
margin-bottom: 10px; |
|||
.cp-dropdown-container { |
|||
button { |
|||
white-space: normal; |
|||
text-align: left; |
|||
.fa { |
|||
float: right; |
|||
} |
|||
} |
|||
a { |
|||
color: black; |
|||
&:hover, :visited { |
|||
color: black !important; |
|||
} |
|||
} |
|||
display: block; |
|||
} |
|||
} |
|||
&.separator { |
|||
margin: 5px 0 15px 0; |
|||
text-align: center; |
|||
font-weight: bold; |
|||
font-size: 1.1em; |
|||
} |
|||
a { |
|||
color: @main-color; |
|||
font-weight:bold; |
|||
font-size: 14px; |
|||
&:hover, :visited { |
|||
color: @main-color !important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.driveLink { |
|||
padding-left: 1rem; //Bootstrap padding in buttons |
|||
font-size: 1em; |
|||
} |
|||
|
|||
&> * { |
|||
margin-bottom: 10px; |
|||
} |
|||
} |
|||
@media screen and (max-width: @media-not-big) { |
|||
#align-container { |
|||
transform: initial; |
|||
position: relative; |
|||
display: block; |
|||
width: 90%; |
|||
left: 0; |
|||
} |
|||
#main-container { |
|||
position: relative; |
|||
transform: unset; |
|||
top:0; |
|||
|
|||
} |
|||
#data { |
|||
text-align: center; |
|||
} |
|||
#userForm, #loggedIn, #data { |
|||
transform: initial; |
|||
position: relative; |
|||
display: block; |
|||
width: 100%; |
|||
max-width: 100%; |
|||
margin: 10px 0; |
|||
box-sizing: border-box; |
|||
float: none; |
|||
} |
|||
#userForm, #loggedIn { |
|||
//border: 1px solid #888; |
|||
} |
|||
position: relative; |
|||
height: auto; |
|||
} |
|||
|
|||
.buttons { |
|||
margin-top: 15px; |
|||
} |
|||
} |
|||
|
|||
/* buttons */ |
|||
|
|||
.create, .action { |
|||
display: inline-block; |
|||
@thick: 2px; |
|||
border: 0; |
|||
background-color: @cp-darkblue; |
|||
color: @topbar-button-color; |
|||
|
|||
font-weight: bold; |
|||
font-size: large; |
|||
margin-right: 5px; |
|||
margin-left: 5px; |
|||
&:hover { |
|||
color: darken(@topbar-button-color, 20%); |
|||
} |
|||
} |
|||
|
|||
// currently only used in /user/ |
|||
.panel { |
|||
background-color: @dark-base; |
|||
} |
|||
|
|||
/* Tables |
|||
* Currently only used by /poll/ |
|||
*/ |
|||
|
|||
// form things |
|||
.bottom-left { |
|||
.bottom-left; |
|||
} |
|||
|
|||
.top-left { |
|||
.top-left; |
|||
} |
|||
|
|||
.remove { |
|||
color: @cp-red; |
|||
cursor: pointer !important; |
|||
} |
|||
} |
|||
|
|||
/* Pin limit */ |
|||
.limit-container { |
|||
display: inline-flex; |
|||
flex-flow: column-reverse; |
|||
width: 100%; |
|||
margin-top: 20px; |
|||
.cryptpad-limit-bar { |
|||
display: inline-block; |
|||
max-width: 100%; |
|||
margin: 3px; |
|||
box-sizing: border-box; |
|||
border: 1px solid #999; |
|||
background: white; |
|||
position: relative; |
|||
text-align: center; |
|||
vertical-align: middle; |
|||
width: ~"calc(100% - 6px)"; |
|||
height: 25px; |
|||
line-height: 25px; |
|||
overflow: hidden; |
|||
.usage { |
|||
height: 100%; |
|||
display: inline-block; |
|||
background: blue; |
|||
position: absolute; |
|||
left: 0; |
|||
z-index:1; // .usage |
|||
&.normal { |
|||
background: @toolbar-green; |
|||
} |
|||
&.warning { |
|||
background: orange; |
|||
} |
|||
&.above { |
|||
background: red; |
|||
} |
|||
} |
|||
.usageText { |
|||
position: relative; |
|||
color: black; |
|||
text-shadow: 1px 0 2px white, 0 1px 2px white, -1px 0 2px white, 0 -1px 2px white; |
|||
z-index: 2; // .usageText |
|||
font-size: @main-font-size; |
|||
font-weight: bold; |
|||
} |
|||
} |
|||
.upgrade { |
|||
padding: 0; |
|||
line-height: 25px; |
|||
height: 25px; |
|||
margin: 0 3px; |
|||
border-radius: 0; |
|||
} |
|||
} |
|||
|
|||
/* Upload status table */ |
|||
#uploadStatusContainer { |
|||
.modal_base(); |
|||
position: absolute; |
|||
left: 10vw; right: 10vw; |
|||
bottom: 10vh; |
|||
opacity: 0.9; |
|||
box-sizing: border-box; |
|||
z-index: 10000; // #uploadStatusContainer |
|||
display: none; |
|||
#uploadStatus { |
|||
width: 80vw; |
|||
tr:nth-child(1) { |
|||
background-color: darken(@colortheme_modal-bg, 20%); |
|||
td { |
|||
text-align: center; |
|||
font-weight: bold; |
|||
padding: 0.25em; |
|||
} |
|||
} |
|||
@upload_pad_h: 0.25em; |
|||
@upload_pad_v: 0.5em; |
|||
|
|||
td { |
|||
padding: @upload_pad_h @upload_pad_v; |
|||
} |
|||
.upProgress { |
|||
width: 200px; |
|||
position: relative; |
|||
text-align: center; |
|||
box-sizing: border-box; |
|||
} |
|||
.progressContainer { |
|||
position: absolute; |
|||
width: 0px; |
|||
left: @upload_pad_v; |
|||
top: @upload_pad_h; bottom: @upload_pad_h; |
|||
background-color: rgba(0,0,255,0.3); |
|||
z-index: -1; // .progressContainer |
|||
} |
|||
.upCancel { text-align: center; } |
|||
.fa.cancel { |
|||
color: rgb(255, 0, 115); |
|||
} |
|||
} |
|||
} |
|||
|
|||
// hack for our cross-origin iframe |
|||
#cors-store { |
|||
display: none; |
|||
} |
|||
@ -1,4 +0,0 @@ |
|||
@import (once) "../less2/include/dropdown.less"; |
|||
|
|||
.dropdown_main(); |
|||
|
|||
@ -1,30 +0,0 @@ |
|||
@import "./variables.less"; |
|||
@import (once) "../less2/include/colortheme-all.less"; |
|||
|
|||
footer { |
|||
background: @category-bg; |
|||
font-family: @colortheme_font; |
|||
padding-top: 1em; |
|||
font-size: 1.2em; |
|||
a { |
|||
color: @cp-link; |
|||
&:visited { |
|||
color: @cp-link-visited; |
|||
} |
|||
&:hover { |
|||
color: @cp-link-hover; |
|||
} |
|||
} |
|||
li.title { |
|||
font-size: 1.2em; |
|||
font-weight: bold; |
|||
} |
|||
div.version-footer { |
|||
background-color: @old-base; |
|||
color: @old-fore; |
|||
text-align: center; |
|||
width: 100%; |
|||
padding-top: 10px; |
|||
padding-bottom: 10px; |
|||
} |
|||
} |
|||
@ -1,193 +0,0 @@ |
|||
@import "/customize/src/less/variables.less"; |
|||
@import (once) "/customize/src/less2/include/tools.less"; |
|||
|
|||
.fontface(@family, @src, @style: normal, @weight: 400, @fmt: 'truetype'){ |
|||
@font-face { |
|||
font-family: @family; |
|||
src: url(@src) format(@fmt); |
|||
font-weight: @weight; |
|||
font-style: @style; |
|||
} |
|||
} |
|||
|
|||
.transform(...) { |
|||
-webkit-transform: @arguments; |
|||
-moz-transform: @arguments; |
|||
-o-transform: @arguments; |
|||
-ms-transform: @arguments; |
|||
transform: @arguments; |
|||
} |
|||
|
|||
.translate(@x:0, @y:0) { |
|||
.transform(translate(@x, @y)); |
|||
} |
|||
|
|||
.bottom-left(@s: 5px) { border-bottom-left-radius: @s; } |
|||
.top-left(@s: 5px) { border-top-left-radius: @s; } |
|||
|
|||
.size (@n) { |
|||
// font-size: @n * 1vmin; |
|||
// line-height: @n * 1.1vmin; |
|||
font-size: @n * 10%; |
|||
// line-height: @n * 11%; |
|||
line-height: 110%; |
|||
} |
|||
|
|||
.two-part-gradient (@start, @end) { |
|||
background: -webkit-linear-gradient(@start, @end); /* For Safari 5.1 to 6.0 */ |
|||
background: -o-linear-gradient(@start, @end); /* For Opera 11.1 to 12.0 */ |
|||
background: -moz-linear-gradient(@start, @end); /* For Firefox 3.6 to 15 */ |
|||
background: linear-gradient(@start, @end); /* Standard syntax */ |
|||
} |
|||
|
|||
.avatar (@width) { |
|||
&.avatar { |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
font-size: 16px; |
|||
display: flex; |
|||
align-items: center; |
|||
&.clickable { |
|||
cursor: pointer; |
|||
&:hover { |
|||
background-color: rgba(0,0,0,0.3); |
|||
} |
|||
} |
|||
.default, media-tag { |
|||
display: inline-flex; |
|||
width: @width; |
|||
height: @width; |
|||
justify-content: center; |
|||
align-items: center; |
|||
border-radius: 4px; |
|||
overflow: hidden; |
|||
box-sizing: content-box; |
|||
} |
|||
.default { |
|||
.tools_unselectable(); |
|||
background: white; |
|||
color: black; |
|||
font-size: @width/1.2; |
|||
} |
|||
.right-col { |
|||
order: 10; |
|||
flex: 1; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
display: flex; |
|||
flex-flow: column; |
|||
.name { |
|||
flex: 1; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
} |
|||
.friend { |
|||
padding: 0; |
|||
} |
|||
} |
|||
media-tag { |
|||
min-height: @width; |
|||
min-width: @width; |
|||
max-height: @width; |
|||
max-width: @width; |
|||
img { |
|||
min-width: 100%; |
|||
min-height: 100%; |
|||
max-width: none; |
|||
max-height: none; // To override 'media-tag img' in slide.less |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.leftsideCategory { |
|||
.tools_unselectable(); |
|||
padding: 5px 20px; |
|||
margin: 15px 0; |
|||
cursor: pointer; |
|||
height: @toolbar-line-height; |
|||
line-height: @toolbar-line-height - 10px; |
|||
.fa { |
|||
width: 25px; |
|||
} |
|||
&:hover { |
|||
background: rgba(0,0,0,0.05); |
|||
} |
|||
&.active { |
|||
background: white; |
|||
} |
|||
} |
|||
|
|||
.fileIcon { |
|||
li { |
|||
display: inline-block; |
|||
margin: 10px 10px; |
|||
width: 140px; |
|||
height: 140px; |
|||
text-align: center; |
|||
vertical-align: top; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
padding-top: 5px; |
|||
padding-bottom: 5px; |
|||
|
|||
&:not(.selected):not(.selectedTmp) { |
|||
border: 1px solid #CCC; |
|||
} |
|||
.name { |
|||
width: 100%; |
|||
height: 48px; |
|||
margin: 8px 0; |
|||
display: inline-block; |
|||
//align-items: center; |
|||
//justify-content: center; |
|||
overflow: hidden; |
|||
//text-overflow: ellipsis; |
|||
word-wrap: break-word; |
|||
} |
|||
.truncated { |
|||
display: block; |
|||
position: absolute; |
|||
bottom: 0px; |
|||
left: 0; right: 0; |
|||
text-align: center; |
|||
} |
|||
img.icon { |
|||
height: 48px; |
|||
max-height: none; |
|||
max-width: none; |
|||
margin: 8px 0; |
|||
} |
|||
.fa { |
|||
display: block; |
|||
margin: auto; |
|||
font-size: 48px; |
|||
margin: 8px 0; |
|||
text-align: center; |
|||
&.listonly { |
|||
display: none; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.sidebarButton { |
|||
button.btn { |
|||
background-color: @button-bg; |
|||
border-color: darken(@button-bg, 10%); |
|||
color: white; |
|||
&:hover { |
|||
background-color: darken(@button-bg, 10%); |
|||
} |
|||
&.btn-danger { |
|||
background-color: @button-red-bg; |
|||
border-color: darken(@button-red-bg, 10%); |
|||
color: white; |
|||
&:hover { |
|||
background-color: darken(@button-red-bg, 10%); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -1,80 +0,0 @@ |
|||
@import '/customize/src/less/variables.less'; |
|||
@import '/customize/src/less/mixins.less'; |
|||
@import (once) "/customize/src/less2/include/colortheme-all.less"; |
|||
|
|||
@leftside-bg: @colortheme_sidebar-left-bg; |
|||
@leftside-color: @colortheme_sidebar-left-fg; |
|||
@rightside-color: @colortheme_sidebar-right-fg; |
|||
@description-color: @colortheme_sidebar-description; |
|||
|
|||
@button-width: 400px; |
|||
|
|||
|
|||
.cp { |
|||
input[type="text"] { |
|||
padding-left: 10px; |
|||
} |
|||
#container { |
|||
font-size: 16px; |
|||
display: flex; |
|||
flex: 1; |
|||
min-height: 0; |
|||
#leftSide { |
|||
color: @leftside-color; |
|||
width: 250px; |
|||
background: @leftside-bg; |
|||
display: flex; |
|||
flex-flow: column; |
|||
.categories { |
|||
flex: 1; |
|||
.category { |
|||
.leftsideCategory(); |
|||
} |
|||
} |
|||
} |
|||
#rightSide { |
|||
flex: 1; |
|||
padding: 5px 20px; |
|||
color: @rightside-color; |
|||
overflow: auto; |
|||
.element { |
|||
label:not(.noTitle), .label { |
|||
display: block; |
|||
font-weight: bold; |
|||
margin-bottom: 0; |
|||
} |
|||
.description { |
|||
display: block; |
|||
color: @description-color; |
|||
margin-bottom: 5px; |
|||
} |
|||
margin-bottom: 20px; |
|||
} |
|||
[type="text"], button { |
|||
vertical-align: middle; |
|||
height: 40px; |
|||
box-sizing: border-box; |
|||
} |
|||
.inputBlock { |
|||
display: inline-flex; |
|||
width: @button-width; |
|||
input { |
|||
flex: 1; |
|||
border-radius: 0.25em 0 0 0.25em; |
|||
border: 1px solid #adadad; |
|||
border-right: 0px; |
|||
} |
|||
button { |
|||
border-radius: 0 0.25em 0.25em 0; |
|||
//border: 1px solid #adadad; |
|||
border-left: 0px; |
|||
} |
|||
} |
|||
&>div { |
|||
margin: 10px 0; |
|||
} |
|||
.sidebarButton; |
|||
} |
|||
} |
|||
} |
|||
|
|||
1035
customize.dist/src/less/toolbar.less
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -1,96 +0,0 @@ |
|||
@import "./variables.less"; |
|||
@import (once) "../less2/include/colortheme-all.less"; |
|||
|
|||
#cryptpadTopBar { |
|||
background: @topbar-back; |
|||
position: relative; |
|||
top: 0; |
|||
left: 0; |
|||
right: 0; |
|||
height: @topbar-height; |
|||
color: @topbar-color; |
|||
font-family: @colortheme_font; |
|||
padding: 5px; |
|||
box-sizing: border-box; |
|||
font-size: 30px; |
|||
|
|||
border-bottom: 1px solid darken(@topbar-back, 15%); |
|||
|
|||
&> span { |
|||
vertical-align: middle; |
|||
display: inline-block; |
|||
height: 100%; |
|||
} |
|||
.cryptpad-logo { |
|||
height: 40px; |
|||
vertical-align: middle; |
|||
} |
|||
|
|||
.slogan { |
|||
font-size: 20px; |
|||
color: @topbar-color; |
|||
line-height: 40px; |
|||
} |
|||
|
|||
.gotoMain { |
|||
color: @topbar-color; |
|||
height: 40px; |
|||
line-height: 40px; |
|||
&:hover { |
|||
text-decoration: none; |
|||
color: @cp-purple; |
|||
} |
|||
} |
|||
|
|||
.right { |
|||
float: right; |
|||
font-size: 20px; |
|||
margin: 0px 10px; |
|||
line-height: 40px; |
|||
|
|||
.buttonSuccess { |
|||
// Bootstrap 4 colors |
|||
color: #fff; |
|||
background: @toolbar-green; |
|||
border-color: @toolbar-green; |
|||
&:hover { |
|||
color: #fff; |
|||
background: #449d44; |
|||
border: 1px solid #419641; |
|||
} |
|||
span { |
|||
color: #fff; |
|||
} |
|||
.large { |
|||
margin-left: 5px; |
|||
} |
|||
} |
|||
|
|||
button { |
|||
.cp-dropdown-button-title { |
|||
.fa-user { |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
} |
|||
&.link a { |
|||
font-weight: 500; |
|||
font-size: 0.75em; |
|||
color: @cp-link; |
|||
|
|||
&:hover { |
|||
color: @cp-link-hover; |
|||
text-decoration: underline; |
|||
} |
|||
&:visited { |
|||
color: @cp-link-visited; |
|||
} |
|||
} |
|||
|
|||
&.link { |
|||
@media screen and (max-width: @media-not-big) { |
|||
display: none; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -1,118 +0,0 @@ |
|||
@import (once) '../less2/include/colortheme-all.less'; |
|||
@import (once) '../less2/include/browser.less'; |
|||
|
|||
@base: @colortheme_base; |
|||
@dark-base: darken(@base, 20%); |
|||
@less-dark-base: darken(@base, 10%); |
|||
@light-base: @colortheme_light-base; |
|||
@less-light-base: lighten(@base, 10%); |
|||
@fore: #555; |
|||
@old-base: @colortheme_old-base; |
|||
@old-fore: @colortheme_old-fore; |
|||
|
|||
@main-font-size: 16px; |
|||
|
|||
@cp-green: @colortheme_cp-green; |
|||
@cp-accent: lighten(@cp-green, 20%); |
|||
|
|||
@cp-red: @colortheme_cp-red; |
|||
@cp-outline: #444; |
|||
|
|||
@cp-orange: #FE9A2E; |
|||
|
|||
@cp-blue: #00CFC1; |
|||
@cp-blue: #00ADEE; |
|||
@cp-light-blue: #41b7d8; // lighten(@cp-blue, 20%); |
|||
|
|||
@cp-purple: #558; |
|||
|
|||
@page-white: #fafafa; |
|||
|
|||
// links |
|||
@cp-link: @cp-light-blue; |
|||
@cp-link-visited: @cp-light-blue; |
|||
@cp-link-hover: darken(@cp-light-blue, 10%); |
|||
|
|||
|
|||
@slide-default-bg: #000; |
|||
|
|||
@bg-loading: #222; |
|||
@color-loading: @old-fore; |
|||
|
|||
@media-not-big: @browser_media-not-big; |
|||
@media-not-small: @browser_media-not-small; |
|||
|
|||
@media-short-screen: @browser_media-short-screen; |
|||
@media-narrow-screen: @browser_media-narrow-screen; |
|||
@media-medium-screen: @browser_media-medium-screen; |
|||
|
|||
|
|||
// Dropdown |
|||
|
|||
@dropdown-font: @main-font-size @colortheme_font; |
|||
@dropdown-bg: #f9f9f9; |
|||
@dropdown-color: black; |
|||
@dropdown-bg-hover: #f1f1f1; |
|||
@dropdown-bg-active: #e8e8e8; |
|||
|
|||
// Toolbar |
|||
|
|||
@toolbar-button-font: @dropdown-font; |
|||
|
|||
@toolbar-pad-bg: @colortheme_pad-bg; |
|||
@toolbar-pad-color: @colortheme_pad-color; |
|||
@toolbar-slide-bg: @colortheme_slide-bg; |
|||
@toolbar-slide-color: @colortheme_slide-color; |
|||
@toolbar-code-bg: @colortheme_code-bg; |
|||
@toolbar-code-color: @colortheme_code-color; |
|||
@toolbar-poll-bg: @colortheme_poll-bg; |
|||
@toolbar-poll-color: @colortheme_poll-color; |
|||
@toolbar-whiteboard-bg: @colortheme_whiteboard-bg; |
|||
@toolbar-whiteboard-color: @colortheme_whiteboard-color; |
|||
@toolbar-drive-bg: @colortheme_drive-bg; |
|||
@toolbar-drive-color: @colortheme_drive-color; |
|||
@toolbar-file-bg: @colortheme_file-bg; |
|||
@toolbar-file-color: @colortheme_file-color; |
|||
@toolbar-friends-bg: @colortheme_friends-bg; |
|||
@toolbar-friends-color: @colortheme_friends-color; |
|||
@toolbar-default-bg: @colortheme_default-bg; |
|||
@toolbar-default-color: @colortheme_default-color; |
|||
@toolbar-settings-bg: @colortheme_settings-bg; |
|||
@toolbar-settings-color: @colortheme_settings-color; |
|||
@toolbar-profile-bg: @colortheme_profile-bg; |
|||
@toolbar-profile-color: @colortheme_profile-color; |
|||
@toolbar-todo-bg: @colortheme_todo-bg; |
|||
@toolbar-todo-color: @colortheme_todo-color; |
|||
|
|||
@topbar-back: #fff; |
|||
@topbar-color: #000; |
|||
@topbar-button-bg: #2E9AFE; |
|||
@topbar-button-color: #fff; |
|||
@topbar-height: 50px; |
|||
|
|||
@toolbar-top-height: 64px; |
|||
|
|||
@main-border-width: 15vw; |
|||
@cp-darkblue: #3333ff; |
|||
@cp-accent2: darken(@cp-darkblue, 20%); |
|||
|
|||
@main-block-bg: rgba(200, 200, 200, 0.3); |
|||
@main-color: #fff; |
|||
@main-bg: url('/customize/bg4.jpg') no-repeat center center; |
|||
|
|||
@category-bg: #f4f4f4; |
|||
|
|||
@button-bg: @colortheme_sidebar-button-bg; |
|||
@button-alt-bg: @colortheme_sidebar-button-alt-bg; |
|||
@button-red-bg: @colortheme_sidebar-button-red-bg; |
|||
|
|||
.unselectable () { |
|||
-webkit-touch-callout: none; |
|||
-webkit-user-select: none; |
|||
-khtml-user-select: none; |
|||
-moz-user-select: none; |
|||
-ms-user-select: none; |
|||
user-select: none; |
|||
} |
|||
|
|||
@toolbar-line-height: 32px; |
|||
Write
Preview
Loading…
Cancel
Save