filebrowser/_assets/src/css/prompts.css
2017-06-29 09:11:46 +01:00

140 lines
2.2 KiB
CSS

.prompt {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #fff;
border: 1px solid rgba(0, 0, 0, 0.075);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
padding: 2em;
max-width: 25em;
width: 90%;
max-height: 95%;
z-index: 99999;
}
.overlay {
background-color: rgba(0, 0, 0, 0.5);
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 9999;
}
.overlay.active,
.prompt.active,
.help.active {
animation: .1s show forwards;
}
.prompt h3 {
margin: 0;
font-weight: 500;
font-size: 1.5em;
}
.prompt p {
font-size: .9em;
color: rgba(0, 0, 0, 0.8);
margin: .5em 0 1em;
}
.prompt input {
width: 100%;
border: 1px solid #dadada;
line-height: 1;
padding: .3em;
}
.prompt code {
word-wrap: break-word;
}
.prompt div {
margin-top: 1em;
display: flex;
justify-content: flex-start;
flex-direction: row-reverse;
}
.prompt .cancel {
background-color: #ECEFF1;
color: #37474F;
}
.prompt .cancel:hover {
background-color: #e9eaeb;
}
/* * * * * * * * * * * * * * * *
* PROMPT - MOVE *
* * * * * * * * * * * * * * * */
.prompt .file-list {
flex-direction: initial;
max-height: 50vh;
overflow: auto;
}
.prompt .file-list ul {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.prompt .file-list ul li {
width: 100%;
user-select: none;
}
.prompt .file-list ul li[aria-selected=true] {
background: #2196f3 !important;
color: #fff !important;
transition: .1s ease all;
}
.prompt .file-list ul li:hover {
background-color: #e9eaeb;
cursor: pointer;
}
.prompt .file-list ul li:before {
content: "folder";
color: #6f6f6f;
vertical-align: middle;
padding: 0 .25em;
line-height: 2em;
}
.prompt .file-list ul li[aria-selected=true]:before {
color: white;
}
.help {
max-width: 24em;
}
.help ul {
padding: 0;
margin: 1em 0;
list-style: none;
}
@keyframes show {
0% {
display: none;
opacity: 0;
}
1% {
display: block;
opacity: 0;
}
100% {
display: block;
opacity: 1;
}
}