├── .gitignore ├── favicon.ico ├── sound ├── water.mp3 ├── bgm │ ├── Eta.m4a │ ├── Zeta.m4a │ └── waterFrogs.mp3 ├── bubble.mp3 └── success.mp3 ├── screenshot ├── game.png ├── home.png ├── level.png └── success.gif ├── package.json ├── README.md ├── index.html ├── css ├── index.css.map └── index.css ├── scss └── index.scss ├── index.js └── LICENSE /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/favicon.ico -------------------------------------------------------------------------------- /sound/water.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/sound/water.mp3 -------------------------------------------------------------------------------- /sound/bgm/Eta.m4a: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/sound/bgm/Eta.m4a -------------------------------------------------------------------------------- /sound/bgm/Zeta.m4a: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/sound/bgm/Zeta.m4a -------------------------------------------------------------------------------- /sound/bubble.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/sound/bubble.mp3 -------------------------------------------------------------------------------- /sound/success.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/sound/success.mp3 -------------------------------------------------------------------------------- /screenshot/game.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/screenshot/game.png -------------------------------------------------------------------------------- /screenshot/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/screenshot/home.png -------------------------------------------------------------------------------- /screenshot/level.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/screenshot/level.png -------------------------------------------------------------------------------- /screenshot/success.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/screenshot/success.gif -------------------------------------------------------------------------------- /sound/bgm/waterFrogs.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/yoqo/sudoku-game/HEAD/sound/bgm/waterFrogs.mp3 -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "sudoku-game", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "css": "sass --watch scss:css" 9 | }, 10 | "author": "", 11 | "license": "ISC", 12 | "devDependencies": { 13 | "sass": "^1.43.4" 14 | }, 15 | "repository": { 16 | "type": "git", 17 | "url": "https://github.com/yoqo/sudoku-game.git" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Sudoku-game 2 | 3 | [Play Online](http://www.3yak.com/sudoku/) 4 | 5 | ## Features 6 | 7 | - 0 JS dependency 8 | - Four kinds of difficulty 9 | - Level system 10 | - Just click 11 | - Random color theme 12 | - Music, sound effect 13 | 14 | ## Todos 15 | 16 | - Mobile experience 17 | 18 | ## Screenshots 19 | 20 | ![home](https://tva1.sinaimg.cn/large/0063X11aly8gwbii1nr5nj310r0po3z8.jpg) 21 | ![level](https://tva3.sinaimg.cn/large/0063X11aly8gwbiih9l9lj310o0pfdh2.jpg) 22 | ![game](https://tva3.sinaimg.cn/large/0063X11aly8gwbiiwth8mj310m0pkac2.jpg) 23 | ![success](https://tva4.sinaimg.cn/large/0063X11aly8gwbij6kt6rg309o06jgv0.gif) 24 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Sudoku Game 8 | 9 | 10 | 11 | 12 | 13 |
14 |
15 |
16 |

数独

17 |

SUDOKU

18 |
19 |
20 |
START
21 |
22 | 27 |
28 |
29 |
30 |
    31 |
  • Easy
  • 32 |
  • Normal
  • 33 |
  • Hard
  • 34 |
  • Hell
  • 35 | 36 |
37 |
    38 |
    39 |
    40 |
    41 | 42 |
    43 |
    44 |
    45 |
    46 |
    Level complete!
    47 |
    48 |
    49 |
    50 |
    51 |
    52 |
    53 |
    54 |
    55 | 56 |
    57 |
    58 | 59 |
    60 |
    61 |
    62 |
    63 | 64 |
    65 |
    66 |
    67 |
    68 | 71 | 72 | 73 | -------------------------------------------------------------------------------- /css/index.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sourceRoot":"","sources":["../scss/index.scss"],"names":[],"mappings":"AAoCA;EACE;IACE;;EAEF;IACE;;;AAGJ;EACE;IACE;;EAEF;IACE;;;AAGJ;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EAEE;;;AAGJ;EACE;EACA;EACA;;AACA;EAEE;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EAnJA;EACA;EACA;EAmJE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;;AAEF;EACE;EACA;;;AAGJ;EAzLE;EACA;EACA;EACA;EACA;EAuLA;;;AAEF;EAtLE;EACA;EACA;EATA;EACA;EACA;EACA;EACA;EA4LA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AACA;AAAA;EA5LF;EACA;EACA;EACA;;AA6LE;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAGJ;EA/MA;EACA;EACA;EA+ME;;AACA;EAvMF;EAyMI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAIN;EACE;EACA;EACA;EACA;;AACA;EACE;;;AAIN;EAjPE;EACA;EACA;EATA;EACA;EACA;EACA;EACA;EAuPA;EACA;;AACA;EAtPA;EACA;EACA;EAsPE;EACA;;AAEF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AAIN;EACE;;AACA;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACA;EACE;EACA;;AAEF;EACE;;AAOR;EACE;;AAEF;EACE;;AAIF;EACE;;AAEF;EACE;;AAIF;EACE;;AAEF;EACE;;AAIF;EACE;;AAEF;EACE;;;AAIN;EA1VE;EACA;EACA;EATA;EACA;EACA;EACA;EACA;EAgWA;;AAEE;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAEF;EAnWF;EACA;EACA;EACA;;AAmWE;EACE,OAjYU;EAkYV,QAlYU;EAmYV;EACA;EACA;EACA;;AAEF;EACE,OAxYM;EAyYN,QAzYM;EA0YN;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EA9XJ;EACA;EACA;EA8XM;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EA9YN;EACA;EACA;EA8YQ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EAnaR;EACA;EACA;EAmaU;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAMJ;EACE;EACA;;AAEF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;;AACA;EACE;;AACA;EACE;EACA;EACA;;AAON;EACE,OA9eA;EA+eA,QA/eA;;AAifF;EAEE;EACA;;AACA;EACE;;AAIF;EACE;;AACA;EACE;;AACA;EACE;;AASN;EA/eV;EACA;EACA;EACA;EA8eY;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAGJ;EACE;;AAQN;EAEE,wBAJK;;AAQP;EAEE,yBAVK;;AAcP;EAEE,2BAhBK;;AAoBP;EAEE,4BAtBK;;;AA2Bb;EA7iBE;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAuiBA;EACA;EACA;EACA;EACA;EACA;;AACA;EA/iBA;EACA;EACA;;AA+iBE;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EAEE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAIN;EACE;EACA;EACA;;AAGI;EACE;;AAEF;EACE;;AAIN;EACE;;;AAOJ;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE;;;AAnCd;EACE;;AAOI;EACE;;AAKA;EACE;;AAOA;EACE;;AACA;EACE;;AAKJ;EACE;;AAGA;EACE","file":"index.css"} -------------------------------------------------------------------------------- /scss/index.scss: -------------------------------------------------------------------------------- 1 | $out: cubic-bezier(0.22, 0.61, 0.36, 1); 2 | $gridNineWidth: 26.3vmin; 3 | $cellWidth: calc($gridNineWidth / 3); 4 | $cellBorderWidth: 0.2vmin; 5 | @function color($num) { 6 | @return hsl($num * 5, 40%, 40%); 7 | } 8 | @function black($num) { 9 | @return rgba(0, 0, 0, $num * 0.01); 10 | } 11 | @function white($num) { 12 | @return rgba(255, 255, 255, $num * 0.01); 13 | } 14 | 15 | @mixin fullscreen { 16 | position: absolute; 17 | left: 0; 18 | top: 0; 19 | height: 100vh; 20 | width: 100vw; 21 | } 22 | @mixin flex-center { 23 | display: flex; 24 | justify-content: center; 25 | align-items: center; 26 | } 27 | @mixin ab-center { 28 | position: absolute; 29 | left: 50%; 30 | top: 50%; 31 | transform: translate(-50%, -50%); 32 | } 33 | @mixin transition { 34 | transition: all 0.2s ease-in-out; 35 | } 36 | 37 | @keyframes fadeIn { 38 | 0% { 39 | opacity: 0; 40 | } 41 | 100% { 42 | opacity: 1; 43 | } 44 | } 45 | @keyframes fadeOut { 46 | 0% { 47 | opacity: 1; 48 | } 49 | 100% { 50 | opacity: 0; 51 | } 52 | } 53 | .fadeIn { 54 | animation: fadeIn 2s $out backwards; 55 | } 56 | .fadeOut { 57 | animation: fadeOut 2s $out forwards; 58 | } 59 | 60 | * { 61 | margin: 0; 62 | padding: 0; 63 | box-sizing: border-box; 64 | } 65 | 66 | li { 67 | list-style: none; 68 | } 69 | 70 | body { 71 | background: #000; 72 | font-size: 14px; 73 | font-family: PingFangSC-Regular, "microsoft-yahei", sans-serif; 74 | user-select: none; 75 | } 76 | 77 | // 图标 78 | [class*="icono-"] { 79 | display: inline-block; 80 | vertical-align: middle; 81 | position: relative; 82 | font-style: normal; 83 | color: currentColor; 84 | text-align: left; 85 | text-indent: -9999px; 86 | direction: ltr; 87 | &::after, 88 | &::before { 89 | content: ""; 90 | } 91 | } 92 | .icono-sliders { 93 | height: 30px; 94 | width: 30px; 95 | margin: 2px; 96 | &::after, 97 | &::before { 98 | transform: translateX(-50%); 99 | left: 50%; 100 | position: absolute; 101 | } 102 | &::before { 103 | width: 8px; 104 | height: 7px; 105 | border-radius: 2px; 106 | top: 67%; 107 | box-shadow: inset 0 0 0 32px, 10px -10px, -10px -14px; 108 | } 109 | &::after { 110 | position: absolute; 111 | width: 2px; 112 | height: 100%; 113 | box-shadow: inset 0 0 0 32px, 10px 0, -10px 0; 114 | } 115 | } 116 | .icono-reset { 117 | width: 26px; 118 | height: 26px; 119 | border-width: 2px; 120 | border-style: solid; 121 | border-radius: 50%; 122 | margin: 4px; 123 | border-left-color: transparent; 124 | &::before { 125 | position: absolute; 126 | width: 0; 127 | height: 0; 128 | left: -7px; 129 | bottom: 0; 130 | border-width: 6px; 131 | border-style: solid; 132 | border-left-color: transparent; 133 | border-bottom-color: transparent; 134 | border-right-color: transparent; 135 | transform: rotate(135deg); 136 | } 137 | } 138 | .icono-power { 139 | width: 22px; 140 | height: 22px; 141 | margin: 6px; 142 | border: 2px solid; 143 | border-top-color: transparent; 144 | border-radius: 50%; 145 | &::before { 146 | position: absolute; 147 | top: -15%; 148 | left: 8px; 149 | width: 2px; 150 | height: 60%; 151 | box-shadow: inset 0 0 0 32px; 152 | } 153 | } 154 | 155 | .zIndexTop { 156 | z-index: 10000; 157 | } 158 | .hide { 159 | display: none !important; 160 | } 161 | .show-flex { 162 | display: flex !important; 163 | } 164 | 165 | .game-handler { 166 | position: absolute; 167 | display: flex; 168 | align-items: flex-end; 169 | height: 55px; 170 | .g-btn { 171 | @include flex-center(); 172 | box-sizing: content-box; 173 | width: 50px; 174 | height: 50px; 175 | cursor: pointer; 176 | background: #fff; 177 | border-radius: 5px; 178 | color: #666; 179 | transition: all 0.2s $out; 180 | margin-right: 3vmin; 181 | border-bottom: 5px solid black(20); 182 | &:hover { 183 | transform: scale(1.05); 184 | } 185 | &:active { 186 | border-bottom-width: 0; 187 | } 188 | &:last-child { 189 | margin-right: 0; 190 | } 191 | } 192 | &-rt { 193 | right: 3vmin; 194 | top: 3vmin; 195 | } 196 | &-rb { 197 | right: 3vmin; 198 | bottom: 3vmin; 199 | } 200 | } 201 | #app { 202 | @include fullscreen(); 203 | overflow: hidden; 204 | } 205 | #home { 206 | @include flex-center(); 207 | @include fullscreen(); 208 | flex-direction: column; 209 | background-image: linear-gradient(to bottom, #ca6ece, #232361); 210 | text-align: center; 211 | z-index: 10; 212 | .title { 213 | position: relative; 214 | height: 25vmin; 215 | width: 100vw; 216 | h1, 217 | h2 { 218 | @include ab-center(); 219 | } 220 | h1 { 221 | color: black(20); 222 | font-size: 25vmin; 223 | width: 100vmin; 224 | } 225 | h2 { 226 | color: white(80); 227 | font-size: 8vmin; 228 | } 229 | } 230 | .buttons { 231 | @include flex-center(); 232 | padding-top: 5vmin; 233 | .start { 234 | @include transition(); 235 | box-sizing: content-box; 236 | width: 50vmin; 237 | height: 10vmin; 238 | line-height: 10vmin; 239 | border: 1px solid white(20); 240 | border-radius: 1vmin; 241 | color: white(60); 242 | cursor: pointer; 243 | font-weight: bold; 244 | font-size: 3.5vmin; 245 | letter-spacing: 1vmin; 246 | text-indent: 1vmin; 247 | &:hover { 248 | border-color: white(40); 249 | background-color: white(10); 250 | color: white(80); 251 | } 252 | } 253 | } 254 | .links { 255 | position: absolute; 256 | left: 50%; 257 | transform: translate(-50%, 0); 258 | bottom: 20px; 259 | a { 260 | color: white(50); 261 | } 262 | } 263 | } 264 | #level { 265 | @include flex-center(); 266 | @include fullscreen(); 267 | z-index: 9; 268 | background-image: linear-gradient(to bottom, #ca6ece, #232361); 269 | .main { 270 | @include flex-center(); 271 | width: 85vw; 272 | height: 80vmin; 273 | } 274 | .difficulty { 275 | width: 20vw; 276 | margin-right: 5vw; 277 | li { 278 | box-sizing: content-box; 279 | width: 20vw; 280 | height: 3vw; 281 | line-height: 3vw; 282 | background-color: #fff; 283 | border-radius: 2.5vw; 284 | text-align: center; 285 | cursor: pointer; 286 | border-bottom: 0.5vw solid black(20); 287 | margin: 2vw 0; 288 | font-size: 1.5vw; 289 | font-weight: bold; 290 | color: black(70); 291 | transition: all 0.2s $out; 292 | opacity: 0.7; 293 | &:hover { 294 | opacity: 0.9; 295 | transform: scale(1.05); 296 | } 297 | } 298 | } 299 | .list { 300 | width: 60vw; 301 | li { 302 | display: flex; 303 | flex-wrap: wrap; 304 | display: none; 305 | b { 306 | box-sizing: content-box; 307 | height: 4vw; 308 | width: 4vw; 309 | line-height: 4vw; 310 | background-color: #fff; 311 | pointer-events: none; 312 | text-align: center; 313 | cursor: pointer; 314 | border-bottom: 0.5vw solid black(20); 315 | border-radius: 0.5vw; 316 | margin: 1vw; 317 | font-size: 1.8vw; 318 | font-weight: bold; 319 | color: black(70); 320 | transition: all 0.2s $out; 321 | opacity: 0.3; 322 | &[data-unlock] { 323 | pointer-events: auto; 324 | opacity: 0.7; 325 | &:hover { 326 | opacity: 0.9; 327 | transform: scale(1.05); 328 | } 329 | &:active { 330 | transform: scale(1); 331 | } 332 | } 333 | } 334 | } 335 | } 336 | &[data-tab="1"] { 337 | .difficulty li:nth-child(1) { 338 | opacity: 1; 339 | } 340 | .list li:nth-child(1) { 341 | display: flex; 342 | } 343 | } 344 | &[data-tab="2"] { 345 | .difficulty li:nth-child(2) { 346 | opacity: 1; 347 | } 348 | .list li:nth-child(2) { 349 | display: flex; 350 | } 351 | } 352 | &[data-tab="3"] { 353 | .difficulty li:nth-child(3) { 354 | opacity: 1; 355 | } 356 | .list li:nth-child(3) { 357 | display: flex; 358 | } 359 | } 360 | &[data-tab="4"] { 361 | .difficulty li:nth-child(4) { 362 | opacity: 1; 363 | } 364 | .list li:nth-child(4) { 365 | display: flex; 366 | } 367 | } 368 | } 369 | #game { 370 | @include flex-center(); 371 | @include fullscreen(); 372 | z-index: 1; 373 | #board { 374 | #grid, 375 | #number { 376 | width: 80vmin; 377 | height: 80vmin; 378 | display: flex; 379 | flex-wrap: wrap; 380 | justify-content: space-between; 381 | align-content: space-between; 382 | } 383 | #number { 384 | @include ab-center(); 385 | } 386 | .grid-nine { 387 | width: $gridNineWidth; 388 | height: $gridNineWidth; 389 | display: flex; 390 | flex-wrap: wrap; 391 | justify-content: space-between; 392 | align-content: space-between; 393 | } 394 | .grid { 395 | width: $cellWidth; 396 | height: $cellWidth; 397 | border: $cellBorderWidth solid transparent; 398 | background-color: white(90); 399 | background-clip: content-box; 400 | transition: background 0.2s $out; 401 | position: relative; 402 | &-transparent { 403 | background-color: transparent; 404 | } 405 | &-number { 406 | @include flex-center(); 407 | position: relative; 408 | .dot { 409 | will-change: transform; 410 | content: ""; 411 | position: absolute; 412 | z-index: -1; 413 | border-radius: 100%; 414 | width: $cellWidth * 0.7; 415 | height: $cellWidth * 0.7; 416 | transform: scale(0) translateZ(0); 417 | opacity: 0; 418 | transition: all 0.2s $out; 419 | transform-origin: center; 420 | } 421 | .number { 422 | @include flex-center(); 423 | position: absolute; 424 | z-index: 2; 425 | width: 100%; 426 | height: 100%; 427 | font-size: 3.5vmin; 428 | color: black(80); 429 | font-weight: bold; 430 | transition: color 0.4s $out; 431 | } 432 | .grid-small { 433 | display: flex; 434 | flex-wrap: wrap; 435 | position: absolute; 436 | width: 100%; 437 | height: 100%; 438 | opacity: 0; 439 | z-index: -1; 440 | transition: opacity 0.4s $out; 441 | color: #fff; 442 | b { 443 | @include flex-center(); 444 | will-change: transform; 445 | width: calc(100% / 3); 446 | height: calc(100% / 3); 447 | opacity: 0.5; 448 | transform: scale(1); 449 | transition: all 0.2s $out; 450 | transform-origin: center; 451 | &.candidate { 452 | opacity: 1; 453 | } 454 | } 455 | } 456 | // 鼠标经过状态 457 | &:not([data-freeze]):hover { 458 | .dot { 459 | transform: scale(1); 460 | opacity: 1; 461 | } 462 | .number { 463 | color: #fff; 464 | } 465 | } 466 | // 激活状态 467 | &.data-active { 468 | .dot { 469 | border-radius: 0; 470 | transform: scale(1); 471 | opacity: 1; 472 | width: auto; 473 | height: auto; 474 | left: 0; 475 | right: 0; 476 | top: 0; 477 | bottom: 0; 478 | margin: -$cellBorderWidth; 479 | z-index: 9; 480 | } 481 | .grid-small { 482 | opacity: 1; 483 | z-index: 10; 484 | b { 485 | color: #fff !important; 486 | &:hover { 487 | opacity: 1; 488 | transform: scale(1.3); 489 | transform-origin: center; 490 | } 491 | } 492 | } 493 | } 494 | // 有候选项 495 | &.small-active { 496 | .dot { 497 | width: $cellWidth; 498 | height: $cellWidth; 499 | } 500 | .grid-small { 501 | // 有候选项状态 502 | opacity: 1; 503 | z-index: 1; 504 | b:not(.candidate) { 505 | opacity: 0; 506 | } 507 | } 508 | &.data-active { 509 | .grid-small { 510 | z-index: 10; 511 | b { 512 | opacity: 0.5; 513 | &.candidate { 514 | opacity: 1; 515 | } 516 | } 517 | } 518 | } 519 | } 520 | // 非法项 521 | &[data-invalid] { 522 | .number { 523 | &::before { 524 | @include ab-center(); 525 | content: ""; 526 | width: $cellWidth * 0.6; 527 | height: $cellWidth * 0.6; 528 | z-index: -1; 529 | transition: all 0.2s $out; 530 | border: 0.5vmin solid currentColor; 531 | border-radius: 100%; 532 | } 533 | } 534 | &:hover { 535 | .number::before { 536 | border-color: transparent; 537 | } 538 | } 539 | &[data-freeze]:hover .number::before { 540 | border-color: currentColor; 541 | } 542 | } 543 | } 544 | } 545 | // 四角设置圆角 546 | $radius: 2vmin; 547 | .grid-nine:nth-child(1) .grid:nth-child(1) { 548 | &, 549 | & .data-active .dot { 550 | border-top-left-radius: $radius; 551 | } 552 | } 553 | .grid-nine:nth-child(3) .grid:nth-child(3) { 554 | &, 555 | & .data-active .dot { 556 | border-top-right-radius: $radius; 557 | } 558 | } 559 | .grid-nine:nth-child(7) .grid:nth-child(7) { 560 | &, 561 | & .data-active .dot { 562 | border-bottom-left-radius: $radius; 563 | } 564 | } 565 | .grid-nine:nth-child(9) .grid:nth-child(9) { 566 | &, 567 | & .data-active .dot { 568 | border-bottom-right-radius: $radius; 569 | } 570 | } 571 | } 572 | } 573 | #win { 574 | @include fullscreen(); 575 | @include flex-center(); 576 | z-index: 2; 577 | pointer-events: none; 578 | background-color: black(30); 579 | opacity: 0; 580 | filter: blur(1vmin); 581 | transition: all 1s; 582 | .text { 583 | @include flex-center(); 584 | span { 585 | color: #fff; 586 | font-size: 3vmin; 587 | } 588 | i { 589 | display: inline-block; 590 | width: 3vmin; 591 | height: 6vmin; 592 | position: relative; 593 | transform: rotate(45deg); 594 | transform-origin: 90% 50%; 595 | margin-right: 3vmin; 596 | &::before, 597 | &::after { 598 | content: ""; 599 | position: absolute; 600 | border-radius: 0.5vmin; 601 | background-color: #fff; 602 | } 603 | &::before { 604 | bottom: 0; 605 | left: 0; 606 | width: 0; 607 | height: 1vmin; 608 | transition: width 0.2s ease-in 0.6s; 609 | } 610 | &::after { 611 | right: 0; 612 | bottom: 0; 613 | height: 0; 614 | width: 1vmin; 615 | transition: height 0.3s cubic-bezier(1, 0.42, 1, 1) 0.8s; 616 | } 617 | } 618 | } 619 | &.show { 620 | filter: blur(0); 621 | opacity: 1; 622 | pointer-events: auto; 623 | .text { 624 | i { 625 | &::before { 626 | width: 3vmin; 627 | } 628 | &::after { 629 | height: 6vmin; 630 | } 631 | } 632 | } 633 | & + #game { 634 | filter: blur(10px); 635 | } 636 | } 637 | } 638 | 639 | // 73 = 365 / 5 640 | @for $i from 1 through 73 { 641 | #game[game-color="#{$i}"] { 642 | background: linear-gradient( 643 | calc(15deg * $i), 644 | color($i), 645 | lighten(color($i), 20%) 646 | ); 647 | #board { 648 | #grid { 649 | .grid[data-light] { 650 | background-color: lighten(color($i), 45%); 651 | } 652 | } 653 | #number { 654 | .grid-number { 655 | .dot { 656 | background: linear-gradient( 657 | calc(15deg * $i), 658 | color($i), 659 | lighten(color($i), 20%) 660 | ); 661 | } 662 | &-input { 663 | .number { 664 | color: color($i); 665 | &:hover { 666 | color: #fff; 667 | } 668 | } 669 | } 670 | &.small-active { 671 | .grid-small { 672 | color: color($i); 673 | } 674 | &:hover { 675 | .grid-small { 676 | color: #fff; 677 | } 678 | } 679 | } 680 | } 681 | } 682 | } 683 | } 684 | } 685 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | class Sudoku { 2 | constructor(diff = "easy", preset) { 3 | this.DifficultyWords = ["easy", "normal", "hard", "hell"]; 4 | this.Difficultys = [3.5, 5, 7, 10]; 5 | this.Difficulty = this.Difficultys[this.DifficultyWords.indexOf(diff)]; 6 | this.BASE = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 7 | 8 | this._sudoku = preset 9 | ? this.copy(preset) 10 | : [[], [], [], [], [], [], [], [], []]; 11 | this.answer = [[], [], [], [], [], [], [], [], []]; 12 | this.invalid = []; 13 | 14 | this.init(); 15 | } 16 | setSudoku([row, col], value) { 17 | this._sudoku[row][col] = value; 18 | this.mapInvalid(); 19 | return this.win(); 20 | } 21 | getSudoku() { 22 | return this._sudoku; 23 | } 24 | blank() { 25 | let arr = []; 26 | for (let i = 0; i < 9; i++) { 27 | arr.push([]); 28 | for (let j = 0; j < 9; j++) { 29 | arr[i].push(0); 30 | } 31 | } 32 | return arr; 33 | } 34 | mapInvalid() { 35 | this.invalid = []; 36 | let base = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 37 | let invalidRow = []; 38 | let invalidCol = []; 39 | let invalidGrid = []; 40 | // row duplicate 41 | for (let i = 0; i < 9; i++) { 42 | let row = this._sudoku[i]; 43 | for (let n in base) { 44 | let invalid = []; 45 | for (let j = 0; j < 9; j++) { 46 | if (row[j] == base[n]) { 47 | invalid.push(j); 48 | } 49 | } 50 | if (invalid.length > 1) { 51 | invalidRow.push(...invalid.map((item) => [i, item])); 52 | } 53 | } 54 | } 55 | // col duplicate 56 | for (let i = 0; i < 9; i++) { 57 | let col = base.map((item, index) => { 58 | return this._sudoku[index][i]; 59 | }); 60 | for (let n in base) { 61 | let invalid = []; 62 | for (let j = 0; j < 9; j++) { 63 | if (col[j] == base[n]) { 64 | invalid.push(j); 65 | } 66 | } 67 | if (invalid.length > 1) { 68 | invalidCol.push(...invalid.map((item) => [item, i])); 69 | } 70 | } 71 | } 72 | // grid duplicate 73 | for (var i = 0; i < 3; i++) { 74 | for (var j = 0; j < 3; j++) { 75 | let grid = [[], [], []].map((item, index) => { 76 | return [ 77 | this._sudoku[i * 3 + index][j * 3 + 0], 78 | this._sudoku[i * 3 + index][j * 3 + 1], 79 | this._sudoku[i * 3 + index][j * 3 + 2], 80 | ]; 81 | }); 82 | for (let n in base) { 83 | let invalid = []; 84 | for (var x = 0; x < 3; x++) { 85 | for (var y = 0; y < 3; y++) { 86 | if (grid[x][y] == base[n]) { 87 | invalid.push([x, y]); 88 | } 89 | } 90 | } 91 | 92 | if (invalid.length > 1) { 93 | invalidGrid.push( 94 | ...invalid.map((item) => [i * 3 + item[0], j * 3 + item[1]]) 95 | ); 96 | } 97 | } 98 | } 99 | } 100 | this.invalid = this.invalid.concat(invalidRow, invalidCol, invalidGrid); 101 | return this.invalid; 102 | } 103 | checkColumn(col, x) { 104 | for (var i = 0; i < 9; i++) { 105 | if (this._sudoku[i][col] === x) { 106 | return false; 107 | } 108 | } 109 | return true; 110 | } 111 | checkRow(row, x) { 112 | for (var j = 0; j < 9; j++) { 113 | if (this._sudoku[row][j] === x) { 114 | return false; 115 | } 116 | } 117 | return true; 118 | } 119 | checkBlock(row, col, x) { 120 | var startRow = Math.floor(row / 3) * 3; 121 | var startCol = Math.floor(col / 3) * 3; 122 | for (var i = 0; i < 3; i++) { 123 | for (var j = 0; j < 3; j++) { 124 | if (this._sudoku[startRow + i][startCol + j] === x) { 125 | return false; 126 | } 127 | } 128 | } 129 | return true; 130 | } 131 | check(i, j, x) { 132 | let b = this.checkBlock(i, j, x); 133 | let r = this.checkRow(i, x); 134 | let c = this.checkColumn(j, x); 135 | let success = b && r && c; 136 | return success; 137 | } 138 | columnOK(col) { 139 | var sum = 0; 140 | for (var i = 0; i < 9; i++) { 141 | sum += this._sudoku[i][col]; 142 | } 143 | return sum === 45; 144 | } 145 | columnsOK() { 146 | for (var j = 0; j < 9; j++) { 147 | if (!this.columnOK(j)) { 148 | return false; 149 | } 150 | } 151 | return true; 152 | } 153 | rowOK(row) { 154 | var sum = 0; 155 | for (var j = 0; j < 9; j++) { 156 | sum += this._sudoku[row][j]; 157 | } 158 | return sum === 45; 159 | } 160 | rowsOK() { 161 | for (var i = 0; i < 9; i++) { 162 | if (!this.rowOK(i)) { 163 | return false; 164 | } 165 | } 166 | return true; 167 | } 168 | blockOK(n) { 169 | var startRow = Math.floor((n - 1) / 3) * 3; 170 | var startCol = ((n - 1) % 3) * 3; 171 | var sum = 0; 172 | for (var i = 0; i < 3; i++) { 173 | for (var j = 0; j < 3; j++) { 174 | sum += this._sudoku[startRow + i][startCol + j]; 175 | } 176 | } 177 | return sum === 45; 178 | } 179 | blocksOK() { 180 | for (var i = 1; i <= 9; i++) { 181 | if (!this.blockOK(i)) { 182 | return false; 183 | } 184 | } 185 | return true; 186 | } 187 | sudokuOK() { 188 | return this.columnsOK() && this.rowsOK() && this.blocksOK(); 189 | } 190 | tryit(i, j) { 191 | if (i >= 9) { 192 | return true; 193 | } 194 | var s = i; 195 | var t = j + 1; 196 | if (t >= 9) { 197 | t -= 9; 198 | s++; 199 | } 200 | if (this._sudoku[i][j] !== 0) { 201 | var success = this.tryit(s, t); 202 | if (success) { 203 | return true; 204 | } 205 | } 206 | for (var k = 0; k < 9; k++) { 207 | if (this.check(i, j, this.BASE[k])) { 208 | this._sudoku[i][j] = this.BASE[k]; 209 | var success = this.tryit(s, t); 210 | if (success) { 211 | return true; 212 | } 213 | this._sudoku[i][j] = 0; 214 | } 215 | } 216 | return false; 217 | } 218 | /** 219 | * After sorting 1-9 randomly, fill in block n 220 | */ 221 | setBlockRandomly(n) { 222 | var startRow = Math.floor((n - 1) / 3) * 3; 223 | var startCol = ((n - 1) % 3) * 3; 224 | this.BASE.sort(this.randomComparator); 225 | for (var i = 0; i < 3; i++) { 226 | for (var j = 0; j < 3; j++) { 227 | this._sudoku[startRow + i][startCol + j] = this.BASE[i * 3 + j]; 228 | } 229 | } 230 | } 231 | createSudoku() { 232 | this.clear(this._sudoku); // Assign the values of Sudoku to 0 233 | // Because these three block values are not related, they can be filled randomly 234 | // To reduce the number of searches 235 | this.setBlockRandomly(3); 236 | this.setBlockRandomly(5); 237 | this.setBlockRandomly(7); 238 | this.BASE.sort(this.randomComparator); 239 | var success = this.tryit(0, 0); 240 | return success; 241 | } 242 | randomComparator(a, b) { 243 | return 0.5 - Math.random(); 244 | } 245 | clear(arr) { 246 | for (var i = 0; i < 9; i++) { 247 | for (var j = 0; j < 9; j++) { 248 | arr[i][j] = 0; 249 | } 250 | } 251 | } 252 | copy(arr) { 253 | var a = [[], [], [], [], [], [], [], [], []]; 254 | for (var i = 0; i < 9; i++) { 255 | for (var j = 0; j < 9; j++) { 256 | a[i].push(arr[i][j]); 257 | } 258 | } 259 | return a; 260 | } 261 | createGame() { 262 | console.time("[create] Create success! time consuming: "); 263 | console.log("[create] Create Sudoku..."); 264 | while (!this.createSudoku()); 265 | console.timeEnd("[create] Create success! time consuming: "); 266 | this.answer = this.copy(this._sudoku); 267 | // The number of digs in each row is related to the difficulty 268 | for (var i = 0; i < 9; i++) { 269 | for ( 270 | var j = 0; 271 | j < this.Difficulty + Math.floor(Math.random() * 2); 272 | j++ 273 | ) { 274 | this._sudoku[i][Math.floor(Math.random() * 9)] = 0; 275 | } 276 | } 277 | } 278 | setDifficulty(diff) { 279 | this.Difficulty = this.Difficultys[this.DifficultyWords.indexOf(diff)]; 280 | } 281 | win() { 282 | return this.sudokuOK() && this.invalid.length == 0; 283 | } 284 | init() { 285 | if (this._sudoku[0][0] === undefined) { 286 | this.createGame(); 287 | } 288 | } 289 | } 290 | 291 | class Game { 292 | constructor() { 293 | this.DifficultyWords = ["easy", "normal", "hard", "hell"]; 294 | this.levelNums = [40, 40, 40, 40]; 295 | this.$home = $("#home"); 296 | this.$title = $("#home .title"); 297 | this.$game = $("#game"); 298 | this.$board = $("#game #board"); 299 | this.$boardGrid = $("#board #grid"); 300 | this.$boardNumber = $("#board #number"); 301 | this.$level = $("#level"); 302 | this.$levelSelect = $("#level .difficulty"); 303 | this.$levelList = $("#level .list"); 304 | this.$win = $("#win"); 305 | 306 | this.gridCls = "grid"; 307 | this.gridNineCls = "grid-nine"; 308 | this.gridTransparentCls = "grid-transparent"; 309 | this.gridNumberCls = "grid-number"; 310 | this.gridNumberInputCls = "grid-number-input"; 311 | this.gridSmallCls = "grid-small"; 312 | this.numberCls = "number"; 313 | this.candidateCls = "candidate"; 314 | 315 | // dom cache 316 | this.$levels = []; 317 | this.$gridNumbers = []; 318 | this.$gridGrids = []; 319 | 320 | // Level state 321 | this.dataUnlock = "data-unlock"; 322 | // Grid state 323 | this.dataActive = "data-active"; 324 | this.dataInvalid = "data-invalid"; 325 | this.dataFreeze = "data-freeze"; 326 | this.dataLight = "data-light"; 327 | 328 | this.sudoku = null; 329 | this.sudokuStorage = JSON.parse(localStorage.getItem("SUDOKU")) || []; 330 | 331 | this.currentLevel = 0; 332 | 333 | this.DELETE_DELAY = 2000; 334 | 335 | this.audioSrcMusic = [ 336 | "./sound/bgm/Zeta.m4a", 337 | "./sound/bgm/Eta.m4a", 338 | "./sound/bgm/waterFrogs.mp3", 339 | ]; 340 | this.audioSrcSound = { 341 | success: "./sound/success.mp3", 342 | water: "./sound/water.mp3", 343 | bubble: "./sound/bubble.mp3", 344 | }; 345 | this.bgm = new Audio(); 346 | this.audioFadeTimer = null; 347 | 348 | this.init(); 349 | } 350 | 351 | init() { 352 | this.renderLevel(); 353 | this.renderBoard(); 354 | this.unlockLevel(); 355 | this.clickLevel(); 356 | this.clickGridCell(); 357 | this.clickSmallNumber(); 358 | this.rightClickSmallNumber(); 359 | this.clickBlank(); 360 | this.enterGridCell(); 361 | this.leaveGridCell(); 362 | } 363 | switchPage(page) { 364 | let pages = ["home", "level", "game"]; 365 | let index = pages.indexOf(page); 366 | if (!~index) return; 367 | this["$" + pages[index]].style.zIndex = ""; 368 | if (index - 1 > -1) { 369 | this["$" + pages[index - 1]].style.zIndex = 0; 370 | } 371 | } 372 | home() { 373 | this.switchPage("home"); 374 | } 375 | level() { 376 | this.switchPage("level"); 377 | 378 | this.audioFadeOut(this.bgm); 379 | } 380 | start(level) { 381 | this.switchPage("game"); 382 | this.randomColor(); 383 | this.clearSmallNumber(); 384 | 385 | clearTimeout(this.audioFadeTimer); 386 | this.playBgm(); 387 | 388 | if (level) { 389 | this.currentLevel = level; 390 | } else if (this.currentLevel > 0) { 391 | level = this.currentLevel; 392 | } else { 393 | console.warn("You can't start without a level"); 394 | return false; 395 | } 396 | 397 | let difficulty = this.levelToDifficulty(level); 398 | if (this.sudokuStorage.length < level) { 399 | // Generate new 400 | this.sudoku = new Sudoku(difficulty); 401 | this.sudokuStorage.push(this.copy(this.sudoku.getSudoku())); 402 | localStorage.setItem("SUDOKU", JSON.stringify(this.sudokuStorage)); 403 | } else { 404 | // Read cache 405 | console.log(`[loading] level ${level}`); 406 | let currentSudoku = this.sudokuStorage[level - 1]; 407 | this.sudoku = new Sudoku(difficulty, currentSudoku); 408 | } 409 | this.setInvalidGrid(); 410 | this.fillBoard(); 411 | } 412 | gameOver() { 413 | this.$win.classList.add("show"); 414 | localStorage.setItem("SUDOKU_COMPLETE", this.currentLevel); 415 | this.unlockNextLevel(); 416 | setTimeout(() => { 417 | this.audioPlay(this.audioSrcSound.success); 418 | }, 700); 419 | 420 | setTimeout(() => { 421 | this.$win.classList.remove("show"); 422 | this.level(); 423 | }, 3000); 424 | } 425 | restart() { 426 | let difficulty = this.levelToDifficulty(this.currentLevel); 427 | let currentSudoku = this.sudokuStorage[this.currentLevel - 1]; 428 | this.sudoku = new Sudoku(difficulty, currentSudoku); 429 | this.setInvalidGrid(); 430 | this.fillBoard(); 431 | this.clearSmallNumber(); 432 | } 433 | 434 | /*----------------- ui -----------------*/ 435 | temporaryClass(dom, className, delay = this.DELETE_DELAY) { 436 | dom = dom instanceof Array ? dom : [dom]; 437 | for (let i = 0; i < dom.length; i++) { 438 | dom[i].classList.add(className); 439 | setTimeout(() => { 440 | dom[i].classList.remove(className); 441 | }, delay); 442 | } 443 | } 444 | show() { 445 | let showCls = "show-flex"; 446 | for (let i = 0; i < arguments.length; i++) { 447 | if (arguments[i].length) { 448 | for (let j = 0; j < arguments[i].length; j++) { 449 | arguments[i][j].classList.add(showCls); 450 | } 451 | } else { 452 | arguments[i].classList.add(showCls); 453 | } 454 | } 455 | } 456 | hide() { 457 | let showCls = "show-flex"; 458 | for (let i = 0; i < arguments.length; i++) { 459 | if (arguments[i].length) { 460 | for (let j = 0; j < arguments[i].length; j++) { 461 | arguments[i][j].classList.remove(showCls); 462 | } 463 | } else { 464 | arguments[i].classList.remove(showCls); 465 | } 466 | } 467 | } 468 | randomColor() { 469 | let random = Math.ceil(Math.random() * 73); // 73 = 365 / 5 470 | this.$game.setAttribute("game-color", random); 471 | } 472 | highLight(gridIndex) { 473 | if ( 474 | gridIndex == undefined || 475 | this.$gridNumbers[gridIndex].getAttribute(this.dataFreeze) !== null 476 | ) { 477 | for (let i = 0; i < this.$gridGrids.length; i++) { 478 | this.$gridGrids[i].removeAttribute(this.dataLight); 479 | } 480 | return; 481 | } 482 | 483 | let [row, col] = this.gridIndexToMap(gridIndex); 484 | let girdStart = Math.floor(gridIndex / 9) * 9; 485 | let light = []; 486 | for (let i = 0; i < 9; i++) { 487 | light.push(this.mapToGridIndex([row, i])); 488 | light.push(this.mapToGridIndex([i, col])); 489 | light.push(girdStart + i); 490 | } 491 | light = [...new Set(light)]; 492 | for (let i = 0; i < this.$gridGrids.length; i++) { 493 | if (light.includes(i)) { 494 | this.$gridGrids[i].setAttribute(this.dataLight, ""); 495 | } else { 496 | this.$gridGrids[i].removeAttribute(this.dataLight); 497 | } 498 | } 499 | } 500 | 501 | /*----------------- event listener -----------------*/ 502 | // Click level 503 | clickLevel() { 504 | addEvent( 505 | this.$levelList, 506 | "b", 507 | "click", 508 | ($this) => { 509 | let level = parseInt($this.innerHTML); 510 | this.start(level); 511 | }, 512 | true 513 | ); 514 | } 515 | // Click the grid to pop up small numbers 516 | clickGridCell() { 517 | addEvent(this.$boardNumber, "." + this.gridNumberCls, "click", ($this) => { 518 | let dataFreeze = $this.getAttribute(this.dataFreeze); 519 | let dataActive = $this.getAttribute(this.dataActive); 520 | this.inactiveGridNumber(); 521 | if (dataFreeze !== null) return false; 522 | if (dataActive === null) { 523 | $this.setAttribute(this.dataActive, ""); 524 | $this.classList.add(this.dataActive); 525 | } 526 | }); 527 | } 528 | enterGridCell() { 529 | addEvent( 530 | this.$boardNumber, 531 | "." + this.gridNumberCls, 532 | "mouseenter", 533 | ($this) => { 534 | let index = parseInt($this.getAttribute("data-index")); 535 | this.highLight(index); 536 | }, 537 | true 538 | ); 539 | } 540 | leaveGridCell() { 541 | addEvent( 542 | this.$boardNumber, 543 | "." + this.gridNumberCls, 544 | "mouseleave", 545 | ($this) => { 546 | this.highLight(); 547 | }, 548 | true 549 | ); 550 | } 551 | // Click the small number and fill in the grid 552 | clickSmallNumber() { 553 | addEvent( 554 | this.$boardNumber, 555 | "b", 556 | "click", 557 | ($this) => { 558 | let number = parseInt($this.innerHTML); 559 | let $gridNumber = findTarget($this, "." + this.gridNumberCls); 560 | // 填入选中数字 561 | this.setNumber($gridNumber, number); 562 | }, 563 | true 564 | ); 565 | } 566 | // Right click a small number to add a candidate 567 | rightClickSmallNumber() { 568 | addEvent( 569 | this.$boardNumber, 570 | "b", 571 | "contextmenu", 572 | ($this) => { 573 | let $gridNumber = findTarget($this, "." + this.gridNumberCls); 574 | $this.classList.contains(this.candidateCls) 575 | ? $this.classList.remove(this.candidateCls) 576 | : $this.classList.add(this.candidateCls); 577 | this.audioPlay(this.audioSrcSound.bubble, 0.5); 578 | this.setNumber($gridNumber, 0); 579 | }, 580 | true 581 | ); 582 | } 583 | // Click the blank to deactivate the status 584 | clickBlank() { 585 | document.addEventListener("click", (e) => { 586 | let isClickGridNumber = findTarget(e.target, "." + this.gridNumberCls); 587 | if (!isClickGridNumber) { 588 | this.inactiveGridNumber(); 589 | } 590 | }); 591 | } 592 | setNumber(gridNumber, number) { 593 | let grindIndex = gridNumber.dataset.index; 594 | let [row, col] = this.gridIndexToMap(grindIndex); 595 | let $number = gridNumber.children[1]; 596 | 597 | $number.innerHTML = !number ? "" : number; 598 | if (number) { 599 | this.audioPlay(this.audioSrcSound.water, 0.7); 600 | this.clearSmallNumber(gridNumber); 601 | gridNumber.classList.remove(this.dataActive); 602 | setTimeout(() => { 603 | gridNumber.removeAttribute(this.dataActive); 604 | }, 60); 605 | } else { 606 | this.toggleSmallNumber(gridNumber); 607 | } 608 | // this.gameOver(); 609 | 610 | let win = this.sudoku.setSudoku([row, col], number); 611 | if (win) { 612 | this.gameOver(); 613 | } else { 614 | this.setInvalidGrid(); 615 | } 616 | } 617 | clearSmallNumber(gridNumber) { 618 | let all = gridNumber === undefined; 619 | 620 | let clearAll = () => { 621 | for (let i = 0; i < this.$gridNumbers.length; i++) { 622 | let number = this.$gridNumbers[i].getAttribute("data-index"); 623 | let smallActive = 624 | this.$gridNumbers[i].classList.contains("small-active"); 625 | if (smallActive !== null) { 626 | clearOne(this.$gridNumbers[i]); 627 | } 628 | } 629 | }; 630 | let clearOne = (gridNumber) => { 631 | let b = gridNumber.querySelectorAll("." + this.gridSmallCls + " b"); 632 | for (let i = 0; i < b.length; i++) { 633 | b[i].classList.contains(this.candidateCls) && 634 | b[i].classList.remove(this.candidateCls); 635 | } 636 | this.toggleSmallNumber(gridNumber); 637 | }; 638 | 639 | all ? clearAll() : clearOne(gridNumber); 640 | } 641 | // Deactive all grids 642 | inactiveGridNumber() { 643 | for (let i = 0; i < this.$gridNumbers.length; i++) { 644 | this.$gridNumbers[i].removeAttribute(this.dataActive); 645 | this.$gridNumbers[i].classList.remove(this.dataActive); 646 | } 647 | } 648 | // Automatically switch the display and hiding of small numbers 649 | toggleSmallNumber(gridNumber) { 650 | let $smallNumber = gridNumber.children[2]; 651 | if (!$smallNumber) return false; 652 | let b = $smallNumber.querySelectorAll("b"); 653 | let hide = true; 654 | for (let i = 0; i < b.length; i++) { 655 | if (b[i].classList.contains(this.candidateCls)) { 656 | hide = false; 657 | break; 658 | } 659 | } 660 | if (!hide) { 661 | gridNumber.classList.add("small-active"); 662 | } else { 663 | gridNumber.classList.remove("small-active"); 664 | } 665 | } 666 | // Traversal setting grid invalid state 667 | setInvalidGrid() { 668 | let arr = this.sudoku.invalid; 669 | for (let i = 0; i < 9; i++) { 670 | for (let j = 0; j < 9; j++) { 671 | let invalid = false; 672 | for (let k = 0; k < arr.length; k++) { 673 | let [row, col] = arr[k]; 674 | if (row == i && col == j) { 675 | invalid = true; 676 | } 677 | } 678 | 679 | let index = this.mapToGridIndex([i, j]); 680 | if (invalid) { 681 | if (!this.$gridNumbers[index].hasAttribute(this.dataInvalid)) 682 | this.$gridNumbers[index].setAttribute(this.dataInvalid, ""); 683 | } else { 684 | if (this.$gridNumbers[index].hasAttribute(this.dataInvalid)) 685 | this.$gridNumbers[index].removeAttribute(this.dataInvalid); 686 | } 687 | } 688 | } 689 | } 690 | renderLevel() { 691 | let dom = []; 692 | let j = 1; 693 | for (let i in this.levelNums) { 694 | dom.push("
  • "); 695 | for (let k = 0; k < this.levelNums[i]; k++) { 696 | dom.push(`${j}`); 697 | j++; 698 | } 699 | dom.push("
  • "); 700 | } 701 | this.$levelList.innerHTML = dom.join(""); 702 | 703 | this.levelTab(1); 704 | this.$levels = this.$levelList.querySelectorAll("b"); 705 | this.unlockNextLevel(); 706 | } 707 | levelTab(n) { 708 | this.$level.setAttribute("data-tab", n); 709 | } 710 | unlockLevel(all) { 711 | if (all) { 712 | for (let i = 0; i < this.$levels.length; i++) { 713 | this.$levels[i].setAttribute(this.dataUnlock, ""); 714 | } 715 | return; 716 | } 717 | for (let i = 0; i < this.sudokuStorage.length; i++) { 718 | if (i < this.$levels.length) { 719 | this.$levels[i].setAttribute(this.dataUnlock, ""); 720 | } 721 | } 722 | } 723 | unlockNextLevel() { 724 | let SUDOKU_COMPLETE = localStorage.getItem("SUDOKU_COMPLETE") || 0; 725 | for (let i = 0; i < Number(SUDOKU_COMPLETE) + 1; i++) { 726 | if (this.$levels[i]) { 727 | this.$levels[i].setAttribute(this.dataUnlock, ""); 728 | } 729 | } 730 | } 731 | levelToDifficulty(level) { 732 | for (let i = 0; i < this.DifficultyWords.length; i++) { 733 | let max = 0; 734 | for (let j = 0; j < i + 1; j++) { 735 | max += this.levelNums[j]; 736 | } 737 | if (level <= max) return this.DifficultyWords[i]; 738 | } 739 | return false; 740 | } 741 | renderBoard() { 742 | let gridNine = `
    `; 743 | let grid = `
    `; 744 | let divEnd = "
    "; 745 | let arrGrid = []; 746 | let arrGridNumber = []; 747 | for (let i = 0; i < 9; i++) { 748 | arrGrid.push(gridNine); 749 | arrGridNumber.push(gridNine); 750 | for (let j = 0; j < 9; j++) { 751 | arrGrid.push(grid, divEnd); 752 | let gridNumber = `
    `; 755 | let numberInner = [""]; 756 | numberInner.push("
    "); 757 | for (let k = 0; k < 9; k++) { 758 | numberInner.push(`${k + 1}`); 759 | } 760 | numberInner.push(divEnd); 761 | arrGridNumber.push(gridNumber, ...numberInner, divEnd); 762 | } 763 | arrGrid.push(divEnd); 764 | arrGridNumber.push(divEnd); 765 | } 766 | this.$boardGrid.innerHTML = arrGrid.join(""); 767 | this.$boardNumber.innerHTML = arrGridNumber.join(""); 768 | this.$gridNumbers = this.$boardNumber.querySelectorAll( 769 | `.${this.gridNineCls} .${this.gridNumberCls}` 770 | ); 771 | this.$gridGrids = this.$boardGrid.querySelectorAll( 772 | `.${this.gridNineCls} .${this.gridCls}:not(.${this.gridNumberCls})` 773 | ); 774 | } 775 | fillBoard() { 776 | for (let i = 0; i < this.$gridNumbers.length; i++) { 777 | let $box = this.$gridNumbers[i]; 778 | let $number = $box.children[1]; 779 | let [row, col] = this.gridIndexToMap(i); 780 | let n = this.sudoku.getSudoku()[row][col]; 781 | if (n === 0) { 782 | $number.innerHTML = ""; 783 | $box.classList.add(this.gridNumberInputCls); 784 | $box.removeAttribute(this.dataFreeze); 785 | } else { 786 | $number.innerHTML = n; 787 | $box.setAttribute(this.dataFreeze, ""); 788 | $box.classList.remove(this.gridNumberInputCls); 789 | } 790 | } 791 | } 792 | gridIndexToMap(i) { 793 | let col = ((i % 3) + Math.floor(i / 9) * 3) % 9; 794 | let row = Math.floor((i % 9) / 3) + Math.floor(i / 27) * 3; 795 | return [row, col]; 796 | } 797 | mapToGridIndex([row, col]) { 798 | return ( 799 | Math.floor(col / 3) * 9 + 800 | (col % 3) + 801 | Math.floor(row / 3) * 27 + 802 | (row % 3) * 3 803 | ); 804 | } 805 | copy(arr) { 806 | var a = [[], [], [], [], [], [], [], [], []]; 807 | for (var i = 0; i < 9; i++) { 808 | for (var j = 0; j < 9; j++) { 809 | a[i].push(arr[i][j]); 810 | } 811 | } 812 | return a; 813 | } 814 | 815 | /*----------------- audio -----------------*/ 816 | playBgm() { 817 | let bgm = 818 | this.audioSrcMusic[Math.floor(Math.random() * this.audioSrcMusic.length)]; 819 | this.bgm.src = bgm; 820 | this.bgm.volume = 0.3; 821 | this.bgm.loop = "loop"; 822 | this.bgm.play(); 823 | } 824 | audioPlay(url, volume = 0.3) { 825 | let audio = new Audio(url); 826 | audio.volume = volume; 827 | audio.play(); 828 | } 829 | audioFadeOut(audio) { 830 | this.audioFadeTimer = setTimeout(() => { 831 | if (audio.volume <= 0.5 / 17) { 832 | audio.pause(); 833 | } else { 834 | audio.volume -= 0.5 / 17; 835 | this.audioFadeOut(audio); 836 | } 837 | }, 60); 838 | } 839 | } 840 | 841 | /*----------------- utils -----------------*/ 842 | function $(cls, isAll) { 843 | if (isAll) { 844 | return document.querySelectorAll(cls); 845 | } else { 846 | return document.querySelector(cls); 847 | } 848 | } 849 | function addEvent(out, query, event, callback, useCapture = false) { 850 | out.addEventListener( 851 | event, 852 | function (e) { 853 | e.preventDefault(); 854 | let child = findTarget(e.target, query, useCapture); 855 | if (!child) { 856 | return false; 857 | } 858 | callback(child); 859 | }, 860 | useCapture 861 | ); 862 | } 863 | function findTarget(node, query, down = false) { 864 | if (node == document || !node || node.length == 0) return false; 865 | let cls = query.split(".")[1]; 866 | let id = query.split("#")[1]; 867 | let test = cls 868 | ? node.classList?.contains(cls) 869 | : id 870 | ? node.id == id 871 | : node.nodeName == query.toUpperCase(); 872 | return test 873 | ? node 874 | : findTarget(down ? node.children : node.parentNode, query, down); 875 | } 876 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | GNU GENERAL PUBLIC LICENSE 2 | Version 3, 29 June 2007 3 | 4 | Copyright (C) 2007 Free Software Foundation, Inc. 5 | Everyone is permitted to copy and distribute verbatim copies 6 | of this license document, but changing it is not allowed. 7 | 8 | Preamble 9 | 10 | The GNU General Public License is a free, copyleft license for 11 | software and other kinds of works. 12 | 13 | The licenses for most software and other practical works are designed 14 | to take away your freedom to share and change the works. By contrast, 15 | the GNU General Public License is intended to guarantee your freedom to 16 | share and change all versions of a program--to make sure it remains free 17 | software for all its users. We, the Free Software Foundation, use the 18 | GNU General Public License for most of our software; it applies also to 19 | any other work released this way by its authors. You can apply it to 20 | your programs, too. 21 | 22 | When we speak of free software, we are referring to freedom, not 23 | price. Our General Public Licenses are designed to make sure that you 24 | have the freedom to distribute copies of free software (and charge for 25 | them if you wish), that you receive source code or can get it if you 26 | want it, that you can change the software or use pieces of it in new 27 | free programs, and that you know you can do these things. 28 | 29 | To protect your rights, we need to prevent others from denying you 30 | these rights or asking you to surrender the rights. Therefore, you have 31 | certain responsibilities if you distribute copies of the software, or if 32 | you modify it: responsibilities to respect the freedom of others. 33 | 34 | For example, if you distribute copies of such a program, whether 35 | gratis or for a fee, you must pass on to the recipients the same 36 | freedoms that you received. You must make sure that they, too, receive 37 | or can get the source code. And you must show them these terms so they 38 | know their rights. 39 | 40 | Developers that use the GNU GPL protect your rights with two steps: 41 | (1) assert copyright on the software, and (2) offer you this License 42 | giving you legal permission to copy, distribute and/or modify it. 43 | 44 | For the developers' and authors' protection, the GPL clearly explains 45 | that there is no warranty for this free software. For both users' and 46 | authors' sake, the GPL requires that modified versions be marked as 47 | changed, so that their problems will not be attributed erroneously to 48 | authors of previous versions. 49 | 50 | Some devices are designed to deny users access to install or run 51 | modified versions of the software inside them, although the manufacturer 52 | can do so. This is fundamentally incompatible with the aim of 53 | protecting users' freedom to change the software. The systematic 54 | pattern of such abuse occurs in the area of products for individuals to 55 | use, which is precisely where it is most unacceptable. Therefore, we 56 | have designed this version of the GPL to prohibit the practice for those 57 | products. If such problems arise substantially in other domains, we 58 | stand ready to extend this provision to those domains in future versions 59 | of the GPL, as needed to protect the freedom of users. 60 | 61 | Finally, every program is threatened constantly by software patents. 62 | States should not allow patents to restrict development and use of 63 | software on general-purpose computers, but in those that do, we wish to 64 | avoid the special danger that patents applied to a free program could 65 | make it effectively proprietary. To prevent this, the GPL assures that 66 | patents cannot be used to render the program non-free. 67 | 68 | The precise terms and conditions for copying, distribution and 69 | modification follow. 70 | 71 | TERMS AND CONDITIONS 72 | 73 | 0. Definitions. 74 | 75 | "This License" refers to version 3 of the GNU General Public License. 76 | 77 | "Copyright" also means copyright-like laws that apply to other kinds of 78 | works, such as semiconductor masks. 79 | 80 | "The Program" refers to any copyrightable work licensed under this 81 | License. Each licensee is addressed as "you". "Licensees" and 82 | "recipients" may be individuals or organizations. 83 | 84 | To "modify" a work means to copy from or adapt all or part of the work 85 | in a fashion requiring copyright permission, other than the making of an 86 | exact copy. The resulting work is called a "modified version" of the 87 | earlier work or a work "based on" the earlier work. 88 | 89 | A "covered work" means either the unmodified Program or a work based 90 | on the Program. 91 | 92 | To "propagate" a work means to do anything with it that, without 93 | permission, would make you directly or secondarily liable for 94 | infringement under applicable copyright law, except executing it on a 95 | computer or modifying a private copy. Propagation includes copying, 96 | distribution (with or without modification), making available to the 97 | public, and in some countries other activities as well. 98 | 99 | To "convey" a work means any kind of propagation that enables other 100 | parties to make or receive copies. Mere interaction with a user through 101 | a computer network, with no transfer of a copy, is not conveying. 102 | 103 | An interactive user interface displays "Appropriate Legal Notices" 104 | to the extent that it includes a convenient and prominently visible 105 | feature that (1) displays an appropriate copyright notice, and (2) 106 | tells the user that there is no warranty for the work (except to the 107 | extent that warranties are provided), that licensees may convey the 108 | work under this License, and how to view a copy of this License. If 109 | the interface presents a list of user commands or options, such as a 110 | menu, a prominent item in the list meets this criterion. 111 | 112 | 1. Source Code. 113 | 114 | The "source code" for a work means the preferred form of the work 115 | for making modifications to it. "Object code" means any non-source 116 | form of a work. 117 | 118 | A "Standard Interface" means an interface that either is an official 119 | standard defined by a recognized standards body, or, in the case of 120 | interfaces specified for a particular programming language, one that 121 | is widely used among developers working in that language. 122 | 123 | The "System Libraries" of an executable work include anything, other 124 | than the work as a whole, that (a) is included in the normal form of 125 | packaging a Major Component, but which is not part of that Major 126 | Component, and (b) serves only to enable use of the work with that 127 | Major Component, or to implement a Standard Interface for which an 128 | implementation is available to the public in source code form. A 129 | "Major Component", in this context, means a major essential component 130 | (kernel, window system, and so on) of the specific operating system 131 | (if any) on which the executable work runs, or a compiler used to 132 | produce the work, or an object code interpreter used to run it. 133 | 134 | The "Corresponding Source" for a work in object code form means all 135 | the source code needed to generate, install, and (for an executable 136 | work) run the object code and to modify the work, including scripts to 137 | control those activities. However, it does not include the work's 138 | System Libraries, or general-purpose tools or generally available free 139 | programs which are used unmodified in performing those activities but 140 | which are not part of the work. For example, Corresponding Source 141 | includes interface definition files associated with source files for 142 | the work, and the source code for shared libraries and dynamically 143 | linked subprograms that the work is specifically designed to require, 144 | such as by intimate data communication or control flow between those 145 | subprograms and other parts of the work. 146 | 147 | The Corresponding Source need not include anything that users 148 | can regenerate automatically from other parts of the Corresponding 149 | Source. 150 | 151 | The Corresponding Source for a work in source code form is that 152 | same work. 153 | 154 | 2. Basic Permissions. 155 | 156 | All rights granted under this License are granted for the term of 157 | copyright on the Program, and are irrevocable provided the stated 158 | conditions are met. This License explicitly affirms your unlimited 159 | permission to run the unmodified Program. The output from running a 160 | covered work is covered by this License only if the output, given its 161 | content, constitutes a covered work. This License acknowledges your 162 | rights of fair use or other equivalent, as provided by copyright law. 163 | 164 | You may make, run and propagate covered works that you do not 165 | convey, without conditions so long as your license otherwise remains 166 | in force. You may convey covered works to others for the sole purpose 167 | of having them make modifications exclusively for you, or provide you 168 | with facilities for running those works, provided that you comply with 169 | the terms of this License in conveying all material for which you do 170 | not control copyright. Those thus making or running the covered works 171 | for you must do so exclusively on your behalf, under your direction 172 | and control, on terms that prohibit them from making any copies of 173 | your copyrighted material outside their relationship with you. 174 | 175 | Conveying under any other circumstances is permitted solely under 176 | the conditions stated below. Sublicensing is not allowed; section 10 177 | makes it unnecessary. 178 | 179 | 3. Protecting Users' Legal Rights From Anti-Circumvention Law. 180 | 181 | No covered work shall be deemed part of an effective technological 182 | measure under any applicable law fulfilling obligations under article 183 | 11 of the WIPO copyright treaty adopted on 20 December 1996, or 184 | similar laws prohibiting or restricting circumvention of such 185 | measures. 186 | 187 | When you convey a covered work, you waive any legal power to forbid 188 | circumvention of technological measures to the extent such circumvention 189 | is effected by exercising rights under this License with respect to 190 | the covered work, and you disclaim any intention to limit operation or 191 | modification of the work as a means of enforcing, against the work's 192 | users, your or third parties' legal rights to forbid circumvention of 193 | technological measures. 194 | 195 | 4. Conveying Verbatim Copies. 196 | 197 | You may convey verbatim copies of the Program's source code as you 198 | receive it, in any medium, provided that you conspicuously and 199 | appropriately publish on each copy an appropriate copyright notice; 200 | keep intact all notices stating that this License and any 201 | non-permissive terms added in accord with section 7 apply to the code; 202 | keep intact all notices of the absence of any warranty; and give all 203 | recipients a copy of this License along with the Program. 204 | 205 | You may charge any price or no price for each copy that you convey, 206 | and you may offer support or warranty protection for a fee. 207 | 208 | 5. Conveying Modified Source Versions. 209 | 210 | You may convey a work based on the Program, or the modifications to 211 | produce it from the Program, in the form of source code under the 212 | terms of section 4, provided that you also meet all of these conditions: 213 | 214 | a) The work must carry prominent notices stating that you modified 215 | it, and giving a relevant date. 216 | 217 | b) The work must carry prominent notices stating that it is 218 | released under this License and any conditions added under section 219 | 7. This requirement modifies the requirement in section 4 to 220 | "keep intact all notices". 221 | 222 | c) You must license the entire work, as a whole, under this 223 | License to anyone who comes into possession of a copy. This 224 | License will therefore apply, along with any applicable section 7 225 | additional terms, to the whole of the work, and all its parts, 226 | regardless of how they are packaged. This License gives no 227 | permission to license the work in any other way, but it does not 228 | invalidate such permission if you have separately received it. 229 | 230 | d) If the work has interactive user interfaces, each must display 231 | Appropriate Legal Notices; however, if the Program has interactive 232 | interfaces that do not display Appropriate Legal Notices, your 233 | work need not make them do so. 234 | 235 | A compilation of a covered work with other separate and independent 236 | works, which are not by their nature extensions of the covered work, 237 | and which are not combined with it such as to form a larger program, 238 | in or on a volume of a storage or distribution medium, is called an 239 | "aggregate" if the compilation and its resulting copyright are not 240 | used to limit the access or legal rights of the compilation's users 241 | beyond what the individual works permit. Inclusion of a covered work 242 | in an aggregate does not cause this License to apply to the other 243 | parts of the aggregate. 244 | 245 | 6. Conveying Non-Source Forms. 246 | 247 | You may convey a covered work in object code form under the terms 248 | of sections 4 and 5, provided that you also convey the 249 | machine-readable Corresponding Source under the terms of this License, 250 | in one of these ways: 251 | 252 | a) Convey the object code in, or embodied in, a physical product 253 | (including a physical distribution medium), accompanied by the 254 | Corresponding Source fixed on a durable physical medium 255 | customarily used for software interchange. 256 | 257 | b) Convey the object code in, or embodied in, a physical product 258 | (including a physical distribution medium), accompanied by a 259 | written offer, valid for at least three years and valid for as 260 | long as you offer spare parts or customer support for that product 261 | model, to give anyone who possesses the object code either (1) a 262 | copy of the Corresponding Source for all the software in the 263 | product that is covered by this License, on a durable physical 264 | medium customarily used for software interchange, for a price no 265 | more than your reasonable cost of physically performing this 266 | conveying of source, or (2) access to copy the 267 | Corresponding Source from a network server at no charge. 268 | 269 | c) Convey individual copies of the object code with a copy of the 270 | written offer to provide the Corresponding Source. This 271 | alternative is allowed only occasionally and noncommercially, and 272 | only if you received the object code with such an offer, in accord 273 | with subsection 6b. 274 | 275 | d) Convey the object code by offering access from a designated 276 | place (gratis or for a charge), and offer equivalent access to the 277 | Corresponding Source in the same way through the same place at no 278 | further charge. You need not require recipients to copy the 279 | Corresponding Source along with the object code. If the place to 280 | copy the object code is a network server, the Corresponding Source 281 | may be on a different server (operated by you or a third party) 282 | that supports equivalent copying facilities, provided you maintain 283 | clear directions next to the object code saying where to find the 284 | Corresponding Source. Regardless of what server hosts the 285 | Corresponding Source, you remain obligated to ensure that it is 286 | available for as long as needed to satisfy these requirements. 287 | 288 | e) Convey the object code using peer-to-peer transmission, provided 289 | you inform other peers where the object code and Corresponding 290 | Source of the work are being offered to the general public at no 291 | charge under subsection 6d. 292 | 293 | A separable portion of the object code, whose source code is excluded 294 | from the Corresponding Source as a System Library, need not be 295 | included in conveying the object code work. 296 | 297 | A "User Product" is either (1) a "consumer product", which means any 298 | tangible personal property which is normally used for personal, family, 299 | or household purposes, or (2) anything designed or sold for incorporation 300 | into a dwelling. In determining whether a product is a consumer product, 301 | doubtful cases shall be resolved in favor of coverage. For a particular 302 | product received by a particular user, "normally used" refers to a 303 | typical or common use of that class of product, regardless of the status 304 | of the particular user or of the way in which the particular user 305 | actually uses, or expects or is expected to use, the product. A product 306 | is a consumer product regardless of whether the product has substantial 307 | commercial, industrial or non-consumer uses, unless such uses represent 308 | the only significant mode of use of the product. 309 | 310 | "Installation Information" for a User Product means any methods, 311 | procedures, authorization keys, or other information required to install 312 | and execute modified versions of a covered work in that User Product from 313 | a modified version of its Corresponding Source. The information must 314 | suffice to ensure that the continued functioning of the modified object 315 | code is in no case prevented or interfered with solely because 316 | modification has been made. 317 | 318 | If you convey an object code work under this section in, or with, or 319 | specifically for use in, a User Product, and the conveying occurs as 320 | part of a transaction in which the right of possession and use of the 321 | User Product is transferred to the recipient in perpetuity or for a 322 | fixed term (regardless of how the transaction is characterized), the 323 | Corresponding Source conveyed under this section must be accompanied 324 | by the Installation Information. But this requirement does not apply 325 | if neither you nor any third party retains the ability to install 326 | modified object code on the User Product (for example, the work has 327 | been installed in ROM). 328 | 329 | The requirement to provide Installation Information does not include a 330 | requirement to continue to provide support service, warranty, or updates 331 | for a work that has been modified or installed by the recipient, or for 332 | the User Product in which it has been modified or installed. Access to a 333 | network may be denied when the modification itself materially and 334 | adversely affects the operation of the network or violates the rules and 335 | protocols for communication across the network. 336 | 337 | Corresponding Source conveyed, and Installation Information provided, 338 | in accord with this section must be in a format that is publicly 339 | documented (and with an implementation available to the public in 340 | source code form), and must require no special password or key for 341 | unpacking, reading or copying. 342 | 343 | 7. Additional Terms. 344 | 345 | "Additional permissions" are terms that supplement the terms of this 346 | License by making exceptions from one or more of its conditions. 347 | Additional permissions that are applicable to the entire Program shall 348 | be treated as though they were included in this License, to the extent 349 | that they are valid under applicable law. If additional permissions 350 | apply only to part of the Program, that part may be used separately 351 | under those permissions, but the entire Program remains governed by 352 | this License without regard to the additional permissions. 353 | 354 | When you convey a copy of a covered work, you may at your option 355 | remove any additional permissions from that copy, or from any part of 356 | it. (Additional permissions may be written to require their own 357 | removal in certain cases when you modify the work.) You may place 358 | additional permissions on material, added by you to a covered work, 359 | for which you have or can give appropriate copyright permission. 360 | 361 | Notwithstanding any other provision of this License, for material you 362 | add to a covered work, you may (if authorized by the copyright holders of 363 | that material) supplement the terms of this License with terms: 364 | 365 | a) Disclaiming warranty or limiting liability differently from the 366 | terms of sections 15 and 16 of this License; or 367 | 368 | b) Requiring preservation of specified reasonable legal notices or 369 | author attributions in that material or in the Appropriate Legal 370 | Notices displayed by works containing it; or 371 | 372 | c) Prohibiting misrepresentation of the origin of that material, or 373 | requiring that modified versions of such material be marked in 374 | reasonable ways as different from the original version; or 375 | 376 | d) Limiting the use for publicity purposes of names of licensors or 377 | authors of the material; or 378 | 379 | e) Declining to grant rights under trademark law for use of some 380 | trade names, trademarks, or service marks; or 381 | 382 | f) Requiring indemnification of licensors and authors of that 383 | material by anyone who conveys the material (or modified versions of 384 | it) with contractual assumptions of liability to the recipient, for 385 | any liability that these contractual assumptions directly impose on 386 | those licensors and authors. 387 | 388 | All other non-permissive additional terms are considered "further 389 | restrictions" within the meaning of section 10. If the Program as you 390 | received it, or any part of it, contains a notice stating that it is 391 | governed by this License along with a term that is a further 392 | restriction, you may remove that term. If a license document contains 393 | a further restriction but permits relicensing or conveying under this 394 | License, you may add to a covered work material governed by the terms 395 | of that license document, provided that the further restriction does 396 | not survive such relicensing or conveying. 397 | 398 | If you add terms to a covered work in accord with this section, you 399 | must place, in the relevant source files, a statement of the 400 | additional terms that apply to those files, or a notice indicating 401 | where to find the applicable terms. 402 | 403 | Additional terms, permissive or non-permissive, may be stated in the 404 | form of a separately written license, or stated as exceptions; 405 | the above requirements apply either way. 406 | 407 | 8. Termination. 408 | 409 | You may not propagate or modify a covered work except as expressly 410 | provided under this License. Any attempt otherwise to propagate or 411 | modify it is void, and will automatically terminate your rights under 412 | this License (including any patent licenses granted under the third 413 | paragraph of section 11). 414 | 415 | However, if you cease all violation of this License, then your 416 | license from a particular copyright holder is reinstated (a) 417 | provisionally, unless and until the copyright holder explicitly and 418 | finally terminates your license, and (b) permanently, if the copyright 419 | holder fails to notify you of the violation by some reasonable means 420 | prior to 60 days after the cessation. 421 | 422 | Moreover, your license from a particular copyright holder is 423 | reinstated permanently if the copyright holder notifies you of the 424 | violation by some reasonable means, this is the first time you have 425 | received notice of violation of this License (for any work) from that 426 | copyright holder, and you cure the violation prior to 30 days after 427 | your receipt of the notice. 428 | 429 | Termination of your rights under this section does not terminate the 430 | licenses of parties who have received copies or rights from you under 431 | this License. If your rights have been terminated and not permanently 432 | reinstated, you do not qualify to receive new licenses for the same 433 | material under section 10. 434 | 435 | 9. Acceptance Not Required for Having Copies. 436 | 437 | You are not required to accept this License in order to receive or 438 | run a copy of the Program. Ancillary propagation of a covered work 439 | occurring solely as a consequence of using peer-to-peer transmission 440 | to receive a copy likewise does not require acceptance. However, 441 | nothing other than this License grants you permission to propagate or 442 | modify any covered work. These actions infringe copyright if you do 443 | not accept this License. Therefore, by modifying or propagating a 444 | covered work, you indicate your acceptance of this License to do so. 445 | 446 | 10. Automatic Licensing of Downstream Recipients. 447 | 448 | Each time you convey a covered work, the recipient automatically 449 | receives a license from the original licensors, to run, modify and 450 | propagate that work, subject to this License. You are not responsible 451 | for enforcing compliance by third parties with this License. 452 | 453 | An "entity transaction" is a transaction transferring control of an 454 | organization, or substantially all assets of one, or subdividing an 455 | organization, or merging organizations. If propagation of a covered 456 | work results from an entity transaction, each party to that 457 | transaction who receives a copy of the work also receives whatever 458 | licenses to the work the party's predecessor in interest had or could 459 | give under the previous paragraph, plus a right to possession of the 460 | Corresponding Source of the work from the predecessor in interest, if 461 | the predecessor has it or can get it with reasonable efforts. 462 | 463 | You may not impose any further restrictions on the exercise of the 464 | rights granted or affirmed under this License. For example, you may 465 | not impose a license fee, royalty, or other charge for exercise of 466 | rights granted under this License, and you may not initiate litigation 467 | (including a cross-claim or counterclaim in a lawsuit) alleging that 468 | any patent claim is infringed by making, using, selling, offering for 469 | sale, or importing the Program or any portion of it. 470 | 471 | 11. Patents. 472 | 473 | A "contributor" is a copyright holder who authorizes use under this 474 | License of the Program or a work on which the Program is based. The 475 | work thus licensed is called the contributor's "contributor version". 476 | 477 | A contributor's "essential patent claims" are all patent claims 478 | owned or controlled by the contributor, whether already acquired or 479 | hereafter acquired, that would be infringed by some manner, permitted 480 | by this License, of making, using, or selling its contributor version, 481 | but do not include claims that would be infringed only as a 482 | consequence of further modification of the contributor version. For 483 | purposes of this definition, "control" includes the right to grant 484 | patent sublicenses in a manner consistent with the requirements of 485 | this License. 486 | 487 | Each contributor grants you a non-exclusive, worldwide, royalty-free 488 | patent license under the contributor's essential patent claims, to 489 | make, use, sell, offer for sale, import and otherwise run, modify and 490 | propagate the contents of its contributor version. 491 | 492 | In the following three paragraphs, a "patent license" is any express 493 | agreement or commitment, however denominated, not to enforce a patent 494 | (such as an express permission to practice a patent or covenant not to 495 | sue for patent infringement). To "grant" such a patent license to a 496 | party means to make such an agreement or commitment not to enforce a 497 | patent against the party. 498 | 499 | If you convey a covered work, knowingly relying on a patent license, 500 | and the Corresponding Source of the work is not available for anyone 501 | to copy, free of charge and under the terms of this License, through a 502 | publicly available network server or other readily accessible means, 503 | then you must either (1) cause the Corresponding Source to be so 504 | available, or (2) arrange to deprive yourself of the benefit of the 505 | patent license for this particular work, or (3) arrange, in a manner 506 | consistent with the requirements of this License, to extend the patent 507 | license to downstream recipients. "Knowingly relying" means you have 508 | actual knowledge that, but for the patent license, your conveying the 509 | covered work in a country, or your recipient's use of the covered work 510 | in a country, would infringe one or more identifiable patents in that 511 | country that you have reason to believe are valid. 512 | 513 | If, pursuant to or in connection with a single transaction or 514 | arrangement, you convey, or propagate by procuring conveyance of, a 515 | covered work, and grant a patent license to some of the parties 516 | receiving the covered work authorizing them to use, propagate, modify 517 | or convey a specific copy of the covered work, then the patent license 518 | you grant is automatically extended to all recipients of the covered 519 | work and works based on it. 520 | 521 | A patent license is "discriminatory" if it does not include within 522 | the scope of its coverage, prohibits the exercise of, or is 523 | conditioned on the non-exercise of one or more of the rights that are 524 | specifically granted under this License. You may not convey a covered 525 | work if you are a party to an arrangement with a third party that is 526 | in the business of distributing software, under which you make payment 527 | to the third party based on the extent of your activity of conveying 528 | the work, and under which the third party grants, to any of the 529 | parties who would receive the covered work from you, a discriminatory 530 | patent license (a) in connection with copies of the covered work 531 | conveyed by you (or copies made from those copies), or (b) primarily 532 | for and in connection with specific products or compilations that 533 | contain the covered work, unless you entered into that arrangement, 534 | or that patent license was granted, prior to 28 March 2007. 535 | 536 | Nothing in this License shall be construed as excluding or limiting 537 | any implied license or other defenses to infringement that may 538 | otherwise be available to you under applicable patent law. 539 | 540 | 12. No Surrender of Others' Freedom. 541 | 542 | If conditions are imposed on you (whether by court order, agreement or 543 | otherwise) that contradict the conditions of this License, they do not 544 | excuse you from the conditions of this License. If you cannot convey a 545 | covered work so as to satisfy simultaneously your obligations under this 546 | License and any other pertinent obligations, then as a consequence you may 547 | not convey it at all. For example, if you agree to terms that obligate you 548 | to collect a royalty for further conveying from those to whom you convey 549 | the Program, the only way you could satisfy both those terms and this 550 | License would be to refrain entirely from conveying the Program. 551 | 552 | 13. Use with the GNU Affero General Public License. 553 | 554 | Notwithstanding any other provision of this License, you have 555 | permission to link or combine any covered work with a work licensed 556 | under version 3 of the GNU Affero General Public License into a single 557 | combined work, and to convey the resulting work. The terms of this 558 | License will continue to apply to the part which is the covered work, 559 | but the special requirements of the GNU Affero General Public License, 560 | section 13, concerning interaction through a network will apply to the 561 | combination as such. 562 | 563 | 14. Revised Versions of this License. 564 | 565 | The Free Software Foundation may publish revised and/or new versions of 566 | the GNU General Public License from time to time. Such new versions will 567 | be similar in spirit to the present version, but may differ in detail to 568 | address new problems or concerns. 569 | 570 | Each version is given a distinguishing version number. If the 571 | Program specifies that a certain numbered version of the GNU General 572 | Public License "or any later version" applies to it, you have the 573 | option of following the terms and conditions either of that numbered 574 | version or of any later version published by the Free Software 575 | Foundation. If the Program does not specify a version number of the 576 | GNU General Public License, you may choose any version ever published 577 | by the Free Software Foundation. 578 | 579 | If the Program specifies that a proxy can decide which future 580 | versions of the GNU General Public License can be used, that proxy's 581 | public statement of acceptance of a version permanently authorizes you 582 | to choose that version for the Program. 583 | 584 | Later license versions may give you additional or different 585 | permissions. However, no additional obligations are imposed on any 586 | author or copyright holder as a result of your choosing to follow a 587 | later version. 588 | 589 | 15. Disclaimer of Warranty. 590 | 591 | THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY 592 | APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT 593 | HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY 594 | OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, 595 | THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 596 | PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM 597 | IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF 598 | ALL NECESSARY SERVICING, REPAIR OR CORRECTION. 599 | 600 | 16. Limitation of Liability. 601 | 602 | IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING 603 | WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS 604 | THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY 605 | GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE 606 | USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF 607 | DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD 608 | PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS), 609 | EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF 610 | SUCH DAMAGES. 611 | 612 | 17. Interpretation of Sections 15 and 16. 613 | 614 | If the disclaimer of warranty and limitation of liability provided 615 | above cannot be given local legal effect according to their terms, 616 | reviewing courts shall apply local law that most closely approximates 617 | an absolute waiver of all civil liability in connection with the 618 | Program, unless a warranty or assumption of liability accompanies a 619 | copy of the Program in return for a fee. 620 | 621 | END OF TERMS AND CONDITIONS 622 | 623 | How to Apply These Terms to Your New Programs 624 | 625 | If you develop a new program, and you want it to be of the greatest 626 | possible use to the public, the best way to achieve this is to make it 627 | free software which everyone can redistribute and change under these terms. 628 | 629 | To do so, attach the following notices to the program. It is safest 630 | to attach them to the start of each source file to most effectively 631 | state the exclusion of warranty; and each file should have at least 632 | the "copyright" line and a pointer to where the full notice is found. 633 | 634 | 635 | Copyright (C) 636 | 637 | This program is free software: you can redistribute it and/or modify 638 | it under the terms of the GNU General Public License as published by 639 | the Free Software Foundation, either version 3 of the License, or 640 | (at your option) any later version. 641 | 642 | This program is distributed in the hope that it will be useful, 643 | but WITHOUT ANY WARRANTY; without even the implied warranty of 644 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 645 | GNU General Public License for more details. 646 | 647 | You should have received a copy of the GNU General Public License 648 | along with this program. If not, see . 649 | 650 | Also add information on how to contact you by electronic and paper mail. 651 | 652 | If the program does terminal interaction, make it output a short 653 | notice like this when it starts in an interactive mode: 654 | 655 | Copyright (C) 656 | This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'. 657 | This is free software, and you are welcome to redistribute it 658 | under certain conditions; type `show c' for details. 659 | 660 | The hypothetical commands `show w' and `show c' should show the appropriate 661 | parts of the General Public License. Of course, your program's commands 662 | might be different; for a GUI interface, you would use an "about box". 663 | 664 | You should also get your employer (if you work as a programmer) or school, 665 | if any, to sign a "copyright disclaimer" for the program, if necessary. 666 | For more information on this, and how to apply and follow the GNU GPL, see 667 | . 668 | 669 | The GNU General Public License does not permit incorporating your program 670 | into proprietary programs. If your program is a subroutine library, you 671 | may consider it more useful to permit linking proprietary applications with 672 | the library. If this is what you want to do, use the GNU Lesser General 673 | Public License instead of this License. But first, please read 674 | . 675 | -------------------------------------------------------------------------------- /css/index.css: -------------------------------------------------------------------------------- 1 | @keyframes fadeIn { 2 | 0% { 3 | opacity: 0; 4 | } 5 | 100% { 6 | opacity: 1; 7 | } 8 | } 9 | @keyframes fadeOut { 10 | 0% { 11 | opacity: 1; 12 | } 13 | 100% { 14 | opacity: 0; 15 | } 16 | } 17 | .fadeIn { 18 | animation: fadeIn 2s cubic-bezier(0.22, 0.61, 0.36, 1) backwards; 19 | } 20 | 21 | .fadeOut { 22 | animation: fadeOut 2s cubic-bezier(0.22, 0.61, 0.36, 1) forwards; 23 | } 24 | 25 | * { 26 | margin: 0; 27 | padding: 0; 28 | box-sizing: border-box; 29 | } 30 | 31 | li { 32 | list-style: none; 33 | } 34 | 35 | body { 36 | background: #000; 37 | font-size: 14px; 38 | font-family: PingFangSC-Regular, "microsoft-yahei", sans-serif; 39 | user-select: none; 40 | } 41 | 42 | [class*=icono-] { 43 | display: inline-block; 44 | vertical-align: middle; 45 | position: relative; 46 | font-style: normal; 47 | color: currentColor; 48 | text-align: left; 49 | text-indent: -9999px; 50 | direction: ltr; 51 | } 52 | [class*=icono-]::after, [class*=icono-]::before { 53 | content: ""; 54 | } 55 | 56 | .icono-sliders { 57 | height: 30px; 58 | width: 30px; 59 | margin: 2px; 60 | } 61 | .icono-sliders::after, .icono-sliders::before { 62 | transform: translateX(-50%); 63 | left: 50%; 64 | position: absolute; 65 | } 66 | .icono-sliders::before { 67 | width: 8px; 68 | height: 7px; 69 | border-radius: 2px; 70 | top: 67%; 71 | box-shadow: inset 0 0 0 32px, 10px -10px, -10px -14px; 72 | } 73 | .icono-sliders::after { 74 | position: absolute; 75 | width: 2px; 76 | height: 100%; 77 | box-shadow: inset 0 0 0 32px, 10px 0, -10px 0; 78 | } 79 | 80 | .icono-reset { 81 | width: 26px; 82 | height: 26px; 83 | border-width: 2px; 84 | border-style: solid; 85 | border-radius: 50%; 86 | margin: 4px; 87 | border-left-color: transparent; 88 | } 89 | .icono-reset::before { 90 | position: absolute; 91 | width: 0; 92 | height: 0; 93 | left: -7px; 94 | bottom: 0; 95 | border-width: 6px; 96 | border-style: solid; 97 | border-left-color: transparent; 98 | border-bottom-color: transparent; 99 | border-right-color: transparent; 100 | transform: rotate(135deg); 101 | } 102 | 103 | .icono-power { 104 | width: 22px; 105 | height: 22px; 106 | margin: 6px; 107 | border: 2px solid; 108 | border-top-color: transparent; 109 | border-radius: 50%; 110 | } 111 | .icono-power::before { 112 | position: absolute; 113 | top: -15%; 114 | left: 8px; 115 | width: 2px; 116 | height: 60%; 117 | box-shadow: inset 0 0 0 32px; 118 | } 119 | 120 | .zIndexTop { 121 | z-index: 10000; 122 | } 123 | 124 | .hide { 125 | display: none !important; 126 | } 127 | 128 | .show-flex { 129 | display: flex !important; 130 | } 131 | 132 | .game-handler { 133 | position: absolute; 134 | display: flex; 135 | align-items: flex-end; 136 | height: 55px; 137 | } 138 | .game-handler .g-btn { 139 | display: flex; 140 | justify-content: center; 141 | align-items: center; 142 | box-sizing: content-box; 143 | width: 50px; 144 | height: 50px; 145 | cursor: pointer; 146 | background: #fff; 147 | border-radius: 5px; 148 | color: #666; 149 | transition: all 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 150 | margin-right: 3vmin; 151 | border-bottom: 5px solid rgba(0, 0, 0, 0.2); 152 | } 153 | .game-handler .g-btn:hover { 154 | transform: scale(1.05); 155 | } 156 | .game-handler .g-btn:active { 157 | border-bottom-width: 0; 158 | } 159 | .game-handler .g-btn:last-child { 160 | margin-right: 0; 161 | } 162 | .game-handler-rt { 163 | right: 3vmin; 164 | top: 3vmin; 165 | } 166 | .game-handler-rb { 167 | right: 3vmin; 168 | bottom: 3vmin; 169 | } 170 | 171 | #app { 172 | position: absolute; 173 | left: 0; 174 | top: 0; 175 | height: 100vh; 176 | width: 100vw; 177 | overflow: hidden; 178 | } 179 | 180 | #home { 181 | display: flex; 182 | justify-content: center; 183 | align-items: center; 184 | position: absolute; 185 | left: 0; 186 | top: 0; 187 | height: 100vh; 188 | width: 100vw; 189 | flex-direction: column; 190 | background-image: linear-gradient(to bottom, #ca6ece, #232361); 191 | text-align: center; 192 | z-index: 10; 193 | } 194 | #home .title { 195 | position: relative; 196 | height: 25vmin; 197 | width: 100vw; 198 | } 199 | #home .title h1, 200 | #home .title h2 { 201 | position: absolute; 202 | left: 50%; 203 | top: 50%; 204 | transform: translate(-50%, -50%); 205 | } 206 | #home .title h1 { 207 | color: rgba(0, 0, 0, 0.2); 208 | font-size: 25vmin; 209 | width: 100vmin; 210 | } 211 | #home .title h2 { 212 | color: rgba(255, 255, 255, 0.8); 213 | font-size: 8vmin; 214 | } 215 | #home .buttons { 216 | display: flex; 217 | justify-content: center; 218 | align-items: center; 219 | padding-top: 5vmin; 220 | } 221 | #home .buttons .start { 222 | transition: all 0.2s ease-in-out; 223 | box-sizing: content-box; 224 | width: 50vmin; 225 | height: 10vmin; 226 | line-height: 10vmin; 227 | border: 1px solid rgba(255, 255, 255, 0.2); 228 | border-radius: 1vmin; 229 | color: rgba(255, 255, 255, 0.6); 230 | cursor: pointer; 231 | font-weight: bold; 232 | font-size: 3.5vmin; 233 | letter-spacing: 1vmin; 234 | text-indent: 1vmin; 235 | } 236 | #home .buttons .start:hover { 237 | border-color: rgba(255, 255, 255, 0.4); 238 | background-color: rgba(255, 255, 255, 0.1); 239 | color: rgba(255, 255, 255, 0.8); 240 | } 241 | #home .links { 242 | position: absolute; 243 | left: 50%; 244 | transform: translate(-50%, 0); 245 | bottom: 20px; 246 | } 247 | #home .links a { 248 | color: rgba(255, 255, 255, 0.5); 249 | } 250 | 251 | #level { 252 | display: flex; 253 | justify-content: center; 254 | align-items: center; 255 | position: absolute; 256 | left: 0; 257 | top: 0; 258 | height: 100vh; 259 | width: 100vw; 260 | z-index: 9; 261 | background-image: linear-gradient(to bottom, #ca6ece, #232361); 262 | } 263 | #level .main { 264 | display: flex; 265 | justify-content: center; 266 | align-items: center; 267 | width: 85vw; 268 | height: 80vmin; 269 | } 270 | #level .difficulty { 271 | width: 20vw; 272 | margin-right: 5vw; 273 | } 274 | #level .difficulty li { 275 | box-sizing: content-box; 276 | width: 20vw; 277 | height: 3vw; 278 | line-height: 3vw; 279 | background-color: #fff; 280 | border-radius: 2.5vw; 281 | text-align: center; 282 | cursor: pointer; 283 | border-bottom: 0.5vw solid rgba(0, 0, 0, 0.2); 284 | margin: 2vw 0; 285 | font-size: 1.5vw; 286 | font-weight: bold; 287 | color: rgba(0, 0, 0, 0.7); 288 | transition: all 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 289 | opacity: 0.7; 290 | } 291 | #level .difficulty li:hover { 292 | opacity: 0.9; 293 | transform: scale(1.05); 294 | } 295 | #level .list { 296 | width: 60vw; 297 | } 298 | #level .list li { 299 | display: flex; 300 | flex-wrap: wrap; 301 | display: none; 302 | } 303 | #level .list li b { 304 | box-sizing: content-box; 305 | height: 4vw; 306 | width: 4vw; 307 | line-height: 4vw; 308 | background-color: #fff; 309 | pointer-events: none; 310 | text-align: center; 311 | cursor: pointer; 312 | border-bottom: 0.5vw solid rgba(0, 0, 0, 0.2); 313 | border-radius: 0.5vw; 314 | margin: 1vw; 315 | font-size: 1.8vw; 316 | font-weight: bold; 317 | color: rgba(0, 0, 0, 0.7); 318 | transition: all 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 319 | opacity: 0.3; 320 | } 321 | #level .list li b[data-unlock] { 322 | pointer-events: auto; 323 | opacity: 0.7; 324 | } 325 | #level .list li b[data-unlock]:hover { 326 | opacity: 0.9; 327 | transform: scale(1.05); 328 | } 329 | #level .list li b[data-unlock]:active { 330 | transform: scale(1); 331 | } 332 | #level[data-tab="1"] .difficulty li:nth-child(1) { 333 | opacity: 1; 334 | } 335 | #level[data-tab="1"] .list li:nth-child(1) { 336 | display: flex; 337 | } 338 | #level[data-tab="2"] .difficulty li:nth-child(2) { 339 | opacity: 1; 340 | } 341 | #level[data-tab="2"] .list li:nth-child(2) { 342 | display: flex; 343 | } 344 | #level[data-tab="3"] .difficulty li:nth-child(3) { 345 | opacity: 1; 346 | } 347 | #level[data-tab="3"] .list li:nth-child(3) { 348 | display: flex; 349 | } 350 | #level[data-tab="4"] .difficulty li:nth-child(4) { 351 | opacity: 1; 352 | } 353 | #level[data-tab="4"] .list li:nth-child(4) { 354 | display: flex; 355 | } 356 | 357 | #game { 358 | display: flex; 359 | justify-content: center; 360 | align-items: center; 361 | position: absolute; 362 | left: 0; 363 | top: 0; 364 | height: 100vh; 365 | width: 100vw; 366 | z-index: 1; 367 | } 368 | #game #board #grid, 369 | #game #board #number { 370 | width: 80vmin; 371 | height: 80vmin; 372 | display: flex; 373 | flex-wrap: wrap; 374 | justify-content: space-between; 375 | align-content: space-between; 376 | } 377 | #game #board #number { 378 | position: absolute; 379 | left: 50%; 380 | top: 50%; 381 | transform: translate(-50%, -50%); 382 | } 383 | #game #board .grid-nine { 384 | width: 26.3vmin; 385 | height: 26.3vmin; 386 | display: flex; 387 | flex-wrap: wrap; 388 | justify-content: space-between; 389 | align-content: space-between; 390 | } 391 | #game #board .grid { 392 | width: 8.7666666667vmin; 393 | height: 8.7666666667vmin; 394 | border: 0.2vmin solid transparent; 395 | background-color: rgba(255, 255, 255, 0.9); 396 | background-clip: content-box; 397 | transition: background 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 398 | position: relative; 399 | } 400 | #game #board .grid-transparent { 401 | background-color: transparent; 402 | } 403 | #game #board .grid-number { 404 | display: flex; 405 | justify-content: center; 406 | align-items: center; 407 | position: relative; 408 | } 409 | #game #board .grid-number .dot { 410 | will-change: transform; 411 | content: ""; 412 | position: absolute; 413 | z-index: -1; 414 | border-radius: 100%; 415 | width: 6.1366666667vmin; 416 | height: 6.1366666667vmin; 417 | transform: scale(0) translateZ(0); 418 | opacity: 0; 419 | transition: all 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 420 | transform-origin: center; 421 | } 422 | #game #board .grid-number .number { 423 | display: flex; 424 | justify-content: center; 425 | align-items: center; 426 | position: absolute; 427 | z-index: 2; 428 | width: 100%; 429 | height: 100%; 430 | font-size: 3.5vmin; 431 | color: rgba(0, 0, 0, 0.8); 432 | font-weight: bold; 433 | transition: color 0.4s cubic-bezier(0.22, 0.61, 0.36, 1); 434 | } 435 | #game #board .grid-number .grid-small { 436 | display: flex; 437 | flex-wrap: wrap; 438 | position: absolute; 439 | width: 100%; 440 | height: 100%; 441 | opacity: 0; 442 | z-index: -1; 443 | transition: opacity 0.4s cubic-bezier(0.22, 0.61, 0.36, 1); 444 | color: #fff; 445 | } 446 | #game #board .grid-number .grid-small b { 447 | display: flex; 448 | justify-content: center; 449 | align-items: center; 450 | will-change: transform; 451 | width: 33.3333333333%; 452 | height: 33.3333333333%; 453 | opacity: 0.5; 454 | transform: scale(1); 455 | transition: all 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 456 | transform-origin: center; 457 | } 458 | #game #board .grid-number .grid-small b.candidate { 459 | opacity: 1; 460 | } 461 | #game #board .grid-number:not([data-freeze]):hover .dot { 462 | transform: scale(1); 463 | opacity: 1; 464 | } 465 | #game #board .grid-number:not([data-freeze]):hover .number { 466 | color: #fff; 467 | } 468 | #game #board .grid-number.data-active .dot { 469 | border-radius: 0; 470 | transform: scale(1); 471 | opacity: 1; 472 | width: auto; 473 | height: auto; 474 | left: 0; 475 | right: 0; 476 | top: 0; 477 | bottom: 0; 478 | margin: -0.2vmin; 479 | z-index: 9; 480 | } 481 | #game #board .grid-number.data-active .grid-small { 482 | opacity: 1; 483 | z-index: 10; 484 | } 485 | #game #board .grid-number.data-active .grid-small b { 486 | color: #fff !important; 487 | } 488 | #game #board .grid-number.data-active .grid-small b:hover { 489 | opacity: 1; 490 | transform: scale(1.3); 491 | transform-origin: center; 492 | } 493 | #game #board .grid-number.small-active .dot { 494 | width: 8.7666666667vmin; 495 | height: 8.7666666667vmin; 496 | } 497 | #game #board .grid-number.small-active .grid-small { 498 | opacity: 1; 499 | z-index: 1; 500 | } 501 | #game #board .grid-number.small-active .grid-small b:not(.candidate) { 502 | opacity: 0; 503 | } 504 | #game #board .grid-number.small-active.data-active .grid-small { 505 | z-index: 10; 506 | } 507 | #game #board .grid-number.small-active.data-active .grid-small b { 508 | opacity: 0.5; 509 | } 510 | #game #board .grid-number.small-active.data-active .grid-small b.candidate { 511 | opacity: 1; 512 | } 513 | #game #board .grid-number[data-invalid] .number::before { 514 | position: absolute; 515 | left: 50%; 516 | top: 50%; 517 | transform: translate(-50%, -50%); 518 | content: ""; 519 | width: 5.26vmin; 520 | height: 5.26vmin; 521 | z-index: -1; 522 | transition: all 0.2s cubic-bezier(0.22, 0.61, 0.36, 1); 523 | border: 0.5vmin solid currentColor; 524 | border-radius: 100%; 525 | } 526 | #game #board .grid-number[data-invalid]:hover .number::before { 527 | border-color: transparent; 528 | } 529 | #game #board .grid-number[data-invalid][data-freeze]:hover .number::before { 530 | border-color: currentColor; 531 | } 532 | #game #board .grid-nine:nth-child(1) .grid:nth-child(1), #game #board .grid-nine:nth-child(1) .grid:nth-child(1) .data-active .dot { 533 | border-top-left-radius: 2vmin; 534 | } 535 | #game #board .grid-nine:nth-child(3) .grid:nth-child(3), #game #board .grid-nine:nth-child(3) .grid:nth-child(3) .data-active .dot { 536 | border-top-right-radius: 2vmin; 537 | } 538 | #game #board .grid-nine:nth-child(7) .grid:nth-child(7), #game #board .grid-nine:nth-child(7) .grid:nth-child(7) .data-active .dot { 539 | border-bottom-left-radius: 2vmin; 540 | } 541 | #game #board .grid-nine:nth-child(9) .grid:nth-child(9), #game #board .grid-nine:nth-child(9) .grid:nth-child(9) .data-active .dot { 542 | border-bottom-right-radius: 2vmin; 543 | } 544 | 545 | #win { 546 | position: absolute; 547 | left: 0; 548 | top: 0; 549 | height: 100vh; 550 | width: 100vw; 551 | display: flex; 552 | justify-content: center; 553 | align-items: center; 554 | z-index: 2; 555 | pointer-events: none; 556 | background-color: rgba(0, 0, 0, 0.3); 557 | opacity: 0; 558 | filter: blur(1vmin); 559 | transition: all 1s; 560 | } 561 | #win .text { 562 | display: flex; 563 | justify-content: center; 564 | align-items: center; 565 | } 566 | #win .text span { 567 | color: #fff; 568 | font-size: 3vmin; 569 | } 570 | #win .text i { 571 | display: inline-block; 572 | width: 3vmin; 573 | height: 6vmin; 574 | position: relative; 575 | transform: rotate(45deg); 576 | transform-origin: 90% 50%; 577 | margin-right: 3vmin; 578 | } 579 | #win .text i::before, #win .text i::after { 580 | content: ""; 581 | position: absolute; 582 | border-radius: 0.5vmin; 583 | background-color: #fff; 584 | } 585 | #win .text i::before { 586 | bottom: 0; 587 | left: 0; 588 | width: 0; 589 | height: 1vmin; 590 | transition: width 0.2s ease-in 0.6s; 591 | } 592 | #win .text i::after { 593 | right: 0; 594 | bottom: 0; 595 | height: 0; 596 | width: 1vmin; 597 | transition: height 0.3s cubic-bezier(1, 0.42, 1, 1) 0.8s; 598 | } 599 | #win.show { 600 | filter: blur(0); 601 | opacity: 1; 602 | pointer-events: auto; 603 | } 604 | #win.show .text i::before { 605 | width: 3vmin; 606 | } 607 | #win.show .text i::after { 608 | height: 6vmin; 609 | } 610 | #win.show + #game { 611 | filter: blur(10px); 612 | } 613 | 614 | #game[game-color="1"] { 615 | background: linear-gradient(15deg, #8f443d, #c27770); 616 | } 617 | #game[game-color="1"] #board #grid .grid[data-light] { 618 | background-color: #e8ccc9; 619 | } 620 | #game[game-color="1"] #board #number .grid-number .dot { 621 | background: linear-gradient(15deg, #8f443d, #c27770); 622 | } 623 | #game[game-color="1"] #board #number .grid-number-input .number { 624 | color: #8f443d; 625 | } 626 | #game[game-color="1"] #board #number .grid-number-input .number:hover { 627 | color: #fff; 628 | } 629 | #game[game-color="1"] #board #number .grid-number.small-active .grid-small { 630 | color: #8f443d; 631 | } 632 | #game[game-color="1"] #board #number .grid-number.small-active:hover .grid-small { 633 | color: #fff; 634 | } 635 | 636 | #game[game-color="2"] { 637 | background: linear-gradient(30deg, #8f4b3d, #c27e70); 638 | } 639 | #game[game-color="2"] #board #grid .grid[data-light] { 640 | background-color: #e8cfc9; 641 | } 642 | #game[game-color="2"] #board #number .grid-number .dot { 643 | background: linear-gradient(30deg, #8f4b3d, #c27e70); 644 | } 645 | #game[game-color="2"] #board #number .grid-number-input .number { 646 | color: #8f4b3d; 647 | } 648 | #game[game-color="2"] #board #number .grid-number-input .number:hover { 649 | color: #fff; 650 | } 651 | #game[game-color="2"] #board #number .grid-number.small-active .grid-small { 652 | color: #8f4b3d; 653 | } 654 | #game[game-color="2"] #board #number .grid-number.small-active:hover .grid-small { 655 | color: #fff; 656 | } 657 | 658 | #game[game-color="3"] { 659 | background: linear-gradient(45deg, #8f523d, #c28570); 660 | } 661 | #game[game-color="3"] #board #grid .grid[data-light] { 662 | background-color: #e8d1c9; 663 | } 664 | #game[game-color="3"] #board #number .grid-number .dot { 665 | background: linear-gradient(45deg, #8f523d, #c28570); 666 | } 667 | #game[game-color="3"] #board #number .grid-number-input .number { 668 | color: #8f523d; 669 | } 670 | #game[game-color="3"] #board #number .grid-number-input .number:hover { 671 | color: #fff; 672 | } 673 | #game[game-color="3"] #board #number .grid-number.small-active .grid-small { 674 | color: #8f523d; 675 | } 676 | #game[game-color="3"] #board #number .grid-number.small-active:hover .grid-small { 677 | color: #fff; 678 | } 679 | 680 | #game[game-color="4"] { 681 | background: linear-gradient(60deg, #8f583d, #c28b70); 682 | } 683 | #game[game-color="4"] #board #grid .grid[data-light] { 684 | background-color: #e8d4c9; 685 | } 686 | #game[game-color="4"] #board #number .grid-number .dot { 687 | background: linear-gradient(60deg, #8f583d, #c28b70); 688 | } 689 | #game[game-color="4"] #board #number .grid-number-input .number { 690 | color: #8f583d; 691 | } 692 | #game[game-color="4"] #board #number .grid-number-input .number:hover { 693 | color: #fff; 694 | } 695 | #game[game-color="4"] #board #number .grid-number.small-active .grid-small { 696 | color: #8f583d; 697 | } 698 | #game[game-color="4"] #board #number .grid-number.small-active:hover .grid-small { 699 | color: #fff; 700 | } 701 | 702 | #game[game-color="5"] { 703 | background: linear-gradient(75deg, #8f5f3d, #c29270); 704 | } 705 | #game[game-color="5"] #board #grid .grid[data-light] { 706 | background-color: #e8d6c9; 707 | } 708 | #game[game-color="5"] #board #number .grid-number .dot { 709 | background: linear-gradient(75deg, #8f5f3d, #c29270); 710 | } 711 | #game[game-color="5"] #board #number .grid-number-input .number { 712 | color: #8f5f3d; 713 | } 714 | #game[game-color="5"] #board #number .grid-number-input .number:hover { 715 | color: #fff; 716 | } 717 | #game[game-color="5"] #board #number .grid-number.small-active .grid-small { 718 | color: #8f5f3d; 719 | } 720 | #game[game-color="5"] #board #number .grid-number.small-active:hover .grid-small { 721 | color: #fff; 722 | } 723 | 724 | #game[game-color="6"] { 725 | background: linear-gradient(90deg, #8f663d, #c29970); 726 | } 727 | #game[game-color="6"] #board #grid .grid[data-light] { 728 | background-color: #e8d9c9; 729 | } 730 | #game[game-color="6"] #board #number .grid-number .dot { 731 | background: linear-gradient(90deg, #8f663d, #c29970); 732 | } 733 | #game[game-color="6"] #board #number .grid-number-input .number { 734 | color: #8f663d; 735 | } 736 | #game[game-color="6"] #board #number .grid-number-input .number:hover { 737 | color: #fff; 738 | } 739 | #game[game-color="6"] #board #number .grid-number.small-active .grid-small { 740 | color: #8f663d; 741 | } 742 | #game[game-color="6"] #board #number .grid-number.small-active:hover .grid-small { 743 | color: #fff; 744 | } 745 | 746 | #game[game-color="7"] { 747 | background: linear-gradient(105deg, #8f6d3d, #c2a070); 748 | } 749 | #game[game-color="7"] #board #grid .grid[data-light] { 750 | background-color: #e8dbc9; 751 | } 752 | #game[game-color="7"] #board #number .grid-number .dot { 753 | background: linear-gradient(105deg, #8f6d3d, #c2a070); 754 | } 755 | #game[game-color="7"] #board #number .grid-number-input .number { 756 | color: #8f6d3d; 757 | } 758 | #game[game-color="7"] #board #number .grid-number-input .number:hover { 759 | color: #fff; 760 | } 761 | #game[game-color="7"] #board #number .grid-number.small-active .grid-small { 762 | color: #8f6d3d; 763 | } 764 | #game[game-color="7"] #board #number .grid-number.small-active:hover .grid-small { 765 | color: #fff; 766 | } 767 | 768 | #game[game-color="8"] { 769 | background: linear-gradient(120deg, #8f743d, #c2a770); 770 | } 771 | #game[game-color="8"] #board #grid .grid[data-light] { 772 | background-color: #e8dec9; 773 | } 774 | #game[game-color="8"] #board #number .grid-number .dot { 775 | background: linear-gradient(120deg, #8f743d, #c2a770); 776 | } 777 | #game[game-color="8"] #board #number .grid-number-input .number { 778 | color: #8f743d; 779 | } 780 | #game[game-color="8"] #board #number .grid-number-input .number:hover { 781 | color: #fff; 782 | } 783 | #game[game-color="8"] #board #number .grid-number.small-active .grid-small { 784 | color: #8f743d; 785 | } 786 | #game[game-color="8"] #board #number .grid-number.small-active:hover .grid-small { 787 | color: #fff; 788 | } 789 | 790 | #game[game-color="9"] { 791 | background: linear-gradient(135deg, #8f7a3d, #c2ad70); 792 | } 793 | #game[game-color="9"] #board #grid .grid[data-light] { 794 | background-color: #e8e0c9; 795 | } 796 | #game[game-color="9"] #board #number .grid-number .dot { 797 | background: linear-gradient(135deg, #8f7a3d, #c2ad70); 798 | } 799 | #game[game-color="9"] #board #number .grid-number-input .number { 800 | color: #8f7a3d; 801 | } 802 | #game[game-color="9"] #board #number .grid-number-input .number:hover { 803 | color: #fff; 804 | } 805 | #game[game-color="9"] #board #number .grid-number.small-active .grid-small { 806 | color: #8f7a3d; 807 | } 808 | #game[game-color="9"] #board #number .grid-number.small-active:hover .grid-small { 809 | color: #fff; 810 | } 811 | 812 | #game[game-color="10"] { 813 | background: linear-gradient(150deg, #8f813d, #c2b470); 814 | } 815 | #game[game-color="10"] #board #grid .grid[data-light] { 816 | background-color: #e8e3c9; 817 | } 818 | #game[game-color="10"] #board #number .grid-number .dot { 819 | background: linear-gradient(150deg, #8f813d, #c2b470); 820 | } 821 | #game[game-color="10"] #board #number .grid-number-input .number { 822 | color: #8f813d; 823 | } 824 | #game[game-color="10"] #board #number .grid-number-input .number:hover { 825 | color: #fff; 826 | } 827 | #game[game-color="10"] #board #number .grid-number.small-active .grid-small { 828 | color: #8f813d; 829 | } 830 | #game[game-color="10"] #board #number .grid-number.small-active:hover .grid-small { 831 | color: #fff; 832 | } 833 | 834 | #game[game-color="11"] { 835 | background: linear-gradient(165deg, #8f883d, #c2bb70); 836 | } 837 | #game[game-color="11"] #board #grid .grid[data-light] { 838 | background-color: #e8e6c9; 839 | } 840 | #game[game-color="11"] #board #number .grid-number .dot { 841 | background: linear-gradient(165deg, #8f883d, #c2bb70); 842 | } 843 | #game[game-color="11"] #board #number .grid-number-input .number { 844 | color: #8f883d; 845 | } 846 | #game[game-color="11"] #board #number .grid-number-input .number:hover { 847 | color: #fff; 848 | } 849 | #game[game-color="11"] #board #number .grid-number.small-active .grid-small { 850 | color: #8f883d; 851 | } 852 | #game[game-color="11"] #board #number .grid-number.small-active:hover .grid-small { 853 | color: #fff; 854 | } 855 | 856 | #game[game-color="12"] { 857 | background: linear-gradient(180deg, #8f8f3d, #c2c270); 858 | } 859 | #game[game-color="12"] #board #grid .grid[data-light] { 860 | background-color: #e8e8c9; 861 | } 862 | #game[game-color="12"] #board #number .grid-number .dot { 863 | background: linear-gradient(180deg, #8f8f3d, #c2c270); 864 | } 865 | #game[game-color="12"] #board #number .grid-number-input .number { 866 | color: #8f8f3d; 867 | } 868 | #game[game-color="12"] #board #number .grid-number-input .number:hover { 869 | color: #fff; 870 | } 871 | #game[game-color="12"] #board #number .grid-number.small-active .grid-small { 872 | color: #8f8f3d; 873 | } 874 | #game[game-color="12"] #board #number .grid-number.small-active:hover .grid-small { 875 | color: #fff; 876 | } 877 | 878 | #game[game-color="13"] { 879 | background: linear-gradient(195deg, #888f3d, #bbc270); 880 | } 881 | #game[game-color="13"] #board #grid .grid[data-light] { 882 | background-color: #e6e8c9; 883 | } 884 | #game[game-color="13"] #board #number .grid-number .dot { 885 | background: linear-gradient(195deg, #888f3d, #bbc270); 886 | } 887 | #game[game-color="13"] #board #number .grid-number-input .number { 888 | color: #888f3d; 889 | } 890 | #game[game-color="13"] #board #number .grid-number-input .number:hover { 891 | color: #fff; 892 | } 893 | #game[game-color="13"] #board #number .grid-number.small-active .grid-small { 894 | color: #888f3d; 895 | } 896 | #game[game-color="13"] #board #number .grid-number.small-active:hover .grid-small { 897 | color: #fff; 898 | } 899 | 900 | #game[game-color="14"] { 901 | background: linear-gradient(210deg, #818f3d, #b4c270); 902 | } 903 | #game[game-color="14"] #board #grid .grid[data-light] { 904 | background-color: #e3e8c9; 905 | } 906 | #game[game-color="14"] #board #number .grid-number .dot { 907 | background: linear-gradient(210deg, #818f3d, #b4c270); 908 | } 909 | #game[game-color="14"] #board #number .grid-number-input .number { 910 | color: #818f3d; 911 | } 912 | #game[game-color="14"] #board #number .grid-number-input .number:hover { 913 | color: #fff; 914 | } 915 | #game[game-color="14"] #board #number .grid-number.small-active .grid-small { 916 | color: #818f3d; 917 | } 918 | #game[game-color="14"] #board #number .grid-number.small-active:hover .grid-small { 919 | color: #fff; 920 | } 921 | 922 | #game[game-color="15"] { 923 | background: linear-gradient(225deg, #7a8f3d, #adc270); 924 | } 925 | #game[game-color="15"] #board #grid .grid[data-light] { 926 | background-color: #e0e8c9; 927 | } 928 | #game[game-color="15"] #board #number .grid-number .dot { 929 | background: linear-gradient(225deg, #7a8f3d, #adc270); 930 | } 931 | #game[game-color="15"] #board #number .grid-number-input .number { 932 | color: #7a8f3d; 933 | } 934 | #game[game-color="15"] #board #number .grid-number-input .number:hover { 935 | color: #fff; 936 | } 937 | #game[game-color="15"] #board #number .grid-number.small-active .grid-small { 938 | color: #7a8f3d; 939 | } 940 | #game[game-color="15"] #board #number .grid-number.small-active:hover .grid-small { 941 | color: #fff; 942 | } 943 | 944 | #game[game-color="16"] { 945 | background: linear-gradient(240deg, #748f3d, #a7c270); 946 | } 947 | #game[game-color="16"] #board #grid .grid[data-light] { 948 | background-color: #dee8c9; 949 | } 950 | #game[game-color="16"] #board #number .grid-number .dot { 951 | background: linear-gradient(240deg, #748f3d, #a7c270); 952 | } 953 | #game[game-color="16"] #board #number .grid-number-input .number { 954 | color: #748f3d; 955 | } 956 | #game[game-color="16"] #board #number .grid-number-input .number:hover { 957 | color: #fff; 958 | } 959 | #game[game-color="16"] #board #number .grid-number.small-active .grid-small { 960 | color: #748f3d; 961 | } 962 | #game[game-color="16"] #board #number .grid-number.small-active:hover .grid-small { 963 | color: #fff; 964 | } 965 | 966 | #game[game-color="17"] { 967 | background: linear-gradient(255deg, #6d8f3d, #a0c270); 968 | } 969 | #game[game-color="17"] #board #grid .grid[data-light] { 970 | background-color: #dbe8c9; 971 | } 972 | #game[game-color="17"] #board #number .grid-number .dot { 973 | background: linear-gradient(255deg, #6d8f3d, #a0c270); 974 | } 975 | #game[game-color="17"] #board #number .grid-number-input .number { 976 | color: #6d8f3d; 977 | } 978 | #game[game-color="17"] #board #number .grid-number-input .number:hover { 979 | color: #fff; 980 | } 981 | #game[game-color="17"] #board #number .grid-number.small-active .grid-small { 982 | color: #6d8f3d; 983 | } 984 | #game[game-color="17"] #board #number .grid-number.small-active:hover .grid-small { 985 | color: #fff; 986 | } 987 | 988 | #game[game-color="18"] { 989 | background: linear-gradient(270deg, #668f3d, #99c270); 990 | } 991 | #game[game-color="18"] #board #grid .grid[data-light] { 992 | background-color: #d9e8c9; 993 | } 994 | #game[game-color="18"] #board #number .grid-number .dot { 995 | background: linear-gradient(270deg, #668f3d, #99c270); 996 | } 997 | #game[game-color="18"] #board #number .grid-number-input .number { 998 | color: #668f3d; 999 | } 1000 | #game[game-color="18"] #board #number .grid-number-input .number:hover { 1001 | color: #fff; 1002 | } 1003 | #game[game-color="18"] #board #number .grid-number.small-active .grid-small { 1004 | color: #668f3d; 1005 | } 1006 | #game[game-color="18"] #board #number .grid-number.small-active:hover .grid-small { 1007 | color: #fff; 1008 | } 1009 | 1010 | #game[game-color="19"] { 1011 | background: linear-gradient(285deg, #5f8f3d, #92c270); 1012 | } 1013 | #game[game-color="19"] #board #grid .grid[data-light] { 1014 | background-color: #d6e8c9; 1015 | } 1016 | #game[game-color="19"] #board #number .grid-number .dot { 1017 | background: linear-gradient(285deg, #5f8f3d, #92c270); 1018 | } 1019 | #game[game-color="19"] #board #number .grid-number-input .number { 1020 | color: #5f8f3d; 1021 | } 1022 | #game[game-color="19"] #board #number .grid-number-input .number:hover { 1023 | color: #fff; 1024 | } 1025 | #game[game-color="19"] #board #number .grid-number.small-active .grid-small { 1026 | color: #5f8f3d; 1027 | } 1028 | #game[game-color="19"] #board #number .grid-number.small-active:hover .grid-small { 1029 | color: #fff; 1030 | } 1031 | 1032 | #game[game-color="20"] { 1033 | background: linear-gradient(300deg, #588f3d, #8bc270); 1034 | } 1035 | #game[game-color="20"] #board #grid .grid[data-light] { 1036 | background-color: #d4e8c9; 1037 | } 1038 | #game[game-color="20"] #board #number .grid-number .dot { 1039 | background: linear-gradient(300deg, #588f3d, #8bc270); 1040 | } 1041 | #game[game-color="20"] #board #number .grid-number-input .number { 1042 | color: #588f3d; 1043 | } 1044 | #game[game-color="20"] #board #number .grid-number-input .number:hover { 1045 | color: #fff; 1046 | } 1047 | #game[game-color="20"] #board #number .grid-number.small-active .grid-small { 1048 | color: #588f3d; 1049 | } 1050 | #game[game-color="20"] #board #number .grid-number.small-active:hover .grid-small { 1051 | color: #fff; 1052 | } 1053 | 1054 | #game[game-color="21"] { 1055 | background: linear-gradient(315deg, #528f3d, #85c270); 1056 | } 1057 | #game[game-color="21"] #board #grid .grid[data-light] { 1058 | background-color: #d1e8c9; 1059 | } 1060 | #game[game-color="21"] #board #number .grid-number .dot { 1061 | background: linear-gradient(315deg, #528f3d, #85c270); 1062 | } 1063 | #game[game-color="21"] #board #number .grid-number-input .number { 1064 | color: #528f3d; 1065 | } 1066 | #game[game-color="21"] #board #number .grid-number-input .number:hover { 1067 | color: #fff; 1068 | } 1069 | #game[game-color="21"] #board #number .grid-number.small-active .grid-small { 1070 | color: #528f3d; 1071 | } 1072 | #game[game-color="21"] #board #number .grid-number.small-active:hover .grid-small { 1073 | color: #fff; 1074 | } 1075 | 1076 | #game[game-color="22"] { 1077 | background: linear-gradient(330deg, #4b8f3d, #7ec270); 1078 | } 1079 | #game[game-color="22"] #board #grid .grid[data-light] { 1080 | background-color: #cfe8c9; 1081 | } 1082 | #game[game-color="22"] #board #number .grid-number .dot { 1083 | background: linear-gradient(330deg, #4b8f3d, #7ec270); 1084 | } 1085 | #game[game-color="22"] #board #number .grid-number-input .number { 1086 | color: #4b8f3d; 1087 | } 1088 | #game[game-color="22"] #board #number .grid-number-input .number:hover { 1089 | color: #fff; 1090 | } 1091 | #game[game-color="22"] #board #number .grid-number.small-active .grid-small { 1092 | color: #4b8f3d; 1093 | } 1094 | #game[game-color="22"] #board #number .grid-number.small-active:hover .grid-small { 1095 | color: #fff; 1096 | } 1097 | 1098 | #game[game-color="23"] { 1099 | background: linear-gradient(345deg, #448f3d, #77c270); 1100 | } 1101 | #game[game-color="23"] #board #grid .grid[data-light] { 1102 | background-color: #cce8c9; 1103 | } 1104 | #game[game-color="23"] #board #number .grid-number .dot { 1105 | background: linear-gradient(345deg, #448f3d, #77c270); 1106 | } 1107 | #game[game-color="23"] #board #number .grid-number-input .number { 1108 | color: #448f3d; 1109 | } 1110 | #game[game-color="23"] #board #number .grid-number-input .number:hover { 1111 | color: #fff; 1112 | } 1113 | #game[game-color="23"] #board #number .grid-number.small-active .grid-small { 1114 | color: #448f3d; 1115 | } 1116 | #game[game-color="23"] #board #number .grid-number.small-active:hover .grid-small { 1117 | color: #fff; 1118 | } 1119 | 1120 | #game[game-color="24"] { 1121 | background: linear-gradient(360deg, #3d8f3d, #70c270); 1122 | } 1123 | #game[game-color="24"] #board #grid .grid[data-light] { 1124 | background-color: #c9e8c9; 1125 | } 1126 | #game[game-color="24"] #board #number .grid-number .dot { 1127 | background: linear-gradient(360deg, #3d8f3d, #70c270); 1128 | } 1129 | #game[game-color="24"] #board #number .grid-number-input .number { 1130 | color: #3d8f3d; 1131 | } 1132 | #game[game-color="24"] #board #number .grid-number-input .number:hover { 1133 | color: #fff; 1134 | } 1135 | #game[game-color="24"] #board #number .grid-number.small-active .grid-small { 1136 | color: #3d8f3d; 1137 | } 1138 | #game[game-color="24"] #board #number .grid-number.small-active:hover .grid-small { 1139 | color: #fff; 1140 | } 1141 | 1142 | #game[game-color="25"] { 1143 | background: linear-gradient(375deg, #3d8f44, #70c277); 1144 | } 1145 | #game[game-color="25"] #board #grid .grid[data-light] { 1146 | background-color: #c9e8cc; 1147 | } 1148 | #game[game-color="25"] #board #number .grid-number .dot { 1149 | background: linear-gradient(375deg, #3d8f44, #70c277); 1150 | } 1151 | #game[game-color="25"] #board #number .grid-number-input .number { 1152 | color: #3d8f44; 1153 | } 1154 | #game[game-color="25"] #board #number .grid-number-input .number:hover { 1155 | color: #fff; 1156 | } 1157 | #game[game-color="25"] #board #number .grid-number.small-active .grid-small { 1158 | color: #3d8f44; 1159 | } 1160 | #game[game-color="25"] #board #number .grid-number.small-active:hover .grid-small { 1161 | color: #fff; 1162 | } 1163 | 1164 | #game[game-color="26"] { 1165 | background: linear-gradient(390deg, #3d8f4b, #70c27e); 1166 | } 1167 | #game[game-color="26"] #board #grid .grid[data-light] { 1168 | background-color: #c9e8cf; 1169 | } 1170 | #game[game-color="26"] #board #number .grid-number .dot { 1171 | background: linear-gradient(390deg, #3d8f4b, #70c27e); 1172 | } 1173 | #game[game-color="26"] #board #number .grid-number-input .number { 1174 | color: #3d8f4b; 1175 | } 1176 | #game[game-color="26"] #board #number .grid-number-input .number:hover { 1177 | color: #fff; 1178 | } 1179 | #game[game-color="26"] #board #number .grid-number.small-active .grid-small { 1180 | color: #3d8f4b; 1181 | } 1182 | #game[game-color="26"] #board #number .grid-number.small-active:hover .grid-small { 1183 | color: #fff; 1184 | } 1185 | 1186 | #game[game-color="27"] { 1187 | background: linear-gradient(405deg, #3d8f52, #70c285); 1188 | } 1189 | #game[game-color="27"] #board #grid .grid[data-light] { 1190 | background-color: #c9e8d1; 1191 | } 1192 | #game[game-color="27"] #board #number .grid-number .dot { 1193 | background: linear-gradient(405deg, #3d8f52, #70c285); 1194 | } 1195 | #game[game-color="27"] #board #number .grid-number-input .number { 1196 | color: #3d8f52; 1197 | } 1198 | #game[game-color="27"] #board #number .grid-number-input .number:hover { 1199 | color: #fff; 1200 | } 1201 | #game[game-color="27"] #board #number .grid-number.small-active .grid-small { 1202 | color: #3d8f52; 1203 | } 1204 | #game[game-color="27"] #board #number .grid-number.small-active:hover .grid-small { 1205 | color: #fff; 1206 | } 1207 | 1208 | #game[game-color="28"] { 1209 | background: linear-gradient(420deg, #3d8f58, #70c28b); 1210 | } 1211 | #game[game-color="28"] #board #grid .grid[data-light] { 1212 | background-color: #c9e8d4; 1213 | } 1214 | #game[game-color="28"] #board #number .grid-number .dot { 1215 | background: linear-gradient(420deg, #3d8f58, #70c28b); 1216 | } 1217 | #game[game-color="28"] #board #number .grid-number-input .number { 1218 | color: #3d8f58; 1219 | } 1220 | #game[game-color="28"] #board #number .grid-number-input .number:hover { 1221 | color: #fff; 1222 | } 1223 | #game[game-color="28"] #board #number .grid-number.small-active .grid-small { 1224 | color: #3d8f58; 1225 | } 1226 | #game[game-color="28"] #board #number .grid-number.small-active:hover .grid-small { 1227 | color: #fff; 1228 | } 1229 | 1230 | #game[game-color="29"] { 1231 | background: linear-gradient(435deg, #3d8f5f, #70c292); 1232 | } 1233 | #game[game-color="29"] #board #grid .grid[data-light] { 1234 | background-color: #c9e8d6; 1235 | } 1236 | #game[game-color="29"] #board #number .grid-number .dot { 1237 | background: linear-gradient(435deg, #3d8f5f, #70c292); 1238 | } 1239 | #game[game-color="29"] #board #number .grid-number-input .number { 1240 | color: #3d8f5f; 1241 | } 1242 | #game[game-color="29"] #board #number .grid-number-input .number:hover { 1243 | color: #fff; 1244 | } 1245 | #game[game-color="29"] #board #number .grid-number.small-active .grid-small { 1246 | color: #3d8f5f; 1247 | } 1248 | #game[game-color="29"] #board #number .grid-number.small-active:hover .grid-small { 1249 | color: #fff; 1250 | } 1251 | 1252 | #game[game-color="30"] { 1253 | background: linear-gradient(450deg, #3d8f66, #70c299); 1254 | } 1255 | #game[game-color="30"] #board #grid .grid[data-light] { 1256 | background-color: #c9e8d9; 1257 | } 1258 | #game[game-color="30"] #board #number .grid-number .dot { 1259 | background: linear-gradient(450deg, #3d8f66, #70c299); 1260 | } 1261 | #game[game-color="30"] #board #number .grid-number-input .number { 1262 | color: #3d8f66; 1263 | } 1264 | #game[game-color="30"] #board #number .grid-number-input .number:hover { 1265 | color: #fff; 1266 | } 1267 | #game[game-color="30"] #board #number .grid-number.small-active .grid-small { 1268 | color: #3d8f66; 1269 | } 1270 | #game[game-color="30"] #board #number .grid-number.small-active:hover .grid-small { 1271 | color: #fff; 1272 | } 1273 | 1274 | #game[game-color="31"] { 1275 | background: linear-gradient(465deg, #3d8f6d, #70c2a0); 1276 | } 1277 | #game[game-color="31"] #board #grid .grid[data-light] { 1278 | background-color: #c9e8db; 1279 | } 1280 | #game[game-color="31"] #board #number .grid-number .dot { 1281 | background: linear-gradient(465deg, #3d8f6d, #70c2a0); 1282 | } 1283 | #game[game-color="31"] #board #number .grid-number-input .number { 1284 | color: #3d8f6d; 1285 | } 1286 | #game[game-color="31"] #board #number .grid-number-input .number:hover { 1287 | color: #fff; 1288 | } 1289 | #game[game-color="31"] #board #number .grid-number.small-active .grid-small { 1290 | color: #3d8f6d; 1291 | } 1292 | #game[game-color="31"] #board #number .grid-number.small-active:hover .grid-small { 1293 | color: #fff; 1294 | } 1295 | 1296 | #game[game-color="32"] { 1297 | background: linear-gradient(480deg, #3d8f74, #70c2a7); 1298 | } 1299 | #game[game-color="32"] #board #grid .grid[data-light] { 1300 | background-color: #c9e8de; 1301 | } 1302 | #game[game-color="32"] #board #number .grid-number .dot { 1303 | background: linear-gradient(480deg, #3d8f74, #70c2a7); 1304 | } 1305 | #game[game-color="32"] #board #number .grid-number-input .number { 1306 | color: #3d8f74; 1307 | } 1308 | #game[game-color="32"] #board #number .grid-number-input .number:hover { 1309 | color: #fff; 1310 | } 1311 | #game[game-color="32"] #board #number .grid-number.small-active .grid-small { 1312 | color: #3d8f74; 1313 | } 1314 | #game[game-color="32"] #board #number .grid-number.small-active:hover .grid-small { 1315 | color: #fff; 1316 | } 1317 | 1318 | #game[game-color="33"] { 1319 | background: linear-gradient(495deg, #3d8f7a, #70c2ad); 1320 | } 1321 | #game[game-color="33"] #board #grid .grid[data-light] { 1322 | background-color: #c9e8e0; 1323 | } 1324 | #game[game-color="33"] #board #number .grid-number .dot { 1325 | background: linear-gradient(495deg, #3d8f7a, #70c2ad); 1326 | } 1327 | #game[game-color="33"] #board #number .grid-number-input .number { 1328 | color: #3d8f7a; 1329 | } 1330 | #game[game-color="33"] #board #number .grid-number-input .number:hover { 1331 | color: #fff; 1332 | } 1333 | #game[game-color="33"] #board #number .grid-number.small-active .grid-small { 1334 | color: #3d8f7a; 1335 | } 1336 | #game[game-color="33"] #board #number .grid-number.small-active:hover .grid-small { 1337 | color: #fff; 1338 | } 1339 | 1340 | #game[game-color="34"] { 1341 | background: linear-gradient(510deg, #3d8f81, #70c2b4); 1342 | } 1343 | #game[game-color="34"] #board #grid .grid[data-light] { 1344 | background-color: #c9e8e3; 1345 | } 1346 | #game[game-color="34"] #board #number .grid-number .dot { 1347 | background: linear-gradient(510deg, #3d8f81, #70c2b4); 1348 | } 1349 | #game[game-color="34"] #board #number .grid-number-input .number { 1350 | color: #3d8f81; 1351 | } 1352 | #game[game-color="34"] #board #number .grid-number-input .number:hover { 1353 | color: #fff; 1354 | } 1355 | #game[game-color="34"] #board #number .grid-number.small-active .grid-small { 1356 | color: #3d8f81; 1357 | } 1358 | #game[game-color="34"] #board #number .grid-number.small-active:hover .grid-small { 1359 | color: #fff; 1360 | } 1361 | 1362 | #game[game-color="35"] { 1363 | background: linear-gradient(525deg, #3d8f88, #70c2bb); 1364 | } 1365 | #game[game-color="35"] #board #grid .grid[data-light] { 1366 | background-color: #c9e8e6; 1367 | } 1368 | #game[game-color="35"] #board #number .grid-number .dot { 1369 | background: linear-gradient(525deg, #3d8f88, #70c2bb); 1370 | } 1371 | #game[game-color="35"] #board #number .grid-number-input .number { 1372 | color: #3d8f88; 1373 | } 1374 | #game[game-color="35"] #board #number .grid-number-input .number:hover { 1375 | color: #fff; 1376 | } 1377 | #game[game-color="35"] #board #number .grid-number.small-active .grid-small { 1378 | color: #3d8f88; 1379 | } 1380 | #game[game-color="35"] #board #number .grid-number.small-active:hover .grid-small { 1381 | color: #fff; 1382 | } 1383 | 1384 | #game[game-color="36"] { 1385 | background: linear-gradient(540deg, #3d8f8f, #70c2c2); 1386 | } 1387 | #game[game-color="36"] #board #grid .grid[data-light] { 1388 | background-color: #c9e8e8; 1389 | } 1390 | #game[game-color="36"] #board #number .grid-number .dot { 1391 | background: linear-gradient(540deg, #3d8f8f, #70c2c2); 1392 | } 1393 | #game[game-color="36"] #board #number .grid-number-input .number { 1394 | color: #3d8f8f; 1395 | } 1396 | #game[game-color="36"] #board #number .grid-number-input .number:hover { 1397 | color: #fff; 1398 | } 1399 | #game[game-color="36"] #board #number .grid-number.small-active .grid-small { 1400 | color: #3d8f8f; 1401 | } 1402 | #game[game-color="36"] #board #number .grid-number.small-active:hover .grid-small { 1403 | color: #fff; 1404 | } 1405 | 1406 | #game[game-color="37"] { 1407 | background: linear-gradient(555deg, #3d888f, #70bbc2); 1408 | } 1409 | #game[game-color="37"] #board #grid .grid[data-light] { 1410 | background-color: #c9e6e8; 1411 | } 1412 | #game[game-color="37"] #board #number .grid-number .dot { 1413 | background: linear-gradient(555deg, #3d888f, #70bbc2); 1414 | } 1415 | #game[game-color="37"] #board #number .grid-number-input .number { 1416 | color: #3d888f; 1417 | } 1418 | #game[game-color="37"] #board #number .grid-number-input .number:hover { 1419 | color: #fff; 1420 | } 1421 | #game[game-color="37"] #board #number .grid-number.small-active .grid-small { 1422 | color: #3d888f; 1423 | } 1424 | #game[game-color="37"] #board #number .grid-number.small-active:hover .grid-small { 1425 | color: #fff; 1426 | } 1427 | 1428 | #game[game-color="38"] { 1429 | background: linear-gradient(570deg, #3d818f, #70b4c2); 1430 | } 1431 | #game[game-color="38"] #board #grid .grid[data-light] { 1432 | background-color: #c9e3e8; 1433 | } 1434 | #game[game-color="38"] #board #number .grid-number .dot { 1435 | background: linear-gradient(570deg, #3d818f, #70b4c2); 1436 | } 1437 | #game[game-color="38"] #board #number .grid-number-input .number { 1438 | color: #3d818f; 1439 | } 1440 | #game[game-color="38"] #board #number .grid-number-input .number:hover { 1441 | color: #fff; 1442 | } 1443 | #game[game-color="38"] #board #number .grid-number.small-active .grid-small { 1444 | color: #3d818f; 1445 | } 1446 | #game[game-color="38"] #board #number .grid-number.small-active:hover .grid-small { 1447 | color: #fff; 1448 | } 1449 | 1450 | #game[game-color="39"] { 1451 | background: linear-gradient(585deg, #3d7a8f, #70adc2); 1452 | } 1453 | #game[game-color="39"] #board #grid .grid[data-light] { 1454 | background-color: #c9e0e8; 1455 | } 1456 | #game[game-color="39"] #board #number .grid-number .dot { 1457 | background: linear-gradient(585deg, #3d7a8f, #70adc2); 1458 | } 1459 | #game[game-color="39"] #board #number .grid-number-input .number { 1460 | color: #3d7a8f; 1461 | } 1462 | #game[game-color="39"] #board #number .grid-number-input .number:hover { 1463 | color: #fff; 1464 | } 1465 | #game[game-color="39"] #board #number .grid-number.small-active .grid-small { 1466 | color: #3d7a8f; 1467 | } 1468 | #game[game-color="39"] #board #number .grid-number.small-active:hover .grid-small { 1469 | color: #fff; 1470 | } 1471 | 1472 | #game[game-color="40"] { 1473 | background: linear-gradient(600deg, #3d748f, #70a7c2); 1474 | } 1475 | #game[game-color="40"] #board #grid .grid[data-light] { 1476 | background-color: #c9dee8; 1477 | } 1478 | #game[game-color="40"] #board #number .grid-number .dot { 1479 | background: linear-gradient(600deg, #3d748f, #70a7c2); 1480 | } 1481 | #game[game-color="40"] #board #number .grid-number-input .number { 1482 | color: #3d748f; 1483 | } 1484 | #game[game-color="40"] #board #number .grid-number-input .number:hover { 1485 | color: #fff; 1486 | } 1487 | #game[game-color="40"] #board #number .grid-number.small-active .grid-small { 1488 | color: #3d748f; 1489 | } 1490 | #game[game-color="40"] #board #number .grid-number.small-active:hover .grid-small { 1491 | color: #fff; 1492 | } 1493 | 1494 | #game[game-color="41"] { 1495 | background: linear-gradient(615deg, #3d6d8f, #70a0c2); 1496 | } 1497 | #game[game-color="41"] #board #grid .grid[data-light] { 1498 | background-color: #c9dbe8; 1499 | } 1500 | #game[game-color="41"] #board #number .grid-number .dot { 1501 | background: linear-gradient(615deg, #3d6d8f, #70a0c2); 1502 | } 1503 | #game[game-color="41"] #board #number .grid-number-input .number { 1504 | color: #3d6d8f; 1505 | } 1506 | #game[game-color="41"] #board #number .grid-number-input .number:hover { 1507 | color: #fff; 1508 | } 1509 | #game[game-color="41"] #board #number .grid-number.small-active .grid-small { 1510 | color: #3d6d8f; 1511 | } 1512 | #game[game-color="41"] #board #number .grid-number.small-active:hover .grid-small { 1513 | color: #fff; 1514 | } 1515 | 1516 | #game[game-color="42"] { 1517 | background: linear-gradient(630deg, #3d668f, #7099c2); 1518 | } 1519 | #game[game-color="42"] #board #grid .grid[data-light] { 1520 | background-color: #c9d9e8; 1521 | } 1522 | #game[game-color="42"] #board #number .grid-number .dot { 1523 | background: linear-gradient(630deg, #3d668f, #7099c2); 1524 | } 1525 | #game[game-color="42"] #board #number .grid-number-input .number { 1526 | color: #3d668f; 1527 | } 1528 | #game[game-color="42"] #board #number .grid-number-input .number:hover { 1529 | color: #fff; 1530 | } 1531 | #game[game-color="42"] #board #number .grid-number.small-active .grid-small { 1532 | color: #3d668f; 1533 | } 1534 | #game[game-color="42"] #board #number .grid-number.small-active:hover .grid-small { 1535 | color: #fff; 1536 | } 1537 | 1538 | #game[game-color="43"] { 1539 | background: linear-gradient(645deg, #3d5f8f, #7092c2); 1540 | } 1541 | #game[game-color="43"] #board #grid .grid[data-light] { 1542 | background-color: #c9d6e8; 1543 | } 1544 | #game[game-color="43"] #board #number .grid-number .dot { 1545 | background: linear-gradient(645deg, #3d5f8f, #7092c2); 1546 | } 1547 | #game[game-color="43"] #board #number .grid-number-input .number { 1548 | color: #3d5f8f; 1549 | } 1550 | #game[game-color="43"] #board #number .grid-number-input .number:hover { 1551 | color: #fff; 1552 | } 1553 | #game[game-color="43"] #board #number .grid-number.small-active .grid-small { 1554 | color: #3d5f8f; 1555 | } 1556 | #game[game-color="43"] #board #number .grid-number.small-active:hover .grid-small { 1557 | color: #fff; 1558 | } 1559 | 1560 | #game[game-color="44"] { 1561 | background: linear-gradient(660deg, #3d588f, #708bc2); 1562 | } 1563 | #game[game-color="44"] #board #grid .grid[data-light] { 1564 | background-color: #c9d4e8; 1565 | } 1566 | #game[game-color="44"] #board #number .grid-number .dot { 1567 | background: linear-gradient(660deg, #3d588f, #708bc2); 1568 | } 1569 | #game[game-color="44"] #board #number .grid-number-input .number { 1570 | color: #3d588f; 1571 | } 1572 | #game[game-color="44"] #board #number .grid-number-input .number:hover { 1573 | color: #fff; 1574 | } 1575 | #game[game-color="44"] #board #number .grid-number.small-active .grid-small { 1576 | color: #3d588f; 1577 | } 1578 | #game[game-color="44"] #board #number .grid-number.small-active:hover .grid-small { 1579 | color: #fff; 1580 | } 1581 | 1582 | #game[game-color="45"] { 1583 | background: linear-gradient(675deg, #3d528f, #7085c2); 1584 | } 1585 | #game[game-color="45"] #board #grid .grid[data-light] { 1586 | background-color: #c9d1e8; 1587 | } 1588 | #game[game-color="45"] #board #number .grid-number .dot { 1589 | background: linear-gradient(675deg, #3d528f, #7085c2); 1590 | } 1591 | #game[game-color="45"] #board #number .grid-number-input .number { 1592 | color: #3d528f; 1593 | } 1594 | #game[game-color="45"] #board #number .grid-number-input .number:hover { 1595 | color: #fff; 1596 | } 1597 | #game[game-color="45"] #board #number .grid-number.small-active .grid-small { 1598 | color: #3d528f; 1599 | } 1600 | #game[game-color="45"] #board #number .grid-number.small-active:hover .grid-small { 1601 | color: #fff; 1602 | } 1603 | 1604 | #game[game-color="46"] { 1605 | background: linear-gradient(690deg, #3d4b8f, #707ec2); 1606 | } 1607 | #game[game-color="46"] #board #grid .grid[data-light] { 1608 | background-color: #c9cfe8; 1609 | } 1610 | #game[game-color="46"] #board #number .grid-number .dot { 1611 | background: linear-gradient(690deg, #3d4b8f, #707ec2); 1612 | } 1613 | #game[game-color="46"] #board #number .grid-number-input .number { 1614 | color: #3d4b8f; 1615 | } 1616 | #game[game-color="46"] #board #number .grid-number-input .number:hover { 1617 | color: #fff; 1618 | } 1619 | #game[game-color="46"] #board #number .grid-number.small-active .grid-small { 1620 | color: #3d4b8f; 1621 | } 1622 | #game[game-color="46"] #board #number .grid-number.small-active:hover .grid-small { 1623 | color: #fff; 1624 | } 1625 | 1626 | #game[game-color="47"] { 1627 | background: linear-gradient(705deg, #3d448f, #7077c2); 1628 | } 1629 | #game[game-color="47"] #board #grid .grid[data-light] { 1630 | background-color: #c9cce8; 1631 | } 1632 | #game[game-color="47"] #board #number .grid-number .dot { 1633 | background: linear-gradient(705deg, #3d448f, #7077c2); 1634 | } 1635 | #game[game-color="47"] #board #number .grid-number-input .number { 1636 | color: #3d448f; 1637 | } 1638 | #game[game-color="47"] #board #number .grid-number-input .number:hover { 1639 | color: #fff; 1640 | } 1641 | #game[game-color="47"] #board #number .grid-number.small-active .grid-small { 1642 | color: #3d448f; 1643 | } 1644 | #game[game-color="47"] #board #number .grid-number.small-active:hover .grid-small { 1645 | color: #fff; 1646 | } 1647 | 1648 | #game[game-color="48"] { 1649 | background: linear-gradient(720deg, #3d3d8f, #7070c2); 1650 | } 1651 | #game[game-color="48"] #board #grid .grid[data-light] { 1652 | background-color: #c9c9e8; 1653 | } 1654 | #game[game-color="48"] #board #number .grid-number .dot { 1655 | background: linear-gradient(720deg, #3d3d8f, #7070c2); 1656 | } 1657 | #game[game-color="48"] #board #number .grid-number-input .number { 1658 | color: #3d3d8f; 1659 | } 1660 | #game[game-color="48"] #board #number .grid-number-input .number:hover { 1661 | color: #fff; 1662 | } 1663 | #game[game-color="48"] #board #number .grid-number.small-active .grid-small { 1664 | color: #3d3d8f; 1665 | } 1666 | #game[game-color="48"] #board #number .grid-number.small-active:hover .grid-small { 1667 | color: #fff; 1668 | } 1669 | 1670 | #game[game-color="49"] { 1671 | background: linear-gradient(735deg, #443d8f, #7770c2); 1672 | } 1673 | #game[game-color="49"] #board #grid .grid[data-light] { 1674 | background-color: #ccc9e8; 1675 | } 1676 | #game[game-color="49"] #board #number .grid-number .dot { 1677 | background: linear-gradient(735deg, #443d8f, #7770c2); 1678 | } 1679 | #game[game-color="49"] #board #number .grid-number-input .number { 1680 | color: #443d8f; 1681 | } 1682 | #game[game-color="49"] #board #number .grid-number-input .number:hover { 1683 | color: #fff; 1684 | } 1685 | #game[game-color="49"] #board #number .grid-number.small-active .grid-small { 1686 | color: #443d8f; 1687 | } 1688 | #game[game-color="49"] #board #number .grid-number.small-active:hover .grid-small { 1689 | color: #fff; 1690 | } 1691 | 1692 | #game[game-color="50"] { 1693 | background: linear-gradient(750deg, #4b3d8f, #7e70c2); 1694 | } 1695 | #game[game-color="50"] #board #grid .grid[data-light] { 1696 | background-color: #cfc9e8; 1697 | } 1698 | #game[game-color="50"] #board #number .grid-number .dot { 1699 | background: linear-gradient(750deg, #4b3d8f, #7e70c2); 1700 | } 1701 | #game[game-color="50"] #board #number .grid-number-input .number { 1702 | color: #4b3d8f; 1703 | } 1704 | #game[game-color="50"] #board #number .grid-number-input .number:hover { 1705 | color: #fff; 1706 | } 1707 | #game[game-color="50"] #board #number .grid-number.small-active .grid-small { 1708 | color: #4b3d8f; 1709 | } 1710 | #game[game-color="50"] #board #number .grid-number.small-active:hover .grid-small { 1711 | color: #fff; 1712 | } 1713 | 1714 | #game[game-color="51"] { 1715 | background: linear-gradient(765deg, #523d8f, #8570c2); 1716 | } 1717 | #game[game-color="51"] #board #grid .grid[data-light] { 1718 | background-color: #d1c9e8; 1719 | } 1720 | #game[game-color="51"] #board #number .grid-number .dot { 1721 | background: linear-gradient(765deg, #523d8f, #8570c2); 1722 | } 1723 | #game[game-color="51"] #board #number .grid-number-input .number { 1724 | color: #523d8f; 1725 | } 1726 | #game[game-color="51"] #board #number .grid-number-input .number:hover { 1727 | color: #fff; 1728 | } 1729 | #game[game-color="51"] #board #number .grid-number.small-active .grid-small { 1730 | color: #523d8f; 1731 | } 1732 | #game[game-color="51"] #board #number .grid-number.small-active:hover .grid-small { 1733 | color: #fff; 1734 | } 1735 | 1736 | #game[game-color="52"] { 1737 | background: linear-gradient(780deg, #583d8f, #8b70c2); 1738 | } 1739 | #game[game-color="52"] #board #grid .grid[data-light] { 1740 | background-color: #d4c9e8; 1741 | } 1742 | #game[game-color="52"] #board #number .grid-number .dot { 1743 | background: linear-gradient(780deg, #583d8f, #8b70c2); 1744 | } 1745 | #game[game-color="52"] #board #number .grid-number-input .number { 1746 | color: #583d8f; 1747 | } 1748 | #game[game-color="52"] #board #number .grid-number-input .number:hover { 1749 | color: #fff; 1750 | } 1751 | #game[game-color="52"] #board #number .grid-number.small-active .grid-small { 1752 | color: #583d8f; 1753 | } 1754 | #game[game-color="52"] #board #number .grid-number.small-active:hover .grid-small { 1755 | color: #fff; 1756 | } 1757 | 1758 | #game[game-color="53"] { 1759 | background: linear-gradient(795deg, #5f3d8f, #9270c2); 1760 | } 1761 | #game[game-color="53"] #board #grid .grid[data-light] { 1762 | background-color: #d6c9e8; 1763 | } 1764 | #game[game-color="53"] #board #number .grid-number .dot { 1765 | background: linear-gradient(795deg, #5f3d8f, #9270c2); 1766 | } 1767 | #game[game-color="53"] #board #number .grid-number-input .number { 1768 | color: #5f3d8f; 1769 | } 1770 | #game[game-color="53"] #board #number .grid-number-input .number:hover { 1771 | color: #fff; 1772 | } 1773 | #game[game-color="53"] #board #number .grid-number.small-active .grid-small { 1774 | color: #5f3d8f; 1775 | } 1776 | #game[game-color="53"] #board #number .grid-number.small-active:hover .grid-small { 1777 | color: #fff; 1778 | } 1779 | 1780 | #game[game-color="54"] { 1781 | background: linear-gradient(810deg, #663d8f, #9970c2); 1782 | } 1783 | #game[game-color="54"] #board #grid .grid[data-light] { 1784 | background-color: #d9c9e8; 1785 | } 1786 | #game[game-color="54"] #board #number .grid-number .dot { 1787 | background: linear-gradient(810deg, #663d8f, #9970c2); 1788 | } 1789 | #game[game-color="54"] #board #number .grid-number-input .number { 1790 | color: #663d8f; 1791 | } 1792 | #game[game-color="54"] #board #number .grid-number-input .number:hover { 1793 | color: #fff; 1794 | } 1795 | #game[game-color="54"] #board #number .grid-number.small-active .grid-small { 1796 | color: #663d8f; 1797 | } 1798 | #game[game-color="54"] #board #number .grid-number.small-active:hover .grid-small { 1799 | color: #fff; 1800 | } 1801 | 1802 | #game[game-color="55"] { 1803 | background: linear-gradient(825deg, #6d3d8f, #a070c2); 1804 | } 1805 | #game[game-color="55"] #board #grid .grid[data-light] { 1806 | background-color: #dbc9e8; 1807 | } 1808 | #game[game-color="55"] #board #number .grid-number .dot { 1809 | background: linear-gradient(825deg, #6d3d8f, #a070c2); 1810 | } 1811 | #game[game-color="55"] #board #number .grid-number-input .number { 1812 | color: #6d3d8f; 1813 | } 1814 | #game[game-color="55"] #board #number .grid-number-input .number:hover { 1815 | color: #fff; 1816 | } 1817 | #game[game-color="55"] #board #number .grid-number.small-active .grid-small { 1818 | color: #6d3d8f; 1819 | } 1820 | #game[game-color="55"] #board #number .grid-number.small-active:hover .grid-small { 1821 | color: #fff; 1822 | } 1823 | 1824 | #game[game-color="56"] { 1825 | background: linear-gradient(840deg, #743d8f, #a770c2); 1826 | } 1827 | #game[game-color="56"] #board #grid .grid[data-light] { 1828 | background-color: #dec9e8; 1829 | } 1830 | #game[game-color="56"] #board #number .grid-number .dot { 1831 | background: linear-gradient(840deg, #743d8f, #a770c2); 1832 | } 1833 | #game[game-color="56"] #board #number .grid-number-input .number { 1834 | color: #743d8f; 1835 | } 1836 | #game[game-color="56"] #board #number .grid-number-input .number:hover { 1837 | color: #fff; 1838 | } 1839 | #game[game-color="56"] #board #number .grid-number.small-active .grid-small { 1840 | color: #743d8f; 1841 | } 1842 | #game[game-color="56"] #board #number .grid-number.small-active:hover .grid-small { 1843 | color: #fff; 1844 | } 1845 | 1846 | #game[game-color="57"] { 1847 | background: linear-gradient(855deg, #7a3d8f, #ad70c2); 1848 | } 1849 | #game[game-color="57"] #board #grid .grid[data-light] { 1850 | background-color: #e0c9e8; 1851 | } 1852 | #game[game-color="57"] #board #number .grid-number .dot { 1853 | background: linear-gradient(855deg, #7a3d8f, #ad70c2); 1854 | } 1855 | #game[game-color="57"] #board #number .grid-number-input .number { 1856 | color: #7a3d8f; 1857 | } 1858 | #game[game-color="57"] #board #number .grid-number-input .number:hover { 1859 | color: #fff; 1860 | } 1861 | #game[game-color="57"] #board #number .grid-number.small-active .grid-small { 1862 | color: #7a3d8f; 1863 | } 1864 | #game[game-color="57"] #board #number .grid-number.small-active:hover .grid-small { 1865 | color: #fff; 1866 | } 1867 | 1868 | #game[game-color="58"] { 1869 | background: linear-gradient(870deg, #813d8f, #b470c2); 1870 | } 1871 | #game[game-color="58"] #board #grid .grid[data-light] { 1872 | background-color: #e3c9e8; 1873 | } 1874 | #game[game-color="58"] #board #number .grid-number .dot { 1875 | background: linear-gradient(870deg, #813d8f, #b470c2); 1876 | } 1877 | #game[game-color="58"] #board #number .grid-number-input .number { 1878 | color: #813d8f; 1879 | } 1880 | #game[game-color="58"] #board #number .grid-number-input .number:hover { 1881 | color: #fff; 1882 | } 1883 | #game[game-color="58"] #board #number .grid-number.small-active .grid-small { 1884 | color: #813d8f; 1885 | } 1886 | #game[game-color="58"] #board #number .grid-number.small-active:hover .grid-small { 1887 | color: #fff; 1888 | } 1889 | 1890 | #game[game-color="59"] { 1891 | background: linear-gradient(885deg, #883d8f, #bb70c2); 1892 | } 1893 | #game[game-color="59"] #board #grid .grid[data-light] { 1894 | background-color: #e6c9e8; 1895 | } 1896 | #game[game-color="59"] #board #number .grid-number .dot { 1897 | background: linear-gradient(885deg, #883d8f, #bb70c2); 1898 | } 1899 | #game[game-color="59"] #board #number .grid-number-input .number { 1900 | color: #883d8f; 1901 | } 1902 | #game[game-color="59"] #board #number .grid-number-input .number:hover { 1903 | color: #fff; 1904 | } 1905 | #game[game-color="59"] #board #number .grid-number.small-active .grid-small { 1906 | color: #883d8f; 1907 | } 1908 | #game[game-color="59"] #board #number .grid-number.small-active:hover .grid-small { 1909 | color: #fff; 1910 | } 1911 | 1912 | #game[game-color="60"] { 1913 | background: linear-gradient(900deg, #8f3d8f, #c270c2); 1914 | } 1915 | #game[game-color="60"] #board #grid .grid[data-light] { 1916 | background-color: #e8c9e8; 1917 | } 1918 | #game[game-color="60"] #board #number .grid-number .dot { 1919 | background: linear-gradient(900deg, #8f3d8f, #c270c2); 1920 | } 1921 | #game[game-color="60"] #board #number .grid-number-input .number { 1922 | color: #8f3d8f; 1923 | } 1924 | #game[game-color="60"] #board #number .grid-number-input .number:hover { 1925 | color: #fff; 1926 | } 1927 | #game[game-color="60"] #board #number .grid-number.small-active .grid-small { 1928 | color: #8f3d8f; 1929 | } 1930 | #game[game-color="60"] #board #number .grid-number.small-active:hover .grid-small { 1931 | color: #fff; 1932 | } 1933 | 1934 | #game[game-color="61"] { 1935 | background: linear-gradient(915deg, #8f3d88, #c270bb); 1936 | } 1937 | #game[game-color="61"] #board #grid .grid[data-light] { 1938 | background-color: #e8c9e6; 1939 | } 1940 | #game[game-color="61"] #board #number .grid-number .dot { 1941 | background: linear-gradient(915deg, #8f3d88, #c270bb); 1942 | } 1943 | #game[game-color="61"] #board #number .grid-number-input .number { 1944 | color: #8f3d88; 1945 | } 1946 | #game[game-color="61"] #board #number .grid-number-input .number:hover { 1947 | color: #fff; 1948 | } 1949 | #game[game-color="61"] #board #number .grid-number.small-active .grid-small { 1950 | color: #8f3d88; 1951 | } 1952 | #game[game-color="61"] #board #number .grid-number.small-active:hover .grid-small { 1953 | color: #fff; 1954 | } 1955 | 1956 | #game[game-color="62"] { 1957 | background: linear-gradient(930deg, #8f3d81, #c270b4); 1958 | } 1959 | #game[game-color="62"] #board #grid .grid[data-light] { 1960 | background-color: #e8c9e3; 1961 | } 1962 | #game[game-color="62"] #board #number .grid-number .dot { 1963 | background: linear-gradient(930deg, #8f3d81, #c270b4); 1964 | } 1965 | #game[game-color="62"] #board #number .grid-number-input .number { 1966 | color: #8f3d81; 1967 | } 1968 | #game[game-color="62"] #board #number .grid-number-input .number:hover { 1969 | color: #fff; 1970 | } 1971 | #game[game-color="62"] #board #number .grid-number.small-active .grid-small { 1972 | color: #8f3d81; 1973 | } 1974 | #game[game-color="62"] #board #number .grid-number.small-active:hover .grid-small { 1975 | color: #fff; 1976 | } 1977 | 1978 | #game[game-color="63"] { 1979 | background: linear-gradient(945deg, #8f3d7a, #c270ad); 1980 | } 1981 | #game[game-color="63"] #board #grid .grid[data-light] { 1982 | background-color: #e8c9e0; 1983 | } 1984 | #game[game-color="63"] #board #number .grid-number .dot { 1985 | background: linear-gradient(945deg, #8f3d7a, #c270ad); 1986 | } 1987 | #game[game-color="63"] #board #number .grid-number-input .number { 1988 | color: #8f3d7a; 1989 | } 1990 | #game[game-color="63"] #board #number .grid-number-input .number:hover { 1991 | color: #fff; 1992 | } 1993 | #game[game-color="63"] #board #number .grid-number.small-active .grid-small { 1994 | color: #8f3d7a; 1995 | } 1996 | #game[game-color="63"] #board #number .grid-number.small-active:hover .grid-small { 1997 | color: #fff; 1998 | } 1999 | 2000 | #game[game-color="64"] { 2001 | background: linear-gradient(960deg, #8f3d74, #c270a7); 2002 | } 2003 | #game[game-color="64"] #board #grid .grid[data-light] { 2004 | background-color: #e8c9de; 2005 | } 2006 | #game[game-color="64"] #board #number .grid-number .dot { 2007 | background: linear-gradient(960deg, #8f3d74, #c270a7); 2008 | } 2009 | #game[game-color="64"] #board #number .grid-number-input .number { 2010 | color: #8f3d74; 2011 | } 2012 | #game[game-color="64"] #board #number .grid-number-input .number:hover { 2013 | color: #fff; 2014 | } 2015 | #game[game-color="64"] #board #number .grid-number.small-active .grid-small { 2016 | color: #8f3d74; 2017 | } 2018 | #game[game-color="64"] #board #number .grid-number.small-active:hover .grid-small { 2019 | color: #fff; 2020 | } 2021 | 2022 | #game[game-color="65"] { 2023 | background: linear-gradient(975deg, #8f3d6d, #c270a0); 2024 | } 2025 | #game[game-color="65"] #board #grid .grid[data-light] { 2026 | background-color: #e8c9db; 2027 | } 2028 | #game[game-color="65"] #board #number .grid-number .dot { 2029 | background: linear-gradient(975deg, #8f3d6d, #c270a0); 2030 | } 2031 | #game[game-color="65"] #board #number .grid-number-input .number { 2032 | color: #8f3d6d; 2033 | } 2034 | #game[game-color="65"] #board #number .grid-number-input .number:hover { 2035 | color: #fff; 2036 | } 2037 | #game[game-color="65"] #board #number .grid-number.small-active .grid-small { 2038 | color: #8f3d6d; 2039 | } 2040 | #game[game-color="65"] #board #number .grid-number.small-active:hover .grid-small { 2041 | color: #fff; 2042 | } 2043 | 2044 | #game[game-color="66"] { 2045 | background: linear-gradient(990deg, #8f3d66, #c27099); 2046 | } 2047 | #game[game-color="66"] #board #grid .grid[data-light] { 2048 | background-color: #e8c9d9; 2049 | } 2050 | #game[game-color="66"] #board #number .grid-number .dot { 2051 | background: linear-gradient(990deg, #8f3d66, #c27099); 2052 | } 2053 | #game[game-color="66"] #board #number .grid-number-input .number { 2054 | color: #8f3d66; 2055 | } 2056 | #game[game-color="66"] #board #number .grid-number-input .number:hover { 2057 | color: #fff; 2058 | } 2059 | #game[game-color="66"] #board #number .grid-number.small-active .grid-small { 2060 | color: #8f3d66; 2061 | } 2062 | #game[game-color="66"] #board #number .grid-number.small-active:hover .grid-small { 2063 | color: #fff; 2064 | } 2065 | 2066 | #game[game-color="67"] { 2067 | background: linear-gradient(1005deg, #8f3d5f, #c27092); 2068 | } 2069 | #game[game-color="67"] #board #grid .grid[data-light] { 2070 | background-color: #e8c9d6; 2071 | } 2072 | #game[game-color="67"] #board #number .grid-number .dot { 2073 | background: linear-gradient(1005deg, #8f3d5f, #c27092); 2074 | } 2075 | #game[game-color="67"] #board #number .grid-number-input .number { 2076 | color: #8f3d5f; 2077 | } 2078 | #game[game-color="67"] #board #number .grid-number-input .number:hover { 2079 | color: #fff; 2080 | } 2081 | #game[game-color="67"] #board #number .grid-number.small-active .grid-small { 2082 | color: #8f3d5f; 2083 | } 2084 | #game[game-color="67"] #board #number .grid-number.small-active:hover .grid-small { 2085 | color: #fff; 2086 | } 2087 | 2088 | #game[game-color="68"] { 2089 | background: linear-gradient(1020deg, #8f3d58, #c2708b); 2090 | } 2091 | #game[game-color="68"] #board #grid .grid[data-light] { 2092 | background-color: #e8c9d4; 2093 | } 2094 | #game[game-color="68"] #board #number .grid-number .dot { 2095 | background: linear-gradient(1020deg, #8f3d58, #c2708b); 2096 | } 2097 | #game[game-color="68"] #board #number .grid-number-input .number { 2098 | color: #8f3d58; 2099 | } 2100 | #game[game-color="68"] #board #number .grid-number-input .number:hover { 2101 | color: #fff; 2102 | } 2103 | #game[game-color="68"] #board #number .grid-number.small-active .grid-small { 2104 | color: #8f3d58; 2105 | } 2106 | #game[game-color="68"] #board #number .grid-number.small-active:hover .grid-small { 2107 | color: #fff; 2108 | } 2109 | 2110 | #game[game-color="69"] { 2111 | background: linear-gradient(1035deg, #8f3d52, #c27085); 2112 | } 2113 | #game[game-color="69"] #board #grid .grid[data-light] { 2114 | background-color: #e8c9d1; 2115 | } 2116 | #game[game-color="69"] #board #number .grid-number .dot { 2117 | background: linear-gradient(1035deg, #8f3d52, #c27085); 2118 | } 2119 | #game[game-color="69"] #board #number .grid-number-input .number { 2120 | color: #8f3d52; 2121 | } 2122 | #game[game-color="69"] #board #number .grid-number-input .number:hover { 2123 | color: #fff; 2124 | } 2125 | #game[game-color="69"] #board #number .grid-number.small-active .grid-small { 2126 | color: #8f3d52; 2127 | } 2128 | #game[game-color="69"] #board #number .grid-number.small-active:hover .grid-small { 2129 | color: #fff; 2130 | } 2131 | 2132 | #game[game-color="70"] { 2133 | background: linear-gradient(1050deg, #8f3d4b, #c2707e); 2134 | } 2135 | #game[game-color="70"] #board #grid .grid[data-light] { 2136 | background-color: #e8c9cf; 2137 | } 2138 | #game[game-color="70"] #board #number .grid-number .dot { 2139 | background: linear-gradient(1050deg, #8f3d4b, #c2707e); 2140 | } 2141 | #game[game-color="70"] #board #number .grid-number-input .number { 2142 | color: #8f3d4b; 2143 | } 2144 | #game[game-color="70"] #board #number .grid-number-input .number:hover { 2145 | color: #fff; 2146 | } 2147 | #game[game-color="70"] #board #number .grid-number.small-active .grid-small { 2148 | color: #8f3d4b; 2149 | } 2150 | #game[game-color="70"] #board #number .grid-number.small-active:hover .grid-small { 2151 | color: #fff; 2152 | } 2153 | 2154 | #game[game-color="71"] { 2155 | background: linear-gradient(1065deg, #8f3d44, #c27077); 2156 | } 2157 | #game[game-color="71"] #board #grid .grid[data-light] { 2158 | background-color: #e8c9cc; 2159 | } 2160 | #game[game-color="71"] #board #number .grid-number .dot { 2161 | background: linear-gradient(1065deg, #8f3d44, #c27077); 2162 | } 2163 | #game[game-color="71"] #board #number .grid-number-input .number { 2164 | color: #8f3d44; 2165 | } 2166 | #game[game-color="71"] #board #number .grid-number-input .number:hover { 2167 | color: #fff; 2168 | } 2169 | #game[game-color="71"] #board #number .grid-number.small-active .grid-small { 2170 | color: #8f3d44; 2171 | } 2172 | #game[game-color="71"] #board #number .grid-number.small-active:hover .grid-small { 2173 | color: #fff; 2174 | } 2175 | 2176 | #game[game-color="72"] { 2177 | background: linear-gradient(1080deg, #8f3d3d, #c27070); 2178 | } 2179 | #game[game-color="72"] #board #grid .grid[data-light] { 2180 | background-color: #e8c9c9; 2181 | } 2182 | #game[game-color="72"] #board #number .grid-number .dot { 2183 | background: linear-gradient(1080deg, #8f3d3d, #c27070); 2184 | } 2185 | #game[game-color="72"] #board #number .grid-number-input .number { 2186 | color: #8f3d3d; 2187 | } 2188 | #game[game-color="72"] #board #number .grid-number-input .number:hover { 2189 | color: #fff; 2190 | } 2191 | #game[game-color="72"] #board #number .grid-number.small-active .grid-small { 2192 | color: #8f3d3d; 2193 | } 2194 | #game[game-color="72"] #board #number .grid-number.small-active:hover .grid-small { 2195 | color: #fff; 2196 | } 2197 | 2198 | #game[game-color="73"] { 2199 | background: linear-gradient(1095deg, #8f443d, #c27770); 2200 | } 2201 | #game[game-color="73"] #board #grid .grid[data-light] { 2202 | background-color: #e8ccc9; 2203 | } 2204 | #game[game-color="73"] #board #number .grid-number .dot { 2205 | background: linear-gradient(1095deg, #8f443d, #c27770); 2206 | } 2207 | #game[game-color="73"] #board #number .grid-number-input .number { 2208 | color: #8f443d; 2209 | } 2210 | #game[game-color="73"] #board #number .grid-number-input .number:hover { 2211 | color: #fff; 2212 | } 2213 | #game[game-color="73"] #board #number .grid-number.small-active .grid-small { 2214 | color: #8f443d; 2215 | } 2216 | #game[game-color="73"] #board #number .grid-number.small-active:hover .grid-small { 2217 | color: #fff; 2218 | } 2219 | 2220 | /*# sourceMappingURL=index.css.map */ 2221 | --------------------------------------------------------------------------------