Skip to content

Instantly share code, notes, and snippets.

@tiagoamaro
Last active July 14, 2023 23:45
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tiagoamaro/9ae01c485d91861b724a99e458de50a8 to your computer and use it in GitHub Desktop.
Save tiagoamaro/9ae01c485d91861b724a99e458de50a8 to your computer and use it in GitHub Desktop.
Chess.com Stauton piece styles on Lichess using Stylus
/* ==UserStyle==
@name 9/30/2022, 3:33:22 PM
@namespace github.com/openstyles/stylus
@version 0.0.1
@description Margin-top on chess.com board
@author github.com/tiagoamaro
==/UserStyle== */
@-moz-document domain("chess.com") {
#board-layout-main {
padding-top: 2rem;
}
#board-layout-player-top img {
width: 0;
}
#player-bottom .player-component {
padding-top: 1.4rem;
}
#player-bottom .player-component img {
display: none
}
}
/* ==UserStyle==
@name lichess.org - 10/15/2022, 6:30:45 PM
@namespace github.com/openstyles/stylus
@version 1.0.0
@description Chess.com 3D Stauton chess pieces on lichess
@author tiagoamaro
==/UserStyle== */
@-moz-document url-prefix("https://lichess.org/") {
#promotion-choice .queen,
#promotion-choice .knight,
#promotion-choice .rook,
#promotion-choice .bishop {
background-position: 45% 65%;
}
/* White pieces */
.Staunton .pawn.white {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/wp.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .rook.white {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/wr.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .knight.white {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/wn.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .bishop.white {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/wb.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .queen.white {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/wq.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .king.white {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/wk.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
/* Black pieces */
.Staunton .pawn.black {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/bp.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .rook.black {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/br.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .knight.black {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/bn.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .bishop.black {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/bb.png");
background-repeat: no-repeat;
background-position: 45% 83%;
background-size: 70%;
}
.Staunton .queen.black {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/bq.png");
background-repeat: no-repeat;
background-position: 45% 70%;
background-size: 70%;
}
.Staunton .king.black {
background-image: url("https://images.chesscomfiles.com/chess-themes/pieces/3d_staunton/150/bk.png");
background-repeat: no-repeat;
background-position: 45% 70%;
background-size: 70%;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment