dasher UI
Thibault Duplessis
parent
718c99086c
commit
1cc510065b
|
|
@ -9,7 +9,7 @@ public/vendor/stockfish.wasm
|
|||
public/vendor/stockfish-mv.wasm
|
||||
public/vendor/stockfish.pexe
|
||||
public/vendor/stockfish.js
|
||||
public/css/*.css
|
||||
public/css/
|
||||
target
|
||||
bin/.translate_version
|
||||
data/
|
||||
|
|
|
|||
|
|
@ -96,6 +96,8 @@ object layout {
|
|||
private val dataAssetVersion = attr("data-asset-version")
|
||||
private val dataNonce = attr("data-nonce")
|
||||
private val dataZoom = attr("data-zoom")
|
||||
private val dataTheme = attr("data-theme")
|
||||
private val dataResp = attr("data-resp")
|
||||
private val dataPreload = attr("data-preload")
|
||||
private val dataPlaying = attr("data-playing")
|
||||
private val dataPatrons = attr("data-patrons")
|
||||
|
|
@ -133,10 +135,14 @@ object layout {
|
|||
)
|
||||
else frag(
|
||||
titleTag(s"[dev] ${fullTitle | s"$title • lichess.org"}"),
|
||||
!responsive option cssAt("offline/font.noto.css"),
|
||||
!responsive option cssAt("offline/font.roboto.mono.css")
|
||||
!responsive option frag(
|
||||
cssAt("offline/font.noto.css"),
|
||||
cssAt("offline/font.roboto.mono.css")
|
||||
)
|
||||
),
|
||||
if (responsive) responsiveCssTag("site")
|
||||
if (responsive) ctx.zoom ifTrue zoomable map { z =>
|
||||
raw(s"""<style>main{--zoom:$z}</style>""")
|
||||
}
|
||||
else frag(
|
||||
currentBgCss,
|
||||
cssTag("common.css"),
|
||||
|
|
@ -187,7 +193,9 @@ object layout {
|
|||
dataAssetUrl := assetBaseUrl,
|
||||
dataAssetVersion := assetVersion.value,
|
||||
dataNonce := ctx.nonce.map(_.value),
|
||||
dataZoom := ctx.zoom.map(_.toString)
|
||||
dataZoom := ctx.zoom.map(_.toString),
|
||||
dataResp := responsive.option(true),
|
||||
dataTheme := responsive.option(ctx.currentBg)
|
||||
)(
|
||||
blindModeForm,
|
||||
ctx.pageData.inquiry map { views.html.mod.inquiry(_) },
|
||||
|
|
@ -282,7 +290,7 @@ object layout {
|
|||
)
|
||||
|
||||
def responsive(playing: Boolean)(implicit ctx: Context) =
|
||||
header(id := "site-header")(
|
||||
header(id := "top")(
|
||||
div(cls := "site-title-nav")(
|
||||
topnavToggle,
|
||||
h1(cls := "site-title")(
|
||||
|
|
|
|||
|
|
@ -9,15 +9,9 @@ ul.ui-autocomplete li a {
|
|||
display: block;
|
||||
padding: 0.6em 1em;
|
||||
}
|
||||
ul.ui-autocomplete li a.ui-state-focus {
|
||||
background: #E1F6F8;
|
||||
color: #444;
|
||||
}
|
||||
.ui-widget-header {
|
||||
color: #fff !important;
|
||||
text-shadow: 0 1px 0 #000 !important;
|
||||
background: #d85000 !important;
|
||||
border-color: #b84400 !important;
|
||||
box-shadow: 0 3px 4px rgba(0, 0, 0, 0.15) inset !important;
|
||||
}
|
||||
/* slider */
|
||||
|
|
@ -74,26 +68,3 @@ ul.ui-autocomplete li a.ui-state-focus {
|
|||
.ui-slider-horizontal .ui-slider-range-max {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
body.dark .ui-slider,
|
||||
body.dark .progressbar {
|
||||
background-color: #505050;
|
||||
}
|
||||
/* body.dark .ui-state-default { */
|
||||
/* border-color: #3d3d3d; */
|
||||
/* } */
|
||||
body.dark .ui-state-default {
|
||||
background: linear-gradient(to bottom, rgba(40, 40, 40, 1), rgba(34, 34, 34, 1) 100%);
|
||||
text-shadow: 0 1px 0 #000;
|
||||
}
|
||||
body.dark .ui-slider-handle,
|
||||
body.dark .ui-widget-content {
|
||||
border-color: #323232;
|
||||
}
|
||||
body.transp .ui-state-hover {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
body.transp .ui-state-default {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.7) 100%);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,9 +18,7 @@
|
|||
|
||||
@import 'vendors/chessground';
|
||||
|
||||
@import 'components/site-header';
|
||||
@import 'components/topnav-hidden';
|
||||
@import 'components/topnav-visible';
|
||||
@import 'components/header/header';
|
||||
@import 'components/mini-board';
|
||||
@import 'components/subnav';
|
||||
@import 'components/box';
|
||||
|
|
|
|||
|
|
@ -7,3 +7,4 @@
|
|||
@import 'abstracts/mixins';
|
||||
@import 'abstracts/extends';
|
||||
@import 'abstracts/z-index';
|
||||
@import 'abstracts/fluid-size';
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ $z-indexes: (
|
|||
'modal': 5000,
|
||||
'dropdown': 4000,
|
||||
'site-header': 5,
|
||||
'dasher': 2,
|
||||
'default': 1,
|
||||
'below': -1,
|
||||
);
|
||||
|
|
|
|||
|
|
@ -3,20 +3,18 @@
|
|||
.user_link .line,
|
||||
.is-after::after {
|
||||
font-size: 1.2em;
|
||||
vertical-align: middle;
|
||||
vertical-align: text-top;
|
||||
font-family: "lichess" !important;
|
||||
font-style: normal !important;
|
||||
font-weight: normal !important;
|
||||
text-transform: none !important;
|
||||
speak: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
content: attr(data-icon);
|
||||
opacity: 0.9;
|
||||
}
|
||||
.is.text::before,
|
||||
.text[data-icon]::before {
|
||||
margin-right: 0.27em;
|
||||
margin-right: 0.37em;
|
||||
}
|
||||
[data-icon].is2::before {
|
||||
font-size: 20px;
|
||||
|
|
|
|||
|
|
@ -14,3 +14,9 @@ a {
|
|||
color: $c-link-hover;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,8 @@ html {
|
|||
// font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", 'Noto Sans', Roboto, Ubuntu, "Helvetica Neue", sans-serif;
|
||||
font-family: 'Noto Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
|
||||
@include fluid-size('font-size', 14px, 16px);
|
||||
// font-smoothing: antialiased;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
h1,
|
||||
|
|
|
|||
|
|
@ -1,20 +0,0 @@
|
|||
%placeholder {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: $c-background-clear;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-transform: uppercase;
|
||||
// outline: 1px solid $c-border;
|
||||
@extend %box-shadow;
|
||||
|
||||
& p {
|
||||
text-transform: none;
|
||||
}
|
||||
}
|
||||
placeholder,
|
||||
.placeholder {
|
||||
@extend %placeholder;
|
||||
}
|
||||
|
|
@ -1,122 +0,0 @@
|
|||
#site-header {
|
||||
height: $site-header-height;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
z-index: z('site-header');
|
||||
& .dropdown {
|
||||
display: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 28px;
|
||||
background: #fff;
|
||||
z-index: 3;
|
||||
box-shadow: 2px 5px 6px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
& .shown .dropdown {
|
||||
display: block;
|
||||
}
|
||||
& .dropdown .initiating .spinner {
|
||||
padding: 10px 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.site-title-nav {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.site-title {
|
||||
font: 26px/#{$site-header-short-height - 3} 'Noto Sans';
|
||||
font-weight: normal;
|
||||
white-space: nowrap;
|
||||
margin: 0 .5rem;
|
||||
display: none;
|
||||
@include breakpoint($mq-xx-small) {
|
||||
display: block;
|
||||
}
|
||||
@include breakpoint($mq-site-header-tall) {
|
||||
font-size: 32px;
|
||||
line-height: #{$site-header-tall-height - 3};
|
||||
}
|
||||
@include breakpoint($mq-site-header-tall $mq-topnav-visible) {
|
||||
line-height: #{$site-header-tall-height - 5};
|
||||
margin: 0 1rem;
|
||||
}
|
||||
& a {
|
||||
color: $c-font;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: $c-primary;
|
||||
& span {
|
||||
color: $c-primary-dim;
|
||||
}
|
||||
}
|
||||
}
|
||||
& span {
|
||||
color: $c-font-dim;
|
||||
}
|
||||
}
|
||||
|
||||
.site-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
& .link {
|
||||
color: $c-font;
|
||||
font-size: 1.1rem;
|
||||
text-decoration: none;
|
||||
padding: 0 0.5rem;
|
||||
&:hover {
|
||||
color: $c-link;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#clinput {
|
||||
display: flex;
|
||||
height: 24px;
|
||||
}
|
||||
#clinput a.link:hover {
|
||||
color: #303030;
|
||||
}
|
||||
#clinput input {
|
||||
border: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid #888;
|
||||
background: transparent;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
line-height: 24px;
|
||||
margin-right: 14px;
|
||||
display: none;
|
||||
}
|
||||
#clinput.shown input {
|
||||
display: inline-block;
|
||||
}
|
||||
#clinput input:focus {
|
||||
outline: none;
|
||||
}
|
||||
body.dark #clinput input {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
#reconnecting {
|
||||
display: none;
|
||||
opacity: 0;
|
||||
}
|
||||
body.offline #reconnecting,
|
||||
#network_error {
|
||||
display: inline-block;
|
||||
opacity: 1;
|
||||
color: #dc322f;
|
||||
}
|
||||
@keyframes reconnected {
|
||||
0% { opacity: 1; color: #759900; }
|
||||
100% { opacity: 0; color: #759900; transform: translateY(-15px); }
|
||||
}
|
||||
body.online.reconnected #reconnecting {
|
||||
animation: reconnected 2s ease-out 1s backwards;
|
||||
}
|
||||
body.online #reconnecting::before {
|
||||
content: 'J'
|
||||
}
|
||||
|
|
@ -0,0 +1,59 @@
|
|||
$c-slider: $c-primary !default;
|
||||
|
||||
.ui-slider {
|
||||
background: $c-background-dim;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
cursor:pointer;
|
||||
}
|
||||
.ui-widget-header {
|
||||
width: 8px;
|
||||
bottom: 0;
|
||||
background: $c-slider!important;
|
||||
}
|
||||
.ui-slider-handle {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: 1.2em;
|
||||
height: 1.2em;
|
||||
cursor:pointer;
|
||||
margin: 0 0 -9px -5.5px;
|
||||
border-radius: 50%;
|
||||
border-color: $c-slider!important;
|
||||
background: linear-gradient(to bottom, hsl(0, 0, 95%) 0%, hsl(0, 0, 80%) 100%);
|
||||
}
|
||||
.ui-slider-handle,
|
||||
.ui-widget-content {
|
||||
border: 1px solid c-clearer($c-slider);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.ui-slider-handle:hover {
|
||||
border-color: #e2e2e2;
|
||||
background: rgb(248, 248, 248);
|
||||
background: linear-gradient(to bottom, rgba(248, 248, 248, 1) 0%, rgba(243, 243, 243, 1) 100%);
|
||||
}
|
||||
.ui-slider .ui-slider-range {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
font-size: .7em;
|
||||
display: block;
|
||||
border: 0;
|
||||
background-position: 0 0;
|
||||
}
|
||||
.ui-slider-horizontal {
|
||||
height: .8em;
|
||||
}
|
||||
.ui-slider-horizontal .ui-slider-handle {
|
||||
top: -.3em;
|
||||
margin-left: -.6em;
|
||||
}
|
||||
.ui-slider-horizontal .ui-slider-range {
|
||||
top: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.ui-slider-horizontal .ui-slider-range-min {
|
||||
left: 0;
|
||||
}
|
||||
.ui-slider-horizontal .ui-slider-range-max {
|
||||
right: 0;
|
||||
}
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
.site-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
& .link {
|
||||
color: $c-font;
|
||||
font-size: 1.1rem;
|
||||
padding: 0 .6rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&:hover {
|
||||
color: $c-link;
|
||||
}
|
||||
& span::before {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
& .toggle {
|
||||
display: block;
|
||||
height: $site-header-height;
|
||||
line-height: $site-header-height;
|
||||
// padding: 0 0.5rem;
|
||||
}
|
||||
& .toggle:hover {
|
||||
// color: ;
|
||||
}
|
||||
& .dropdown {
|
||||
display: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: var(--dropdown-top);
|
||||
background: $c-header-dropdown-background;
|
||||
z-index: 3;
|
||||
box-shadow: -1px 5px 6px rgba(0, 0, 0, 0.3);
|
||||
& .initiating .spinner {
|
||||
padding: 10px 30px;
|
||||
}
|
||||
& a,
|
||||
& button {
|
||||
color: $c-header-dropdown-color;
|
||||
}
|
||||
}
|
||||
& .shown {
|
||||
& .toggle {
|
||||
color: $c-header-dropdown-color;
|
||||
background: $c-header-dropdown-background;
|
||||
}
|
||||
& .dropdown {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
#user_tag {
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
#clinput {
|
||||
display: flex;
|
||||
height: 24px;
|
||||
}
|
||||
#clinput a.link:hover {
|
||||
color: #303030;
|
||||
}
|
||||
#clinput input {
|
||||
border: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid #888;
|
||||
background: transparent;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
line-height: 24px;
|
||||
margin-right: 14px;
|
||||
display: none;
|
||||
}
|
||||
#clinput.shown input {
|
||||
display: inline-block;
|
||||
}
|
||||
#clinput input:focus {
|
||||
outline: none;
|
||||
}
|
||||
body.dark #clinput input {
|
||||
color: #aaa;
|
||||
}
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
@import 'topnav-hidden';
|
||||
@import 'topnav-visible';
|
||||
@import 'title';
|
||||
@import 'buttons';
|
||||
@import 'clinput';
|
||||
|
||||
#top {
|
||||
height: $site-header-height;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
z-index: z('site-header');
|
||||
|
||||
--dropdown-top: 35px;
|
||||
@include breakpoint($mq-site-header-tall) {
|
||||
--dropdown-top: 53px;
|
||||
}
|
||||
}
|
||||
|
||||
.site-title-nav {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
#reconnecting {
|
||||
display: none;
|
||||
opacity: 0;
|
||||
}
|
||||
body.offline #reconnecting,
|
||||
#network_error {
|
||||
display: inline-block;
|
||||
opacity: 1;
|
||||
color: $c-error;
|
||||
}
|
||||
@keyframes reconnected {
|
||||
0% { opacity: 1; color: $c-good; }
|
||||
100% { opacity: 0; color: $c-good; transform: translateY(-15px); }
|
||||
}
|
||||
body.online.reconnected #reconnecting {
|
||||
animation: reconnected 2s ease-out 1s backwards;
|
||||
}
|
||||
body.online #reconnecting::before {
|
||||
content: 'J'
|
||||
}
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
.site-title {
|
||||
font: 26px/#{$site-header-short-height - 3} 'Noto Sans';
|
||||
font-weight: normal;
|
||||
text-shadow: $text-shadow;
|
||||
white-space: nowrap;
|
||||
margin: 0 .5rem;
|
||||
display: none;
|
||||
@include breakpoint($mq-xx-small) {
|
||||
display: block;
|
||||
}
|
||||
@include breakpoint($mq-site-header-tall) {
|
||||
font-size: 32px;
|
||||
line-height: #{$site-header-tall-height - 3};
|
||||
}
|
||||
@include breakpoint($mq-site-header-tall $mq-topnav-visible) {
|
||||
line-height: #{$site-header-tall-height - 5};
|
||||
margin: 0 1rem;
|
||||
}
|
||||
& a {
|
||||
color: $c-font;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: $c-primary;
|
||||
& span {
|
||||
color: $c-primary-dim;
|
||||
}
|
||||
}
|
||||
}
|
||||
& span {
|
||||
color: $c-font-dim;
|
||||
}
|
||||
}
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
&:active {
|
||||
& > a {
|
||||
height: var(--nav-section-hover);
|
||||
background: $c-header-dropdown;
|
||||
background: $c-header-dropdown-background;
|
||||
color: $c-font-clear;
|
||||
border-color: $c-primary;
|
||||
}
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
display: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
background: $c-header-dropdown;
|
||||
background: $c-header-dropdown-background;
|
||||
width: 10rem;
|
||||
box-shadow: 2px 5px 6px rgba(0, 0, 0, 0.3);
|
||||
border-radius: 0 3px 3px 3px;
|
||||
|
|
@ -58,7 +58,7 @@
|
|||
@media (hover: none) {
|
||||
padding: .5rem .7rem;
|
||||
}
|
||||
color: $c-font-clear;
|
||||
color: $c-header-dropdown-color;
|
||||
&:hover {
|
||||
background: $c-primary;
|
||||
color: $c-primary-over;
|
||||
|
|
@ -12,7 +12,7 @@ $theme: 'dark';
|
|||
$c-background: hsl(0, 0%, 9%);
|
||||
$c-background-dim: hsl(0, 0%, 0%);
|
||||
$c-background-clear: hsl(0, 0%, 18%);
|
||||
$c-background-clearer: hsl(0, 0%, 25%);
|
||||
$c-background-clearer: hsl(0, 0%, 23%);
|
||||
|
||||
$c-font: hsl(0, 0%, 70%);
|
||||
$c-font-dim: c-dimmer($c-font, 15%);
|
||||
|
|
@ -24,14 +24,15 @@ $c-brag: hsl(37, 74%, 43%);
|
|||
/* Fancy: pink */
|
||||
$c-fancy: hsl(294, 62%, 48%);
|
||||
|
||||
$c-body-gradient: hsl(0, 0%, 19%);
|
||||
$c-body-gradient: hsl(0, 0%, 18%);
|
||||
|
||||
$c-primary-dim: c-dimmer($c-primary, 15%);
|
||||
|
||||
$c-header-dropdown: $c-background-clearer;
|
||||
$c-header-dropdown-background: $c-background-clearer;
|
||||
$c-header-dropdown-color: $c-font-clear;
|
||||
|
||||
$c-border: hsl(0, 0%, 50%);
|
||||
$borders: $border-width $border-style $c-border;
|
||||
$c-border: hsl(0, 0%, 40%);
|
||||
$border: $border-width $border-style $c-border;
|
||||
|
||||
$c-font-shadow: black;
|
||||
$text-shadow: 0 1px 1px $c-font-shadow;
|
||||
|
|
|
|||
|
|
@ -39,6 +39,10 @@ $c-brag-over: white; /* text over brag background */
|
|||
$c-error: hsl(0, 60%, 50%);
|
||||
$c-error-over: white; /* text over brag background */
|
||||
|
||||
/* Good: green */
|
||||
$c-good: $c-secondary;
|
||||
$c-good-over: $c-secondary-over;
|
||||
|
||||
/* Fancy: pink */
|
||||
$c-fancy: hsl(294, 61%, 62%);
|
||||
$c-fancy-over: white; /* text over brag background */
|
||||
|
|
@ -50,7 +54,8 @@ $c-border: hsl(0, 0%, 80%);
|
|||
|
||||
$c-page-mask: hsla(0, 0, 0%, 0.5);
|
||||
|
||||
$c-header-dropdown: $c-background-clear;
|
||||
$c-header-dropdown-background: $c-background-clear;
|
||||
$c-header-dropdown-color: $c-font;
|
||||
|
||||
$c-font-shadow: white;
|
||||
|
||||
|
|
@ -58,7 +63,7 @@ $c-font-shadow: white;
|
|||
|
||||
$border-width: 1px;
|
||||
$border-style: solid;
|
||||
$borders: $border-width $border-style $c-border;
|
||||
$border: $border-width $border-style $c-border;
|
||||
|
||||
/* Shadows */
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,399 @@
|
|||
#dasher_app {
|
||||
width: 225px;
|
||||
z-index: z('dasher');
|
||||
border-radius: $box-radius-size 0 0 $box-radius-size;
|
||||
|
||||
& .spinner {
|
||||
margin: 20px auto;
|
||||
}
|
||||
& .links,
|
||||
& .subs {
|
||||
padding: 5px 0;
|
||||
}
|
||||
& .links a,
|
||||
& .links button,
|
||||
& .subs .sub {
|
||||
display: block;
|
||||
padding: 0.5rem 0.9rem;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
& .links a:hover,
|
||||
& .links button:hover,
|
||||
& .subs .sub:hover {
|
||||
background: $c-dasher;
|
||||
color: $c-dasher-over;
|
||||
}
|
||||
& .logout button:hover {
|
||||
background: $c-error;
|
||||
}
|
||||
& .links button {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
border: 0;
|
||||
background: none;
|
||||
}
|
||||
& .subs {
|
||||
border-top: $border;
|
||||
}
|
||||
.sub {
|
||||
&::before {
|
||||
float: right;
|
||||
font-size: 80%;
|
||||
margin-top: 0.25rem;
|
||||
color: $c-dasher;
|
||||
}
|
||||
&:hover::before {
|
||||
color: $c-dasher-over;
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
& .status {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 10px 0 5px 0;
|
||||
border-top: $border;
|
||||
& signal {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
font-size: 20px;
|
||||
}
|
||||
& .ping,
|
||||
& .server {
|
||||
display: block;
|
||||
font-family: 'Roboto Mono', 'Roboto';
|
||||
padding-left: 10px;
|
||||
}
|
||||
& strong {
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
& .head {
|
||||
display: block;
|
||||
padding: 1rem 0.9rem;
|
||||
border-bottom: $border;
|
||||
}
|
||||
& .head::before {
|
||||
color: $c-dasher;
|
||||
opacity: 0.8;
|
||||
}
|
||||
& .head:hover::before {
|
||||
opacity: 1;
|
||||
}
|
||||
& .slider .ui-slider-handle {
|
||||
margin: 0 0 -9px -5.5px;
|
||||
}
|
||||
|
||||
& .langs {
|
||||
& form {
|
||||
max-height: 400px;
|
||||
overflow: auto;
|
||||
}
|
||||
& button {
|
||||
display: block;
|
||||
padding: 0.4em 0.5em;
|
||||
border: none;
|
||||
background: none;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
box-sizing: border-box;
|
||||
&:hover {
|
||||
background: $c-dasher-light;
|
||||
}
|
||||
}
|
||||
& .accepted {
|
||||
border-left: 3px solid $c-dasher;
|
||||
}
|
||||
& .current {
|
||||
background: $c-dasher!important;
|
||||
color: $c-dasher-over!important;
|
||||
border-left: none;
|
||||
}
|
||||
}
|
||||
& .selector {
|
||||
flex: 1 1 100%;
|
||||
margin: 5px 0;
|
||||
& a {
|
||||
display: block;
|
||||
padding: 0.4rem 0.9rem;
|
||||
&:hover {
|
||||
background: $c-dasher-light;
|
||||
}
|
||||
&.active {
|
||||
background: $c-dasher!important;
|
||||
color: $c-dasher-over!important;
|
||||
}
|
||||
&::before {
|
||||
margin-right: 8px;
|
||||
font-size: 19px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover::before {
|
||||
opacity: 1;
|
||||
color: $c-dasher;
|
||||
}
|
||||
&.active::before {
|
||||
opacity: 1;
|
||||
color: $c-dasher-over!important;
|
||||
}
|
||||
}
|
||||
&.large a {
|
||||
padding: 0.5rem 0.9rem;
|
||||
}
|
||||
}
|
||||
& .zen a::before {
|
||||
font-size: 18px;
|
||||
margin-right: 3px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
& .zen:hover a::before{
|
||||
opacity: 1;
|
||||
}
|
||||
& .sound {
|
||||
& .content {
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
}
|
||||
& .selector a {
|
||||
border-radius: $box-radius-size 0 0 $box-radius-size;
|
||||
}
|
||||
& .slider {
|
||||
flex: 0 0 8px;
|
||||
margin: 10px;
|
||||
}
|
||||
&.silent .slider {
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
|
||||
& .background {
|
||||
& .image p {
|
||||
font-size: 0.9em;
|
||||
padding: 5px;
|
||||
}
|
||||
& input {
|
||||
padding: 5px;
|
||||
border: 1px solid #444;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
background-color: #3e3e3e;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
& .board .zoom {
|
||||
margin: 5px 0px;
|
||||
border-top: 1px solid #ddd;
|
||||
padding: 10px 10px;
|
||||
}
|
||||
& .board .slider {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
& .theme {
|
||||
& .list {
|
||||
margin: 5px 0;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
& .list a {
|
||||
flex: 0 0 50%;
|
||||
height: 44px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
& .list span {
|
||||
display: block;
|
||||
width: 64px;
|
||||
height: 32px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
&.d3 .list span {
|
||||
width: 66px;
|
||||
height: 30px;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
& .list a:hover {
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
& .list a:hover span {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
& .list a.active {
|
||||
background-color: $c-font;
|
||||
}
|
||||
}
|
||||
|
||||
& .piece {
|
||||
& .list {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
background: url(../images/board/darksquares.jpg);
|
||||
box-shadow: inset 0 7px 20px 3px #777;
|
||||
}
|
||||
& .no-square {
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
position: relative;
|
||||
}
|
||||
& .no-square:hover {
|
||||
background: rgba(250, 250, 250, 0.15);
|
||||
}
|
||||
& .no-square.active {
|
||||
background: fade-out($c-dasher, 0.3);
|
||||
}
|
||||
& piece {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
&.d3 piece {
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-size: cover;
|
||||
background-position: 0 67%;
|
||||
}
|
||||
}
|
||||
|
||||
& .theme.d2 {
|
||||
.blue {
|
||||
background-image: url(../images/board/svg/blue.svg);
|
||||
background-size: 256px;
|
||||
}
|
||||
.blue2 {
|
||||
background-image: url(../images/board/blue2.thumbnail.jpg);
|
||||
}
|
||||
.wood2 {
|
||||
background-image: url(../images/board/wood2.thumbnail.jpg);
|
||||
}
|
||||
.wood3 {
|
||||
background-image: url(../images/board/wood3.thumbnail.jpg);
|
||||
}
|
||||
.blue3 {
|
||||
background-image: url(../images/board/blue3.thumbnail.jpg);
|
||||
}
|
||||
.marble {
|
||||
background-image: url(../images/board/marble.thumbnail.jpg);
|
||||
}
|
||||
.brown {
|
||||
background-image: url(../images/board/svg/brown.svg);
|
||||
background-size: 256px;
|
||||
}
|
||||
.green {
|
||||
background-image: url(../images/board/svg/green.svg);
|
||||
background-size: 256px;
|
||||
}
|
||||
.olive {
|
||||
background-image: url(../images/board/olive.thumbnail.jpg);
|
||||
}
|
||||
.purple {
|
||||
background-image: url(../images/board/svg/purple.svg);
|
||||
background-size: 256px;
|
||||
}
|
||||
.grey {
|
||||
background-image: url(../images/board/grey.thumbnail.jpg);
|
||||
}
|
||||
.wood {
|
||||
background-image: url(../images/board/wood.thumbnail.jpg);
|
||||
}
|
||||
.canvas {
|
||||
background-image: url(../images/board/canvas2.thumbnail.jpg);
|
||||
}
|
||||
.leather {
|
||||
background-image: url(../images/board/leather.thumbnail.jpg);
|
||||
}
|
||||
.metal {
|
||||
background-image: url(../images/board/metal.thumbnail.jpg);
|
||||
}
|
||||
.maple {
|
||||
background-image: url(../images/board/maple.thumbnail.jpg);
|
||||
}
|
||||
}
|
||||
& .theme.d3 {
|
||||
& .Black-White-Aluminium {
|
||||
background-image: url(../images/staunton/board/Black-White-Aluminium.thumbnail.png);
|
||||
}
|
||||
& .Brushed-Aluminium {
|
||||
background-image: url(../images/staunton/board/Brushed-Aluminium.thumbnail.png);
|
||||
}
|
||||
& .China-Blue {
|
||||
background-image: url(../images/staunton/board/China-Blue.thumbnail.png);
|
||||
}
|
||||
& .China-Green {
|
||||
background-image: url(../images/staunton/board/China-Green.thumbnail.png);
|
||||
}
|
||||
& .China-Grey {
|
||||
background-image: url(../images/staunton/board/China-Grey.thumbnail.png);
|
||||
}
|
||||
& .China-Scarlet {
|
||||
background-image: url(../images/staunton/board/China-Scarlet.thumbnail.png);
|
||||
}
|
||||
& .China-Yellow {
|
||||
background-image: url(../images/staunton/board/China-Yellow.thumbnail.png);
|
||||
}
|
||||
& .Classic-Blue {
|
||||
background-image: url(../images/staunton/board/Classic-Blue.thumbnail.png);
|
||||
}
|
||||
& .Transparent-Glass {
|
||||
background-image: url(../images/staunton/board/Glass.thumbnail.png);
|
||||
}
|
||||
& .Gold-Silver {
|
||||
background-image: url(../images/staunton/board/Gold-Silver.thumbnail.png);
|
||||
}
|
||||
& .Green-Glass {
|
||||
background-image: url(../images/staunton/board/Green-Glass.thumbnail.png);
|
||||
}
|
||||
& .Light-Wood {
|
||||
background-image: url(../images/staunton/board/Light-Wood.thumbnail.png);
|
||||
}
|
||||
& .Power-Coated {
|
||||
background-image: url(../images/staunton/board/Power-Coated.thumbnail.png);
|
||||
}
|
||||
& .Purple-Black {
|
||||
background-image: url(../images/staunton/board/Purple-Black.thumbnail.png);
|
||||
}
|
||||
& .Rosewood {
|
||||
background-image: url(../images/staunton/board/Rosewood.thumbnail.png);
|
||||
}
|
||||
& .Wood-Glass {
|
||||
background-image: url(../images/staunton/board/Wood-Glass.thumbnail.png);
|
||||
}
|
||||
& .Wax {
|
||||
background-image: url(../images/staunton/board/Wax.thumbnail.png);
|
||||
}
|
||||
& .Jade {
|
||||
background-image: url(../images/staunton/board/Jade.thumbnail.png);
|
||||
}
|
||||
& .Marble {
|
||||
background-image: url(../images/board/3d/marble.thumbnail.png);
|
||||
}
|
||||
& .Woodi {
|
||||
background-image: url(../images/board/3d/woodi.thumbnail.png);
|
||||
}
|
||||
}
|
||||
|
||||
// body.dark & .subs,
|
||||
// body.dark & .status,
|
||||
// body.dark & .board .zoom {
|
||||
// border-color: #3d3d3d;
|
||||
// }
|
||||
// body.dark & .head,
|
||||
// body.dark & .links a:hover,
|
||||
// body.dark & .links button:hover,
|
||||
// body.dark & .subs a:hover,
|
||||
// body.dark & .langs form > *:hover,
|
||||
// body.dark & .selector a:hover {
|
||||
// background: #3e3e3e;
|
||||
// color: #b0b0b0;
|
||||
// }
|
||||
// body.dark & .links button {
|
||||
// color: #8f8f8f;
|
||||
// }
|
||||
// body.dark & .selector a:hover::before {
|
||||
// color: #555;
|
||||
// }
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
@import '../../../common/css/plugin';
|
||||
|
||||
$c-dasher: $c-secondary;
|
||||
$c-dasher-over: $c-secondary-over;
|
||||
$c-dasher-light: c-dimmer($c-dasher, 85);
|
||||
$c-slider: $c-dasher;
|
||||
|
||||
@import '../../../common/css/components/ui-slider';
|
||||
@import '../dasher';
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
@import '../../../common/css/themes/dark';
|
||||
@import 'dasher';
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
@import '../../../common/css/themes/light';
|
||||
@import 'dasher';
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
@import '../../../common/css/themes/transp';
|
||||
@import 'dasher';
|
||||
|
|
@ -1,3 +1,3 @@
|
|||
const lilaGulp = require('../gulp/tsProject.js');
|
||||
require('../gulp/tsProject.js')('LichessDasher', 'lichess.dasher', __dirname);
|
||||
|
||||
lilaGulp('LichessDasher', 'lichess.dasher', __dirname);
|
||||
require('../gulp/cssProject.js')(__dirname);
|
||||
|
|
|
|||
|
|
@ -6,10 +6,10 @@ import { Redraw, Close, bind, header } from './util'
|
|||
export interface BackgroundCtrl {
|
||||
list: Background[]
|
||||
set(k: string): void
|
||||
get(): string
|
||||
get(): string
|
||||
getImage(): string
|
||||
setImage(i: string): void
|
||||
trans: Trans
|
||||
trans: Trans
|
||||
close: Close
|
||||
}
|
||||
|
||||
|
|
@ -58,7 +58,7 @@ export function view(ctrl: BackgroundCtrl): VNode {
|
|||
|
||||
return h('div.sub.background', [
|
||||
header(ctrl.trans.noarg('background'), ctrl.close),
|
||||
h('div.selector', ctrl.list.map(bg => {
|
||||
h('div.selector.large', ctrl.list.map(bg => {
|
||||
return h('a.text', {
|
||||
class: { active: cur === bg.key },
|
||||
attrs: { 'data-icon': 'E' },
|
||||
|
|
@ -93,20 +93,32 @@ function applyBackground(data: BackgroundData, list: Background[]) {
|
|||
|
||||
const key = data.current;
|
||||
|
||||
$('body').removeClass(list.map(b => b.key).join(' ')).addClass(key === 'transp' ? 'transp dark' : key);
|
||||
$('body')
|
||||
.removeClass(list.map(b => b.key).join(' '))
|
||||
.addClass(key === 'transp' ? 'transp dark' : key);
|
||||
|
||||
if ((key === 'dark' || key === 'transp') && !$('link[href*="dark.css"]').length) {
|
||||
|
||||
$('link[href*="common.css"]').clone().each(function(this: HTMLElement) {
|
||||
$(this).attr('href', $(this).attr('href').replace(/common\.css/, 'dark.css')).appendTo('head');
|
||||
if ($('body').data('resp')) {
|
||||
const prev = $('body').data('theme');
|
||||
$('body').data('theme', key);
|
||||
$('link[href*=".' + prev + '."]').each(function(this: HTMLElement) {
|
||||
console.log($(this).attr('href'));
|
||||
$(this).attr('href', $(this).attr('href').replace('.' + prev + '.', '.' + key + '.')).appendTo('head');
|
||||
});
|
||||
}
|
||||
} else {
|
||||
|
||||
if (key === 'transp' && !$('link[href*="transp.css"]').length) {
|
||||
if ((key === 'dark' || key === 'transp') && !$('link[href*="dark.css"]').length) {
|
||||
|
||||
$('link[href*="common.css"]').clone().each(function(this: HTMLElement) {
|
||||
$(this).attr('href', $(this).attr('href').replace(/common\.css/, 'transp.css')).appendTo('head');
|
||||
});
|
||||
$('link[href*="common.css"]').clone().each(function(this: HTMLElement) {
|
||||
$(this).attr('href', $(this).attr('href').replace(/common\.css/, 'dark.css')).appendTo('head');
|
||||
});
|
||||
}
|
||||
|
||||
if (key === 'transp' && !$('link[href*="transp.css"]').length) {
|
||||
|
||||
$('link[href*="common.css"]').clone().each(function(this: HTMLElement) {
|
||||
$(this).attr('href', $(this).attr('href').replace(/common\.css/, 'transp.css')).appendTo('head');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (key === 'transp') {
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ export function view(ctrl: BoardCtrl): VNode {
|
|||
|
||||
return h('div.sub.board', [
|
||||
header(ctrl.trans.noarg('boardGeometry'), ctrl.close),
|
||||
h('div.selector', [
|
||||
h('div.selector.large', [
|
||||
h('a.text', {
|
||||
class: { active: !ctrl.data.is3d },
|
||||
attrs: { 'data-icon': 'E' },
|
||||
|
|
@ -63,7 +63,7 @@ export function view(ctrl: BoardCtrl): VNode {
|
|||
}, '3D')
|
||||
]),
|
||||
h('div.zoom', [
|
||||
h('h2', ctrl.trans.noarg('boardSize')),
|
||||
h('p', ctrl.trans.noarg('boardSize')),
|
||||
h('div.slider', {
|
||||
hook: { insert: vnode => makeSlider(ctrl, vnode.elm as HTMLElement) }
|
||||
})
|
||||
|
|
|
|||
|
|
@ -28,6 +28,8 @@ export interface DasherData {
|
|||
|
||||
export type Mode = 'links' | 'langs' | 'sound' | 'background' | 'board' | 'theme' | 'piece';
|
||||
|
||||
const defaultMode = 'links';
|
||||
|
||||
export interface DasherCtrl {
|
||||
mode: Prop<Mode>;
|
||||
setMode(m: Mode): void;
|
||||
|
|
@ -55,13 +57,13 @@ export function makeCtrl(opts: DasherOpts, data: DasherData, redraw: Redraw): Da
|
|||
|
||||
const trans = window.lichess.trans(data.i18n);
|
||||
|
||||
let mode: Prop<Mode> = prop('links' as Mode);
|
||||
let mode: Prop<Mode> = prop(defaultMode as Mode);
|
||||
|
||||
function setMode(m: Mode) {
|
||||
mode(m);
|
||||
redraw();
|
||||
}
|
||||
function close() { setMode('links'); }
|
||||
function close() { setMode(defaultMode); }
|
||||
|
||||
const ping = pingCtrl(trans, redraw);
|
||||
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ export default function(ctrl: DasherCtrl): VNode {
|
|||
linkCfg('/streamer/edit', ''),
|
||||
'Streamer manager'),
|
||||
|
||||
h('form', {
|
||||
h('form.logout', {
|
||||
attrs: { method: 'post', action: '/logout' }
|
||||
}, [
|
||||
h('button.text', {
|
||||
|
|
|
|||
|
|
@ -54,13 +54,7 @@ export function view(ctrl: PieceCtrl): VNode {
|
|||
header(ctrl.trans.noarg('pieceSet'), () => ctrl.open('links')),
|
||||
h('div.list', {
|
||||
attrs: { method: 'post', action: '/pref/soundSet' }
|
||||
}, d.list.map(pieceView(d.current, ctrl.set, ctrl.dimension() == 'd3'))),
|
||||
h('div.subs', [
|
||||
h('a', {
|
||||
hook: bind('click', () => ctrl.open('theme')),
|
||||
attrs: { 'data-icon': 'H' }
|
||||
}, ctrl.trans.noarg('boardTheme'))
|
||||
])
|
||||
}, d.list.map(pieceView(d.current, ctrl.set, ctrl.dimension() == 'd3')))
|
||||
]);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -54,13 +54,7 @@ export function view(ctrl: ThemeCtrl): VNode {
|
|||
header(ctrl.trans.noarg('boardTheme'), () => ctrl.open('links')),
|
||||
h('div.list', {
|
||||
attrs: { method: 'post', action: '/pref/soundSet' }
|
||||
}, d.list.map(themeView(d.current, ctrl.set))),
|
||||
h('div.subs', [
|
||||
h('a', {
|
||||
hook: bind('click', () => ctrl.open('piece')),
|
||||
attrs: { 'data-icon': 'H' }
|
||||
}, ctrl.trans.noarg('pieceSet'))
|
||||
])
|
||||
}, d.list.map(themeView(d.current, ctrl.set)))
|
||||
]);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ const autoprefixerOptions = {
|
|||
};
|
||||
const destination = () => gulp.dest('../../public/css/');
|
||||
|
||||
module.exports = (name, dir) => {
|
||||
module.exports = (dir) => {
|
||||
|
||||
const sourceDir = `${dir}/css`;
|
||||
const buildDir = `${sourceDir}/build`;
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ $variant-height: 2.5rem;
|
|||
height: 30%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
border-top: $borders;
|
||||
border-top: $border;
|
||||
padding: 0.5rem;
|
||||
text-transform: uppercase;
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ const concat = require('gulp-concat');
|
|||
const exec = require('child_process').exec;
|
||||
const fs = require('fs');
|
||||
|
||||
require('../gulp/cssProject.js')('lichess.editor', __dirname);
|
||||
require('../gulp/cssProject.js')(__dirname);
|
||||
|
||||
const browserifyOpts = (entries, debug) => ({
|
||||
entries: entries,
|
||||
|
|
|
|||
|
|
@ -460,7 +460,7 @@ lichess.topMenuIntent = function() {
|
|||
var $el = $('#dasher_app').html(initiatingHtml);
|
||||
var isDev = $('body').data('dev');
|
||||
var isPlaying = $('body').hasClass('playing');
|
||||
lichess.loadCss('stylesheets/dasherApp.css');
|
||||
lichess.loadCss(lichess.cssPath('dasher'));
|
||||
lichess.loadScript('compiled/lichess.dasher' + (isDev ? '' : '.min') + '.js').done(function() {
|
||||
instance = LichessDasher.default($el.empty()[0], {
|
||||
setZoom: setZoom,
|
||||
|
|
@ -468,6 +468,7 @@ lichess.topMenuIntent = function() {
|
|||
});
|
||||
});
|
||||
});
|
||||
setTimeout(function() { $('#top .dasher .toggle').click(); }, 10);
|
||||
})();
|
||||
|
||||
// cli
|
||||
|
|
|
|||
|
|
@ -217,6 +217,7 @@ lichess.widget = function(name, prototype) {
|
|||
return returnValue;
|
||||
};
|
||||
};
|
||||
lichess.isResp = $('body').data('resp');
|
||||
lichess.isTrident = navigator.userAgent.indexOf('Trident/') > -1;
|
||||
lichess.isMS = lichess.isTrident || navigator.userAgent.indexOf('Edge/') > -1;
|
||||
lichess.spinnerHtml = '<div class="spinner"><svg viewBox="0 0 40 40"><circle cx=20 cy=20 r=18 fill="none"></circle></svg></div>';
|
||||
|
|
@ -226,6 +227,9 @@ lichess.assetUrl = function(path, opts) {
|
|||
var version = document.body.getAttribute('data-asset-version');
|
||||
return baseUrl + '/assets' + (opts.noVersion ? '' : '/_' + version) + '/' + path;
|
||||
};
|
||||
lichess.cssPath = function(key) {
|
||||
return 'css/lichess.' + key + '.' + $('body').data('theme') + '.' + ($('body').data('dev') ? 'dev' : 'min') + '.css';
|
||||
};
|
||||
lichess.loadedCss = {};
|
||||
lichess.loadCss = function(url) {
|
||||
if (lichess.loadedCss[url]) return;
|
||||
|
|
@ -252,7 +256,7 @@ lichess.hopscotch = function(f) {
|
|||
lichess.loadScript('vendor/hopscotch/dist/js/hopscotch.min.js', {noVersion:true}).done(f);
|
||||
}
|
||||
lichess.slider = function() {
|
||||
lichess.loadCss('stylesheets/jquery-ui.css');
|
||||
if (!lichess.isResp) lichess.loadCss('stylesheets/jquery-ui.css');
|
||||
return lichess.loadScript('javascripts/vendor/jquery-ui.slider.min.js', {noVersion:true});
|
||||
};
|
||||
lichess.shepherd = function(f) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue