oui-kit
Version:
> *...c'est un "kit" pour Vue.js :)*
78 lines (65 loc) • 1.46 kB
text/stylus
oui-debug() {
.debug {
position: fixed;
width: 1rem;
height: 1rem;
bottom: 1rem;
right: 1rem;
background-color: rgba(255, 0, 0, 0.33);
overflow: hidden;
border: 0.5rem rgba(255, 0, 0, 0.33) solid;
z-index: 99999;
border-radius: 2rem;
color: transparent;
white-space: pre-wrap;
font-family: var(--font-mono, monospace);
.debug-content {
display: none;
padding: 1rem;
}
&:hover, &:active, &:_active, &.-show {
border-radius: 4px;
padding: 1rem;
width: auto;
height: auto;
max-width: 80%;
max-height: 80%;
bottom: 1rem;
right: 1rem;
overflow: auto;
background: white;
border-color: red;
color: black;
.debug-content {
display: block;
}
}
}
.-bg1 {
background-color: rgba(128, 0, 128, 0.5) ;
}
.-bg2 {
background-color: rgba(43, 0, 128, 0.5) ;
}
.-bg3 {
background-color: rgba(15, 0, 128, 0.5) ;
}
.-bd1 {
border: 1px solid rgba(128, 0, 128, 0.5) ;
}
.-bd2 {
border: 1px solid rgba(43, 0, 128, 0.5) ;
}
.-bd3 {
border: 1px solid rgba(15, 0, 128, 0.5) ;
}
.-ol1 {
outline: 1px solid rgba(128, 0, 128, 0.5) ;
}
.-ol2 {
outline: 1px solid rgba(43, 0, 128, 0.5) ;
}
.-ol3 {
outline: 1px solid rgba(15, 0, 128, 0.5) ;
}
}