/
build.css
10 lines (10 loc) · 7.04 KB
/
build.css
1
2
3
4
5
6
7
8
9
10
*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:'Marcellus', serif;font-size:16px}a{text-decoration:none;color:#963535}a:hover,a:focus{text-decoration:underline}.btn{cursor:pointer;border:none;background-color:#963535;color:white;font-size:1rem;font-family:'Marcellus', serif;padding:0.5rem 1rem;margin:0 0.75rem 0.25rem 0;border-bottom:4px solid #832e2e}.btn:hover,.btn:active{position:relative;top:1px;background-color:#832e2e;border-bottom:3px solid #702828}.btn[disabled]{background-color:#777;border-bottom:4px solid #666;color:#666}.btn[disabled]:hover,.btn[disabled]:active{top:0;background-color:#777;border-bottom:4px solid #666}.btn--block{display:block}label{display:block}input[type="text"],textarea{display:block;width:100%;background-color:#dadada;font-size:1rem;font-family:'Marcellus', serif;padding:0.5rem;border:none}input[type="text"]:hover,input[type="text"]:focus,textarea:hover,textarea:focus{outline:none}.alert{margin:0}.alert--error{color:red}.alert--success{color:green}.area{position:relative;display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;border-radius:8px;background-color:rgba(0,128,0,0.1)}.area__slot{margin-left:0.25rem;height:150px;width:100px;background-color:rgba(0,0,0,0.1);border-radius:8px}.area__slot:first-of-type{margin-left:0}.stack__counter,.area__title{position:absolute;top:0;left:0;background-color:rgba(0,0,0,0.8);color:white;padding:0.5rem;border-radius:4px}.container{display:-ms-flexbox;display:flex;height:calc(100vh - 2rem)}.boards{-ms-flex-positive:1;flex-grow:1}.sidebar{width:200px;background-color:black;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.actions{margin:auto 0;text-align:center;-ms-flex-positive:1;flex-grow:1;padding:1rem;color:white;border-top:1px solid white;border-bottom:1px solid white}.actions h2{margin-top:0;margin-bottom:0.5rem}.actions hr{margin:1rem 0;border:none;background-color:white;height:1px}.actions .btn{width:100%;display:block;border:none;background-color:white;color:black;margin-bottom:0.5rem;padding:0.25rem;font-size:0.825rem}.chat{width:100%;height:50%;margin:auto;-ms-flex-positive:0;flex-grow:0;position:relative}.chat__messages{list-style-type:none;margin:0;padding:0.5rem;height:calc(50vh - 1.5rem);overflow-y:scroll}.chat__messages li{color:white;padding:0.25rem}.chat__messages li:last-of-type{margin-bottom:1rem}.chat__messages li.server-msg{color:#CCC;font-style:italic}.chat__form{display:block;position:absolute;bottom:0;width:100%}.chat__input,.chat__btn{display:inline-block;border:none;border-top:1px solid white;border-bottom:1px solid white;background-color:black;color:white;padding:0.25rem}.chat__input:focus,.chat__btn:focus{outline:none}.chat__input{width:80%}.chat__btn{width:20%;border-left:1px solid white}.chat__btn:hover,.chat__btn:active{background-color:#555;cursor:pointer}.boards{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:end;justify-content:flex-end}
.board{width:100%;height:calc(50vh - 1rem);padding:1rem;display:-ms-flexbox;display:flex}.board *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.board__player{margin:auto}.board__areas{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around}.board--opponent{border-bottom:1px dashed #CCC}.board--you .board__areas{-ms-flex-direction:column-reverse;flex-direction:column-reverse}
.card{display:inline-block;vertical-align:top;width:100px;height:136px;position:relative;background-image:url("../img/back-standard.jpg");background-size:100px 136px}
.die{position:relative;width:29px;height:29px;display:inline-block;margin-right:2px}.die.die--exhausted::after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:2px;background-color:rgba(0,0,0,0.6)}.die.die--rolling{animation:diceRoll 0.25s infinite linear}.die--illbasic{background-image:url("../img/dice/illbasic.jpg")}.die--illclass{background-image:url("../img/dice/illclass.jpg")}.die--illpower{background-image:url("../img/dice/illpower.jpg")}.die--natbasic{background-image:url("../img/dice/natbasic.jpg")}.die--natclass{background-image:url("../img/dice/natclass.jpg")}.die--natpower{background-image:url("../img/dice/natpower.jpg")}.die--chabasic{background-image:url("../img/dice/chabasic.jpg")}.die--chaclass{background-image:url("../img/dice/chaclass.jpg")}.die--chapower{background-image:url("../img/dice/chapower.jpg")}.die--cerbasic{background-image:url("../img/dice/cerbasic.jpg")}.die--cerclass{background-image:url("../img/dice/cerclass.jpg")}.die--cerpower{background-image:url("../img/dice/cerpower.jpg")}@keyframes diceRoll{0%{top:0}25%{top:-0.75rem;transform:rotate(90deg)}50%{top:-0.25rem;transform:rotate(180deg)}75%{top:0;transform:rotate(270deg)}100%{top:0;transform:rotate(359deg)}}
.stack{display:inline-block;vertical-align:top;width:100px;height:136px;position:relative;background-image:url("../img/back-standard.jpg");background-size:100px 136px}.stack--conjurations{background-image:url("../img/back-conjuration.jpg")}.stack--empty{background-image:none}
.card-browser{position:absolute;width:100vw;top:50%;margin-top:-226px;left:0;overflow-x:scroll;z-index:99}.card-browser__list{margin:0;padding:0;list-style-type:none;width:9960px;display:block;height:452px}.card-browser__item{display:inline-block}.card-browser__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,0.8);z-index:98}.card-browser .card{width:332px;height:452px;background-size:332px 452px}
.context-menu{position:absolute;z-index:99;background:rgba(0,0,0,0.85);border:1px solid white;color:white}.context-menu__list,.context-menu__sublist{margin:0;padding:0;list-style-type:none;min-width:7.5rem}.context-menu__item{padding:0.25rem 0.5rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative}.context-menu__item:hover{background-color:black}.context-menu__item:hover .context-menu__sublist{display:block}.context-menu__sublist{display:none;position:absolute;left:100%;top:0;background:rgba(0,0,0,0.85);border:1px solid white}
.deck-loader{-ms-flex-positive:1;flex-grow:1}label{display:block}#decklist,#prebuilt{margin-bottom:1rem}
.infobar{height:2rem;background-color:black;color:white;padding:0.375rem 1.5rem;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.infobar__playerlist,.infobar__title,.infobar__round{-ms-flex:1;flex:1}.infobar__title{font-size:1rem;font-weight:normal;margin:0 auto;text-align:center}.infobar__round{text-align:right}
.lobby h1{text-align:center;margin-bottom:0}.lobby .subheading{display:block;text-align:center;font-size:1.25rem;letter-spacing:1.25rem;padding-left:1.25rem}.lobby .container{display:block;max-width:40rem;margin:auto}.lobby .lobby__games{background-color:black;margin:1rem 0;min-height:10rem}.lobby .lobby__game-list{margin:0;padding:0;list-style-type:none}.lobby .lobby__games-none{color:white;padding:0.5rem;margin:0}.lobby .lobby__game{color:white;padding:0.5rem}.lobby .lobby__game.selected{background-color:#555}