2 lines
No EOL
21 KiB
CSS
2 lines
No EOL
21 KiB
CSS
html *{margin:0;font-size:14px}body{margin:0;font-family:Oswald,sans-serif;font-weight:800;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;height:100vh;width:100vw}body div#root,body div.App{height:100%;width:100%}body div.App{background-color:#dcdc34}body aside{background-color:#3c013f}body main{background-color:#95acae;font-weight:100}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}div.main-wrapper{display:flex;justify-content:flex-start;flex-flow:column nowrap;height:100%;width:100%}div.main-wrapper div.NavBar{max-height:10vh;min-height:5vh}div.main-wrapper div.content-wrapper{display:flex;justify-content:flex-start;height:100%;width:100%}div.main-wrapper div.content-wrapper aside{display:flex;flex-direction:column;flex-grow:1;max-width:20vw}div.main-wrapper div.content-wrapper aside a{display:block}div.main-wrapper div.content-wrapper main{display:block;max-width:80vw;width:100%;height:100%}div.NavBar{display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center;background-color:#6f3e68;color:#dae1b7}div.NavBar p{font-size:1.4em}div.NavBar a{text-decoration:none;color:inherit}aside{color:#f2ce3d}aside,aside nav{display:flex;flex-flow:column nowrap}aside nav{align-items:stretch}aside h3{font-size:130%;margin:.2em auto;text-transform:capitalize}aside input{display:block;margin:.2em 0 .2em auto}aside div.nav__section{border:.25em solid hsla(0,0%,39.2%,.5);margin:.5em;padding:.75em .5em}aside p.nav__section__label{font-size:110%;margin-bottom:.5em;text-decoration:none}aside p.nav__section__label:hover{cursor:pointer;text-decoration:underline}div.Game{display:grid;grid-template-columns:1fr 2fr 1fr;height:100%;width:100%;background:radial-gradient(farthest-corner at 55% 40%,#96c8dc 0,#61a6c2 65%,#466478 90%,#28505a 100%)}div.Game__board-container{display:flex;flex-flow:column nowrap;justify-content:space-evenly;max-width:50vw;max-height:100vh}div.Game__board{background:radial-gradient(farthest-corner at 55% 40%,#f4e678 0,#eab24e 65%,#c8a05a 90%,#c88c5a 100%);background-size:cover;box-shadow:-2vmin 4vmin 3vmin rgba(145,92,23,.5);display:grid;margin:0 auto;z-index:1}div.Game__board--size-9{grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr)}div.Game__board--size-9 div.board__point{width:9vmin;height:9vmin}@media only screen and (min-width:570px){div.Game__board--size-9 div.board__point{height:7.5vh;width:7.5vh}}div.Game__board--size-13{grid-template-columns:repeat(13,1fr);grid-template-rows:repeat(13,1fr)}div.Game__board--size-13 div.board__point{width:7vmin;height:7vmin}@media only screen and (min-width:570px){div.Game__board--size-13 div.board__point{height:5vh;width:5vh}}div.Game__board--size-19{grid-template-columns:repeat(19,1fr);grid-template-rows:repeat(19,1fr)}div.Game__board--size-19 div.board__point{width:5vmin;height:5vmin}@media only screen and (min-width:590px){div.Game__board--size-19 div.board__point{height:2.6vw;width:2.6vw;max-width:3.5vh;max-height:3.5vh}}div.board__point{background:conic-gradient(#000 0,transparent 1%,transparent 24%,#000 25%,transparent 26%,transparent 49%,#000 50%,transparent 51%,transparent 74%,#000 75%,transparent 76%,transparent 99%,#000 100%);border-radius:50% solid #000;color:#000;margin:auto;padding:0;vertical-align:middle}div.board__point--top{background:conic-gradient(transparent 24%,#000 25%,transparent 26%,transparent 49%,#000 50%,transparent 51%,transparent 74%,#000 75%,transparent 76%)}div.board__point--bottom{background:conic-gradient(#000 0,transparent 1%,transparent 24%,#000 25%,transparent 26%,transparent 74%,#000 75%,transparent 76%,transparent 99%,#000 100%)}div.board__point--left{background:conic-gradient(#000 0,transparent 1%,transparent 24%,#000 25%,transparent 26%,transparent 49%,#000 50%,transparent 51%,transparent 99%,#000 100%)}div.board__point--right{background:conic-gradient(#000 0,transparent 1%,transparent 49%,#000 50%,transparent 51%,transparent 74%,#000 75%,transparent 76%,transparent 99%,#000 100%)}div.board__point--top.board__point--left{background:conic-gradient(transparent 24%,#000 25%,transparent 26%,transparent 49%,#000 50%,transparent 51%)}div.board__point--top.board__point--right{background:conic-gradient(transparent 49%,#000 50%,transparent 51%,transparent 74%,#000 75%,transparent 76%)}div.board__point--bottom.board__point--left{background:conic-gradient(#000 0,transparent 1%,transparent 24%,#000 25%,transparent 26%,transparent 99%,#000 100%)}div.board__point--bottom.board__point--right{background:conic-gradient(#000 0,transparent 1%,transparent 74%,#000 75%,transparent 76%,transparent 99%,#000 100%)}div.board__point__stone{width:85%;height:85%;border-radius:50%;margin:auto;vertical-align:middle;display:flex;flex-direction:column;justify-content:center}div.board__point div.board__point__stone div.board__point__dot{width:35%;height:35%;border-radius:50%;margin:auto;vertical-align:middle}div.board__point__stone[data-stone=white]{background:radial-gradient(farthest-side at 55% 40%,#fff 0,#c8c8c8 65%,#646464 90%,#443200 100%);box-shadow:-.25vmin .5vmin .5vmin rgba(145,92,23,.5)}div.board__point__stone[data-stone=black]{background-color:#000;background:radial-gradient(farthest-side at 55% 40%,#dcdcdc 0,#3c3c3c 45%,#0f0f0f 90%,#050500 100%);box-shadow:-.25vmin .5vmin .5vmin rgba(145,92,23,.75)}div.player-container{align-items:flex-end;display:flex;flex:5 1;height:9vmin;justify-content:space-around;margin:1em;width:100%}div.player-container:last-child{align-items:flex-start;flex-direction:row-reverse;justify-self:flex-end}@media only screen and (min-width:500px){div.player-container{height:14vh}}div.player-container div.player-container__bowl{align-items:center;background:radial-gradient(farthest-corner at 48% 54%,rgba(30,5,0,.25) 0,rgba(30,5,0,.45) 2%,rgba(30,5,0,.75) 32%,rgba(0,0,0,.85) 35%,#743011 48%,#8c3c28 52%,#642805 55%,#743011 58%,#8c3c28 65%,#642805 80%,#501400 90%);background-color:#743011;border-radius:50%;box-shadow:-1vmin 2vmin 1.5vmin rgba(83,53,35,.61);display:flex;height:15vh;justify-content:center;margin:4vh;order:-1;width:15vh}@media only screen and (min-width:570px){div.player-container div.player-container__bowl{height:10vh;margin:3vh;width:10vh}}div.player-container div.player-container__bowl[data-turn]:hover p{background-color:rgba(0,0,0,.3);color:#fff;cursor:-webkit-grab;cursor:grab;display:block;padding:.5em}div.player-container div.player-container__bowl[data-turn]{box-shadow:0 0 3vh 3vh #ffaf02}div.player-container div.player-container__bowl[data-turn]+.player-container__name-space .player-container__caps-space:hover :first-child{background-color:rgba(0,0,0,.7);cursor:-webkit-grab;cursor:grab;display:block;padding:.5em;position:absolute}div.player-container div.player-container__bowl p{display:none}div.player-container__caps-space{align-items:center;background:radial-gradient(farthest-side at 49% 52%,#964b32 0,#743011 35%,#743011 64%,#501400 65%,#af8c5f 70%,#783228 80%,#501400 95%,#af8c5f 100%);border-radius:50%;box-shadow:-.5vmin 1vmin 1vmin rgba(83,53,35,.61);color:#fff;display:flex;height:10vh;justify-content:center;margin:1vh;width:10vh}@media only screen and (min-width:570px){div.player-container__caps-space{height:7vh;margin:2vh;width:7vh}}div.player-container__caps-space :first-child{display:none}div.player-container__name-space{align-items:center;flex-direction:column;display:flex;order:1}div.player-container__name-space h4{color:#fff0e6;background-color:rgba(0,0,0,.7);padding:.25em;font-size:120%;z-index:1}div.Home{height:100%;width:100%;display:flex;flex-flow:row wrap;align-items:flex-start;justify-content:flex-start;background-color:#444;overflow:scroll}div.RoomButton{display:block;padding:1vw}div.RoomButton .RoomButton__room-name{text-transform:capitalize}div.Loading{background-color:#eab24e;display:flex;flex-flow:row wrap;height:6vw;left:47vw;position:absolute;top:45vh;width:6vw}div.Loading div.point{height:1vw;width:1vw;border-radius:50%;padding:.25vw}div.Loading #a-1{-webkit-animation-name:white-stone--corner;animation-name:white-stone--corner;-webkit-animation-delay:-2.75s;animation-delay:-2.75s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #a-1,div.Loading #a-2{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #a-2{background-color:#000;-webkit-animation-name:black-stone;animation-name:black-stone;-webkit-animation-delay:-1s;animation-delay:-1s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #a-3{background-color:#fff;-webkit-animation-name:white-stone;animation-name:white-stone;-webkit-animation-delay:-2.25s;animation-delay:-2.25s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #a-3,div.Loading #a-4{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #a-4{-webkit-animation-name:black-stone--corner;animation-name:black-stone--corner;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #b-1{background-color:#000;-webkit-animation-name:black-stone;animation-name:black-stone;-webkit-animation-delay:-1.5s;animation-delay:-1.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #b-1,div.Loading #b-2{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #b-2{-webkit-animation-name:white-stone--center;animation-name:white-stone--center;-webkit-animation-delay:-3.25s;animation-delay:-3.25s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #b-3{background-color:#000;-webkit-animation-name:black-stone--center;animation-name:black-stone--center;-webkit-animation-delay:-.5s;animation-delay:-.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #b-3,div.Loading #b-4{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #b-4{background-color:#fff;-webkit-animation-delay:-1.75s;animation-delay:-1.75s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #b-4,div.Loading #c-1{-webkit-animation-name:white-stone;animation-name:white-stone}div.Loading #c-1{-webkit-animation-delay:-3.75s;animation-delay:-3.75s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #c-1,div.Loading #c-2{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #c-2{background-color:#000;-webkit-animation-name:black-stone--center;animation-name:black-stone--center;-webkit-animation-delay:-2.5s;animation-delay:-2.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #c-3{background-color:#fff;-webkit-animation-name:white-stone--center;animation-name:white-stone--center;-webkit-animation-delay:-1.25s;animation-delay:-1.25s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #c-3,div.Loading #c-4{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #c-4{-webkit-animation-name:black-stone;animation-name:black-stone;-webkit-animation-delay:-3.5s;animation-delay:-3.5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #d-1{background-color:#000;-webkit-animation-name:black-stone--corner;animation-name:black-stone--corner;-webkit-animation-delay:-2s;animation-delay:-2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #d-1,div.Loading #d-2{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #d-2{background-color:#fff;-webkit-animation-name:white-stone;animation-name:white-stone;-webkit-animation-delay:-.25s;animation-delay:-.25s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #d-3{-webkit-animation-name:black-stone;animation-name:black-stone;-webkit-animation-delay:-3s;animation-delay:-3s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}div.Loading #d-3,div.Loading #d-4{-webkit-animation-duration:4s;animation-duration:4s}div.Loading #d-4{background-color:#fff;-webkit-animation-name:white-stone--corner;animation-name:white-stone--corner;-webkit-animation-delay:-.75s;animation-delay:-.75s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}@-webkit-keyframes black-stone{0%{background:#000}67.5%{background:#000}70%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}99.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}}@keyframes black-stone{0%{background:#000}67.5%{background:#000}70%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}99.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}}@-webkit-keyframes white-stone{0%{background:#fff}60%{background:#fff}62.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}92.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}95%{background:#fff}}@keyframes white-stone{0%{background:#fff}60%{background:#fff}62.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}92.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}95%{background:#fff}}@-webkit-keyframes black-stone--corner{0%{background:#000}52.5%{background:#000}55%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}99%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}}@keyframes black-stone--corner{0%{background:#000}52.5%{background:#000}55%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}99%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}}@-webkit-keyframes white-stone--corner{0%{background:#fff}47.5%{background:#fff}50%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}95%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}97.5%{background:#fff}}@keyframes white-stone--corner{0%{background:#fff}47.5%{background:#fff}50%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}95%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}97.5%{background:#fff}}@-webkit-keyframes black-stone--center{0%{background:#000}75.5%{background:#000}77.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}99%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}}@keyframes black-stone--center{0%{background:#000}75.5%{background:#000}77.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}99%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}}@-webkit-keyframes white-stone--center{0%{background:#fff}72.5%{background:#fff}75%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}97.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}to{background:#fff}}@keyframes white-stone--center{0%{background:#fff}72.5%{background:#fff}75%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}97.5%{background:repeating-linear-gradient(0deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent),repeating-linear-gradient(90deg,transparent,transparent 45%,#000 50%,transparent 55%,transparent)}to{background:#fff}}div.Room{align-items:normal;background:radial-gradient(farthest-corner at 55% 40%,#bd8364 0,#af7150 65%,#965a41 90%,#7d4128 100%);display:flex;flex-flow:column nowrap;justify-content:stretch;overflow:scroll;width:100%;height:100%}div.Room div.Room__heading{align-self:center;height:100%;position:-webkit-sticky;position:sticky;top:1em;z-index:3}div.Room div.Room__heading span.error--action{padding:1em;background-color:#a33;color:#fff}div.Room div.Room__game-container{min-height:100%;min-width:100%;justify-self:flex-start;align-self:flex-start;display:flex;flex-flow:row wrap}div.Room div.Room__message-container{height:100%;justify-self:flex-end;align-self:flex-end}div.GameButton{align-items:stretch;box-shadow:-2vmin 4vmin 2vmin rgba(83,53,35,.81);display:flex;flex-flow:column nowrap;height:20vh;justify-content:space-around;margin:1vw;width:20vh}div.GameButton__seat{background-color:red;height:10%;margin:0 auto;width:50%}div.GameButton__seat.GameButton__seat--black{border:rgba(83,53,35,.81);border-radius:5vw 5vw 0 0}div.GameButton__seat.GameButton__seat--white{border:transparent;border-radius:0 0 5vw 5vw}div.GameButton__table{height:80%;margin:0;width:100%}div.GameButton__table__meta{display:flex;flex-flow:column nowrap;height:100%;justify-content:space-between;width:100%;z-index:2}div.GameButton__table__meta *{z-index:2}div.GameButton__table__image{align-items:center;background:radial-gradient(farthest-corner at 55% 40%,#96c8dc 0,#61a6c2 65%,#466478 100%);border-top:.1vw solid #96c8dc;border-right:.05vw solid #61a6c2;border-radius:.3vw;display:flex;flex-flow:column nowrap;height:100%;justify-content:space-between;position:relative;top:-100%;width:100%;z-index:1}div.GameButton__table__image div.table__game-board{background:radial-gradient(farthest-corner at 55% 40%,#f4e678 0,#eab24e 65%,#c8a05a 90%,#c88c5a 100%);height:60%;width:60%;display:flex;align-items:center;justify-content:center}div.GameButton__table__image div.table__game-board div.table__game-board--grid{background:repeating-linear-gradient(0deg,#000,transparent .75%,transparent 4.25%,#000 5%),repeating-linear-gradient(90deg,#000,transparent .75%,transparent 4.25%,#000 5%);height:94%;width:94%}div.table__player-area{height:20%;width:60%}div.table__player-area div.table__player-bowl{background:radial-gradient(farthest-corner at 48% 54%,#1e0500 0,#1e0500 2%,#1e0500 32%,#000 35%,#743011 48%,#8c3c28 52%,#642805 55%,#743011 58%,#8c3c28 65%,#642805 80%,#501400 90%);border-radius:50%;height:100%}div.table__player-area div.table__player-bowl--white{margin:auto auto auto 75%}div.table__player-area div.table__player-bowl--black{margin:auto 75% auto auto}div.GameButton__player-data{color:#fff0e6;background-color:rgba(0,0,0,.7);padding:.25em;display:flex;justify-content:space-around;max-width:100%}div.GameButton__player-data.GameButton__player-data--white{margin:0 5vw 1vw .5vw}div.GameButton__player-data.GameButton__player-data--black{margin:1vw .5vw 0 5vw}.GameButton__link{color:#fff0e6;background-color:rgba(0,0,0,.7);padding:.25em;margin:0 auto;text-decoration:none}.GameButton__link:hover{text-decoration:underline}span.FormError{color:#a33}
|
|
/*# sourceMappingURL=main.1d648088.chunk.css.map */ |