Tips for UI, translations, insights, swiss, accessibility

User interface

Javascripts and CSS:

ui/build --help

Read up on our custom package.json properties to learn how assets are built and linked.

Translations

1. New translation keys are added in translation/source/site.xml in British English.
2. Then regenerate translation keys for Scala: pnpm run trans-dump
3. Also update translation typings and objects for Javascript: ui/build

Do not touch translations/dest/. New translations from crowdin will automatically be applied here.

If you need to add a new file to translation/source (for example to translate a completely new page), you also need to add the name of the file (without the extension):

In bin/trans-dump.ts: here

In /build.sbt: here

For an in-depth explanation of how the whole translation system works, see How translations work.

Puzzles

Import some puzzle data.

Forum

Create the default categories.

Swiss

You need to install and run bbpPairings. Mind that Lichess uses cyanfish fork.

To set up a swiss tournament, you need to be a team leader. For the Lichess one's to be working properly it's advised to create the team of the official Lichess swiss.

Insights

1. Download insights sample data.
2. run

mongorestore --db lichess-insight --collection insight insight.bson

3. Register an account named thibault.
4. Either play one rated game with it or hack this function.
5. Access to http://localhost:9663/insights/thibault/

Using icons in source code

bin/gen/licon.py --help

Font icon to SVG

Extract all fonts as SVG fontforge -lang=ff -c 'Open($1); SelectWorthOutputting(); foreach Export("svg"); endloop;' lichess.sfd Where lichess.sfd is https://github.com/lichess-org/lila/blob/master/public/font/lichess.sfd

Accessibility

To activate Accessibility mode on lichess, press tab then enter on the homepage.

Most of the code is located in ui/nvui, and it is then loaded as a plugin.