125 lines
2.3 KiB
CSS
125 lines
2.3 KiB
CSS
body{
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
background-color:#c5c0c0;
|
|
margin: 0%;
|
|
}
|
|
.container{
|
|
padding:0.5rem;
|
|
/*display: flex;*/
|
|
}
|
|
@media only screen and (max-width: 750px){
|
|
.container{
|
|
padding:0;
|
|
}
|
|
}
|
|
|
|
.navbar-container{
|
|
/* Primary color */
|
|
background-color: #2196f3;
|
|
}
|
|
.navbar{
|
|
position:float;
|
|
padding:1rem;
|
|
font-size:1.5em;
|
|
}
|
|
.content{
|
|
padding:0.5rem;
|
|
border-radius: 0.25rem;
|
|
width:75%;
|
|
margin:0.5rem auto 0.5rem auto;
|
|
background-color: aliceblue;
|
|
}
|
|
|
|
@media only screen and (min-width: 750px){
|
|
.content{
|
|
min-width:40rem;
|
|
}
|
|
}
|
|
|
|
@media only screen and (max-width: 750px){
|
|
.content{
|
|
width: auto;
|
|
border-radius: 0;
|
|
margin-top:0;
|
|
}
|
|
}
|
|
|
|
.nav-bottom-container{
|
|
position: fixed;
|
|
bottom:0;
|
|
width:100%;
|
|
}
|
|
|
|
.nav-bottom{
|
|
background-color:aliceblue;
|
|
z-index:2;
|
|
padding:0.5rem;
|
|
height: 1.5rem;
|
|
width:100%;
|
|
|
|
}
|
|
.nav-bottom-button-container{
|
|
width:100%;
|
|
text-align: right;
|
|
}
|
|
.nav-bottom-button{
|
|
margin-bottom: 1rem;
|
|
margin-right:1rem;
|
|
margin-left: auto;
|
|
width:4.5rem;
|
|
height:4.5rem;
|
|
padding:auto;
|
|
border-radius: 10em;
|
|
outline: none;
|
|
/* Button - Secondary color */
|
|
background-color:royalblue;
|
|
border:0.5rem royalblue solid;
|
|
color:white;
|
|
font-size: 2rem;
|
|
}
|
|
|
|
.nav-bottom-pad{
|
|
height:1.5rem;
|
|
margin-top:0.5rem;
|
|
}
|
|
|
|
table#files-details{
|
|
width:100%;
|
|
}
|
|
table{
|
|
border-collapse: collapse;
|
|
}
|
|
table tr{
|
|
border-bottom: 1px #c5c0c0 solid;
|
|
}
|
|
table td{
|
|
padding:0.25em;
|
|
}
|
|
tbody tr:last-child{
|
|
border:0;
|
|
}
|
|
tbody td.file-isDir{
|
|
font-style: italic;
|
|
}
|
|
tbody td.file-isDir::after{
|
|
content: '/';
|
|
}
|
|
|
|
|
|
.box-shadow-1{
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
|
}
|
|
.box-shadow-2, .box-shadow-1-active:active{
|
|
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
|
|
}
|
|
.box-shadow-3, .box-shadow-2-active:active{
|
|
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
|
|
}
|
|
|
|
.box-shadow-4, .box-shadow-3-active:active{
|
|
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
|
|
}
|
|
|
|
.box-shadow-1-active,.box-shadow-2-active,.box-shadow-3-active{
|
|
transition: box-shadow 0.3s cubic-bezier(.25,.8,.25,1);
|
|
} |