cryptpad/www/common/file-dialog.less
2017-08-09 11:20:46 +02:00

103 lines
2.2 KiB
Text

@import (once) '../customize/src/less2/include/colortheme.less';
#fileDialog {
display: none;
z-index: 100000;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: @colortheme_modal-dim;
.cp-modal {
background-color: @colortheme_modal-bg;
color: @colortheme_modal-fg;
box-shadow: @colortheme_modal-shadow;
padding: @colortheme_modal-padding;
position: absolute;
top: 15vh; bottom: 15vh;
left: 10vw; right: 10vw;
overflow: auto;
font-family: @colortheme_font;
text-align: center;
& > p {
margin-bottom: 1em;
}
.cp-form {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}
input {
background-color: @colortheme_modal-input;
color: @colortheme_modal-fg;
border: 0;
padding: 8px 12px;
margin: 1em;
width: 300px;
}
.close {
text-shadow: none;
color: inherit;
position: absolute;
top: 0;
right: 0;
margin: @colortheme_modal-padding;
cursor: pointer;
}
.fileContainer {
display: flex;
flex-wrap: wrap;
justify-content: center;
overflow-y: auto;
}
.element {
@darker: darken(@colortheme_modal-fg, 30%);
width: 200px;
min-width: 200px;
height: 1em;
padding: 0.5em;
margin: 5px;
box-sizing: content-box;
text-align: left;
line-height: 1em;
cursor: pointer;
background-color: #111;
color: @darker;
transition: all 0.1s;
&:hover {
color: @colortheme_modal-fg;
}
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
align-items: center;
.fa {
cursor: pointer;
margin-right: 0.5em;
}
}
}
}