Merge branch 'dark'
* dark: implement background toggle
This commit is contained in:
commit
a65b8ac29e
|
@ -19,6 +19,7 @@ object Setting extends LilaController {
|
|||
case "theme" ⇒ setTheme.some
|
||||
case "sound" ⇒ setSound.some
|
||||
case "chat" ⇒ setChat.some
|
||||
case "bg" ⇒ setBg.some
|
||||
case _ ⇒ none
|
||||
}
|
||||
setter.fold({
|
||||
|
@ -44,4 +45,8 @@ object Setting extends LilaController {
|
|||
val setChat: Setter = forms.chat -> {
|
||||
(setting, v) ⇒ setting.chat(v)(userRepo)
|
||||
}
|
||||
|
||||
val setBg: Setter = forms.bg -> {
|
||||
(setting, v) ⇒ setting.bg(v)(userRepo)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -18,6 +18,9 @@ final class Setting(ctx: Context) {
|
|||
def chat = get("chat", "true").parseBoolean | true
|
||||
def chat(value: String) = set("chat", value) _
|
||||
|
||||
def bg = get("bg", "light")
|
||||
def bg(value: String) = set("bg", value) _
|
||||
|
||||
private def get(name: String, default: String = ""): String =
|
||||
ctx.req.session.get(name) orElse {
|
||||
ctx.me flatMap (_ setting name) map (_.toString)
|
||||
|
|
|
@ -159,7 +159,8 @@ final class I18nKeys(translator: Translator) {
|
|||
val takebackPropositionCanceled = new Key("takebackPropositionCanceled")
|
||||
val yourOpponentProposesATakeback = new Key("yourOpponentProposesATakeback")
|
||||
val bookmarkThisGame = new Key("bookmarkThisGame")
|
||||
val toggleBackground = new Key("toggleBackground")
|
||||
val freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents = new Key("freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents")
|
||||
|
||||
def keys = List(playWithAFriend, inviteAFriendToPlayWithYou, playWithTheMachine, challengeTheArtificialIntelligence, toInviteSomeoneToPlayGiveThisUrl, gameOver, waitingForOpponent, waiting, yourTurn, aiNameLevelAiLevel, level, toggleTheChat, toggleSound, chat, resign, checkmate, stalemate, white, black, createAGame, noGameAvailableRightNowCreateOne, whiteIsVictorious, blackIsVictorious, playWithTheSameOpponentAgain, newOpponent, playWithAnotherOpponent, yourOpponentWantsToPlayANewGameWithYou, joinTheGame, whitePlays, blackPlays, theOtherPlayerHasLeftTheGameYouCanForceResignationOrWaitForHim, makeYourOpponentResign, forceResignation, talkInChat, theFirstPersonToComeOnThisUrlWillPlayWithYou, whiteCreatesTheGame, blackCreatesTheGame, whiteJoinsTheGame, blackJoinsTheGame, whiteResigned, blackResigned, whiteLeftTheGame, blackLeftTheGame, shareThisUrlToLetSpectatorsSeeTheGame, youAreViewingThisGameAsASpectator, replayAndAnalyse, viewGameStats, flipBoard, threefoldRepetition, claimADraw, offerDraw, draw, nbConnectedPlayers, talkAboutChessAndDiscussLichessFeaturesInTheForum, seeTheGamesBeingPlayedInRealTime, gamesBeingPlayedRightNow, viewAllNbGames, viewNbCheckmates, nbBookmarks, nbPopularGames, bookmarkedByNbPlayers, viewInFullSize, logOut, signIn, signUp, people, games, forum, chessPlayers, minutesPerSide, variant, timeControl, start, username, password, haveAnAccount, allYouNeedIsAUsernameAndAPassword, learnMoreAboutLichess, rank, gamesPlayed, declineInvitation, cancel, timeOut, drawOfferSent, drawOfferDeclined, drawOfferAccepted, drawOfferCanceled, yourOpponentOffersADraw, accept, decline, playingRightNow, abortGame, gameAborted, standard, unlimited, mode, casual, rated, thisGameIsRated, rematch, rematchOfferSent, rematchOfferAccepted, rematchOfferCanceled, rematchOfferDeclined, cancelRematchOffer, viewRematch, play, inbox, chatRoom, spectatorRoom, composeMessage, sentMessages, incrementInSeconds, freeOnlineChess, spectators, nbWins, nbLosses, nbDraws, exportGames, color, eloRange, giveNbSeconds, searchAPlayer, whoIsOnline, allPlayers, namedPlayers, premoveEnabledClickAnywhereToCancel, thisPlayerUsesChessComputerAssistance, opening, takeback, proposeATakeback, takebackPropositionSent, takebackPropositionDeclined, takebackPropositionAccepted, takebackPropositionCanceled, yourOpponentProposesATakeback, bookmarkThisGame, freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents)
|
||||
def keys = List(playWithAFriend, inviteAFriendToPlayWithYou, playWithTheMachine, challengeTheArtificialIntelligence, toInviteSomeoneToPlayGiveThisUrl, gameOver, waitingForOpponent, waiting, yourTurn, aiNameLevelAiLevel, level, toggleTheChat, toggleSound, chat, resign, checkmate, stalemate, white, black, createAGame, noGameAvailableRightNowCreateOne, whiteIsVictorious, blackIsVictorious, playWithTheSameOpponentAgain, newOpponent, playWithAnotherOpponent, yourOpponentWantsToPlayANewGameWithYou, joinTheGame, whitePlays, blackPlays, theOtherPlayerHasLeftTheGameYouCanForceResignationOrWaitForHim, makeYourOpponentResign, forceResignation, talkInChat, theFirstPersonToComeOnThisUrlWillPlayWithYou, whiteCreatesTheGame, blackCreatesTheGame, whiteJoinsTheGame, blackJoinsTheGame, whiteResigned, blackResigned, whiteLeftTheGame, blackLeftTheGame, shareThisUrlToLetSpectatorsSeeTheGame, youAreViewingThisGameAsASpectator, replayAndAnalyse, viewGameStats, flipBoard, threefoldRepetition, claimADraw, offerDraw, draw, nbConnectedPlayers, talkAboutChessAndDiscussLichessFeaturesInTheForum, seeTheGamesBeingPlayedInRealTime, gamesBeingPlayedRightNow, viewAllNbGames, viewNbCheckmates, nbBookmarks, nbPopularGames, bookmarkedByNbPlayers, viewInFullSize, logOut, signIn, signUp, people, games, forum, chessPlayers, minutesPerSide, variant, timeControl, start, username, password, haveAnAccount, allYouNeedIsAUsernameAndAPassword, learnMoreAboutLichess, rank, gamesPlayed, declineInvitation, cancel, timeOut, drawOfferSent, drawOfferDeclined, drawOfferAccepted, drawOfferCanceled, yourOpponentOffersADraw, accept, decline, playingRightNow, abortGame, gameAborted, standard, unlimited, mode, casual, rated, thisGameIsRated, rematch, rematchOfferSent, rematchOfferAccepted, rematchOfferCanceled, rematchOfferDeclined, cancelRematchOffer, viewRematch, play, inbox, chatRoom, spectatorRoom, composeMessage, sentMessages, incrementInSeconds, freeOnlineChess, spectators, nbWins, nbLosses, nbDraws, exportGames, color, eloRange, giveNbSeconds, searchAPlayer, whoIsOnline, allPlayers, namedPlayers, premoveEnabledClickAnywhereToCancel, thisPlayerUsesChessComputerAssistance, opening, takeback, proposeATakeback, takebackPropositionSent, takebackPropositionDeclined, takebackPropositionAccepted, takebackPropositionCanceled, yourOpponentProposesATakeback, bookmarkThisGame, toggleBackground, freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents)
|
||||
}
|
||||
|
|
|
@ -24,5 +24,9 @@ object DataForm {
|
|||
"theme" -> nonEmptyText.verifying(Theme contains _)
|
||||
))
|
||||
|
||||
val bg = Form(single(
|
||||
"bg" -> text.verifying(Set("light", "dark") contains _)
|
||||
))
|
||||
|
||||
private def jsBoolean = nonEmptyText.verifying(Set("true", "false") contains _)
|
||||
}
|
||||
|
|
|
@ -9,6 +9,7 @@
|
|||
@cssTag("board.css")
|
||||
@cssTag("gamelist.css")
|
||||
@cssTag("opening.css")
|
||||
@cssTag("dark.css")
|
||||
@moreCss
|
||||
<meta content="@trans.freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents()" name="description">
|
||||
<meta name="google-site-verification" content="fZ08Imok7kcLaGcJg7BKQExO6vXGgSgsJUsW6JalUCo" />
|
||||
|
@ -17,7 +18,7 @@
|
|||
<meta content="noindex, nofollow" name="robots">
|
||||
}
|
||||
</head>
|
||||
<body class="@setting.theme.name" data-sound-file="@routes.Assets.at("sound/alert.ogg")">
|
||||
<body class="@setting.theme.name @setting.bg" data-sound-file="@routes.Assets.at("sound/alert.ogg")">
|
||||
<div id="site_description">@trans.freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents()</div>
|
||||
<div id="top" class="clearfix">
|
||||
<a href="@routes.Setting.set("sound")" title="@trans.toggleSound()" id="sound_state" class="available @soundString">
|
||||
|
@ -57,6 +58,9 @@
|
|||
}
|
||||
</div>
|
||||
</div>
|
||||
<a href="@routes.Setting.set("bg")" title="@trans.toggleBackground()" class="bgpicker">
|
||||
<span></span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="header">
|
||||
|
|
|
@ -135,4 +135,5 @@ takebackPropositionAccepted=Takeback proposition accepted
|
|||
takebackPropositionCanceled=Takeback proposition canceled
|
||||
yourOpponentProposesATakeback=Your opponent proposes a takeback
|
||||
bookmarkThisGame=Bookmark this game
|
||||
toggleBackground=Toggle background color
|
||||
freeOnlineChessGamePlayChessNowInACleanInterfaceNoRegistrationNoAdsNoPluginRequiredPlayChessWithComputerFriendsOrRandomOpponents=Free online Chess game. Play Chess now in a clean interface. No registration, no ads, no plugin required. Play Chess with computer, friends or random opponents.
|
||||
|
|
BIN
public/images/head_bg_dark.png
Normal file
BIN
public/images/head_bg_dark.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 194 B |
Binary file not shown.
Before Width: | Height: | Size: 2 KiB After Width: | Height: | Size: 3.1 KiB |
|
@ -63,17 +63,31 @@ $(function() {
|
|||
}
|
||||
|
||||
// themepicker
|
||||
var theme = document.body.className;
|
||||
$('#top div.themepicker div.theme').hover(function() {
|
||||
document.body.className = $(this).data("theme");
|
||||
var $body = $('body');
|
||||
var $themes = $('#top div.themepicker div.theme');
|
||||
var themes = $.makeArray($themes.map(function() { return $(this).data("theme"); }));
|
||||
var theme = $.map(document.body.className.split(/\s+/), function(a){return $.inArray(a, themes) < 0 ? null : a;})[0];
|
||||
$themes.hover(function() {
|
||||
$body.removeClass(themes.join(' ')).addClass($(this).data("theme"));
|
||||
}, function() {
|
||||
document.body.className = theme;
|
||||
$body.removeClass(themes.join(' ')).addClass(theme);
|
||||
}).click(function() {
|
||||
theme = $(this).data("theme");
|
||||
$.post($(this).parent().data("href"), {"theme": theme});
|
||||
$('#top .themepicker').removeClass("shown");
|
||||
});
|
||||
|
||||
// bgpicker
|
||||
var bgs = ["light", "dark"];
|
||||
var bg = $body.hasClass("dark") ? "dark" : "light";
|
||||
function invertBg(bg) { return bg == "dark" ? "light" : "dark"; }
|
||||
$('#top a.bgpicker').click(function() {
|
||||
bg = invertBg(bg);
|
||||
$body.removeClass(bgs.join(' ')).addClass(bg);
|
||||
$.post($(this).attr('href'), {bg: bg});
|
||||
return false;
|
||||
});
|
||||
|
||||
$.centerOverboard = function() {
|
||||
if ($overboard = $('div.lichess_overboard.auto_center').orNot()) {
|
||||
$overboard.css('top', (238 - $overboard.height() / 2) + 'px').show();
|
||||
|
|
|
@ -67,9 +67,9 @@ span.board_mark.horz {
|
|||
height: 2em;
|
||||
}
|
||||
#GameText {
|
||||
font-size: 1.3em;
|
||||
font-size: 1.4em;
|
||||
width: 220px;
|
||||
height: 400px;
|
||||
height: 512px;
|
||||
margin-bottom: 1em;
|
||||
background: #f7f7f7;
|
||||
border: 1px solid #C0C0C0;
|
||||
|
|
|
@ -300,7 +300,6 @@ div.lichess_promotion_choice div.lichess_piece:hover {
|
|||
}
|
||||
|
||||
div.lichess_board_wrap {
|
||||
box-shadow: 0 0 7px #bbb;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
@ -584,7 +583,6 @@ div.lichess_chat {
|
|||
position: absolute;
|
||||
top: 207px;
|
||||
left: 0;
|
||||
box-shadow: 0 0 7px #d0d0d0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
div.lichess_chat.lobby_chat {
|
||||
|
@ -636,7 +634,6 @@ div.lichess_chat form input {
|
|||
padding: 2px 20px 2px 4px;
|
||||
border-radius: 0 0 4px 4px;
|
||||
width: 172px;
|
||||
background: white;
|
||||
}
|
||||
div.lichess_chat input.lichess_hint {
|
||||
color: #888;
|
||||
|
|
|
@ -117,9 +117,6 @@ div.footer div.right {
|
|||
cursor: pointer;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
.button:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a.easy_button {
|
||||
font-weight: normal;
|
||||
|
@ -227,7 +224,7 @@ div.side_menu a.active {
|
|||
box-shadow: -3px 0 6px #d0d0d0;
|
||||
}
|
||||
|
||||
#nb_connected_players, a.goto_nav, #top a.toggle, a#sound_state {
|
||||
#nb_connected_players, a.goto_nav, #top a.toggle, #top a.bgpicker, a#sound_state {
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
height: 24px;
|
||||
|
@ -244,7 +241,7 @@ div.side_menu a.active {
|
|||
a.goto_nav {
|
||||
float: left;
|
||||
}
|
||||
a.goto_nav:hover, #top a.toggle:hover, a#sound_state:hover {
|
||||
a.goto_nav:hover, #top a.toggle:hover, #top a.bgpicker:hover, a#sound_state:hover {
|
||||
background: #fff;
|
||||
}
|
||||
#top .s16 {
|
||||
|
@ -253,15 +250,15 @@ a.goto_nav:hover, #top a.toggle:hover, a#sound_state:hover {
|
|||
margin-top: 4px;
|
||||
line-height: 16px;
|
||||
}
|
||||
a.goto_nav span.new_messages {
|
||||
padding: 1px 4px;
|
||||
#top span.new_messages {
|
||||
padding: 1px 5px 1px 4px;
|
||||
background: #bbb;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
border-radius:4px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
a.goto_nav span.new_messages.unread {
|
||||
#top span.new_messages.unread {
|
||||
font-size: 1em;
|
||||
}
|
||||
#top .shown a.toggle {
|
||||
|
@ -413,6 +410,18 @@ ul.lichess_language_links li:last-child {
|
|||
left: 64px;
|
||||
}
|
||||
|
||||
#top a.bgpicker {
|
||||
float: right;
|
||||
}
|
||||
#top a.bgpicker span {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
opacity: 0.7;
|
||||
background: url(../images/s24.png) no-repeat;
|
||||
background-position: 0 -48px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
a#sound_state {
|
||||
float: right;
|
||||
}
|
||||
|
@ -582,6 +591,14 @@ div.hooks td.action {
|
|||
background: linear-gradient(top , #aaa, #999) repeat scroll 0 0 #999;
|
||||
}
|
||||
|
||||
/* standard shadow */
|
||||
div.lichess_chat,
|
||||
div.undertable,
|
||||
div.lichess_board_wrap
|
||||
{
|
||||
box-shadow: 0 0 7px #d0d0d0;
|
||||
}
|
||||
|
||||
div.checkmateFen {
|
||||
float: left;
|
||||
width: 220px;
|
||||
|
|
190
public/stylesheets/dark.css
Normal file
190
public/stylesheets/dark.css
Normal file
|
@ -0,0 +1,190 @@
|
|||
body.dark {
|
||||
background: #1a1a1a url(../images/head_bg_dark.png) top left repeat-x;
|
||||
color: #a0a0a0;
|
||||
}
|
||||
|
||||
body.dark a, a:visited {
|
||||
color: #a0a0a0;
|
||||
}
|
||||
|
||||
body.dark input,
|
||||
body.dark textarea {
|
||||
background: #000;
|
||||
color: #d0d0d0;
|
||||
}
|
||||
|
||||
/* standard shadow */
|
||||
body.dark div.lichess_chat,
|
||||
body.dark div.undertable,
|
||||
body.dark div.lichess_board_wrap,
|
||||
body.dark div.lichess_table .lichess_button,
|
||||
body.dark div.lichess_goodies div.box,
|
||||
body.dark div.lichess_table,
|
||||
body.dark div.game_more,
|
||||
body.dark div.clock,
|
||||
body.dark #GameText,
|
||||
body.dark #GameBoard table.boardTable
|
||||
{
|
||||
box-shadow: 0 0 5px #505050;
|
||||
}
|
||||
|
||||
body.dark #top,
|
||||
body.dark #nb_connected_players,
|
||||
body.dark div.lichess_chat_top,
|
||||
body.dark div.lichess_chat ol,
|
||||
body.dark div.undertable_top,
|
||||
body.dark div.undertable_inner,
|
||||
body.dark div.lichess_table .lichess_button,
|
||||
body.dark div.lichess_chat form input,
|
||||
body.dark div.lichess_board_wrap,
|
||||
body.dark a.translation_call,
|
||||
body.dark div.hooks,
|
||||
body.dark div.hooks table,
|
||||
body.dark div.hooks td.action,
|
||||
body.dark div.lichess_bot td,
|
||||
body.dark div.footer_wrap,
|
||||
body.dark div.game_config .optional_config,
|
||||
body.dark .ui-state-default,
|
||||
body.dark .ui-widget-content,
|
||||
body.dark div.lichess_goodies div.box,
|
||||
body.dark div.lichess_table,
|
||||
body.dark div.lichess_separator,
|
||||
body.dark div.game_more,
|
||||
body.dark div.game_extra,
|
||||
body.dark div.clock,
|
||||
body.dark .button,
|
||||
body.dark #GameText,
|
||||
body.dark #GameBoard table.boardTable
|
||||
{
|
||||
border-color: #4a4a4a;
|
||||
}
|
||||
|
||||
body.dark .ui-slider {
|
||||
background-color: #505050;
|
||||
}
|
||||
|
||||
body.dark #site_title,
|
||||
body.dark #site_baseline {
|
||||
color: #808080;
|
||||
}
|
||||
body.dark #site_title span.extension {
|
||||
color: #707070;
|
||||
}
|
||||
|
||||
body.dark #top span.new_messages {
|
||||
background: #707070;
|
||||
}
|
||||
|
||||
body.dark div.anon_chat a.user_link {
|
||||
color: #707070;
|
||||
}
|
||||
|
||||
body.dark div.hooks_wrap {
|
||||
box-shadow: 0 0 20px #444;
|
||||
background: rgba(10,10,10,0.8);
|
||||
background: -moz-linear-gradient(top, rgba(33,33,33,0.9) 0%, rgba(15,15,15,0.5) 100%);
|
||||
background: -webkit-linear-gradient(top, rgba(33,33,33,0.9) 0%,rgba(15,15,15,0.5) 100%);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(33,33,33,0.9)), to(rgba(15,15,15,0.5)));
|
||||
background: -ms-linear-gradient(top, rgba(33,33,33,0.9) 0%,rgba(15,15,15,0.5) 100%);
|
||||
background: -o-linear-gradient(top, rgba(33,33,33,0.9) 0%,rgba(15,15,15,0.5) 100%);
|
||||
}
|
||||
|
||||
body.dark div.lichess_bot td {
|
||||
background: #000;
|
||||
}
|
||||
body.dark div.lichess_bot tr:nth-child(even) td {
|
||||
background: #202020;
|
||||
}
|
||||
body.dark div.lichess_bot tr:hover td {
|
||||
background: #303030;
|
||||
}
|
||||
body.dark div.new_posts li span {
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
body.dark div.lichess_overboard {
|
||||
background: #000;
|
||||
box-shadow: 0 0 20px #d0d0d0;
|
||||
}
|
||||
body.dark div.game_config .optional_config {
|
||||
background: #303030;
|
||||
}
|
||||
|
||||
body.dark span.board_mark {
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
body.dark #GameText {
|
||||
background: #202020;
|
||||
}
|
||||
body.dark #GameText tr:nth-child(even) {
|
||||
background: #000;
|
||||
}
|
||||
body.dark #GameText a.move {
|
||||
color: #d0d0d0;
|
||||
}
|
||||
|
||||
body.dark div.footer_wrap {
|
||||
background: #303030;
|
||||
}
|
||||
|
||||
/* soft inactive gradient */
|
||||
body.dark #top,
|
||||
body.dark div.lichess_chat_top,
|
||||
body.dark div.undertable_top,
|
||||
body.dark .button,
|
||||
body.dark .button:visited,
|
||||
body.dark .ui-state-default,
|
||||
body.dark div.content_box_top,
|
||||
body.dark div.hooks tr,
|
||||
body.dark a.translation_call {
|
||||
background: #404040;
|
||||
color: #b0b0b0;
|
||||
background: -moz-linear-gradient(center top , #404040, #202020) repeat scroll 0 0 #404040;
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#404040), to(#202020));
|
||||
background: -webkit-linear-gradient(top , #404040, #202020) repeat scroll 0 0 #404040;
|
||||
background: -ms-linear-gradient(top , #404040, #202020) repeat scroll 0 0 #404040;
|
||||
background: -o-linear-gradient(top , #404040, #202020) repeat scroll 0 0 #404040;
|
||||
background: linear-gradient(top , #404040, #202020) repeat scroll 0 0 #404040;
|
||||
}
|
||||
/* strong inactive gradient */
|
||||
body.dark div.hooks td.action {
|
||||
background: #606060;
|
||||
background: -moz-linear-gradient(center top , #606060, #000) repeat scroll 0 0 #606060;
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#606060), to(#000));
|
||||
background: -webkit-linear-gradient(top , #606060, #000) repeat scroll 0 0 #606060;
|
||||
background: -ms-linear-gradient(top , #606060, #000) repeat scroll 0 0 #606060;
|
||||
background: -o-linear-gradient(top , #606060, #000) repeat scroll 0 0 #606060;
|
||||
background: linear-gradient(top , #606060, #000) repeat scroll 0 0 #606060;
|
||||
}
|
||||
/* active gradient */
|
||||
body.dark #top a.goto_nav.active,
|
||||
body.dark .button.active,
|
||||
body.dark .button:hover,
|
||||
body.dark .ui-state-active,
|
||||
body.dark .ui-widget-header,
|
||||
body.dark div.pagination span.current,
|
||||
body.dark a.goto_nav span.new_messages.unread,
|
||||
body.dark div.hooks td.action:hover,
|
||||
body.dark div.hooks table.empty_table tr:hover,
|
||||
body.dark div.progressbar.flashy div {
|
||||
color: #fff;
|
||||
background: #d85000;
|
||||
background: -moz-linear-gradient(center top , #f49c00, #d85000) repeat scroll 0 0 #d85000;
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f49c00), to(#d85000));
|
||||
background: -webkit-linear-gradient(top , #f49c00, #d85000) repeat scroll 0 0 #d85000;
|
||||
background: -ms-linear-gradient(top , #f49c00, #d85000) repeat scroll 0 0 #d85000;
|
||||
background: -o-linear-gradient(top , #f49c00, #d85000) repeat scroll 0 0 #d85000;
|
||||
background: linear-gradient(top , #f49c00, #d85000) repeat scroll 0 0 #d85000;
|
||||
}
|
||||
/* current gradient */
|
||||
body.dark #top a.goto_nav.current {
|
||||
color: #fff;
|
||||
background: #808080;
|
||||
background: -moz-linear-gradient(center top , #808080, #606060) repeat scroll 0 0 #808080;
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#808080), to(#606060));
|
||||
background: -webkit-linear-gradient(top , #808080, #606060) repeat scroll 0 0 #606060;
|
||||
background: -ms-linear-gradient(top , #808080, #606060) repeat scroll 0 0 #606060;
|
||||
background: -o-linear-gradient(top , #808080, #606060) repeat scroll 0 0 #606060;
|
||||
background: linear-gradient(top , #808080, #606060) repeat scroll 0 0 #606060;
|
||||
}
|
|
@ -70,20 +70,20 @@ div.game_config div.color_submits button.random span {
|
|||
background-position: 0 -102px;
|
||||
}
|
||||
div.hooks_wrap {
|
||||
position: absolute;
|
||||
width: 384px;
|
||||
height: 384px;
|
||||
top: 51px;
|
||||
left: 52px;
|
||||
padding: 12px;
|
||||
border-radius: 3px;
|
||||
box-shadow: 0 0 20px #444;
|
||||
background: rgba(245,245,245,0.8);
|
||||
background: -moz-linear-gradient(top, rgba(212,212,212,0.9) 0%, rgba(240,240,240,0.5) 100%);
|
||||
background: -webkit-linear-gradient(top, rgba(212,212,212,0.9) 0%,rgba(240,240,240,0.5) 100%);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(212,212,212,0.9)), to(rgba(240,240,240,0.5)));
|
||||
background: -ms-linear-gradient(top, rgba(212,212,212,0.9) 0%,rgba(240,240,240,0.5) 100%);
|
||||
background: -o-linear-gradient(top, rgba(212,212,212,0.9) 0%,rgba(240,240,240,0.5) 100%);
|
||||
position: absolute;
|
||||
width: 384px;
|
||||
height: 384px;
|
||||
top: 51px;
|
||||
left: 52px;
|
||||
padding: 12px;
|
||||
border-radius: 3px;
|
||||
box-shadow: 0 0 20px #444;
|
||||
background: rgba(245,245,245,0.8);
|
||||
background: -moz-linear-gradient(top, rgba(212,212,212,0.9) 0%, rgba(240,240,240,0.5) 100%);
|
||||
background: -webkit-linear-gradient(top, rgba(212,212,212,0.9) 0%,rgba(240,240,240,0.5) 100%);
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(212,212,212,0.9)), to(rgba(240,240,240,0.5)));
|
||||
background: -ms-linear-gradient(top, rgba(212,212,212,0.9) 0%,rgba(240,240,240,0.5) 100%);
|
||||
background: -o-linear-gradient(top, rgba(212,212,212,0.9) 0%,rgba(240,240,240,0.5) 100%);
|
||||
}
|
||||
div.hooks_wrap.large {
|
||||
height: 512px;
|
||||
|
@ -91,59 +91,55 @@ div.hooks_wrap.large {
|
|||
}
|
||||
|
||||
div.hooks_wrap.hidden {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
div.hooks {
|
||||
border: 1px solid #bababa;
|
||||
border-top: 0
|
||||
border: 1px solid #bababa;
|
||||
border-top: 0
|
||||
}
|
||||
div.hooks table {
|
||||
width: 100%;
|
||||
max-height: 424px;
|
||||
overflow: hidden;
|
||||
text-align: left;
|
||||
border-collapse: collapse;
|
||||
background: none;
|
||||
color: #666;
|
||||
border-top: 1px solid #bababa;
|
||||
}
|
||||
div.hooks table a {
|
||||
color: #666;
|
||||
width: 100%;
|
||||
max-height: 424px;
|
||||
overflow: hidden;
|
||||
text-align: left;
|
||||
border-collapse: collapse;
|
||||
background: none;
|
||||
border-top: 1px solid #bababa;
|
||||
}
|
||||
div.hooks table.empty_table {
|
||||
margin-top: 152px;
|
||||
margin-top: 152px;
|
||||
}
|
||||
div.hooks td {
|
||||
padding: 0 8px 0 12px;
|
||||
height: 64px;
|
||||
margin: 0;
|
||||
padding: 0 8px 0 12px;
|
||||
height: 64px;
|
||||
margin: 0;
|
||||
}
|
||||
div.hooks tr:last-child td {
|
||||
border-bottom: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
div.hooks table.empty_table tr {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
div.hooks table.empty_table td {
|
||||
padding: 0;
|
||||
height: 80px;
|
||||
padding: 0;
|
||||
height: 80px;
|
||||
}
|
||||
div.hooks td.color {
|
||||
width: 24px;
|
||||
padding-right: 0;
|
||||
width: 24px;
|
||||
padding-right: 0;
|
||||
}
|
||||
div.hooks td.color span {
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
display: block;
|
||||
background: url(../images/sprite_color_24.png) no-repeat;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
display: block;
|
||||
background: url(../images/sprite_color_24.png) no-repeat;
|
||||
}
|
||||
div.hooks td.color span.black {
|
||||
background-position: 0 -24px;
|
||||
background-position: 0 -24px;
|
||||
}
|
||||
div.hooks td.color span.random {
|
||||
background-position: 0 -49px;
|
||||
background-position: 0 -49px;
|
||||
}
|
||||
div.hooks span.elorange {
|
||||
display: block;
|
||||
|
@ -157,10 +153,10 @@ div.hooks a.user_link.engine {
|
|||
color: #cc7070;
|
||||
}
|
||||
div.hooks td.action {
|
||||
cursor: pointer;
|
||||
border-left: 1px solid #cacaca;
|
||||
width: 63px;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
border-left: 1px solid #cacaca;
|
||||
width: 63px;
|
||||
padding: 0;
|
||||
}
|
||||
div.hooks td.action.empty {
|
||||
cursor: default;
|
||||
|
@ -168,31 +164,30 @@ div.hooks td.action.empty {
|
|||
}
|
||||
div.hooks a.cancel,
|
||||
div.hooks a.join {
|
||||
height: 32px;
|
||||
width: 31px;
|
||||
display: block;
|
||||
padding: 12px 14px;
|
||||
height: 32px;
|
||||
width: 31px;
|
||||
display: block;
|
||||
padding: 12px 14px;
|
||||
}
|
||||
div.hooks a.cancel {
|
||||
background: url(../images/close24.png) +16px no-repeat;
|
||||
background: url(../images/close24.png) +16px no-repeat;
|
||||
}
|
||||
div.hooks a.join {
|
||||
background: url(../images/play32.png) +16px no-repeat;
|
||||
background: url(../images/play32.png) +16px no-repeat;
|
||||
}
|
||||
div.hooks tr.my_hook {
|
||||
color: #405090;
|
||||
background: #c9dbee;
|
||||
color: #405090;
|
||||
background: #c9dbee;
|
||||
}
|
||||
|
||||
div.hooks a.user_link {
|
||||
background: transparent;
|
||||
padding-left: 0;
|
||||
background: transparent;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
div.undertable {
|
||||
width: 514px;
|
||||
font-size: 11px;
|
||||
box-shadow: 0 0 7px #d0d0d0;
|
||||
margin-top: 15px;
|
||||
}
|
||||
div.undertable_top {
|
||||
|
@ -217,6 +212,14 @@ div.undertable_inner {
|
|||
height: 163px;
|
||||
overflow:hidden;
|
||||
}
|
||||
div.undertable a.user_link {
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
color: #999;
|
||||
}
|
||||
div.undertable a.user_link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
div.lichess_bot table {
|
||||
width: 100%;
|
||||
|
@ -233,16 +236,6 @@ div.lichess_bot td {
|
|||
div.lichess_bot tr:nth-child(even) td {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
div.lichess_bot a.user_link {
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
color: #999;
|
||||
background: transparent;
|
||||
padding-left: 0;
|
||||
}
|
||||
div.lichess_bot a.user_link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
div.lichess_bot a.watch {
|
||||
display: block;
|
||||
width: 24px;
|
||||
|
@ -270,13 +263,3 @@ div.new_posts li span {
|
|||
margin-right: 6px;
|
||||
color: #aaa;
|
||||
}
|
||||
div.new_posts a.user_link {
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
color: #aaa;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
div.new_posts a.user_link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
|
5
todo
5
todo
|
@ -15,4 +15,9 @@ cheater slash timeline
|
|||
best game(s) to watch
|
||||
use twitter tooltip instead of tipsy http://twitter.github.com/bootstrap/javascript.html#tooltip
|
||||
make some elo inflation
|
||||
optional darker background http://en.lichess.org/forum/lichess-feedback/new-options#2
|
||||
volume control
|
||||
board on side
|
||||
check(mate) sound
|
||||
mute player = no game room either
|
||||
|
||||
|
|
Loading…
Reference in a new issue