CSS for warning box - keep buttons on the bottom

This commit is contained in:
Stacy Kvernmo
2014-12-01 10:01:16 -06:00
parent 8db3bd5554
commit 7346780185
4 changed files with 30 additions and 12 deletions

View File

@ -9,16 +9,16 @@
/* Main CWV3 Dialog */
.cwv3_dialog {
border: 3px solid #cccccc;
background: white;
border: 3px solid #CCCCCC;
background: #FFFFFF;
max-width: 60%;
max-height: 90%;
position: fixed;
top: 25%;
left: 25%;
-webkit-box-shadow: 2px 11px 48px black;
-moz-box-shadow: 2px 11px 48px black;
box-shadow: 2px 11px 48px black;
-webkit-box-shadow: 2px 11px 48px #000;
-moz-box-shadow: 2px 11px 48px #000;
box-shadow: 2px 11px 48px #000;
overflow: hidden;
z-index: 99999;
}
@ -29,37 +29,46 @@
height: 100%;
}
.cwv3_dialog .cwv3_title {
color: white;
color: #FFFFFF;
font-weight: bold;
text-align: center;
background: red;
background: #FF0000;
}
.cwv3_dialog .cwv3_content {
height: 84%;
overflow-y: scroll;
padding: .75em;
}
.cwv3_dialog .cwv3_btns {
background: rgba(50, 50, 50, 0.7);
bottom: 0;
overflow: hidden;
padding: .45em .75em;
position: absolute;
width: 100%;
}
.cwv3_dialog .cwv3_btns a {
display: block;
width: 100%;
text-align: center;
color: white;
color: #FFFFFF;
font-weight: bold;
text-decoration: none;
padding: .35em;
}
.cwv3_dialog .cwv3_btns .cwv3_exit {
float: right;
width: 40%;
}
.cwv3_dialog .cwv3_btns .cwv3_exit a {
background-color: red;
background-color: #FF0000;
}
.cwv3_dialog .cwv3_btns .cwv3_enter {
float: left;
width: 40%;
}
.cwv3_dialog .cwv3_btns .cwv3_enter a {
background-color: #00cc33;
background-color: #00CC33;
}
/*# sourceMappingURL=cwv3.css.map */

2
css/cwv3.min.css vendored
View File

@ -1 +1 @@
.cwv3.dialog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99998}.cwv3_dialog{border:3px solid #ccc;background:#fff;max-width:60%;max-height:90%;position:fixed;top:25%;left:25%;-webkit-box-shadow:2px 11px 48px #000;-moz-box-shadow:2px 11px 48px #000;box-shadow:2px 11px 48px #000;overflow:hidden;z-index:99999}.cwv3_dialog div{padding:.25em}.cwv3_dialog .cwv3.auth,.cwv3_dialog .cwv3.denied{height:100%}.cwv3_dialog .cwv3_title{color:#fff;font-weight:700;text-align:center;background:red}.cwv3_dialog .cwv3_content{height:84%;overflow-y:scroll}.cwv3_dialog .cwv3_btns{overflow:hidden}.cwv3_dialog .cwv3_btns a{display:block;width:100%;text-align:center;color:#fff;font-weight:700;text-decoration:none}.cwv3_dialog .cwv3_btns .cwv3_exit{float:right;width:40%}.cwv3_dialog .cwv3_btns .cwv3_exit a{background-color:red}.cwv3_dialog .cwv3_btns .cwv3_enter{float:left;width:40%}.cwv3_dialog .cwv3_btns .cwv3_enter a{background-color:#0c3}
.cwv3.dialog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99998}.cwv3_dialog{border:3px solid #CCC;background:#FFF;max-width:60%;max-height:90%;position:fixed;top:25%;left:25%;-webkit-box-shadow:2px 11px 48px #000;-moz-box-shadow:2px 11px 48px #000;box-shadow:2px 11px 48px #000;overflow:hidden;z-index:99999}.cwv3_dialog div{padding:.25em}.cwv3_dialog .cwv3.auth,.cwv3_dialog .cwv3.denied{height:100%}.cwv3_dialog .cwv3_title{color:#FFF;font-weight:700;text-align:center;background:red}.cwv3_dialog .cwv3_content{height:84%;overflow-y:scroll;padding:.75em}.cwv3_dialog .cwv3_btns{background:rgba(50,50,50,.7);bottom:0;overflow:hidden;padding:.45em .75em;position:absolute;width:100%}.cwv3_dialog .cwv3_btns a{display:block;width:100%;text-align:center;color:#FFF;font-weight:700;text-decoration:none;padding:.35em}.cwv3_dialog .cwv3_btns .cwv3_exit{float:right;width:40%}.cwv3_dialog .cwv3_btns .cwv3_exit a{background-color:red}.cwv3_dialog .cwv3_btns .cwv3_enter{float:left;width:40%}.cwv3_dialog .cwv3_btns .cwv3_enter a{background-color:#0C3}

View File

@ -40,10 +40,17 @@
.cwv3_content{
height: 84%;
overflow-y: scroll;
padding: .75em;
}
.cwv3_btns{
background: $button-background;
bottom: 0;
overflow: hidden;
padding: .45em .75em;
position: absolute;
width: 100%;
a{
display: block;
width: 100%;
@ -51,6 +58,7 @@
color: $button-txt-color;
font-weight: bold;
text-decoration: none;
padding: .35em;
}
.cwv3_exit{

View File

@ -3,6 +3,7 @@
///
$button-txt-color : #FFFFFF;
$button-background : rgba(50,50,50,.7);
$exit-button-color : #FF0000;
$enter-button-color : #00CC33;
@ -10,4 +11,4 @@ $title-background : #FF0000;
$title-font-color : #FFFFFF;
$dialog-background : #FFFFFF;
$dialog-border-color : #CCCCCC;
$dialog-border-color : #CCCCCC;