Files
filebrozer/assets/src/css/styles.css
Henrique Dias ee55b9fd9c Dashboard updates
Former-commit-id: e6c96075892397f2033dc54edbe51b218e515e79 [formerly 842b38286f4cffdabd36c8a09f135dea50d8a750] [formerly 6db6ef19b576adc616b8209ec5ad0ef52705effa [formerly af369cdea1]]
Former-commit-id: 1cd150a4e4d4846772e460778fca006ea1105fe4 [formerly 6137ec696244fe7230db1d8c29a6eede7dee6926]
Former-commit-id: 2b82b1b5a2b3f7ff39448501089cd9860cb4707c
2017-07-07 20:00:32 +01:00

198 lines
3.1 KiB
CSS

@import "~normalize.css/normalize.css";
@import "./fonts.css";
@import "./base.css";
@import "./header.css";
@import "./prompts.css";
@import "./listing.css";
@import "./editor.css";
@import "./dashboard.css";
/* * * * * * * * * * * * * * * *
* ACTION *
* * * * * * * * * * * * * * * */
.action {
display: inline-block;
cursor: pointer;
transition: 0.2s ease all;
border: 0;
margin: 0;
color: #546E7A;
border-radius: 50%;
background: transparent;
padding: 0;
box-shadow: 0 0 0 0;
vertical-align: middle;
text-align: left;
position: relative;
}
.action.disabled {
opacity: 0.2;
cursor: not-allowed;
}
.action i {
padding: 0.4em;
-webkit-transition: 0.2s ease-in-out all;
transition: 0.2s ease-in-out all;
border-radius: 50%;
}
.action:hover {
background-color: rgba(0, 0, 0, .1);
}
.action ul {
position: absolute;
top: 0;
color: #7d7d7d;
list-style: none;
margin: 0;
padding: 0;
flex-direction: column;
display: flex;
}
.action ul li {
line-height: 1;
padding: .7em;
transition: .1s ease background-color;
}
.action ul li:hover {
background-color: rgba(0, 0, 0, 0.04);
}
#click-overlay {
display: none;
position: fixed;
cursor: pointer;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
#click-overlay.active {
display: block;
}
.action .counter {
display: block;
position: absolute;
bottom: 0;
right: 0;
background: #2196f3;
color: #fff;
border-radius: 50%;
font-size: .75em;
width: 1.5em;
height: 1.5em;
text-align: center;
line-height: 1.25em;
border: 2px solid white;
}
/* PREVIEWER */
#previewer {
background-color: rgba(0, 0, 0, 0.9);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
overflow: hidden;
}
#previewer .bar {
width: 100%;
text-align: right;
display: flex;
padding: 0.5em 0.5em 0.5em 1em;
height: 3.7em;
}
#previewer .action:first-of-type {
margin-right: auto;
}
#previewer .action i {
color: #fff;
}
#previewer .action:hover {
background-color: rgba(255, 255, 255, 0.3)
}
#previewer .action span {
display: none;
}
#previewer .preview {
margin: 2em auto 4em;
max-width: 80%;
text-align: center;
height: calc(100vh - 9.7em);
}
#previewer .preview pre {
text-align: left;
overflow: auto;
}
#previewer .preview pre,
#previewer .preview video,
#previewer .preview img {
max-height: 100%;
margin: 0;
}
#previewer .pdf {
width: 100%;
height: 100%;
}
#previewer h2.message {
color: rgba(255, 255, 255, 0.5)
}
/* * * * * * * * * * * * * * * *
* PROMPT *
* * * * * * * * * * * * * * * */
/* * * * * * * * * * * * * * * *
* FOOTER *
* * * * * * * * * * * * * * * */
.credits {
font-size: 0.6em;
margin: 3em 2.5em;
color: #a5a5a5;
}
.credits a,
.credits a:hover {
color: inherit;
cursor: pointer;
}
/* * * * * * * * * * * * * * * *
* ANIMATIONS *
* * * * * * * * * * * * * * * */
@keyframes spin {
100% {
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
}
@import './mobile.css';