ScoDoc/app/static/css/table_editor.css

93 lines
1.6 KiB
CSS
Raw Normal View History

/* table_editor, par Sébastien L.
*/
body {
font-family: Arial, Helvetica, sans-serif;
}
/***************************/
/* Le tableau */
/***************************/
.tableau {
display: grid;
grid-auto-rows: minmax(24px, auto);
}
.entete {
background: #09c;
font-weight: bold;
}
.tableau>div {
padding: 4px;
border: 1px solid #999;
grid-column: var(--x) / span var(--nbX);
grid-row: var(--y) / span var(--nbY);
}
/***************************/
/* Attente */
/***************************/
.wait {
position: fixed;
top: 32px;
left: 50%;
height: 4px;
width: 32px;
margin-left: -16px;
background: #424242;
animation: attente 0.4s infinite alternate;
display: none;
}
.go {
display: block;
}
@keyframes attente {
100% {
transform: translateY(-16px) rotate(360deg);
}
}
/***************************/
/* Système de modification */
/***************************/
.modifOnOff {
position: relative;
display: table;
margin: 16px;
padding-right: 8px;
cursor: pointer;
}
.modifOnOff::before {
content: '';
width: 40px;
height: 20px;
background: #c90;
position: absolute;
top: 0;
left: 100%;
border-radius: 20px;
transition: 0.2s;
}
.modifOnOff::after {
content: '';
width: 16px;
height: 16px;
background: #FFF;
position: absolute;
top: 2px;
left: calc(100% + 2px);
border-radius: 100%;
transition: 0.2s;
}
.modifOnOff.active::before {
background: #9c0;
}
.modifOnOff.active::after {
transform: translateX(20px);
}