1754 lines
33 KiB
CSS
1754 lines
33 KiB
CSS
div.analysis_menu {
|
|
text-align: center;
|
|
border-top: 1px solid #c0c0c0;
|
|
height: 21px;
|
|
}
|
|
div.analysis_menu > a {
|
|
background: #f0f0f0;
|
|
border: 1px solid #c0c0c0;
|
|
padding: 2px 8px;
|
|
height: 16px;
|
|
line-height: 16px;
|
|
margin: -1px 0 0 -5px;
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
}
|
|
div.analysis_menu > a.active {
|
|
background-color: #eee;
|
|
border-top: 1px solid #eee;
|
|
}
|
|
body.base div.analysis_menu > a.active {
|
|
border-bottom: 2px solid #d85000;
|
|
}
|
|
div.analysis_panels {
|
|
margin-top: -10px;
|
|
}
|
|
div.analysis_panels > div {
|
|
height: 210px;
|
|
max-height: 210px;
|
|
display: none;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
text-align: left;
|
|
}
|
|
div.analysis_panels > div.active {
|
|
display: block;
|
|
}
|
|
div.no_computer div.analysis_menu .computer_analysis {
|
|
display: none;
|
|
}
|
|
div.analysis_panels .crosstable table {
|
|
margin-top: 60px;
|
|
}
|
|
div.game_analysis {
|
|
padding: 10px;
|
|
width: 492px;
|
|
}
|
|
.view_game_analysis {
|
|
display: none;
|
|
}
|
|
.future_game_analysis {
|
|
margin-top: 84px;
|
|
text-align: center;
|
|
}
|
|
form.better_analysis {
|
|
margin-top: 20px;
|
|
width: 512px;
|
|
text-align: center;
|
|
}
|
|
.underboard_content .quote.panel.active {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.future_game_analysis .button {
|
|
display: inline-block;
|
|
line-height: 24px;
|
|
}
|
|
div.fen_pgn > div {
|
|
margin: 0.6em 0;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
div.fen_pgn a {
|
|
color: #3893E8;
|
|
}
|
|
div.fen_pgn .pgn {
|
|
white-space: pre-wrap;
|
|
font-family: monospace;
|
|
}
|
|
div.fen_pgn strong {
|
|
font-size: 1.1em;
|
|
display: inline-block;
|
|
margin-right: 10px;
|
|
}
|
|
div.fen_pgn .pgn_options div {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
margin-left: 5px;
|
|
}
|
|
div.fen_pgn .pgn_options a {
|
|
flex: 0 0 50%;
|
|
line-height: 1.6em;
|
|
}
|
|
div.game_control {
|
|
flex: 0 0 36px;
|
|
font-size: 1.3em;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
div.game_control button,
|
|
div.game_control a {
|
|
background: none;
|
|
border: none;
|
|
padding: 0 12px;
|
|
outline: none;
|
|
line-height: 36px;
|
|
margin: 0; /* safari */
|
|
}
|
|
div.game_control button.hidden {
|
|
visibility: hidden;
|
|
}
|
|
div.game_control button.disabled {
|
|
opacity: 0.5;
|
|
cursor: default;
|
|
}
|
|
div.game_control a:hover,
|
|
div.game_control button:hover:not(.disabled) {
|
|
background: rgba(56,147,232,0.8);
|
|
color: #fff;
|
|
}
|
|
div.game_control button:active,
|
|
div.game_control button.active {
|
|
background: #3893E8!important;
|
|
color: #fff;
|
|
}
|
|
div.game_control .features {
|
|
white-space: nowrap; /* safari */
|
|
}
|
|
div.game_control .jumps {
|
|
display: flex;
|
|
}
|
|
div.game_control .jumps button:first-child,
|
|
div.game_control .jumps button:last-child {
|
|
font-size: 0.7em;
|
|
padding: 0 5px;
|
|
}
|
|
div.game_control .jumps button:nth-child(2) {
|
|
padding: 0 10px 0 14px;
|
|
}
|
|
div.game_control .jumps button:nth-child(3) {
|
|
padding: 0 14px 0 10px;
|
|
}
|
|
div.lichess_game div.lichess_ground {
|
|
position: relative;
|
|
margin-bottom: -36px;
|
|
}
|
|
div.eval_gauge {
|
|
position: absolute;
|
|
right: -14px;
|
|
top: 0;
|
|
width: 14px;
|
|
height: 100%;
|
|
background: #fff;
|
|
background-size: 100% 100%;
|
|
border-radius: 0 5px 5px 0;
|
|
overflow: hidden;
|
|
}
|
|
div.eval_gauge.reverse {
|
|
transform: rotateX(180deg);
|
|
}
|
|
div.eval_gauge::after {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
box-shadow: 0 0 5px rgba(0,0,0,0.7) inset;
|
|
border-radius: 0 5px 5px 0;
|
|
}
|
|
div.eval_gauge tick {
|
|
position: absolute;
|
|
top: -1px;
|
|
left: 0;
|
|
width: 100%;
|
|
border-bottom: 2px ridge #eee;
|
|
opacity: 0.4;
|
|
}
|
|
div.eval_gauge tick.zero {
|
|
top: 0;
|
|
opacity: 1;
|
|
border-bottom: 7px solid #dc322f!important;
|
|
margin-top: -3px;
|
|
opacity: 0.45;
|
|
}
|
|
div.eval_gauge .black {
|
|
width: 100%;
|
|
height: 50%;
|
|
background: #888;
|
|
border-radius: 0 5px 0 0;
|
|
transition: height 1s;
|
|
}
|
|
div.gauge_displayed div.lichess_game div.lichess_ground {
|
|
padding-left: 19px;
|
|
}
|
|
div.gauge_displayed .fork {
|
|
margin-left: 7px;
|
|
}
|
|
.pocket.top {
|
|
margin: 0;
|
|
border-radius: 3px 3px 0 0;
|
|
}
|
|
.pocket.bottom {
|
|
margin: 0;
|
|
border-radius: 0 0 3px 3px;
|
|
}
|
|
.areplay .opening_box {
|
|
padding: 5px;
|
|
border-bottom: 1px solid #ccc;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
background: #eaeaea;
|
|
font-family: 'Roboto';
|
|
}
|
|
.areplay .chapter-name {
|
|
padding: 5px;
|
|
border-bottom: 1px solid #ccc;
|
|
background: #eaeaea;
|
|
font-family: 'Roboto';
|
|
line-height: 1.2em;
|
|
text-align: center;
|
|
}
|
|
.pv_box .pv {
|
|
height: 2em;
|
|
line-height: 2em;
|
|
border: 1px solid #ccc;
|
|
border-bottom: 0;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
.pv_box .pv[data-uci]:hover {
|
|
background: rgba(191, 231, 255, 0.7);
|
|
cursor: pointer;
|
|
}
|
|
.pv_box .pv strong {
|
|
display: inline-block;
|
|
width: 34px;
|
|
text-align: center;
|
|
}
|
|
.pv_box .pv span {
|
|
margin-left: 4px;
|
|
font-family: 'ChessSansPiratf', sans-serif;
|
|
}
|
|
body.piece_letter .pv_box .pv span {
|
|
font-family: 'Noto Sans';
|
|
}
|
|
.ceval_box {
|
|
flex: 0 0 38px;
|
|
border: 1px solid #ccc;
|
|
border-bottom: 0;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: stretch;
|
|
}
|
|
.ceval_box .switch {
|
|
flex: 0 1 40px;
|
|
margin-right: 8px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.ceval_box pearl {
|
|
flex: 0 0 75px;
|
|
line-height: 40px;
|
|
font-size: 2em;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
background: #e0e0e0;
|
|
}
|
|
.ceval_box .engine {
|
|
opacity: 0.7;
|
|
flex: 1 0;
|
|
margin: 5px 0 0 5px;
|
|
}
|
|
.ceval_box .native {
|
|
margin-left: 5px;
|
|
text-transform: uppercase;
|
|
color: #759900;
|
|
}
|
|
.ceval_box .asmjs {
|
|
margin-left: 5px;
|
|
text-transform: uppercase;
|
|
}
|
|
.ceval_box .cloud {
|
|
margin-left: 4px;
|
|
background: rgba(117, 153, 0, 0.7);
|
|
color: #fff;
|
|
padding: 0px 3px;
|
|
border-radius: 3px;
|
|
text-transform: uppercase;
|
|
font-size: 9px;
|
|
}
|
|
.ceval_box .engine .info {
|
|
display: block;
|
|
font-size: 10px;
|
|
white-space: nowrap;
|
|
}
|
|
.ceval_box .deeper {
|
|
color: #3893e8;
|
|
margin-left: 4px;
|
|
}
|
|
.ceval_box .deeper::before {
|
|
font-size: 12px;
|
|
vertical-align: -2px;
|
|
}
|
|
.ceval_box help {
|
|
opacity: 0.7;
|
|
flex: 1 0;
|
|
margin: 5px;
|
|
font-size: 0.9em;
|
|
white-space: nowrap;
|
|
}
|
|
.ceval_box .bar {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 3px;
|
|
top: 0px;
|
|
}
|
|
@keyframes bar-anim {
|
|
from { background-position: 0 0; }
|
|
to { background-position: 100000px 0; }
|
|
}
|
|
.ceval_box .bar span {
|
|
display: block;
|
|
height: 3px;
|
|
width: 0;
|
|
background: #759900;
|
|
transition: width 1s;
|
|
}
|
|
.ceval_box .bar span.threat {
|
|
background: #dc322f;
|
|
}
|
|
.ceval_box.computing .bar span {
|
|
background-image: url(../images/bar-highlight.png);
|
|
animation: bar-anim 1000s linear infinite;
|
|
}
|
|
.ceval_box .show-threat {
|
|
position: absolute;
|
|
right: -41px;
|
|
top: -1px;
|
|
display: block;
|
|
width: 40px;
|
|
height: 40px;
|
|
box-sizing: border-box;
|
|
/* background: #fff; */
|
|
border: 1px solid #ccc;
|
|
border-left: 0;
|
|
border-radius: 0 5px 5px 0;
|
|
text-align: center;
|
|
font-size: 17px;
|
|
line-height: 36px;
|
|
}
|
|
.ceval_box .show-threat:hover:not(.hidden) {
|
|
background: #3893E8;
|
|
color: #fff;
|
|
}
|
|
.ceval_box .show-threat.active {
|
|
background: #dc322f;
|
|
color: #fff;
|
|
}
|
|
.ceval_box .show-threat.hidden {
|
|
opacity: 0.3;
|
|
cursor: default;
|
|
}
|
|
|
|
.fork {
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 91px;
|
|
width: 130px;
|
|
background: #fff;
|
|
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
|
|
z-index: 1;
|
|
}
|
|
.fork move {
|
|
font-family: 'ChessSansPiratf', sans-serif;
|
|
font-size: 14px;
|
|
line-height: 28px;
|
|
display: block;
|
|
cursor: pointer;
|
|
padding: 0 15px;
|
|
display: flex;
|
|
border-bottom: 1px solid #e4e4e4;
|
|
}
|
|
body.piece_letter .fork move {
|
|
font-family: 'Noto Sans';
|
|
font-size: 13px;
|
|
}
|
|
.fork move:last-child {
|
|
border-bottom: none;
|
|
}
|
|
.fork move:hover,
|
|
.fork:not(:hover) move.selected {
|
|
background: rgba(56,147,232,0.8);
|
|
color: #fff!important;
|
|
}
|
|
.fork glyph {
|
|
font-family: 'Noto Sans';
|
|
margin-left: 2px;
|
|
}
|
|
.fork eval {
|
|
flex: 3 0 auto;
|
|
text-align: right;
|
|
font-size: 0.8em;
|
|
font-family: 'Roboto';
|
|
opacity: 0.8;
|
|
}
|
|
.no_computer eval {
|
|
display: none;
|
|
}
|
|
|
|
@media (min-width: 1050px) {
|
|
|
|
div.analyse div.lichess_game div.lichess_ground {
|
|
flex: 0 0 25vw;
|
|
max-width: 25vw;
|
|
}
|
|
div.analyse .fork { left: 90px; }
|
|
|
|
.pocket piece {
|
|
flex: 0 0 50px;
|
|
}
|
|
}
|
|
|
|
.explorer_box {
|
|
position: relative;
|
|
flex: 2.5 1 0px;
|
|
border: 1px solid #ccc;
|
|
border-top: 0;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
transition: 0.3s;
|
|
transition-delay: 0.3s;
|
|
}
|
|
.explorer_box {
|
|
overflow-y: scroll;
|
|
}
|
|
.explorer_box.config {
|
|
flex: 3.5 1 0px;
|
|
}
|
|
.explorer_box.reduced {
|
|
flex: 0.3 3 0px;
|
|
}
|
|
.explorer_box.reduced:hover {
|
|
flex: 1 2 0px;
|
|
}
|
|
.explorer_box.config {
|
|
min-height: 210px;
|
|
}
|
|
.explorer_box .overlay {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
display: none;
|
|
}
|
|
.explorer_box.loading .overlay {
|
|
display: block;
|
|
}
|
|
.explorer_box tbody {
|
|
transition: opacity 0.13s;
|
|
}
|
|
.explorer_box.loading tbody {
|
|
opacity: 0.4;
|
|
}
|
|
.explorer_box .empty {
|
|
text-align: center;
|
|
display: flex;
|
|
flex-flow: column;
|
|
height: 100%;
|
|
}
|
|
.explorer_box thead th {
|
|
text-transform: capitalize;
|
|
padding-left: 7px;
|
|
}
|
|
.explorer_box thead th,
|
|
.explorer_box .title {
|
|
font-size: 11px;
|
|
line-height: 22px;
|
|
background: #3b93da;
|
|
color: #fff;
|
|
text-align: left;
|
|
padding-left: 10px;
|
|
}
|
|
body.dark .explorer_box thead th,
|
|
body.dark .explorer_box .title,
|
|
body.dark .retro_box .title,
|
|
body.dark .practice_box .title {
|
|
background: #215279;
|
|
color: #ccc;
|
|
}
|
|
.explorer_box tr:nth-child(even) {
|
|
background: #fafafa;
|
|
}
|
|
.explorer_box tbody tr {
|
|
transition: background-color 0.13s;
|
|
}
|
|
.explorer_box tbody tr:hover {
|
|
background: rgba(191, 231, 255, 0.7);
|
|
}
|
|
.explorer_box td {
|
|
cursor: pointer;
|
|
padding-left: 7px;
|
|
}
|
|
.explorer_box .moves td:first-child {
|
|
font-family: 'ChessSansPiratf', sans-serif;
|
|
font-size: 14px;
|
|
line-height: 30px;
|
|
padding-left: 7px;
|
|
}
|
|
body.piece_letter .explorer_box .moves td:first-child {
|
|
font-family: 'Noto Sans';
|
|
font-size: 13px;
|
|
}
|
|
.explorer_box .moves td:nth-child(2) {
|
|
font-size: 10px;
|
|
text-align: right;
|
|
}
|
|
.explorer_box .moves td:last-child {
|
|
width: 100%;
|
|
padding-right: 7px;
|
|
}
|
|
.explorer_box .bar span {
|
|
text-align: center;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
vertical-align: middle;
|
|
border: 0px solid #ccc;
|
|
border-width: 1px 0;
|
|
box-sizing: border-box;
|
|
height: 16px;
|
|
line-height: 16px;
|
|
font-size: 11px;
|
|
}
|
|
body.dark .explorer_box .bar span,
|
|
body.dark .action_menu h2:before,
|
|
body.dark .action_menu h2:after {
|
|
border-color: #555;
|
|
}
|
|
body.dark .ceval_box .show-threat,
|
|
body.dark .pv_box .pv {
|
|
border-color: #3d3d3d;
|
|
}
|
|
.explorer_box .white {
|
|
background: #fff;
|
|
box-shadow: 0 -5px 7px rgba(0,0,0,0.1) inset;
|
|
}
|
|
body.dark .explorer_box .white {
|
|
background: #bbb;
|
|
color: #222;
|
|
box-shadow: 0 -5px 7px rgba(0,0,0,0.25) inset;
|
|
}
|
|
.explorer_box .draws,
|
|
.explorer_box .black {
|
|
color: #fff;
|
|
box-shadow: 0 5px 7px rgba(255,255,255,0.2) inset;
|
|
}
|
|
.explorer_box .draws {
|
|
background: #a0a0a0;
|
|
}
|
|
body.dark .explorer_box .draws {
|
|
background: #666;
|
|
color: #ddd;
|
|
}
|
|
.explorer_box .black {
|
|
background: #555;
|
|
color: #ddd;
|
|
}
|
|
body.dark .explorer_box .black {
|
|
background: #333;
|
|
box-shadow: 0 5px 7px rgba(255,255,255,0.1) inset;
|
|
}
|
|
.explorer_box .bar span:first-child {
|
|
border-top-left-radius: 3px;
|
|
border-bottom-left-radius: 3px;
|
|
border-left-width: 1px;
|
|
}
|
|
.explorer_box .bar span:last-child {
|
|
border-top-right-radius: 3px;
|
|
border-bottom-right-radius: 3px;
|
|
border-right-width: 1px;
|
|
}
|
|
.explorer_box .games {
|
|
width: 100%;
|
|
}
|
|
.explorer_box .games td {
|
|
padding: 5px 0 5px 7px;
|
|
max-width: 110px;
|
|
}
|
|
.explorer_box .games td span {
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.explorer_box .games result {
|
|
display: block;
|
|
text-align: center;
|
|
padding: 3px 5px;
|
|
border-radius: 3px;
|
|
font-size: 0.9em;
|
|
}
|
|
.explorer_box td.game_menu {
|
|
background: #759900;
|
|
cursor: default;
|
|
padding: 0;
|
|
}
|
|
.explorer_box .game_menu .game_title {
|
|
text-align: center;
|
|
color: #fff;
|
|
margin: 3px 0 1px 0;
|
|
}
|
|
.explorer_box .game_menu .menu {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
text-transform: uppercase;
|
|
}
|
|
.explorer_box .game_menu .menu a {
|
|
color: #fff;
|
|
padding: 4px 8px;
|
|
}
|
|
.explorer_box .game_menu .menu a:hover {
|
|
background: rgba(255,255,255,0.2);
|
|
}
|
|
@media (max-width: 1120px) {
|
|
.explorer_box .game_menu {
|
|
font-size: 0.8em;
|
|
letter-spacing: 0;
|
|
}
|
|
}
|
|
.explorer_box .tablebase {
|
|
width: 100%;
|
|
}
|
|
.explorer_box .tablebase td:first-child {
|
|
font-family: 'ChessSansPiratf', sans-serif;
|
|
font-size: 14px;
|
|
line-height: 30px;
|
|
padding-left: 7px;
|
|
}
|
|
body.piece_letter .tablebase td:first-child {
|
|
font-family: 'Noto Sans';
|
|
font-size: 13px;
|
|
}
|
|
.explorer_box .tablebase td:last-child {
|
|
padding-right: 7px;
|
|
text-align: right;
|
|
}
|
|
.explorer_box .tablebase result {
|
|
padding: 3px 5px;
|
|
margin-left: 5px;
|
|
border-radius: 3px;
|
|
font-size: 0.9em;
|
|
}
|
|
.explorer_box .toconf {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
cursor: pointer;
|
|
display: block;
|
|
font-size: 15px;
|
|
color: #fff;
|
|
width: 22px;
|
|
height: 22px;
|
|
line-height: 20px;
|
|
text-align: center;
|
|
opacity: 0.7;
|
|
}
|
|
.explorer_box .toconf:hover {
|
|
opacity: 1;
|
|
}
|
|
.explorer_box .message {
|
|
text-align: center;
|
|
font-style: italic;
|
|
flex: 1 1 100%;
|
|
display: flex;
|
|
flex-flow: column;
|
|
justify-content: center;
|
|
}
|
|
.explorer_box.reduced .message {
|
|
justify-content: flex-start;
|
|
}
|
|
.explorer_box .message h3 {
|
|
margin: 8px 0;
|
|
}
|
|
.explorer_box:not(.reduced) .message h3,
|
|
.explorer_box.reduced:hover .message h3 {
|
|
font-weight: bold;
|
|
}
|
|
.explorer_box .message p {
|
|
white-space: normal;
|
|
padding: 0 8px;
|
|
margin: 0 0 8px 0;
|
|
}
|
|
.explorer_box.reduced .message p,
|
|
.explorer_box.reduced .message button {
|
|
display: none;
|
|
}
|
|
.explorer_box.reduced:hover .message p,
|
|
.explorer_box.reduced:hover .message button {
|
|
display: block;
|
|
}
|
|
.explorer_box .message button {
|
|
margin: 0 30px;
|
|
}
|
|
.explorer_box .message.masters i {
|
|
font-size: 40px;
|
|
margin: 10px 0;
|
|
}
|
|
.explorer_box .config {
|
|
overflow: hidden;
|
|
}
|
|
.explorer_box .config section {
|
|
padding: 8px 10px 0 10px;
|
|
}
|
|
.explorer_box .config section.db {
|
|
padding-top: 5px;
|
|
}
|
|
.explorer_box .config section.save {
|
|
text-align: center;
|
|
padding: 15px 0 10px 0;
|
|
}
|
|
.explorer_box .config label {
|
|
font-weight: bold;
|
|
display: block;
|
|
line-height: 2em;
|
|
}
|
|
.explorer_box .config .choices {
|
|
display: flex;
|
|
}
|
|
.explorer_box .config .choices span {
|
|
flex-grow: 1;
|
|
padding: 5px 0;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
transition: background 0.13s;
|
|
border: 1px solid #ccc;
|
|
border-width: 1px 0 1px 1px;
|
|
text-transform: capitalize;
|
|
}
|
|
.explorer_box .config .choices span:first-child {
|
|
border-radius: 3px 0 0 3px;
|
|
}
|
|
.explorer_box .config .choices span:last-child {
|
|
border-radius: 0 3px 3px 0;
|
|
border-right-width: 1px;
|
|
}
|
|
.explorer_box .config .choices span:hover {
|
|
background: #fff;
|
|
}
|
|
.explorer_box .config .choices span.selected {
|
|
background: #3893E8!important;
|
|
color: #fff!important;
|
|
text-shadow: 1px 0 0 rgba(0,0,0,0.5);
|
|
font-weight: bold;
|
|
box-shadow: 0 3px 5px rgba(0,0,0,0.2) inset;
|
|
}
|
|
|
|
.retro_box,
|
|
.practice_box {
|
|
flex: 1.5 1 0px;
|
|
border: 1px solid #ccc;
|
|
border-top: 0;
|
|
background: #fff;
|
|
display: flex;
|
|
flex-flow: column;
|
|
}
|
|
.retro_box .title,
|
|
.practice_box .title {
|
|
flex: 0 0 22px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 12px;
|
|
line-height: 22px;
|
|
background: #3b93da;
|
|
color: #fff;
|
|
text-align: left;
|
|
padding: 0 5px 0 10px;
|
|
}
|
|
.retro_box .title .close,
|
|
.practice_box .title .close {
|
|
cursor:pointer;
|
|
}
|
|
.retro_box .feedback,
|
|
.practice_box .feedback {
|
|
flex: 1 1 100%;
|
|
display: flex;
|
|
flex-flow: column;
|
|
justify-content: center;
|
|
}
|
|
.retro_box .progress,
|
|
.practice_box .progress {
|
|
margin-top: 5px;
|
|
opacity: 0.8;
|
|
width: 100%;
|
|
height: 4px;
|
|
background: #ddd;
|
|
}
|
|
.retro_box .progress div,
|
|
.practice_box .progress div {
|
|
background: #759900;
|
|
height: 4px;
|
|
transition: width 0.5s;
|
|
max-width: 100%;
|
|
}
|
|
.retro_box .player,
|
|
.practice_box .player {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 10px;
|
|
}
|
|
.retro_box .player.center {
|
|
justify-content: center;
|
|
}
|
|
.retro_box:not(.find) .player {
|
|
height: 100%;
|
|
}
|
|
.retro_box .no-square,
|
|
.practice_box .no-square {
|
|
width: 64px;
|
|
height: 64px;
|
|
margin-right: 10px;
|
|
}
|
|
.is3d .retro_box div.no-square,
|
|
.is3d .practice_box div.no-square {
|
|
height: 82px;
|
|
}
|
|
.retro_box piece,
|
|
.practice_box piece {
|
|
position: inherit;
|
|
display: block;
|
|
width: 100%!important;
|
|
height: 100%!important;
|
|
}
|
|
.retro_box .icon,
|
|
.practice_box .icon {
|
|
display: block;
|
|
width: 64px;
|
|
height: 64px;
|
|
margin-right: 10px;
|
|
font-size: 50px;
|
|
font-size: 64px;
|
|
line-height: 64px;
|
|
text-align: center;
|
|
}
|
|
.retro_box .win .icon:not(.off) {
|
|
color: #759900;
|
|
}
|
|
.retro_box .fail .icon:not(.off) {
|
|
color: #dc322f;
|
|
}
|
|
.retro_box .instruction,
|
|
.practice_box .instruction {
|
|
font-size: 1.1em;
|
|
}
|
|
.retro_box .instruction > *,
|
|
.practice_box .instruction > * {
|
|
display: block;
|
|
}
|
|
.retro_box .instruction > strong,
|
|
.practice_box .instruction > strong {
|
|
font-weight: normal;
|
|
font-size: 1.3em;
|
|
}
|
|
.retro_box .instruction glyph {
|
|
}
|
|
.retro_box .instruction glyph {
|
|
font-weight: normal;
|
|
opacity: 0.7;
|
|
}
|
|
.retro_box .half {
|
|
flex: 1 1 50%;
|
|
}
|
|
.retro_box .choices,
|
|
.practice_box .choices {
|
|
line-height: 1.6em;
|
|
margin: 5px 0 -5px 0;
|
|
}
|
|
.retro_box .choices a,
|
|
.practice_box .choices a {
|
|
display: block;
|
|
color: #3893E8;
|
|
}
|
|
.retro_box .continue {
|
|
display: flex;
|
|
font-size: 1.3em;
|
|
background: rgba(56,147,232,0.8);
|
|
color: #fff;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-transform: uppercase;
|
|
padding: 0 10px;
|
|
}
|
|
.retro_box .continue:hover {
|
|
background: rgba(56,147,232,1);
|
|
}
|
|
.retro_box .continue i::before {
|
|
font-size: 2.5em;
|
|
margin-right: 10px;
|
|
}
|
|
body.dark .retro_box,
|
|
body.dark .practice_box {
|
|
background: #303030;
|
|
color: #aaa;
|
|
}
|
|
body.dark .retro_box .feedback .progress,
|
|
body.dark .practice_box .feedback .progress {
|
|
background: #666;
|
|
}
|
|
|
|
.practice_box {
|
|
flex: 0 0 135px;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
}
|
|
.practice_box .comment {
|
|
flex: 0 0 30px;
|
|
display: flex;
|
|
align-items: stretch;
|
|
background: #f8f8f8;
|
|
border-top: 1px solid #ddd;
|
|
white-space: nowrap;
|
|
line-height: 30px;
|
|
}
|
|
body.dark .practice_box .comment {
|
|
background: #404040;
|
|
white-space: nowrap;
|
|
}
|
|
.practice_box .progress div {
|
|
background: #aaa;
|
|
}
|
|
.practice_box.goodMove .title,
|
|
.practice_box.goodMove .progress div {
|
|
background: #759900!important;
|
|
color: #fff!important;
|
|
}
|
|
.practice_box.inaccuracy .title,
|
|
.practice_box.inaccuracy .progress div {
|
|
background: #d59120!important;
|
|
color: #fff!important;
|
|
}
|
|
.practice_box.mistake .title,
|
|
.practice_box.blunder .title,
|
|
.practice_box.mistake .progress div,
|
|
.practice_box.blunder .progress div {
|
|
background: #dc322f!important;
|
|
color: #fff!important;
|
|
}
|
|
.practice_box .comment .wait {
|
|
padding-left: 15px;
|
|
}
|
|
.practice_box .verdict {
|
|
font-weight: bold;
|
|
font-size: 1.2em;
|
|
margin-right: 10px;
|
|
display: flex;
|
|
}
|
|
.practice_box .verdict::before {
|
|
width: 30px;
|
|
height: 100%;
|
|
color: #fff;
|
|
margin-right: 7px;
|
|
text-align: center;
|
|
font-size: 1.4em;
|
|
font-weight: normal;
|
|
}
|
|
.practice_box.goodMove .verdict {
|
|
color: #759900;
|
|
}
|
|
.practice_box.goodMove .verdict::before {
|
|
background: #759900;
|
|
content: '✓';
|
|
font-size: 1.7em;
|
|
}
|
|
.practice_box.inaccuracy .verdict {
|
|
color: #d59120;
|
|
}
|
|
.practice_box.inaccuracy .verdict::before {
|
|
background: #d59120;
|
|
content: '?';
|
|
}
|
|
.practice_box.mistake .verdict,
|
|
.practice_box.blunder .verdict {
|
|
color: #dc322f;
|
|
}
|
|
.practice_box.mistake .verdict::before,
|
|
.practice_box.blunder .verdict::before {
|
|
background: #dc322f;
|
|
content: '✗';
|
|
}
|
|
.practice_box .comment move {
|
|
margin-left: 5px;
|
|
color: #3893E8;
|
|
transition: 0.3s;
|
|
}
|
|
|
|
.lichess_ground .areplay,
|
|
.action_menu {
|
|
overflow: auto;
|
|
overflow-x: hidden;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
margin-left: 0;
|
|
}
|
|
.lichess_ground .areplay {
|
|
background: #fff;
|
|
border: 1px solid #ccc;
|
|
flex: 2 1 0px;
|
|
position: relative; /* for autoscroll */
|
|
will-change: scroll-position;
|
|
}
|
|
.action_menu {
|
|
flex: 1 0;
|
|
display: flex;
|
|
flex-flow: column;
|
|
justify-content: flex-end;
|
|
padding-bottom: 10px;
|
|
}
|
|
.explorer_box, .retro_box, .practice_box, .action_menu {
|
|
border-bottom: 3px solid #3893E8!important;
|
|
}
|
|
.action_menu h2 {
|
|
text-transform: uppercase;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
margin: 15px 0 3px 0;
|
|
display: table;
|
|
padding: 0 10px;
|
|
}
|
|
.action_menu h2:before,
|
|
.action_menu h2:after {
|
|
border-top: 1px solid #ccc;
|
|
content: '';
|
|
display: table-cell;
|
|
position: relative;
|
|
top: 0.65em;
|
|
width: 45%;
|
|
}
|
|
.action_menu h2:before {
|
|
right: 8px;
|
|
}
|
|
.action_menu h2:after {
|
|
left: 8px;
|
|
}
|
|
.action_menu .icon {
|
|
display: block;
|
|
font-size: 2em;
|
|
}
|
|
.action_menu .autoplay,
|
|
.action_menu .tools {
|
|
display: flex;
|
|
}
|
|
.action_menu .tools {
|
|
flex-flow: row wrap;
|
|
}
|
|
.action_menu .tools > * {
|
|
flex: 0 0 50%;
|
|
text-align: center;
|
|
padding: 0;
|
|
height: 75px;
|
|
display: flex;
|
|
flex-flow: column;
|
|
justify-content: center;
|
|
}
|
|
.action_menu .tools form .fbt {
|
|
width: 100%;
|
|
}
|
|
.action_menu .tools i {
|
|
line-height: 1em;
|
|
margin-bottom: 5px;
|
|
}
|
|
.action_menu .autoplay .fbt {
|
|
flex: 1 1 auto;
|
|
padding: 7px 0;
|
|
text-align: center;
|
|
}
|
|
.action_menu form.delete {
|
|
text-align: right;
|
|
margin-top: 6px;
|
|
}
|
|
.action_menu form.delete .button {
|
|
display: inline-block;
|
|
padding: 0 8px;
|
|
}
|
|
.action_menu form.delete .button::before {
|
|
font-size: 1.2em;
|
|
}
|
|
.action_menu .setting {
|
|
padding: 4px 0 4px 10px;
|
|
line-height: 22px;
|
|
display: flex;
|
|
}
|
|
.action_menu .setting > label {
|
|
flex: 1 0;
|
|
cursor: pointer;
|
|
}
|
|
.action_menu input[type=range] {
|
|
width: 100px;
|
|
height: 22px;
|
|
-webkit-appearance: none;
|
|
background: none;
|
|
}
|
|
.action_menu .range_value {
|
|
flex: 0 0 42px;
|
|
display: block;
|
|
text-align: right;
|
|
}
|
|
.action_menu input[type=range]:focus {
|
|
outline: none;
|
|
}
|
|
.action_menu input[type=range]::-webkit-slider-runnable-track {
|
|
width: 100%;
|
|
height: 11.4px;
|
|
cursor: pointer;
|
|
background: rgba(214, 214, 214, 0.78);
|
|
border-radius: 6px;
|
|
}
|
|
.action_menu input[type=range]::-webkit-slider-thumb {
|
|
border: 1px solid #aaaaaa;
|
|
height: 12px;
|
|
width: 18px;
|
|
border-radius: 12px;
|
|
background: #ffffff;
|
|
cursor: pointer;
|
|
-webkit-appearance: none;
|
|
margin-top: -0.3px;
|
|
}
|
|
.action_menu input[type=range]::-moz-range-track {
|
|
width: 100%;
|
|
height: 11.4px;
|
|
cursor: pointer;
|
|
background: rgba(214, 214, 214, 0.78);
|
|
border-radius: 5.9px;
|
|
}
|
|
.action_menu input[type=range]::-moz-range-thumb {
|
|
border: 1px solid #aaaaaa;
|
|
height: 12px;
|
|
width: 18px;
|
|
border-radius: 12px;
|
|
background: #ffffff;
|
|
cursor: pointer;
|
|
}
|
|
.action_menu input[type=range]::-ms-track {
|
|
width: 100%;
|
|
height: 11.4px;
|
|
cursor: pointer;
|
|
background: transparent;
|
|
border-color: transparent;
|
|
color: transparent;
|
|
}
|
|
.action_menu input[type=range]::-ms-fill-lower {
|
|
background: rgba(191, 191, 191, 0.78);
|
|
border-radius: 11.8px;
|
|
}
|
|
.action_menu input[type=range]::-ms-fill-upper {
|
|
background: rgba(214, 214, 214, 0.78);
|
|
border-radius: 11.8px;
|
|
}
|
|
.action_menu input[type=range]::-ms-thumb {
|
|
border: 1px solid #aaaaaa;
|
|
height: 12px;
|
|
width: 18px;
|
|
border-radius: 12px;
|
|
background: #ffffff;
|
|
cursor: pointer;
|
|
height: 11.4px;
|
|
}
|
|
body.dark .action_menu input[type=range]::-webkit-slider-runnable-track {
|
|
background: rgba(70, 70, 70, 0.78);
|
|
}
|
|
body.dark .action_menu input[type=range]::-moz-range-track {
|
|
background: rgba(70, 70, 70, 0.78);
|
|
}
|
|
body.dark .action_menu input[type=range]::-ms-fill-upper {
|
|
background: rgba(70, 70, 70, 0.78);
|
|
}
|
|
|
|
.lichess_ground .opening {
|
|
padding-bottom: 3px;
|
|
}
|
|
|
|
.aclocks {
|
|
position: absolute;
|
|
right: -62px;
|
|
width: 62px;
|
|
top: calc(50% - 32px);
|
|
font-family: 'Roboto Mono', 'Roboto';
|
|
box-sizing: border-box;
|
|
line-height: 20px;
|
|
}
|
|
.aclocks .aclock {
|
|
height: 20px;
|
|
line-height: 20px;
|
|
padding: 5px 0;
|
|
text-align: center;
|
|
border: 1px solid #ccc;
|
|
}
|
|
|
|
.aclocks .aclock:first-child {
|
|
border-width: 1px 1px 1px 0;
|
|
border-radius: 0 4px 0 0;
|
|
}
|
|
.aclocks .aclock:last-child {
|
|
border-width: 0 1px 1px 0;
|
|
border-radius: 0 0 4px 0;
|
|
}
|
|
.aclocks .aclock.active {
|
|
background: #fafafa;
|
|
font-weight: bold;
|
|
}
|
|
.aclocks .aclock tenths {
|
|
font-size: 80%;
|
|
}
|
|
|
|
body.dark .aclocks .aclock {
|
|
border-color: #3d3d3d;
|
|
}
|
|
body.dark .aclocks .aclock.active {
|
|
background: #303030;
|
|
}
|
|
|
|
.tview2 {
|
|
white-space: normal;
|
|
}
|
|
.tview2.column {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
font-size: 13.5px;
|
|
line-height: 1.25;
|
|
}
|
|
.tview2.inline {
|
|
padding: 7px 3px 7px 7px;
|
|
font-size: 16px;
|
|
line-height: 1em;
|
|
}
|
|
.lichess_ground move {
|
|
font-family: 'ChessSansPiratf', sans-serif;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
}
|
|
body.piece_letter .lichess_ground move {
|
|
font-family: 'Noto Sans';
|
|
}
|
|
.tview2.column move {
|
|
font-size: 1.092em;
|
|
padding: 0 2px;
|
|
}
|
|
.tview2.inline move {
|
|
padding: 0.25em 0.17em;
|
|
white-space: nowrap;
|
|
font-weight: bold;
|
|
}
|
|
.tview2 move.parent,
|
|
.tview2 comment a {
|
|
color: #3893e8!important;
|
|
}
|
|
.tview2 comment a {
|
|
vertical-align: top;
|
|
}
|
|
.tview2 move.current {
|
|
border: 1px solid #d85000!important;
|
|
}
|
|
.tview2 move.active {
|
|
color: #d85000;
|
|
}
|
|
.tview2 move.nongame {
|
|
font-style: italic;
|
|
}
|
|
.tview2 move:not(.empty):hover,
|
|
.tview2 move:not(.empty):hover index,
|
|
.tview2 move:not(.empty):hover eval {
|
|
background: #3893e8;
|
|
color: #fff!important;
|
|
}
|
|
.tview2.inline move:hover {
|
|
border-radius: 3px;
|
|
}
|
|
.tview2 move.empty {
|
|
color: #aaa;
|
|
cursor: default;
|
|
}
|
|
.tview2 move.context_menu {
|
|
background: #d85000!important;
|
|
color: #fff!important;
|
|
}
|
|
.tview2 move index {
|
|
font-size: 90%;
|
|
color: #999;
|
|
}
|
|
.tview2.column move index {
|
|
padding-left: 5px;
|
|
}
|
|
.tview2.column move index:first-child {
|
|
padding-left: 0;
|
|
}
|
|
.tview2.inline move index {
|
|
padding-right: 0.2em;
|
|
line-height: 111.11%
|
|
}
|
|
.tview2 line move {
|
|
color: #606060;
|
|
}
|
|
.tview2.column > move {
|
|
flex: 0 0 43.5%;
|
|
max-width: 43.5%; /* required by IE 11 https://github.com/philipwalton/flexbugs/issues/3 */
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
font-size: 1.185em;
|
|
line-height: 1.75em;
|
|
padding-left: 7px;
|
|
padding-right: 3px;
|
|
}
|
|
.tview2.column > index + move {
|
|
border-right: 1px solid #ddd;
|
|
}
|
|
.tview2 eval {
|
|
flex: 3 0 auto;
|
|
text-align: right;
|
|
font-size: 0.8em;
|
|
font-family: 'Roboto';
|
|
color: #999;
|
|
}
|
|
.tview2 glyph {
|
|
font-family: 'Noto Sans';
|
|
margin-left: 0.08em;
|
|
}
|
|
.tview2.column > move glyph {
|
|
flex: 0 1 auto;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
font-size: 0.82em;
|
|
}
|
|
.tview2.column > index {
|
|
flex: 0 0 13%;
|
|
max-width: 13%; /* required by IE 11 https://github.com/philipwalton/flexbugs/issues/3 */
|
|
display: flex;
|
|
justify-content: center;
|
|
box-sizing: border-box;
|
|
border-right: 1px solid #ddd;
|
|
background: #f8f8f8;
|
|
line-height: 2.07em;
|
|
color: #c0c0c0;
|
|
}
|
|
.tview2 > interrupt {
|
|
font-size: 95%;
|
|
}
|
|
.tview2.column > interrupt {
|
|
flex: 0 0 100%;
|
|
background: #f8f8f8;
|
|
border-top: 1px solid #ddd;
|
|
border-bottom: 1px solid #ddd;
|
|
box-sizing: border-box;
|
|
max-width: 100%;
|
|
}
|
|
.tview2.column > interrupt > comment {
|
|
display: block;
|
|
padding: 3px 5px;
|
|
word-wrap: break-word;
|
|
}
|
|
.tview2.inline comment {
|
|
vertical-align: 45%;
|
|
word-wrap: break-word;
|
|
margin: 0 0.2em 0 0.1em;
|
|
font-size: 0.9em;
|
|
}
|
|
.tview2 comment .by {
|
|
display: inline-block;
|
|
vertical-align: -0.3em;
|
|
white-space: nowrap;
|
|
font-family: 'Roboto';
|
|
font-size: 0.9em;
|
|
opacity: 0.8;
|
|
margin-right: 0.4em;
|
|
max-width: 9em;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.tview2.column comment.white {
|
|
border-left: 3px solid;
|
|
}
|
|
.tview2.column comment.black {
|
|
border-right: 3px solid;
|
|
overflow-x: hidden;
|
|
}
|
|
.tview2.column comment.inaccuracy {
|
|
border-color: #56B4E9;
|
|
}
|
|
.tview2.column comment.mistake {
|
|
border-color: #E69F00;
|
|
}
|
|
.tview2.column comment.blunder {
|
|
border-color: #DF5353;
|
|
}
|
|
.tview2.column comment.undefined {
|
|
border-color: #66558C;
|
|
}
|
|
.tview2 line comment {
|
|
font-size: 90%;
|
|
}
|
|
.tview2.column line comment {
|
|
display: inline;
|
|
color: #808080;
|
|
word-wrap: break-word;
|
|
padding: 0 5px 0 3px;
|
|
vertical-align: top;
|
|
}
|
|
.tview2 line comment .by {
|
|
font-size: 1em;
|
|
vertical-align: top;
|
|
}
|
|
.tview2 lines {
|
|
display: block;
|
|
margin-top: 2px;
|
|
margin-left: 6px;
|
|
margin-bottom: 0.8em;
|
|
border-left: 2px solid #ccc;
|
|
}
|
|
.tview2 > interrupt > lines {
|
|
margin-left: 0px;
|
|
}
|
|
.tview2 lines.single {
|
|
border-left: none;
|
|
}
|
|
.tview2 lines:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.tview2 line {
|
|
display: block;
|
|
padding-left: 7px;
|
|
}
|
|
.tview2.column line {
|
|
margin: 2px 0;
|
|
}
|
|
.tview2 lines lines move {
|
|
font-size: 13px;
|
|
}
|
|
.tview2 lines lines {
|
|
margin-left: 1px;
|
|
}
|
|
.tview2 lines lines::before {
|
|
content: ' ';
|
|
border-top: 2px solid #ccc;
|
|
position: absolute;
|
|
margin-left: -11px;
|
|
width: 9px;
|
|
height: 6px;
|
|
}
|
|
.tview2 lines line::before {
|
|
margin-top: 0.65em;
|
|
margin-left: -8px;
|
|
content: ' ';
|
|
border-top: 2px solid #ccc;
|
|
position: absolute;
|
|
width: 8px;
|
|
height: 6px;
|
|
}
|
|
.tview2 lines lines:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.tview2 inline {
|
|
display: inline;
|
|
font-style: italic;
|
|
font-size: 0.9em;
|
|
opacity: 0.8;
|
|
}
|
|
.tview2 inline::before,
|
|
.tview2 inline::after {
|
|
vertical-align: 0.4em;
|
|
opacity: 0.7;
|
|
font-size: 0.9em;
|
|
}
|
|
.tview2 inline::before {
|
|
content: '(';
|
|
margin-left: 2px;
|
|
}
|
|
.tview2 inline::after {
|
|
content: ')';
|
|
margin-right: 2px;
|
|
}
|
|
.tview2.inline inline::before,
|
|
.tview2.inline inline::after {
|
|
vertical-align: 0.7em;
|
|
}
|
|
.tview2 .conceal {
|
|
opacity: 0.4;
|
|
}
|
|
.tview2 .hide {
|
|
display: none;
|
|
}
|
|
body.dark .tview2 > index {
|
|
color: #6a6a6a;
|
|
}
|
|
body.dark .tview2 move {
|
|
color: #aaa;
|
|
}
|
|
body.dark .tview2 move.active {
|
|
color: #ff7729;
|
|
}
|
|
body.dark .tview2.column comment {
|
|
color: #999;
|
|
}
|
|
body.dark .tview2.column line comment {
|
|
color: #888;
|
|
}
|
|
body.dark .tview2 lines,
|
|
body.dark .tview2 lines lines::before,
|
|
body.dark .tview2 lines line::before {
|
|
border-color: #666;
|
|
}
|
|
.lichess_ground .areplay .result,
|
|
.lichess_ground .areplay .status {
|
|
background: #f8f8f8;
|
|
}
|
|
div.underboard {
|
|
margin-top: 25px;
|
|
}
|
|
div.underboard .center {
|
|
padding: 0;
|
|
}
|
|
div.copyables label.name {
|
|
font-weight: bold;
|
|
}
|
|
div.copyables textarea,
|
|
div.copyables label {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
div.copyables .pgn {
|
|
margin-top: 1em;
|
|
margin-bottom: 20px;
|
|
}
|
|
div.copyables .pgn textarea {
|
|
color: #747474;
|
|
resize: vertical;
|
|
min-height: 6em;
|
|
white-space: pre-wrap;
|
|
overflow-x: hidden;
|
|
}
|
|
div.copyables .pgn .action {
|
|
display: none;
|
|
text-align: right;
|
|
margin-top: 10px;
|
|
}
|
|
div.copyables .pgn:hover .action {
|
|
display: block;
|
|
}
|
|
div.advice_summary {
|
|
margin-top: 13px;
|
|
display: flex;
|
|
flex-flow: column;
|
|
height: 180px;
|
|
justify-content: space-between;
|
|
align-items: flex-start;
|
|
line-height: 1.15em;
|
|
}
|
|
div.advice_summary table {
|
|
width: 100%;
|
|
}
|
|
div.advice_summary td {
|
|
width: 25px;
|
|
padding-right: 5px;
|
|
text-align: center;
|
|
}
|
|
div.advice_summary tbody td {
|
|
font-weight: bold;
|
|
}
|
|
div.advice_summary tr.symbol {
|
|
cursor: pointer;
|
|
}
|
|
div.advice_summary tr.symbol:hover {
|
|
color: #3893E8;
|
|
}
|
|
div.advice_summary .button {
|
|
margin-left: 29px;
|
|
}
|
|
|
|
#adv_chart,
|
|
#movetimes_chart {
|
|
height: 210px;
|
|
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 20%, rgba(128, 128, 128, 0.2) 50%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 0) 100%);
|
|
overflow: hidden;
|
|
}
|
|
div.panel.computer_analysis {
|
|
position: relative;
|
|
}
|
|
#adv_chart_loader {
|
|
position: absolute;
|
|
top: 76px;
|
|
left: -1px;
|
|
background: #fff;
|
|
padding: 7px 10px 7px 0;
|
|
line-height: 20px;
|
|
box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.3);
|
|
display: flex;
|
|
border: 1px solid #ccc;
|
|
border-radius: 0 50px 50px 0;
|
|
}
|
|
#adv_chart_loader span {
|
|
margin-left: 7px;
|
|
opacity: 1;
|
|
transition: 0.5s;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
width: 90px;
|
|
display: block;
|
|
}
|
|
div.underboard:hover #adv_chart_loader span {
|
|
margin-left: 0;
|
|
width: 0;
|
|
opacity: 0;
|
|
}
|
|
#adv_chart_loader .spinner {
|
|
width: 32px;
|
|
height: 32px;
|
|
display:inline-block;
|
|
margin-left: 10px;
|
|
}
|
|
span.mod {
|
|
display: inline-block;
|
|
border-left: 3px solid;
|
|
padding-left: 2px;
|
|
}
|
|
span.blurs {
|
|
border-color: #DDCF3F;
|
|
}
|
|
span.hold {
|
|
border-color: #E73B38;
|
|
}
|
|
.copyables > p {
|
|
margin-top: 7px;
|
|
}
|
|
.copyables .name {
|
|
font-size: 1.2em;
|
|
display: inline-block;
|
|
width: 40px;
|
|
}
|
|
.copyable {
|
|
width: 455px;
|
|
}
|
|
.analeft {
|
|
position: absolute;
|
|
top: 53px;
|
|
left: -241px;
|
|
width: 226px;
|
|
}
|
|
.back_to_game {
|
|
margin-top: 30px;
|
|
text-align: center;
|
|
}
|
|
|
|
.mselect {
|
|
margin-top: 20px;
|
|
width: 100%;
|
|
font-size: 1.2em;
|
|
box-sizing: border-box;
|
|
display:inline-block;
|
|
position: relative;
|
|
padding:0;
|
|
border:0;
|
|
}
|
|
.mselect .button {
|
|
position: relative;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
padding: 10px;
|
|
}
|
|
.mselect .button i {
|
|
font-size: 10px;
|
|
position: absolute;
|
|
right: 5px;
|
|
top: 14px;
|
|
}
|
|
.mselect .list {
|
|
width:100%;
|
|
margin:0;
|
|
padding:0;
|
|
position:absolute;
|
|
top:0;
|
|
text-align: left;
|
|
list-style-type:none;
|
|
font-weight: normal;
|
|
background:#FFF;
|
|
box-shadow: 0px 8px 17px 0px rgba(0, 0, 0, 0.2), 0px 6px 20px 0px rgba(0, 0, 0, 0.19);
|
|
border-radius: 3px;
|
|
display: none;
|
|
}
|
|
.mselect.shown .list {
|
|
display: block;
|
|
}
|
|
.mselect .list a {
|
|
display: block;
|
|
padding: 10px;
|
|
background:#fff;
|
|
transition: 0.13s;
|
|
outline:0;
|
|
text-decoration:none;
|
|
cursor:pointer;
|
|
}
|
|
.mselect .list a:hover{
|
|
background: #3893E8;
|
|
color: #fff;
|
|
}
|
|
.mselect a[data-icon]:before,
|
|
.mselect .button[data-icon]:before {
|
|
font-size: 1.5em;
|
|
margin-right: 10px;
|
|
color: #3893E8;
|
|
transition: 0.13s;
|
|
}
|
|
.mselect a:hover:before {
|
|
color: #fff;
|
|
}
|
|
|
|
#analyse-cm {
|
|
position: absolute;
|
|
display: none;
|
|
z-index: 900000;
|
|
cursor: default;
|
|
background: #f0f0f0;
|
|
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
|
|
}
|
|
#analyse-cm.visible {
|
|
display: block;
|
|
}
|
|
#analyse-cm .title {
|
|
padding: 5px;
|
|
background: #777;
|
|
color: #fff;
|
|
text-align: center;
|
|
font-family: 'ChessSansPiratf', sans-serif;
|
|
font-size: 14px;
|
|
}
|
|
body.piece_letter #analyse-cm .title {
|
|
font-family: 'Noto Sans';
|
|
}
|
|
#analyse-cm .action {
|
|
display: block;
|
|
padding: 10px;
|
|
}
|
|
#analyse-cm .action::before {
|
|
margin-right: 10px;
|
|
}
|
|
#analyse-cm .action:hover {
|
|
background: #fff;
|
|
}
|