trivabble/alert.css

75 lines
1.4 KiB
CSS

.alert {
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,0.2);
display:-webkit-flex;
display:flex;
-webkit-flex-direction:column;
flex-direction:column;
-webkit-justify-content:center;
justify-content:center;
line-height:1.5em;
text-align:center
}
.alert-outer {
background:white;
color:black;
border-radius:4px;
display:-webkit-flex;
display:flex;
-webkit-flex-direction:column;
flex-direction:column;
-webkit-align-self:center;
align-self:center;
text-align:center;
box-shadow:0 0 8px black;
max-width:75%;
padding:4px;
}
.alert-content {
padding:1ex
}
.alert input[type=text], .alert input[type=password] {
border-radius:none;
box-sizing:border-box;
min-height:1.5rem;
outline:none;
width:95%;
min-width:10ex;
margin:1ex;
border:1px solid silver;
}
.alert input[type=text]:focus, .alert input[type=password]:focus {
border:1px solid #5CF;
box-shadow:0 0 1px #5CF
}
.alert input[type=button], .alert button {
margin:1px;
border-radius:0;
min-height:1.5rem;
border:1px solid silver;
padding:1ex 2ex;
background:white
}
.alert input[type=button]:active, .alert button:active {
background:#D5D5D5
}
.alert button {
margin:0.5ex;
border:1px solid gray;
background:#F1F1F1;
color:black;
border-radius:3px
}