54 Commits

Author SHA1 Message Date
Sysy's
ab4043defa Merge branch 'feature/grid' of https://git.ninolbt.com/Nono/Projet_48h into feature/grid 2026-03-31 14:04:04 +02:00
Sysy's
36fa5a9092 Support per-level game element configs
Convert global config maps (initialMirrorAngles, buttonGroups, doorGroups, captorGroups, rotatorButtons) into per-level arrays and add getCurrentLevelConfig(levelConfigs) helper. Update getButtonGroup, getDoorGroup, getCaptorGroup, getRotatorButtonConfig, isMirrorControlledByButton, syncRotatorButtons and initializeMirrorOrientations to pull configs for the current level. Also tweak a couple of level tiles and add a rotator button config for the third level ("3,7": { mirrorX: 7, mirrorY: 7, step: -22.5, intervalMs: 1000 }) while keeping empty objects for levels without overrides. These changes enable per-level customization of mirrors, buttons, doors, captors and rotators.
2026-03-31 13:39:58 +02:00
Sysy's
f9e94f5c18 Implement captors and color-dependent laser effects
Add captor support and related door-toggling state plus color-specific laser interactions. Changes include: replace one level tile value (15 -> 20), add captorGroups/getCaptorGroup, add toggleDoorsFromCaptor, and new state (toggledDoors, poweredCaptors). traceLaser now initializes openedDoors from toggledDoors, tracks nextPoweredCaptors, handles captor tiles (red lasers power/toggle door groups, yellow passes, others stop), updates poweredCaptors, and applies color-based behavior for rotator buttons and demi-wall reflections (only reflect for blue). Reset toggledDoors and poweredCaptors on next level. These changes implement captor mechanics that toggle door groups and ensure correct color-dependent laser effects.
2026-03-31 13:39:58 +02:00
Sysy's
1ad8282833 Remove rotatorButton on lvl 1 2026-03-31 13:39:58 +02:00
4b8a650c26 Level 3 2026-03-31 13:39:52 +02:00
Sysy's
94a60de6b2 Add rotator buttons and auto-rotating mirrors
Introduce a new rotator button tile and mirror auto-rotation feature. CSS adds styles for rotator buttons and locked mirror display. JS: add legend entry and rotatorButtons config, track activeRotatorButtons and rotatorIntervals, implement rotateMirrorStep, isMirrorControlledByButton, syncRotatorButtons and stopAllRotatorButtons; wire rotator behavior into traceLaser and loadGrid so rotator buttons activate intervals that rotate target mirrors automatically and lock out manual rotation. Refactor rotateMirror to reuse rotation step logic and ensure rotator intervals are cleared when advancing levels.
2026-03-31 13:38:24 +02:00
663e89de9e Level 2 2026-03-31 13:38:24 +02:00
0ccd551ef8 Level 2 2026-03-31 13:38:24 +02:00
7131b876cc Level 2 2026-03-31 13:38:24 +02:00
Sysy's
8517ac89da Add win overlay 2026-03-31 13:38:24 +02:00
Sysy's
be14f4513c Add game title and update layout styles
Adjust UI visuals: change page background to #FFF6E5, increase main container border-radius from 10px to 150px, and soften toolbox corners (5px → 15px). Add a new .game-title CSS rule (responsive font-size, weight, color, letter-spacing, centered) and insert an <h1 class="game-title">Mirror Game</h1> into the game template. These are visual polish changes only; no gameplay logic was modified.
2026-03-31 13:38:24 +02:00
Sysy's
0c2d989ad8 Make size bigger + add ads 2026-03-31 13:38:24 +02:00
Sysy's
1c59e7af7a Fix textures/button/lasers & add ads 2026-03-31 13:38:24 +02:00
63c4244e92 Resolution merge conflicts 2026-03-31 13:38:24 +02:00
4d1ed00f03 Map modified + sprites 2026-03-31 13:38:24 +02:00
Sysy's
40a8dee263 Add diagonal lasers 2026-03-31 13:38:24 +02:00
Sysy's
d8f56cb548 Remove player + right click change rotation mirror 2026-03-31 13:38:24 +02:00
Sysy's
853a6ae9ee Make mirror rotate on click 2026-03-31 13:38:24 +02:00
Sysy's
6d81f67ddf Track laser segments and update UI theme
Add per-cell laserSegments tracking and use it to render correct laser orientation: introduce laserSegments global, reset it at trace start, populate entries when tracing, and consult it in loadGrid to choose horizontal vs vertical classes. Update UI styling from a dark to a lighter theme (body and main backgrounds, cell/empty/mirror/wall colors and laser gradients), remove some borders/fit-content sizing, and add a "map" class to the map container in the HTML. These changes fix laser orientation rendering and refresh the game's visual theme.
2026-03-31 13:38:24 +02:00
2c03331663 Upgrade of design of light of laser + add posibility to move a cursor and rotate mirror with keyboard 2026-03-31 13:38:03 +02:00
3e6a2130e9 Laser print and reflect 2026-03-31 13:38:02 +02:00
2eb7bd46dc First version of button for mirrors 2026-03-31 13:38:02 +02:00
a9c4c653d2 Grid enlargement 2026-03-31 13:38:02 +02:00
e787094078 Rebase of feature/mirror + merge with the grid program 2026-03-31 13:38:02 +02:00
Sysy's
1ade298ff5 Add rotateMirror to rotate element 45°
Add a small utility function in web/assets/js/index.js that increments an element's CSS rotation by 45 degrees. The function reads the element's inline transform (handling an empty value), parses the current rotation angle modulo 360, and sets the new rotate(angle+45) value.
2026-03-31 13:38:02 +02:00
d5a84144ef Change index.js and index.css to game.js and game.css 2026-03-31 13:38:02 +02:00
1276edf2f2 End of grid 2026-03-31 13:38:02 +02:00
90e2064ec9 First version of laser 2026-03-31 13:38:02 +02:00
34b76b2cb9 Print grid on html + minimalist css (which will not be used) 2026-03-31 13:38:02 +02:00
Sysy's
a9d2a0c9a5 Support per-level game element configs
Convert global config maps (initialMirrorAngles, buttonGroups, doorGroups, captorGroups, rotatorButtons) into per-level arrays and add getCurrentLevelConfig(levelConfigs) helper. Update getButtonGroup, getDoorGroup, getCaptorGroup, getRotatorButtonConfig, isMirrorControlledByButton, syncRotatorButtons and initializeMirrorOrientations to pull configs for the current level. Also tweak a couple of level tiles and add a rotator button config for the third level ("3,7": { mirrorX: 7, mirrorY: 7, step: -22.5, intervalMs: 1000 }) while keeping empty objects for levels without overrides. These changes enable per-level customization of mirrors, buttons, doors, captors and rotators.
2026-03-31 13:34:27 +02:00
Sysy's
9c7c2ddc1d Implement captors and color-dependent laser effects
Add captor support and related door-toggling state plus color-specific laser interactions. Changes include: replace one level tile value (15 -> 20), add captorGroups/getCaptorGroup, add toggleDoorsFromCaptor, and new state (toggledDoors, poweredCaptors). traceLaser now initializes openedDoors from toggledDoors, tracks nextPoweredCaptors, handles captor tiles (red lasers power/toggle door groups, yellow passes, others stop), updates poweredCaptors, and applies color-based behavior for rotator buttons and demi-wall reflections (only reflect for blue). Reset toggledDoors and poweredCaptors on next level. These changes implement captor mechanics that toggle door groups and ensure correct color-dependent laser effects.
2026-03-31 13:27:08 +02:00
Sysy's
edea5e0972 Remove rotatorButton on lvl 1 2026-03-31 13:15:38 +02:00
Sysy's
f3809db72b Merge branch 'feature/grid' of https://git.ninolbt.com/Nono/Projet_48h into feature/grid 2026-03-31 13:12:34 +02:00
Sysy's
68b6493e50 Add rotator buttons and auto-rotating mirrors
Introduce a new rotator button tile and mirror auto-rotation feature. CSS adds styles for rotator buttons and locked mirror display. JS: add legend entry and rotatorButtons config, track activeRotatorButtons and rotatorIntervals, implement rotateMirrorStep, isMirrorControlledByButton, syncRotatorButtons and stopAllRotatorButtons; wire rotator behavior into traceLaser and loadGrid so rotator buttons activate intervals that rotate target mirrors automatically and lock out manual rotation. Refactor rotateMirror to reuse rotation step logic and ensure rotator intervals are cleared when advancing levels.
2026-03-31 13:11:30 +02:00
a267884dbe Level 3 2026-03-31 12:59:59 +02:00
64b0e5e770 Level 2 2026-03-31 12:19:52 +02:00
57b37d0139 Level 2 2026-03-31 12:16:45 +02:00
4939b74fad Level 2 2026-03-31 12:11:39 +02:00
7e5de16a02 Level 2 2026-03-31 12:09:01 +02:00
Sysy's
49045e4d76 Add win overlay 2026-03-31 12:07:37 +02:00
Sysy's
43100e65e9 Add game title and update layout styles
Adjust UI visuals: change page background to #FFF6E5, increase main container border-radius from 10px to 150px, and soften toolbox corners (5px → 15px). Add a new .game-title CSS rule (responsive font-size, weight, color, letter-spacing, centered) and insert an <h1 class="game-title">Mirror Game</h1> into the game template. These are visual polish changes only; no gameplay logic was modified.
2026-03-31 12:00:03 +02:00
Sysy's
94ddc4a00f Make size bigger + add ads 2026-03-31 11:55:20 +02:00
Sysy's
abf097e117 Fix textures/button/lasers & add ads 2026-03-31 11:52:30 +02:00
ee415c3d8b add check command and user object in user.rs file 2026-03-31 11:40:03 +02:00
4fc21e7876 Resolution merge conflicts 2026-03-31 11:32:40 +02:00
37aa7b5067 Map modified + sprites 2026-03-31 10:57:19 +02:00
e77fb7cb1e Merge branch 'main' of https://git.ninolbt.com/Nono/Projet_48h 2026-03-31 09:22:55 +02:00
4c1a439319 update and add insert command in user.rs file 2026-03-31 09:22:43 +02:00
999d27936a Update README 2026-03-31 09:19:26 +02:00
b509c9f4c3 sql rust interaction file update 2026-03-30 17:01:50 +02:00
26cdc99701 add sql rust interaction file 2026-03-30 15:48:14 +02:00
554d44cebb Merge branch 'backend-axum' of https://git.ninolbt.com/Nono/Projet_48h 2026-03-30 12:14:20 +02:00
GreyRav
3ad5811566 add : all folder + files for backend project 2026-03-30 11:42:42 +02:00
GreyRav
a8a0f54cb7 add : gitignore for target forlder 2026-03-30 11:27:04 +02:00
49 changed files with 2717 additions and 189 deletions

View File

@@ -1,19 +1,31 @@
Règles : Règles :
Un rayon laser constant
Un ou plusieurs laser - Un rayon laser constant
Laser non movibles, on/off
Mirroirs orientables - Un ou plusieurs laser
Prisme (dédouble le laser ou le renvoi selon l'angle)
Vitre colorée fixe ou placable par le joueur (r,j,b) - Laser non movibles, peut-être allumé/éteins
Bouton allumable par clique souris (interaction porte, mirroir, etc)
Bouton allumable par laser spécifique (interaction porte, mirroir, etc) - Mirroirs orientables
- Prisme (dédouble le laser ou le renvoi selon l'angle)
- Vitre colorée fixe ou placable par le joueur (r,j,b)
- Bouton allumable par clique souris (interaction porte, mirroir, etc)
- Bouton allumable par laser spécifique (interaction porte, mirroir, etc)
Rayon : Rayon :
Blanc -> rebondis seulement sur les mirroirs et s'arrête contre les murs
Rouge -> Allumage boutons - Blanc -> Rebondis seulement sur les mirroirs et s'arrête contre les murs
Bleu -> Rebondis sur toutes les surfaces
Jaune -> Traverse tout (mirroir compris) - Rouge -> Allumage des récepteurs
- Bleu -> Rebondis sur toutes les surfaces (murs compris)
- Jaune -> Traverse tout (mirroir compris)
Systeme de placement d'objet par grille Systeme de placement d'objet par grille

759
backend/Cargo.lock generated Normal file
View File

@@ -0,0 +1,759 @@
# This file is automatically @generated by Cargo.
# It is not intended for manual editing.
version = 4
[[package]]
name = "atomic-waker"
version = "1.1.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "1505bd5d3d116872e7271a6d4e16d81d0c8570876c8de68093a09ac269d8aac0"
[[package]]
name = "autocfg"
version = "1.5.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "c08606f8c3cbf4ce6ec8e28fb0014a2c086708fe954eaa885384a6165172e7e8"
[[package]]
name = "axum"
version = "0.8.8"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8b52af3cb4058c895d37317bb27508dccc8e5f2d39454016b297bf4a400597b8"
dependencies = [
"axum-core",
"bytes",
"form_urlencoded",
"futures-util",
"http",
"http-body",
"http-body-util",
"hyper",
"hyper-util",
"itoa",
"matchit",
"memchr",
"mime",
"percent-encoding",
"pin-project-lite",
"serde_core",
"serde_json",
"serde_path_to_error",
"serde_urlencoded",
"sync_wrapper",
"tokio",
"tower",
"tower-layer",
"tower-service",
"tracing",
]
[[package]]
name = "axum-core"
version = "0.5.6"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "08c78f31d7b1291f7ee735c1c6780ccde7785daae9a9206026862dab7d8792d1"
dependencies = [
"bytes",
"futures-core",
"http",
"http-body",
"http-body-util",
"mime",
"pin-project-lite",
"sync_wrapper",
"tower-layer",
"tower-service",
"tracing",
]
[[package]]
name = "axum-server"
version = "0.8.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b1df331683d982a0b9492b38127151e6453639cd34926eb9c07d4cd8c6d22bfc"
dependencies = [
"bytes",
"either",
"fs-err",
"http",
"http-body",
"hyper",
"hyper-util",
"tokio",
"tower-service",
]
[[package]]
name = "backend"
version = "0.1.0"
dependencies = [
"axum",
"axum-server",
"serde",
"tokio",
"tracing-subscriber",
]
[[package]]
name = "bitflags"
version = "2.10.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "812e12b5285cc515a9c72a5c1d3b6d46a19dac5acfef5265968c166106e31dd3"
[[package]]
name = "bytes"
version = "1.11.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "1e748733b7cbc798e1434b6ac524f0c1ff2ab456fe201501e6497c8417a4fc33"
[[package]]
name = "cfg-if"
version = "1.0.4"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9330f8b2ff13f34540b44e946ef35111825727b38d33286ef986142615121801"
[[package]]
name = "either"
version = "1.15.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "48c757948c5ede0e46177b7add2e67155f70e33c07fea8284df6576da70b3719"
[[package]]
name = "equivalent"
version = "1.0.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "877a4ace8713b0bcf2a4e7eec82529c029f1d0619886d18145fea96c3ffe5c0f"
[[package]]
name = "errno"
version = "0.3.14"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "39cab71617ae0d63f51a36d69f866391735b51691dbda63cf6f96d042b63efeb"
dependencies = [
"libc",
"windows-sys",
]
[[package]]
name = "fnv"
version = "1.0.7"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "3f9eec918d3f24069decb9af1554cad7c880e2da24a9afd88aca000531ab82c1"
[[package]]
name = "form_urlencoded"
version = "1.2.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "cb4cb245038516f5f85277875cdaa4f7d2c9a0fa0468de06ed190163b1581fcf"
dependencies = [
"percent-encoding",
]
[[package]]
name = "fs-err"
version = "3.3.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "73fde052dbfc920003cfd2c8e2c6e6d4cc7c1091538c3a24226cec0665ab08c0"
dependencies = [
"autocfg",
"tokio",
]
[[package]]
name = "futures-channel"
version = "0.3.32"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "07bbe89c50d7a535e539b8c17bc0b49bdb77747034daa8087407d655f3f7cc1d"
dependencies = [
"futures-core",
]
[[package]]
name = "futures-core"
version = "0.3.32"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "7e3450815272ef58cec6d564423f6e755e25379b217b0bc688e295ba24df6b1d"
[[package]]
name = "futures-sink"
version = "0.3.32"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "c39754e157331b013978ec91992bde1ac089843443c49cbc7f46150b0fad0893"
[[package]]
name = "futures-task"
version = "0.3.32"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "037711b3d59c33004d3856fbdc83b99d4ff37a24768fa1be9ce3538a1cde4393"
[[package]]
name = "futures-util"
version = "0.3.32"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "389ca41296e6190b48053de0321d02a77f32f8a5d2461dd38762c0593805c6d6"
dependencies = [
"futures-core",
"futures-task",
"pin-project-lite",
"slab",
]
[[package]]
name = "h2"
version = "0.4.13"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2f44da3a8150a6703ed5d34e164b875fd14c2cdab9af1252a9a1020bde2bdc54"
dependencies = [
"atomic-waker",
"bytes",
"fnv",
"futures-core",
"futures-sink",
"http",
"indexmap",
"slab",
"tokio",
"tokio-util",
"tracing",
]
[[package]]
name = "hashbrown"
version = "0.16.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "841d1cc9bed7f9236f321df977030373f4a4163ae1a7dbfe1a51a2c1a51d9100"
[[package]]
name = "http"
version = "1.4.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e3ba2a386d7f85a81f119ad7498ebe444d2e22c2af0b86b069416ace48b3311a"
dependencies = [
"bytes",
"itoa",
]
[[package]]
name = "http-body"
version = "1.0.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "1efedce1fb8e6913f23e0c92de8e62cd5b772a67e7b3946df930a62566c93184"
dependencies = [
"bytes",
"http",
]
[[package]]
name = "http-body-util"
version = "0.1.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b021d93e26becf5dc7e1b75b1bed1fd93124b374ceb73f43d4d4eafec896a64a"
dependencies = [
"bytes",
"futures-core",
"http",
"http-body",
"pin-project-lite",
]
[[package]]
name = "httparse"
version = "1.10.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "6dbf3de79e51f3d586ab4cb9d5c3e2c14aa28ed23d180cf89b4df0454a69cc87"
[[package]]
name = "httpdate"
version = "1.0.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "df3b46402a9d5adb4c86a0cf463f42e19994e3ee891101b1841f30a545cb49a9"
[[package]]
name = "hyper"
version = "1.8.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2ab2d4f250c3d7b1c9fcdff1cece94ea4e2dfbec68614f7b87cb205f24ca9d11"
dependencies = [
"atomic-waker",
"bytes",
"futures-channel",
"futures-core",
"h2",
"http",
"http-body",
"httparse",
"httpdate",
"itoa",
"pin-project-lite",
"pin-utils",
"smallvec",
"tokio",
]
[[package]]
name = "hyper-util"
version = "0.1.20"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "96547c2556ec9d12fb1578c4eaf448b04993e7fb79cbaad930a656880a6bdfa0"
dependencies = [
"bytes",
"http",
"http-body",
"hyper",
"pin-project-lite",
"tokio",
"tower-service",
]
[[package]]
name = "indexmap"
version = "2.13.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "7714e70437a7dc3ac8eb7e6f8df75fd8eb422675fc7678aff7364301092b1017"
dependencies = [
"equivalent",
"hashbrown",
]
[[package]]
name = "itoa"
version = "1.0.18"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8f42a60cbdf9a97f5d2305f08a87dc4e09308d1276d28c869c684d7777685682"
[[package]]
name = "lazy_static"
version = "1.5.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "bbd2bcb4c963f2ddae06a2efc7e9f3591312473c50c6685e1f298068316e66fe"
[[package]]
name = "libc"
version = "0.2.183"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b5b646652bf6661599e1da8901b3b9522896f01e736bad5f723fe7a3a27f899d"
[[package]]
name = "lock_api"
version = "0.4.14"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "224399e74b87b5f3557511d98dff8b14089b3dadafcab6bb93eab67d3aace965"
dependencies = [
"scopeguard",
]
[[package]]
name = "log"
version = "0.4.29"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "5e5032e24019045c762d3c0f28f5b6b8bbf38563a65908389bf7978758920897"
[[package]]
name = "matchit"
version = "0.8.4"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "47e1ffaa40ddd1f3ed91f717a33c8c0ee23fff369e3aa8772b9605cc1d22f4c3"
[[package]]
name = "memchr"
version = "2.8.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "f8ca58f447f06ed17d5fc4043ce1b10dd205e060fb3ce5b979b8ed8e59ff3f79"
[[package]]
name = "mime"
version = "0.3.17"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "6877bb514081ee2a7ff5ef9de3281f14a4dd4bceac4c09388074a6b5df8a139a"
[[package]]
name = "mio"
version = "1.2.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "50b7e5b27aa02a74bac8c3f23f448f8d87ff11f92d3aac1a6ed369ee08cc56c1"
dependencies = [
"libc",
"wasi",
"windows-sys",
]
[[package]]
name = "nu-ansi-term"
version = "0.50.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "7957b9740744892f114936ab4a57b3f487491bbeafaf8083688b16841a4240e5"
dependencies = [
"windows-sys",
]
[[package]]
name = "once_cell"
version = "1.21.4"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9f7c3e4beb33f85d45ae3e3a1792185706c8e16d043238c593331cc7cd313b50"
[[package]]
name = "parking_lot"
version = "0.12.5"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "93857453250e3077bd71ff98b6a65ea6621a19bb0f559a85248955ac12c45a1a"
dependencies = [
"lock_api",
"parking_lot_core",
]
[[package]]
name = "parking_lot_core"
version = "0.9.12"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2621685985a2ebf1c516881c026032ac7deafcda1a2c9b7850dc81e3dfcb64c1"
dependencies = [
"cfg-if",
"libc",
"redox_syscall",
"smallvec",
"windows-link",
]
[[package]]
name = "percent-encoding"
version = "2.3.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9b4f627cb1b25917193a259e49bdad08f671f8d9708acfd5fe0a8c1455d87220"
[[package]]
name = "pin-project-lite"
version = "0.2.17"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "a89322df9ebe1c1578d689c92318e070967d1042b512afbe49518723f4e6d5cd"
[[package]]
name = "pin-utils"
version = "0.1.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8b870d8c151b6f2fb93e84a13146138f05d02ed11c7e7c54f8826aaaf7c9f184"
[[package]]
name = "proc-macro2"
version = "1.0.106"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8fd00f0bb2e90d81d1044c2b32617f68fcb9fa3bb7640c23e9c748e53fb30934"
dependencies = [
"unicode-ident",
]
[[package]]
name = "quote"
version = "1.0.45"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "41f2619966050689382d2b44f664f4bc593e129785a36d6ee376ddf37259b924"
dependencies = [
"proc-macro2",
]
[[package]]
name = "redox_syscall"
version = "0.5.18"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ed2bf2547551a7053d6fdfafda3f938979645c44812fbfcda098faae3f1a362d"
dependencies = [
"bitflags",
]
[[package]]
name = "ryu"
version = "1.0.23"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9774ba4a74de5f7b1c1451ed6cd5285a32eddb5cccb8cc655a4e50009e06477f"
[[package]]
name = "scopeguard"
version = "1.2.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "94143f37725109f92c262ed2cf5e59bce7498c01bcc1502d7b9afe439a4e9f49"
[[package]]
name = "serde"
version = "1.0.228"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9a8e94ea7f378bd32cbbd37198a4a91436180c5bb472411e48b5ec2e2124ae9e"
dependencies = [
"serde_core",
]
[[package]]
name = "serde_core"
version = "1.0.228"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "41d385c7d4ca58e59fc732af25c3983b67ac852c1a25000afe1175de458b67ad"
dependencies = [
"serde_derive",
]
[[package]]
name = "serde_derive"
version = "1.0.228"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "d540f220d3187173da220f885ab66608367b6574e925011a9353e4badda91d79"
dependencies = [
"proc-macro2",
"quote",
"syn",
]
[[package]]
name = "serde_json"
version = "1.0.149"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "83fc039473c5595ace860d8c4fafa220ff474b3fc6bfdb4293327f1a37e94d86"
dependencies = [
"itoa",
"memchr",
"serde",
"serde_core",
"zmij",
]
[[package]]
name = "serde_path_to_error"
version = "0.1.20"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "10a9ff822e371bb5403e391ecd83e182e0e77ba7f6fe0160b795797109d1b457"
dependencies = [
"itoa",
"serde",
"serde_core",
]
[[package]]
name = "serde_urlencoded"
version = "0.7.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "d3491c14715ca2294c4d6a88f15e84739788c1d030eed8c110436aafdaa2f3fd"
dependencies = [
"form_urlencoded",
"itoa",
"ryu",
"serde",
]
[[package]]
name = "sharded-slab"
version = "0.1.7"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "f40ca3c46823713e0d4209592e8d6e826aa57e928f09752619fc696c499637f6"
dependencies = [
"lazy_static",
]
[[package]]
name = "signal-hook-registry"
version = "1.4.8"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "c4db69cba1110affc0e9f7bcd48bbf87b3f4fc7c61fc9155afd4c469eb3d6c1b"
dependencies = [
"errno",
"libc",
]
[[package]]
name = "slab"
version = "0.4.12"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "0c790de23124f9ab44544d7ac05d60440adc586479ce501c1d6d7da3cd8c9cf5"
[[package]]
name = "smallvec"
version = "1.15.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "67b1b7a3b5fe4f1376887184045fcf45c69e92af734b7aaddc05fb777b6fbd03"
[[package]]
name = "socket2"
version = "0.6.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "3a766e1110788c36f4fa1c2b71b387a7815aa65f88ce0229841826633d93723e"
dependencies = [
"libc",
"windows-sys",
]
[[package]]
name = "syn"
version = "2.0.117"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e665b8803e7b1d2a727f4023456bbbbe74da67099c585258af0ad9c5013b9b99"
dependencies = [
"proc-macro2",
"quote",
"unicode-ident",
]
[[package]]
name = "sync_wrapper"
version = "1.0.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "0bf256ce5efdfa370213c1dabab5935a12e49f2c58d15e9eac2870d3b4f27263"
[[package]]
name = "thread_local"
version = "1.1.9"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "f60246a4944f24f6e018aa17cdeffb7818b76356965d03b07d6a9886e8962185"
dependencies = [
"cfg-if",
]
[[package]]
name = "tokio"
version = "1.50.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "27ad5e34374e03cfffefc301becb44e9dc3c17584f414349ebe29ed26661822d"
dependencies = [
"bytes",
"libc",
"mio",
"parking_lot",
"pin-project-lite",
"signal-hook-registry",
"socket2",
"tokio-macros",
"windows-sys",
]
[[package]]
name = "tokio-macros"
version = "2.6.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "5c55a2eff8b69ce66c84f85e1da1c233edc36ceb85a2058d11b0d6a3c7e7569c"
dependencies = [
"proc-macro2",
"quote",
"syn",
]
[[package]]
name = "tokio-util"
version = "0.7.18"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9ae9cec805b01e8fc3fd2fe289f89149a9b66dd16786abd8b19cfa7b48cb0098"
dependencies = [
"bytes",
"futures-core",
"futures-sink",
"pin-project-lite",
"tokio",
]
[[package]]
name = "tower"
version = "0.5.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ebe5ef63511595f1344e2d5cfa636d973292adc0eec1f0ad45fae9f0851ab1d4"
dependencies = [
"futures-core",
"futures-util",
"pin-project-lite",
"sync_wrapper",
"tokio",
"tower-layer",
"tower-service",
"tracing",
]
[[package]]
name = "tower-layer"
version = "0.3.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "121c2a6cda46980bb0fcd1647ffaf6cd3fc79a013de288782836f6df9c48780e"
[[package]]
name = "tower-service"
version = "0.3.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "8df9b6e13f2d32c91b9bd719c00d1958837bc7dec474d94952798cc8e69eeec3"
[[package]]
name = "tracing"
version = "0.1.44"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "63e71662fa4b2a2c3a26f570f037eb95bb1f85397f3cd8076caed2f026a6d100"
dependencies = [
"log",
"pin-project-lite",
"tracing-core",
]
[[package]]
name = "tracing-core"
version = "0.1.36"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "db97caf9d906fbde555dd62fa95ddba9eecfd14cb388e4f491a66d74cd5fb79a"
dependencies = [
"once_cell",
"valuable",
]
[[package]]
name = "tracing-log"
version = "0.2.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ee855f1f400bd0e5c02d150ae5de3840039a3f54b025156404e34c23c03f47c3"
dependencies = [
"log",
"once_cell",
"tracing-core",
]
[[package]]
name = "tracing-subscriber"
version = "0.3.23"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "cb7f578e5945fb242538965c2d0b04418d38ec25c79d160cd279bf0731c8d319"
dependencies = [
"nu-ansi-term",
"sharded-slab",
"smallvec",
"thread_local",
"tracing-core",
"tracing-log",
]
[[package]]
name = "unicode-ident"
version = "1.0.24"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e6e4313cd5fcd3dad5cafa179702e2b244f760991f45397d14d4ebf38247da75"
[[package]]
name = "valuable"
version = "0.1.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ba73ea9cf16a25df0c8caa16c51acb937d5712a8429db78a3ee29d5dcacd3a65"
[[package]]
name = "wasi"
version = "0.11.1+wasi-snapshot-preview1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ccf3ec651a847eb01de73ccad15eb7d99f80485de043efb2f370cd654f4ea44b"
[[package]]
name = "windows-link"
version = "0.2.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "f0805222e57f7521d6a62e36fa9163bc891acd422f971defe97d64e70d0a4fe5"
[[package]]
name = "windows-sys"
version = "0.61.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "ae137229bcbd6cdf0f7b80a31df61766145077ddf49416a728b02cb3921ff3fc"
dependencies = [
"windows-link",
]
[[package]]
name = "zmij"
version = "1.0.21"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b8848ee67ecc8aedbaf3e4122217aff892639231befc6a1b58d29fff4c2cabaa"

11
backend/Cargo.toml Normal file
View File

@@ -0,0 +1,11 @@
[package]
name = "backend"
version = "0.1.0"
edition = "2024"
[dependencies]
axum = "0.8.8"
axum-server = "0.8.0"
serde = "1.0.228"
tokio = { version = "1.50.0", features = ["full"] }
tracing-subscriber = "0.3.23"

View File

14
backend/src/main.rs Normal file
View File

@@ -0,0 +1,14 @@
use axum::{routing::get, Router};
use std::net::SocketAddr;
#[tokio::main]
async fn main() {
let app = Router::new().route("/", get(|| async { "Hello, world!" }));
let addr = SocketAddr::from(([127, 0, 0, 1], 3000));
println!("listening on {}", addr);
axum_server::bind(addr)
.serve(app.into_make_service())
.await
.unwrap();
}

64
backend/user.rs Normal file
View File

@@ -0,0 +1,64 @@
use sqlite::Connection;
use sqlite::State;
pub struct User {
name: String,
level: u32,
password: String,
}
impl User {
pub fn open(name: String, level: u32, password: String) -> User {
User {name, level, password}
}
}
pub struct DataBase {
connection: Connection,
}
impl DataBase {
pub fn open(name: String) -> DataBase {
let connection = sqlite::open(name + ".db").unwrap();
DataBase { connection }
}
fn execute(&self, arg: String){
match self.connection.execute(arg){
_ => (),
Err(e) => panic!("Error : {}",e),
}
}
pub fn create_table(&self, table: &str, var: &str){
self.execute("CREATE TABLE ".to_owned() + &table.to_string() + "(" + &var.to_string() + ");");
}
pub fn add_column(&self, table: &str, arg: &str){
self.execute("ALTER TABLE ".to_owned() + &table.to_string() + " ADD " + &arg.to_string() + ";");
}
pub fn insert(&self, table: &str, arg: &str){
self.execute("INSERT INTO ".to_owned() + &table.to_string() + " VALUES (" + &arg.to_string() + ")" + ";");
}
pub fn check(&self, table: &str, arg: &str) -> bool {
let mut end = false;
self.connection.iterate("Select name FROM ".to_owned() + &table.to_string() + " WHERE name = " + &arg.to_string(), |pairs| {
for &(name, value) in pairs.iter() {
println!("{} = {}", name, value.unwrap());
if name == "name" {
println!("True");
end = true;
}
}
return end;
});
return end;
}
pub fn update(&self, table: &str, arg: &str, where_is: &str, arg2: &str){
self.execute("UPDATE ".to_owned() + &table.to_string() + " SET " + &arg.to_string() + " WHERE " + &where_is.to_string() + " = " + &arg2.to_string());
}
}

View File

@@ -12,11 +12,12 @@ body {
} }
body { body {
background: #f7f7f7; background: #FFF6E5;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-family: 'Arial', sans-serif; font-family: Arial, sans-serif;
user-select: none;
} }
main { main {
@@ -25,52 +26,80 @@ main {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 20px; padding: 20px;
border-radius: 10px; border-radius: 150px;
min-width: fit-content; min-width: fit-content;
flex-shrink: 0; flex-shrink: 0;
gap: 16px;
} }
/* ================================ .game-layout {
GRID width: min(96vw, 1200px);
================================ */ }
.game-title {
font-size: clamp(2rem, 4vw, 3rem);
font-weight: 700;
color: #223;
letter-spacing: 0.04em;
text-align: center;
}
.toolbox {
width: 100%;
background: #dfe5f8;
border-radius: 10px;
padding: 14px;
display: flex;
flex-direction: column;
gap: 10px;
}
.toolbox h2 {
font-size: 1rem;
}
.toolbox p {
font-size: 0.9rem;
color: #334;
}
.glass-palette {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.map { .map {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0px;
padding: 10px; padding: 10px;
background: #DADEEF; background: #dadeef;
border-radius: 5px; border-radius: 15px;
} }
.lign { .lign {
display: flex; display: flex;
gap: 0px;
margin: 0;
} }
/* ================================
CELLS
================================ */
.cell { .cell {
width: clamp(28px, 5.5vmin, 60px); width: clamp(28px, 6.2vmin, 72px);
height: clamp(28px, 5.5vmin, 60px); height: clamp(28px, 6.2vmin, 72px);
transition: all 0.2s ease; transition: all 0.2s ease;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin: 0;
position: relative; position: relative;
background-color: #2a2a2a; background-color: #2a2a2a;
user-select: none;
overflow: hidden;
} }
/* ================================ .cell.can-drop {
CASES TYPE outline: 2px dashed rgba(0, 0, 0, 0.2);
================================ */ }
.empty { .empty {
background-color: #DADEEF; background-color: #dadeef;
} }
.empty:hover { .empty:hover {
@@ -78,79 +107,274 @@ main {
} }
.laser { .laser {
background-color: #FFD700; background-color: #DADEEF;
background-image: url("../img/tiles/Laser.svg");
background-size: 80%;
background-repeat: no-repeat;
background-position: center;
transform: rotate(180deg);
}
.colored-laser {
background-color: #DADEEF;
background-image: url("../img/tiles/Prisme.svg");
background-size: 80%;
background-repeat: no-repeat;
background-position: center;
} }
.mirror { .mirror {
background-color: #DADEEF; background-color: #DADEEF;
border-color: #444444;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
-moz-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
-o-transform: scaleX(-1);
transform: scaleX(-1);
-ms-filter: fliph; /*IE*/
filter: fliph; /*IE*/
} }
.wall { .wall {
background-color: #DADEEF; background-color: #DADEEF;
background-image: url("../img/tiles/Tuile.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.captor {
background-color: #DADEEF;
background-image: url("../img/tiles/Capteur-1.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
transform: rotate(180deg);
}
.captor-turn {
background-color: #DADEEF;
background-image: url("../img/tiles/Capteur-2.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.cable {
background-color: #DADEEF;
background-image: url("../img/tiles/CableV.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
transform: rotate(90deg);
}
.cable-vertical {
background-color: #DADEEF;
background-image: url("../img/tiles/CableV.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.door {
background-color: #DADEEF;
background-image: url("../img/tiles/WoodenDoor.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: end;
}
.door-open {
background-image: url("../img/tiles/WoodenDoor_openned.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: end;
}
.button {
background-color: #DADEEF;
background-image: url("../img/tiles/ButtonComplete.svg"), url("../img/tiles/Tuile.svg");
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
}
.button-2 {
background-color: #DADEEF;
background-image: url("../img/tiles/ButtonQuarter.svg"), url("../img/tiles/Tuile.svg");
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
}
.button-rotator {
background-color: #DADEEF;
background-image: url("../img/tiles/ButtonProfile.svg"), url("../img/tiles/Tuile.svg");
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
}
.button-active {
opacity: 0.7;
} }
.target { .target {
background: #00FF00; background-color: #DADEEF;
background-image: url("../img/tiles/Trigger.svg");
background-size: 80%;
background-repeat: no-repeat;
background-position: center;
} }
/* ================================ .demi-wall-corner-up-left {
LIGHT LASER background-color: #DADEEF;
================================ */ background-image: url("../img/tiles/TopLeft.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.light-laser { .demi-wall-corner-up-right {
position: relative; background-color: #DADEEF;
background-image: url("../img/tiles/TopRight.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.demi-wall-corner-down-left {
background-color: #DADEEF;
background-image: url("../img/tiles/BottomLeft.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.demi-wall-corner-down-right {
background-color: #DADEEF;
background-image: url("../img/tiles/BottomRight.svg");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}
.laser-overlay {
position: absolute;
inset: 0;
pointer-events: none;
z-index: 2;
} }
.laser-horizontal { .laser-horizontal {
background: linear-gradient(to bottom, transparent 0%, transparent 45%, red 45%, red 55%, transparent 55%, transparent 100%), #DADEEF --laser-color: red;
background: linear-gradient(to bottom, transparent 0%, transparent 45%, var(--laser-color) 45%, var(--laser-color) 55%, transparent 55%, transparent 100%);
} }
.laser-vertical { .laser-vertical {
background: linear-gradient(to right, transparent 0%, transparent 45%, red 45%, red 55%, transparent 55%, transparent 100%), #DADEEF; --laser-color: red;
background: linear-gradient(to right, transparent 0%, transparent 45%, var(--laser-color) 45%, var(--laser-color) 55%, transparent 55%, transparent 100%);
} }
.laser-diagonal-down { .laser-diagonal-down {
background: linear-gradient(45deg, transparent 0%, transparent 46%, red 46%, red 54%, transparent 54%, transparent 100%), #DADEEF; --laser-color: red;
background: linear-gradient(45deg, transparent 0%, transparent 46%, var(--laser-color) 46%, var(--laser-color) 54%, transparent 54%, transparent 100%);
} }
.laser-diagonal-up { .laser-diagonal-up {
background: linear-gradient(135deg, transparent 0%, transparent 46%, red 46%, red 54%, transparent 54%, transparent 100%), #DADEEF; --laser-color: red;
background: linear-gradient(135deg, transparent 0%, transparent 46%, var(--laser-color) 46%, var(--laser-color) 54%, transparent 54%, transparent 100%);
} }
/* ================================ .laser-color-white {
MIRROR --laser-color: #f8f8f8;
================================ */ }
.laser-color-red {
--laser-color: #ff3b30;
}
.laser-color-blue {
--laser-color: #2d7ff9;
}
.laser-color-yellow {
--laser-color: #ffd400;
}
.btn-mirror { .btn-mirror {
background: none; background: none;
border: none; border: none;
cursor: pointer; cursor: pointer;
width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
z-index: 3;
display: flex;
align-items: center;
justify-content: center;
} }
.btn-mirror::after { .btn-mirror-locked {
content: ''; cursor: default;
position: absolute; }
top: 50%;
left: 10%; .mirror-img {
width: 80%; width: 80%;
height: 2px; height: 80%;
background-color: #aaaaaa; object-fit: contain;
transform-origin: center; pointer-events: none;
} }
/* ================================ .glass-item {
RESPONSIVE width: 54px;
================================ */ height: 54px;
border: none;
border-radius: 10px;
cursor: grab;
position: relative;
box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.1);
user-select: none;
color: #223;
font-size: 0.8rem;
font-weight: bold;
}
.glass-item::after,
.cell-glass::after {
content: "";
position: absolute;
inset: 10px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.45);
border: 1px solid rgba(255, 255, 255, 0.8);
}
.glass-red {
background: rgba(255, 59, 48, 0.85);
}
.glass-blue {
background: rgba(45, 127, 249, 0.85);
}
.glass-yellow {
background: rgba(255, 212, 0, 0.9);
}
.cell-glass {
position: absolute;
inset: 5px;
border-radius: 8px;
opacity: 0.9;
pointer-events: none;
z-index: 4;
}
@media (max-width: 600px) { @media (max-width: 600px) {
.map { .map {
padding: 5px; padding: 5px;
border-radius: 3px;
} }
main { main {
@@ -158,8 +382,41 @@ main {
} }
} }
@media (max-height: 500px) { .win-overlay {
.map { position: absolute;
padding: 4px; inset: 0;
} background: rgba(0, 0, 0, 0.5);
z-index: 1000;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
visibility: hidden;
gap: 20px;
backdrop-filter: blur(6px);
}
.win-overlay h1 {
font-size: 2rem;
font-weight: 700;
color: #fff;
text-align: center;
}
.win-overlay p {
font-size: 1.5rem;
font-weight: 400;
color: #fff;
text-align: center;
}
.win-overlay button {
font-size: 1.5rem;
padding: 10px 20px;
border-radius: 5px;
background-color: #fff;
color: #000;
border: none;
cursor: pointer;
} }

View File

@@ -0,0 +1,9 @@
<svg width="20" height="200" viewBox="0 0 20 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<ellipse cx="10" cy="100" rx="10" ry="100" fill="url(#paint0_linear_25_4)"/>
<defs>
<linearGradient id="paint0_linear_25_4" x1="-8.46573" y1="60.2496" x2="61.4687" y2="123.939" gradientUnits="userSpaceOnUse">
<stop stop-color="#3C62E2" stop-opacity="0.4"/>
<stop offset="1" stop-color="#00137C" stop-opacity="0.4"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 447 B

View File

@@ -0,0 +1,19 @@
<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 49V1.61816L95.7637 49L1 49Z" fill="url(#paint0_linear_19_240)" stroke="url(#paint1_linear_19_240)" stroke-width="2"/>
<circle cx="5.5" cy="44.5" r="1.5" transform="rotate(-180 5.5 44.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="44.5" r="1" transform="rotate(-180 5.5 44.5)" fill="#898989"/>
<circle cx="4.5" cy="8.5" r="1.5" transform="rotate(-180 4.5 8.5)" fill="#4A4A4A"/>
<circle cx="4.5" cy="8.5" r="1" transform="rotate(-180 4.5 8.5)" fill="#898989"/>
<circle cx="77.5" cy="44.5" r="1.5" transform="rotate(-180 77.5 44.5)" fill="#4A4A4A"/>
<circle cx="77.5" cy="44.5" r="1" transform="rotate(-180 77.5 44.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_240" x1="0" y1="0" x2="40" y2="80" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_240" x1="100" y1="50" x2="60" y2="-30" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="50" height="100" viewBox="0 0 50 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M49 99L1.61816 99L49 4.23633L49 99Z" fill="url(#paint0_linear_19_286)" stroke="url(#paint1_linear_19_286)" stroke-width="2"/>
<circle cx="44.5" cy="94.5" r="1.5" transform="rotate(90 44.5 94.5)" fill="#4A4A4A"/>
<circle cx="44.5" cy="94.5" r="1" transform="rotate(90 44.5 94.5)" fill="#898989"/>
<circle cx="8.5" cy="95.5" r="1.5" transform="rotate(90 8.5 95.5)" fill="#4A4A4A"/>
<circle cx="8.5" cy="95.5" r="1" transform="rotate(90 8.5 95.5)" fill="#898989"/>
<circle cx="44.5" cy="22.5" r="1.5" transform="rotate(90 44.5 22.5)" fill="#4A4A4A"/>
<circle cx="44.5" cy="22.5" r="1" transform="rotate(90 44.5 22.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_286" x1="0" y1="0" x2="80" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_286" x1="50" y1="100" x2="-30" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 99L1 2.41406L97.5859 99L1 99Z" fill="url(#paint0_linear_17_89)" stroke="url(#paint1_linear_17_89)" stroke-width="2"/>
<circle cx="5.5" cy="94.5" r="1.5" transform="rotate(-180 5.5 94.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" transform="rotate(-180 5.5 94.5)" fill="#898989"/>
<circle cx="5.5" cy="13.5" r="1.5" transform="rotate(-180 5.5 13.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="13.5" r="1" transform="rotate(-180 5.5 13.5)" fill="#898989"/>
<circle cx="86.5" cy="94.5" r="1.5" transform="rotate(-180 86.5 94.5)" fill="#4A4A4A"/>
<circle cx="86.5" cy="94.5" r="1" transform="rotate(-180 86.5 94.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_17_89" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_17_89" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M99 49L4.23633 49L99 1.61816V49Z" fill="url(#paint0_linear_19_273)" stroke="url(#paint1_linear_19_273)" stroke-width="2"/>
<circle cx="94.5" cy="44.5" r="1.5" transform="rotate(90 94.5 44.5)" fill="#4A4A4A"/>
<circle cx="94.5" cy="44.5" r="1" transform="rotate(90 94.5 44.5)" fill="#898989"/>
<circle cx="22.5" cy="44.5" r="1.5" transform="rotate(90 22.5 44.5)" fill="#4A4A4A"/>
<circle cx="22.5" cy="44.5" r="1" transform="rotate(90 22.5 44.5)" fill="#898989"/>
<circle cx="94.5" cy="9.5" r="1.5" transform="rotate(90 94.5 9.5)" fill="#4A4A4A"/>
<circle cx="94.5" cy="9.5" r="1" transform="rotate(90 94.5 9.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_273" x1="8.9407e-06" y1="1.49012e-06" x2="40" y2="80" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_273" x1="100" y1="50" x2="60" y2="-30" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="50" height="100" viewBox="0 0 50 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M49 1V95.7637L1.61818 1H49Z" fill="url(#paint0_linear_19_319)" stroke="url(#paint1_linear_19_319)" stroke-width="2"/>
<circle cx="44.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="44.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="44.5" cy="77.5" r="1.5" fill="#4A4A4A"/>
<circle cx="44.5" cy="77.5" r="1" fill="#898989"/>
<circle cx="9.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="9.5" cy="5.5" r="1" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_319" x1="1.14441e-05" y1="0" x2="80" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_319" x1="50" y1="100" x2="-30" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 947 B

View File

@@ -0,0 +1,19 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M99 99H2.41406L99 2.41406V99Z" fill="url(#paint0_linear_19_190)" stroke="url(#paint1_linear_19_190)" stroke-width="2"/>
<circle cx="94.5" cy="94.5" r="1.5" transform="rotate(90 94.5 94.5)" fill="#4A4A4A"/>
<circle cx="94.5" cy="94.5" r="1" transform="rotate(90 94.5 94.5)" fill="#898989"/>
<circle cx="13.5" cy="94.5" r="1.5" transform="rotate(90 13.5 94.5)" fill="#4A4A4A"/>
<circle cx="13.5" cy="94.5" r="1" transform="rotate(90 13.5 94.5)" fill="#898989"/>
<circle cx="94.5" cy="13.5" r="1.5" transform="rotate(90 94.5 13.5)" fill="#4A4A4A"/>
<circle cx="94.5" cy="13.5" r="1" transform="rotate(90 94.5 13.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_190" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_190" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,27 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M50 1H99V99H50C22.938 99 1 77.062 1 50C1 22.938 22.938 1 50 1Z" fill="url(#paint0_linear_19_364)" stroke="url(#paint1_linear_19_364)" stroke-width="2"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="50" cy="50" r="30" fill="url(#paint2_linear_19_364)"/>
<circle cx="50" cy="50" r="25" fill="url(#paint3_linear_19_364)"/>
<defs>
<linearGradient id="paint0_linear_19_364" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_364" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
<linearGradient id="paint2_linear_19_364" x1="20" y1="80" x2="80" y2="20" gradientUnits="userSpaceOnUse">
<stop stop-color="#F88484"/>
<stop offset="1" stop-color="#B03232"/>
</linearGradient>
<linearGradient id="paint3_linear_19_364" x1="25" y1="25" x2="75" y2="75" gradientUnits="userSpaceOnUse">
<stop stop-color="#F88484"/>
<stop offset="1" stop-color="#B03232"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1,24 @@
<svg width="100" height="30" viewBox="0 0 100 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect y="20" width="100" height="10" fill="url(#paint0_linear_19_205)"/>
<path d="M80 10L100 20H0L20 10H80Z" fill="url(#paint1_linear_19_205)"/>
<path d="M25 5H75V10H25V5Z" fill="url(#paint2_linear_19_205)"/>
<path d="M70 0L75 5H25L30 0H70Z" fill="url(#paint3_linear_19_205)"/>
<defs>
<linearGradient id="paint0_linear_19_205" x1="0" y1="25" x2="100" y2="25" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9"/>
<stop offset="1" stop-color="#737373"/>
</linearGradient>
<linearGradient id="paint1_linear_19_205" x1="20" y1="10" x2="80" y2="10" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9"/>
<stop offset="1" stop-color="#737373"/>
</linearGradient>
<linearGradient id="paint2_linear_19_205" x1="25" y1="7.5" x2="75" y2="7.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#F88484"/>
<stop offset="1" stop-color="#B03232"/>
</linearGradient>
<linearGradient id="paint3_linear_19_205" x1="30" y1="-5.5879e-10" x2="70" y2="-8.54951e-08" gradientUnits="userSpaceOnUse">
<stop stop-color="#F88484"/>
<stop offset="1" stop-color="#B03232"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -0,0 +1,29 @@
<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M79 1V78.9932C36.1632 78.4618 1.53823 43.8368 1.00684 1H79Z" fill="url(#paint0_linear_21_561)" stroke="url(#paint1_linear_21_561)" stroke-width="2"/>
<circle cx="74.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="74.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="6.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="6.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="74.5" cy="73.5" r="1.5" fill="#3C3C3C"/>
<circle cx="74.5" cy="73.5" r="1" fill="#898989"/>
<circle cx="46" cy="34" r="20" fill="url(#paint2_linear_21_561)"/>
<circle cx="46" cy="34" r="16.6667" fill="url(#paint3_linear_21_561)"/>
<defs>
<linearGradient id="paint0_linear_21_561" x1="0" y1="0" x2="80" y2="80" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_561" x1="80" y1="80" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
<linearGradient id="paint2_linear_21_561" x1="26" y1="54" x2="66" y2="14" gradientUnits="userSpaceOnUse">
<stop stop-color="#F88484"/>
<stop offset="1" stop-color="#B03232"/>
</linearGradient>
<linearGradient id="paint3_linear_21_561" x1="29.3333" y1="17.3333" x2="62.6667" y2="50.6667" gradientUnits="userSpaceOnUse">
<stop stop-color="#F88484"/>
<stop offset="1" stop-color="#B03232"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_417)" stroke="url(#paint1_linear_21_417)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<path d="M58 100H42V58H0V42H58V100Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_417" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_417" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_385)" stroke="url(#paint1_linear_21_385)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<path d="M100 42V58H58V100H42V42H100Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_385" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_385" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_545)" stroke="url(#paint1_linear_21_545)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<rect y="42" width="100" height="16" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_545" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_545" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_449)" stroke="url(#paint1_linear_21_449)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<path d="M0 58V42L42 42L42 0L58 0L58 58L0 58Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_449" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_449" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_433)" stroke="url(#paint1_linear_21_433)" stroke-width="2"/>
<circle cx="5.5" cy="4.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="4.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="93.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="93.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="4.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="4.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="93.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="93.5" r="1" fill="#898989"/>
<path d="M42 0H58L58 42H100V58L42 58L42 0Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_433" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_433" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_529)" stroke="url(#paint1_linear_21_529)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<rect x="42" width="16" height="100" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_529" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_529" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_23_646)" stroke="url(#paint1_linear_23_646)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<path d="M30 42H100V58H30L0 90V10L30 42Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_23_646" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_23_646" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_23_626)" stroke="url(#paint1_linear_23_626)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<path d="M58 100H42V58H30L0 90V10L30 42H58V100Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_23_626" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_23_626" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,22 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_21_599)" stroke="url(#paint1_linear_21_599)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M30 42H42V0H58V58H30L0 90V10L30 42Z" fill="#FF8282"/>
<defs>
<linearGradient id="paint0_linear_21_599" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_21_599" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,21 @@
<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="48" fill="url(#paint0_linear_19_332)" stroke="url(#paint1_linear_19_332)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="44.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="44.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="44.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="44.5" r="1" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_332" x1="0" y1="0" x2="40" y2="80" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_332" x1="100" y1="50" x2="60" y2="-30" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@@ -0,0 +1,44 @@
<svg width="300" height="100" viewBox="0 0 300 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="172" y="90" width="80" height="30" transform="rotate(-90 172 90)" fill="url(#paint0_linear_17_26)"/>
<rect x="202" y="100" width="100" height="98" transform="rotate(-90 202 100)" fill="url(#paint1_linear_17_26)"/>
<rect x="122" y="100" width="100" height="50" transform="rotate(-90 122 100)" fill="url(#paint2_linear_17_26)"/>
<rect x="92" y="90" width="80" height="30" transform="rotate(-90 92 90)" fill="url(#paint3_linear_17_26)"/>
<rect x="42" y="100" width="100" height="50" transform="rotate(-90 42 100)" fill="url(#paint4_linear_17_26)"/>
<rect x="22" y="90" width="80" height="20" transform="rotate(-90 22 90)" fill="url(#paint5_linear_17_26)"/>
<path d="M2 30L22 10L22 90L2 70L2 30Z" fill="url(#paint6_linear_17_26)"/>
<rect y="60" width="20" height="2" transform="rotate(-90 0 60)" fill="url(#paint7_linear_17_26)"/>
<defs>
<linearGradient id="paint0_linear_17_26" x1="172" y1="105" x2="252" y2="105" gradientUnits="userSpaceOnUse">
<stop offset="0.177885" stop-color="#484848"/>
<stop offset="0.725962" stop-color="#AEAEAE"/>
</linearGradient>
<linearGradient id="paint1_linear_17_26" x1="202" y1="149" x2="302" y2="149" gradientUnits="userSpaceOnUse">
<stop offset="0.125" stop-color="#2D2D2D"/>
<stop offset="0.745192" stop-color="#939393"/>
</linearGradient>
<linearGradient id="paint2_linear_17_26" x1="122" y1="125" x2="222" y2="125" gradientUnits="userSpaceOnUse">
<stop offset="0.125" stop-color="#2D2D2D"/>
<stop offset="0.745192" stop-color="#939393"/>
</linearGradient>
<linearGradient id="paint3_linear_17_26" x1="92" y1="105" x2="172" y2="105" gradientUnits="userSpaceOnUse">
<stop offset="0.177885" stop-color="#484848"/>
<stop offset="0.725962" stop-color="#AEAEAE"/>
</linearGradient>
<linearGradient id="paint4_linear_17_26" x1="42" y1="125" x2="142" y2="125" gradientUnits="userSpaceOnUse">
<stop offset="0.125" stop-color="#2D2D2D"/>
<stop offset="0.745192" stop-color="#939393"/>
</linearGradient>
<linearGradient id="paint5_linear_17_26" x1="22" y1="100" x2="102" y2="100" gradientUnits="userSpaceOnUse">
<stop offset="0.177885" stop-color="#484848"/>
<stop offset="0.725962" stop-color="#AEAEAE"/>
</linearGradient>
<linearGradient id="paint6_linear_17_26" x1="2" y1="70" x2="2" y2="30" gradientUnits="userSpaceOnUse">
<stop offset="0.177885" stop-color="#484848"/>
<stop offset="1" stop-color="#AEAEAE"/>
</linearGradient>
<linearGradient id="paint7_linear_17_26" x1="-42.5" y1="61" x2="61" y2="61" gradientUnits="userSpaceOnUse">
<stop offset="0.225962" stop-color="#484848"/>
<stop offset="1" stop-color="#AEAEAE"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@@ -0,0 +1,46 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="88" height="98" fill="url(#paint0_linear_29_15)" stroke="url(#paint1_linear_29_15)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="81.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="81.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="81.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="81.5" cy="94.5" r="1" fill="#898989"/>
<rect x="90" width="10" height="100" fill="url(#paint2_linear_29_15)"/>
<rect x="85" y="4" width="8" height="4" fill="url(#paint3_linear_29_15)"/>
<rect x="85" y="92" width="8" height="4" fill="url(#paint4_linear_29_15)"/>
<rect x="85" y="64" width="8" height="4" fill="url(#paint5_linear_29_15)"/>
<rect x="85" y="32" width="8" height="4" fill="url(#paint6_linear_29_15)"/>
<defs>
<linearGradient id="paint0_linear_29_15" x1="0" y1="0" x2="99.4475" y2="89.5028" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_29_15" x1="90" y1="100" x2="-9.44751" y2="10.4972" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
<linearGradient id="paint2_linear_29_15" x1="100" y1="50" x2="90" y2="50" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
<linearGradient id="paint3_linear_29_15" x1="93" y1="6" x2="85" y2="6" gradientUnits="userSpaceOnUse">
<stop stop-color="#474747"/>
<stop offset="1" stop-color="#ADADAD"/>
</linearGradient>
<linearGradient id="paint4_linear_29_15" x1="93" y1="94" x2="85" y2="94" gradientUnits="userSpaceOnUse">
<stop stop-color="#474747"/>
<stop offset="1" stop-color="#ADADAD"/>
</linearGradient>
<linearGradient id="paint5_linear_29_15" x1="93" y1="66" x2="85" y2="66" gradientUnits="userSpaceOnUse">
<stop stop-color="#474747"/>
<stop offset="1" stop-color="#ADADAD"/>
</linearGradient>
<linearGradient id="paint6_linear_29_15" x1="93" y1="34" x2="85" y2="34" gradientUnits="userSpaceOnUse">
<stop stop-color="#474747"/>
<stop offset="1" stop-color="#ADADAD"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@@ -0,0 +1,15 @@
<svg width="40" height="200" viewBox="0 0 40 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20 2C20.6534 2 21.5184 2.3224 22.6006 3.42969C23.686 4.54032 24.8285 6.28601 25.9766 8.71387C28.2679 13.5596 30.3842 20.6991 32.1807 29.6816C35.7671 47.6141 38 72.4764 38 100C38 127.524 35.7671 152.386 32.1807 170.318C30.3842 179.301 28.2679 186.44 25.9766 191.286C24.8285 193.714 23.686 195.46 22.6006 196.57C21.5184 197.678 20.6534 198 20 198C19.3466 198 18.4816 197.678 17.3994 196.57C16.314 195.46 15.1715 193.714 14.0234 191.286C11.7321 186.44 9.61584 179.301 7.81934 170.318C4.23285 152.386 2 127.524 2 100C2 72.4764 4.23285 47.6141 7.81934 29.6816C9.61584 20.6991 11.7321 13.5596 14.0234 8.71387C15.1715 6.28601 16.314 4.54032 17.3994 3.42969C18.4816 2.3224 19.3466 2 20 2Z" fill="url(#paint0_linear_29_61)" stroke="url(#paint1_linear_29_61)" stroke-width="4"/>
<defs>
<linearGradient id="paint0_linear_29_61" x1="-16.9315" y1="60.2496" x2="42.3327" y2="168.193" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#84A3B3"/>
</linearGradient>
<linearGradient id="paint1_linear_29_61" x1="20" y1="0" x2="19.4598" y2="193.684" gradientUnits="userSpaceOnUse">
<stop stop-color="#B9B9B9"/>
<stop offset="0.336163" stop-color="#6E6E6E"/>
<stop offset="0.609062" stop-color="#B9B9B9"/>
<stop offset="1" stop-color="#6E6E6E"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1,15 @@
<svg width="40" height="200" viewBox="0 0 40 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20 2C20.6534 2 21.5184 2.3224 22.6006 3.42969C23.686 4.54032 24.8285 6.28601 25.9766 8.71387C28.2679 13.5596 30.3842 20.6991 32.1807 29.6816C35.7671 47.6141 38 72.4764 38 100C38 127.524 35.7671 152.386 32.1807 170.318C30.3842 179.301 28.2679 186.44 25.9766 191.286C24.8285 193.714 23.686 195.46 22.6006 196.57C21.5184 197.678 20.6534 198 20 198C19.3466 198 18.4816 197.678 17.3994 196.57C16.314 195.46 15.1715 193.714 14.0234 191.286C11.7321 186.44 9.61584 179.301 7.81934 170.318C4.23285 152.386 2 127.524 2 100C2 72.4764 4.23285 47.6141 7.81934 29.6816C9.61584 20.6991 11.7321 13.5596 14.0234 8.71387C15.1715 6.28601 16.314 4.54032 17.3994 3.42969C18.4816 2.3224 19.3466 2 20 2Z" fill="url(#paint0_linear_4_13)" stroke="url(#paint1_linear_4_13)" stroke-width="4"/>
<defs>
<linearGradient id="paint0_linear_4_13" x1="-16.9315" y1="60.2496" x2="42.3327" y2="168.193" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#84A3B3"/>
</linearGradient>
<linearGradient id="paint1_linear_4_13" x1="20" y1="0" x2="19.4598" y2="193.684" gradientUnits="userSpaceOnUse">
<stop stop-color="#603C18"/>
<stop offset="0.336163" stop-color="#885B2E"/>
<stop offset="0.609062" stop-color="#603C18"/>
<stop offset="1" stop-color="#885B2E"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1,3 @@
<svg width="87" height="75" viewBox="0 0 87 75" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M43.3013 0L86.6025 75H0L43.3013 0Z" fill="#D9D9D9" fill-opacity="0.4"/>
</svg>

After

Width:  |  Height:  |  Size: 184 B

View File

@@ -0,0 +1,9 @@
<svg width="20" height="200" viewBox="0 0 20 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<ellipse cx="10" cy="100" rx="10" ry="100" fill="url(#paint0_linear_25_10)"/>
<defs>
<linearGradient id="paint0_linear_25_10" x1="-8.46573" y1="60.2496" x2="61.4687" y2="123.939" gradientUnits="userSpaceOnUse">
<stop stop-color="#E23C3C" stop-opacity="0.4"/>
<stop offset="1" stop-color="#7C0000" stop-opacity="0.4"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 449 B

View File

@@ -0,0 +1,19 @@
<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L95.7637 1L1 48.3818L1 1Z" fill="url(#paint0_linear_19_251)" stroke="url(#paint1_linear_19_251)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" transform="rotate(-90 5.5 5.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="5.5" r="1" transform="rotate(-90 5.5 5.5)" fill="#898989"/>
<circle cx="76.5" cy="5.5" r="1.5" transform="rotate(-90 76.5 5.5)" fill="#4A4A4A"/>
<circle cx="76.5" cy="5.5" r="1" transform="rotate(-90 76.5 5.5)" fill="#898989"/>
<circle cx="5.5" cy="40.5" r="1.5" transform="rotate(-90 5.5 40.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="40.5" r="1" transform="rotate(-90 5.5 40.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_251" x1="0" y1="0" x2="40" y2="80" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_251" x1="100" y1="50" x2="60" y2="-30" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="50" height="100" viewBox="0 0 50 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 99L1 4.23633L48.3818 99H1Z" fill="url(#paint0_linear_19_297)" stroke="url(#paint1_linear_19_297)" stroke-width="2"/>
<circle cx="5.5" cy="94.5" r="1.5" transform="rotate(-180 5.5 94.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" transform="rotate(-180 5.5 94.5)" fill="#898989"/>
<circle cx="5.5" cy="23.5" r="1.5" transform="rotate(-180 5.5 23.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="23.5" r="1" transform="rotate(-180 5.5 23.5)" fill="#898989"/>
<circle cx="40.5" cy="94.5" r="1.5" transform="rotate(-180 40.5 94.5)" fill="#4A4A4A"/>
<circle cx="40.5" cy="94.5" r="1" transform="rotate(-180 40.5 94.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_297" x1="0" y1="0" x2="80" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_297" x1="50" y1="100" x2="-30" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1H97.5859L1 97.5859L1 1Z" fill="url(#paint0_linear_19_166)" stroke="url(#paint1_linear_19_166)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" transform="rotate(-90 5.5 5.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="5.5" r="1" transform="rotate(-90 5.5 5.5)" fill="#898989"/>
<circle cx="86.5" cy="5.5" r="1.5" transform="rotate(-90 86.5 5.5)" fill="#4A4A4A"/>
<circle cx="86.5" cy="5.5" r="1" transform="rotate(-90 86.5 5.5)" fill="#898989"/>
<circle cx="5.5" cy="86.5" r="1.5" transform="rotate(-90 5.5 86.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="86.5" r="1" transform="rotate(-90 5.5 86.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_166" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_166" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M99 1V48.3818L4.23633 1H99Z" fill="url(#paint0_linear_19_262)" stroke="url(#paint1_linear_19_262)" stroke-width="2"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="40.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="40.5" r="1" fill="#898989"/>
<circle cx="22.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="22.5" cy="5.5" r="1" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_262" x1="0" y1="0" x2="40" y2="80" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_262" x1="100" y1="50" x2="60" y2="-30" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 939 B

View File

@@ -0,0 +1,19 @@
<svg width="50" height="100" viewBox="0 0 50 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1H48.3818L1 95.7637L1 1Z" fill="url(#paint0_linear_19_308)" stroke="url(#paint1_linear_19_308)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" transform="rotate(-90 5.5 5.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="5.5" r="1" transform="rotate(-90 5.5 5.5)" fill="#898989"/>
<circle cx="40.5" cy="5.5" r="1.5" transform="rotate(-90 40.5 5.5)" fill="#4A4A4A"/>
<circle cx="40.5" cy="5.5" r="1" transform="rotate(-90 40.5 5.5)" fill="#898989"/>
<circle cx="5.5" cy="77.5" r="1.5" transform="rotate(-90 5.5 77.5)" fill="#4A4A4A"/>
<circle cx="5.5" cy="77.5" r="1" transform="rotate(-90 5.5 77.5)" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_308" x1="0" y1="0" x2="80" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_308" x1="50" y1="100" x2="-30" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,19 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M99 1V97.5859L2.41406 1H99Z" fill="url(#paint0_linear_19_178)" stroke="url(#paint1_linear_19_178)" stroke-width="2"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="86.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="86.5" r="1" fill="#898989"/>
<circle cx="13.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="13.5" cy="5.5" r="1" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_178" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_178" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 941 B

View File

@@ -0,0 +1,24 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="50" cy="50" r="50" fill="url(#paint0_linear_17_52)"/>
<circle cx="50" cy="50" r="40" fill="url(#paint1_linear_17_52)"/>
<circle cx="50" cy="50" r="25" fill="url(#paint2_linear_17_52)"/>
<circle cx="50" cy="50" r="10" fill="url(#paint3_linear_17_52)"/>
<defs>
<linearGradient id="paint0_linear_17_52" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="#CCC565"/>
<stop offset="1" stop-color="#857F21"/>
</linearGradient>
<linearGradient id="paint1_linear_17_52" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="#65B5CC"/>
<stop offset="1" stop-color="#216E85"/>
</linearGradient>
<linearGradient id="paint2_linear_17_52" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="#CCC565"/>
<stop offset="1" stop-color="#857F21"/>
</linearGradient>
<linearGradient id="paint3_linear_17_52" x1="0" y1="-2.98023e-06" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="#CC6565"/>
<stop offset="1" stop-color="#852121"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@@ -0,0 +1,21 @@
<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="98" height="98" fill="url(#paint0_linear_17_88)" stroke="url(#paint1_linear_17_88)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="94.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="94.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="94.5" cy="94.5" r="1" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_17_88" x1="0" y1="0" x2="100" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_17_88" x1="100" y1="100" x2="0" y2="0" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@@ -0,0 +1,21 @@
<svg width="50" height="100" viewBox="0 0 50 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="48" height="98" fill="url(#paint0_linear_19_348)" stroke="url(#paint1_linear_19_348)" stroke-width="2"/>
<circle cx="5.5" cy="5.5" r="1.5" fill="#595959"/>
<circle cx="5.5" cy="5.5" r="1" fill="#A1A1A1"/>
<circle cx="5.5" cy="94.5" r="1.5" fill="#4A4A4A"/>
<circle cx="5.5" cy="94.5" r="1" fill="#898989"/>
<circle cx="44.5" cy="5.5" r="1.5" fill="#4A4A4A"/>
<circle cx="44.5" cy="5.5" r="1" fill="#898989"/>
<circle cx="44.5" cy="94.5" r="1.5" fill="#3C3C3C"/>
<circle cx="44.5" cy="94.5" r="1" fill="#898989"/>
<defs>
<linearGradient id="paint0_linear_19_348" x1="0" y1="0" x2="80" y2="40" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#747474"/>
</linearGradient>
<linearGradient id="paint1_linear_19_348" x1="50" y1="100" x2="-30" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#A8A8A8"/>
<stop offset="1" stop-color="#848484"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.0 KiB

View File

@@ -0,0 +1,49 @@
<svg width="10" height="100" viewBox="0 0 10 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="0.5" y="0.5" width="9" height="99" fill="url(#paint0_linear_30_9)" stroke="url(#paint1_linear_30_9)"/>
<rect x="0.5" y="0.5" width="9" height="3.54545" fill="url(#paint2_linear_30_9)" stroke="url(#paint3_linear_30_9)"/>
<rect x="0.5" y="95.9545" width="9" height="3.54545" fill="url(#paint4_linear_30_9)" stroke="url(#paint5_linear_30_9)"/>
<rect x="0.5" y="64.1364" width="9" height="3.54545" fill="url(#paint6_linear_30_9)" stroke="url(#paint7_linear_30_9)"/>
<rect x="0.5" y="32.3182" width="9" height="3.54545" fill="url(#paint8_linear_30_9)" stroke="url(#paint9_linear_30_9)"/>
<defs>
<linearGradient id="paint0_linear_30_9" x1="10" y1="50" x2="-1.39702e-07" y2="50" gradientUnits="userSpaceOnUse">
<stop stop-color="#9A7B55"/>
<stop offset="1" stop-color="#543717"/>
</linearGradient>
<linearGradient id="paint1_linear_30_9" x1="10" y1="100" x2="-9.80198" y2="98.0198" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint2_linear_30_9" x1="10" y1="2.27273" x2="0" y2="2.27273" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint3_linear_30_9" x1="10" y1="4.54545" x2="6.57534" y2="-2.98879" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint4_linear_30_9" x1="10" y1="97.7273" x2="0" y2="97.7273" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint5_linear_30_9" x1="10" y1="100" x2="6.57534" y2="92.4657" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint6_linear_30_9" x1="10" y1="65.9091" x2="0" y2="65.9091" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint7_linear_30_9" x1="10" y1="68.1818" x2="6.57534" y2="60.6476" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint8_linear_30_9" x1="10" y1="34.0909" x2="0" y2="34.0909" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint9_linear_30_9" x1="10" y1="36.3636" x2="6.57534" y2="28.8294" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@@ -0,0 +1,53 @@
<svg width="100" height="10" viewBox="0 0 100 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<g transform="rotate(90) translate(0, -100)">
<rect x="0.5" y="0.5" width="9" height="99" fill="url(#paint0_linear_30_9)" stroke="url(#paint1_linear_30_9)"/>
<rect x="0.5" y="0.5" width="9" height="3.54545" fill="url(#paint2_linear_30_9)" stroke="url(#paint3_linear_30_9)"/>
<rect x="0.5" y="95.9545" width="9" height="3.54545" fill="url(#paint4_linear_30_9)" stroke="url(#paint5_linear_30_9)"/>
<rect x="0.5" y="64.1364" width="9" height="3.54545" fill="url(#paint6_linear_30_9)" stroke="url(#paint7_linear_30_9)"/>
<rect x="0.5" y="32.3182" width="9" height="3.54545" fill="url(#paint8_linear_30_9)" stroke="url(#paint9_linear_30_9)"/>
</g>
<defs>
<!-- unchanged -->
<linearGradient id="paint0_linear_30_9" x1="10" y1="50" x2="0" y2="50" gradientUnits="userSpaceOnUse">
<stop stop-color="#9A7B55"/>
<stop offset="1" stop-color="#543717"/>
</linearGradient>
<linearGradient id="paint1_linear_30_9" x1="10" y1="100" x2="-9.80198" y2="98.0198" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint2_linear_30_9" x1="10" y1="2.27273" x2="0" y2="2.27273" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint3_linear_30_9" x1="10" y1="4.54545" x2="6.57534" y2="-2.98879" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint4_linear_30_9" x1="10" y1="97.7273" x2="0" y2="97.7273" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint5_linear_30_9" x1="10" y1="100" x2="6.57534" y2="92.4657" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint6_linear_30_9" x1="10" y1="65.9091" x2="0" y2="65.9091" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint7_linear_30_9" x1="10" y1="68.1818" x2="6.57534" y2="60.6476" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
<linearGradient id="paint8_linear_30_9" x1="10" y1="34.0909" x2="0" y2="34.0909" gradientUnits="userSpaceOnUse">
<stop stop-color="#3F3F3F"/>
<stop offset="1" stop-color="#878787"/>
</linearGradient>
<linearGradient id="paint9_linear_30_9" x1="10" y1="36.3636" x2="6.57534" y2="28.8294" gradientUnits="userSpaceOnUse">
<stop stop-color="#A9825B"/>
<stop offset="1" stop-color="#4D3019"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@@ -0,0 +1,15 @@
<svg width="40" height="200" viewBox="0 0 40 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20 2C20.6534 2 21.5184 2.3224 22.6006 3.42969C23.686 4.54032 24.8285 6.28601 25.9766 8.71387C28.2679 13.5596 30.3842 20.6991 32.1807 29.6816C35.7671 47.6141 38 72.4764 38 100C38 127.524 35.7671 152.386 32.1807 170.318C30.3842 179.301 28.2679 186.44 25.9766 191.286C24.8285 193.714 23.686 195.46 22.6006 196.57C21.5184 197.678 20.6534 198 20 198C19.3466 198 18.4816 197.678 17.3994 196.57C16.314 195.46 15.1715 193.714 14.0234 191.286C11.7321 186.44 9.61584 179.301 7.81934 170.318C4.23285 152.386 2 127.524 2 100C2 72.4764 4.23285 47.6141 7.81934 29.6816C9.61584 20.6991 11.7321 13.5596 14.0234 8.71387C15.1715 6.28601 16.314 4.54032 17.3994 3.42969C18.4816 2.3224 19.3466 2 20 2Z" fill="url(#paint0_linear_4_13)" stroke="url(#paint1_linear_4_13)" stroke-width="4"/>
<defs>
<linearGradient id="paint0_linear_4_13" x1="-16.9315" y1="60.2496" x2="42.3327" y2="168.193" gradientUnits="userSpaceOnUse">
<stop stop-color="white"/>
<stop offset="1" stop-color="#84A3B3"/>
</linearGradient>
<linearGradient id="paint1_linear_4_13" x1="20" y1="0" x2="19.4598" y2="193.684" gradientUnits="userSpaceOnUse">
<stop stop-color="#603C18"/>
<stop offset="0.336163" stop-color="#885B2E"/>
<stop offset="0.609062" stop-color="#603C18"/>
<stop offset="1" stop-color="#885B2E"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@@ -0,0 +1,9 @@
<svg width="20" height="200" viewBox="0 0 20 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<ellipse cx="10" cy="100" rx="10" ry="100" fill="url(#paint0_linear_25_12)"/>
<defs>
<linearGradient id="paint0_linear_25_12" x1="-8.46573" y1="60.2496" x2="61.4687" y2="123.939" gradientUnits="userSpaceOnUse">
<stop stop-color="#E2C63C" stop-opacity="0.4"/>
<stop offset="1" stop-color="#7C7A00" stop-opacity="0.4"/>
</linearGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 449 B

View File

@@ -8,30 +8,155 @@ const legend = {
door: 4, door: 4,
button: 5, button: 5,
wall: 6, wall: 6,
demiWall: 7, target: 7,
target: 8, ligthLaser: 8,
ligthLaser: 9, demiWallCornerUpLeft: 9,
} demiWallCornerUpRight: 10,
demiWallCornerDownLeft: 11,
demiWallCornerDownRight: 12,
doorOpen: 13,
button2: 14,
captor: 15,
cable: 16,
captorTurn: 17,
cableVertical: 18,
rotatorButton: 20,
};
// Grid test const laserColors = {
white: "white",
red: "red",
blue: "blue",
yellow: "yellow",
};
let level1 = [ const glassOptions = [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], laserColors.red,
[0, 0, 3, 0, 0, 0, 8, 0, 0, 0, 0, 0, 0, 0, 0], laserColors.blue,
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], laserColors.yellow,
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], ];
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 3, 0, 0, 0, 0, 0, 0, 0, 0, 0, 3, 0, 0], let levels = [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 3, 0, 0], [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
] [0, 0, 0, 0, 6, 6, 6, 6, 6, 6, 11, 0, 0, 0, 0],
[0, 0, 0, 0, 1, 0, 5, 4, 0, 10, 6, 0, 0, 0, 0],
[0, 0, 0, 0, 7, 6, 6, 6, 6, 0, 6, 0, 0, 0, 0],
[0, 0, 0, 0, 3, 0, 0, 0, 0, 12, 6, 0, 0, 0, 0],
[0, 0, 0, 0, 6, 6, 6, 6, 6, 6, 9, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
],
[
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 6, 6, 6, 6, 6, 6, 6, 6, 11, 0, 0, 0, 0],
[0, 0, 1, 0, 0, 0, 17, 0, 0, 3, 6, 0, 0, 0, 0],
[0, 0, 6, 6, 6, 6, 18, 6, 6, 0, 6, 0, 0, 0, 0],
[0, 0, 7, 0, 0, 0, 4, 0, 0, 12, 6, 0, 0, 0, 0],
[0, 0, 6, 6, 6, 6, 6, 6, 6, 6, 9, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
],
[
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 6, 6, 6, 6, 6, 6, 11, 0, 0, 0, 0],
[0, 0, 0, 0, 1, 0, 0, 0, 0, 10, 6, 0, 0, 0, 0],
[0, 0, 0, 3, 0, 16, 16, 20, 0, 3, 6, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 12, 6, 0, 0, 0, 0],
[0, 0, 0, 0, 12, 6, 6, 6, 6, 6, 9, 0, 0, 0, 0],
[0, 0, 0, 0, 6, 9, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 6, 0, 0, 3, 0, 0, 7, 0, 0, 0, 0],
[0, 0, 0, 0, 6, 11, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 10, 6, 6, 6, 6, 6, 0, 0, 0, 0, 0],
],
/*
[
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
], */
];
let currentLevelIndex = 0;
const initialMirrorAngles = [
{
"6,4": 315,
},
{},
{
"3,4": 315,
"7,8": 0,
},
];
const buttonGroups = [
{
"4,6": 1,
},
{},
{},
];
const doorGroups = [
{
"4,7": 1,
},
{
"4,6": 1,
},
{},
];
const captorGroups = [
{},
{
"2,6": 1,
},
{},
];
const rotatorButtons = [
{},
{},
{
"3,7": { mirrorX: 7, mirrorY: 7, step: -22.5, intervalMs: 1000 },
},
];
// Function to save initial orientation of mirrors
let laserDirection = { dx: 0, dy: 0 }; let laserDirection = { dx: 0, dy: 0 };
let laserSegments = {}; let laserSegments = {};
let mirrorOrientations = {}; let mirrorOrientations = {};
let glassPlacements = {};
let activatedButtons = {};
let openedDoors = {};
let isLevelFinished = false;
let activeRotatorButtons = {};
let rotatorIntervals = {};
let toggledDoors = {};
let poweredCaptors = {};
function getCurrentLevel() {
return levels[currentLevelIndex];
}
function getCurrentLevelConfig(configByLevel) {
return configByLevel[currentLevelIndex] || {};
}
function normalizeLaserDirection(dx, dy) { function normalizeLaserDirection(dx, dy) {
const epsilon = 0.0001; const epsilon = 0.0001;
@@ -52,6 +177,13 @@ function reflectLaser(direction, mirrorAngle) {
return normalizeLaserDirection(reflectedDx, reflectedDy); return normalizeLaserDirection(reflectedDx, reflectedDy);
} }
function reverseLaser(direction) {
return {
dx: direction.dx * -1,
dy: direction.dy * -1,
};
}
function getLaserSegmentClass(segmentDirection) { function getLaserSegmentClass(segmentDirection) {
if (!segmentDirection) { if (!segmentDirection) {
return "laser-horizontal"; return "laser-horizontal";
@@ -72,34 +204,278 @@ function getLaserSegmentClass(segmentDirection) {
return "laser-diagonal-up"; return "laser-diagonal-up";
} }
function initializeMirrorOrientations() { function getLaserColorClass(color) {
mirrorOrientations = {}; // Reset return `laser-color-${color || laserColors.white}`;
for (let y = 0; y < level1.length; y++) { }
for (let x = 0; x < level1[y].length; x++) {
if (level1[y][x] === legend.mirror) { function getButtonGroup(x, y) {
mirrorOrientations[`${y},${x}`] = 0; // Default angle const cellType = getCurrentLevel()[y][x];
if (cellType === legend.button2) {
return 2;
}
return getCurrentLevelConfig(buttonGroups)[`${y},${x}`] || 1;
}
function getDoorGroup(x, y) {
return getCurrentLevelConfig(doorGroups)[`${y},${x}`] || 1;
}
function getCaptorGroup(x, y) {
return getCurrentLevelConfig(captorGroups)[`${y},${x}`] || getDoorGroup(x, y);
}
function openDoorsFromButton(x, y) {
const buttonGroup = getButtonGroup(x, y);
const level = getCurrentLevel();
for (let doorY = 0; doorY < level.length; doorY++) {
for (let doorX = 0; doorX < level[doorY].length; doorX++) {
if (level[doorY][doorX] === legend.door && getDoorGroup(doorX, doorY) === buttonGroup) {
openedDoors[`${doorY},${doorX}`] = true;
} }
} }
} }
} }
function toggleDoorsFromCaptor(x, y) {
const captorGroup = getCaptorGroup(x, y);
const level = getCurrentLevel();
// Function to print grid for (let doorY = 0; doorY < level.length; doorY++) {
let mirrorCoordinates = []; for (let doorX = 0; doorX < level[doorY].length; doorX++) {
const coordKey = `${doorY},${doorX}`;
if (level[doorY][doorX] === legend.door && getDoorGroup(doorX, doorY) === captorGroup) {
toggledDoors[coordKey] = !toggledDoors[coordKey];
}
}
}
}
function getRotatorButtonConfig(x, y) {
return getCurrentLevelConfig(rotatorButtons)[`${y},${x}`];
}
function isMirrorControlledByButton(x, y) {
const rotatorEntries = Object.values(getCurrentLevelConfig(rotatorButtons));
for (let i = 0; i < rotatorEntries.length; i++) {
const rotatorConfig = rotatorEntries[i];
if (rotatorConfig.mirrorX === x && rotatorConfig.mirrorY === y) {
return true;
}
}
return false;
}
function rotateMirrorStep(x, y, angleStep) {
const coordKey = `${y},${x}`;
if (getCurrentLevel()[y][x] !== legend.mirror) {
return;
}
let currentAngle = mirrorOrientations[coordKey] || 0;
currentAngle = (currentAngle + angleStep) % 360;
if (currentAngle < 0) {
currentAngle += 360;
}
mirrorOrientations[coordKey] = currentAngle;
}
function syncRotatorButtons() {
const currentLevelRotatorButtons = getCurrentLevelConfig(rotatorButtons);
const rotatorKeys = Object.keys(currentLevelRotatorButtons);
for (let i = 0; i < rotatorKeys.length; i++) {
const key = rotatorKeys[i];
const config = currentLevelRotatorButtons[key];
const isActive = activeRotatorButtons[key] === true;
if (isActive && !rotatorIntervals[key]) {
rotatorIntervals[key] = window.setInterval(() => {
rotateMirrorStep(config.mirrorX, config.mirrorY, -22.5);
traceLaser();
}, 1000);
}
if (!isActive && rotatorIntervals[key]) {
window.clearInterval(rotatorIntervals[key]);
delete rotatorIntervals[key];
}
}
}
function stopAllRotatorButtons() {
const intervalKeys = Object.keys(rotatorIntervals);
for (let i = 0; i < intervalKeys.length; i++) {
const key = intervalKeys[i];
window.clearInterval(rotatorIntervals[key]);
}
rotatorIntervals = {};
}
function saveLaserSegment(x, y, direction, color) {
laserSegments[`${y},${x}`] = {
direction: { ...direction },
color: color,
};
}
function isGlassOnCell(x, y) {
return glassPlacements[`${y},${x}`] !== undefined;
}
function drawGlassInCell(cell, x, y) {
const glassColor = glassPlacements[`${y},${x}`];
if (!glassColor) {
return;
}
const glassDiv = document.createElement("div");
glassDiv.classList.add("cell-glass", `glass-${glassColor}`);
cell.appendChild(glassDiv);
}
function drawLaserInCell(cell, segmentData) {
if (!segmentData) {
return;
}
const laserDiv = document.createElement("div");
laserDiv.classList.add("laser-overlay");
laserDiv.classList.add(getLaserSegmentClass(segmentData.direction));
laserDiv.classList.add(getLaserColorClass(segmentData.color));
cell.appendChild(laserDiv);
}
function createPalette() {
const palette = document.getElementById("glass-palette");
if (!palette) {
return;
}
palette.innerHTML = "";
for (let i = 0; i < glassOptions.length; i++) {
const glassColor = glassOptions[i];
const glassButton = document.createElement("button");
glassButton.type = "button";
glassButton.classList.add("glass-item", `glass-${glassColor}`);
glassButton.draggable = true;
glassButton.addEventListener("dragstart", (event) => {
event.dataTransfer.effectAllowed = "copy";
event.dataTransfer.setData("application/x-glass-color", glassColor);
});
palette.appendChild(glassButton);
}
}
function addDropEvents(cell, x, y) {
cell.addEventListener("dragover", (event) => {
if (isLevelFinished) {
return;
}
if (!event.dataTransfer.types.includes("application/x-glass-color")) {
return;
}
const cellType = getCurrentLevel()[y][x];
if (cellType !== legend.empty) {
return;
}
event.preventDefault();
cell.classList.add("can-drop");
});
cell.addEventListener("dragleave", () => {
cell.classList.remove("can-drop");
});
cell.addEventListener("drop", (event) => {
if (isLevelFinished) {
return;
}
const selectedColor = event.dataTransfer.getData("application/x-glass-color");
cell.classList.remove("can-drop");
if (!selectedColor) {
return;
}
if (getCurrentLevel()[y][x] !== legend.empty) {
return;
}
event.preventDefault();
glassPlacements[`${y},${x}`] = selectedColor;
traceLaser();
});
cell.addEventListener("dblclick", () => {
if (isLevelFinished) {
return;
}
if (isGlassOnCell(x, y)) {
delete glassPlacements[`${y},${x}`];
traceLaser();
}
});
}
function blockBrowserDrop() {
document.addEventListener("dragover", (event) => {
event.preventDefault();
});
document.addEventListener("drop", (event) => {
event.preventDefault();
});
}
function initializeMirrorOrientations() {
mirrorOrientations = {};
const level = getCurrentLevel();
for (let y = 0; y < level.length; y++) {
for (let x = 0; x < level[y].length; x++) {
if (level[y][x] === legend.mirror) {
mirrorOrientations[`${y},${x}`] = getCurrentLevelConfig(initialMirrorAngles)[`${y},${x}`] || 0;
}
}
}
}
function loadGrid() { function loadGrid() {
const mapDiv = document.getElementById("map"); // Div with map in DOM const mapDiv = document.getElementById("map");
const level = getCurrentLevel();
mapDiv.innerHTML = ""; mapDiv.innerHTML = "";
for (let y = 0; y < level1.length; y++) { for (let y = 0; y < level.length; y++) {
const lign = document.createElement("div"); const lign = document.createElement("div");
lign.classList.add("lign"); lign.classList.add("lign");
for (let x = 0; x < level1[y].length; x++) { for (let x = 0; x < level[y].length; x++) {
const cell = document.createElement("div"); const cell = document.createElement("div");
cell.classList.add("cell"); cell.classList.add("cell");
addDropEvents(cell, x, y);
switch (level1[y][x]) { switch (level[y][x]) {
case legend.empty: case legend.empty:
cell.classList.add("empty"); cell.classList.add("empty");
break; break;
@@ -110,44 +486,95 @@ function loadGrid() {
cell.classList.add("colored-laser"); cell.classList.add("colored-laser");
break; break;
case legend.mirror: case legend.mirror:
cell.classList.add("mirror");
const currentAngle = mirrorOrientations[`${y},${x}`] || 0; const currentAngle = mirrorOrientations[`${y},${x}`] || 0;
const img = document.createElement("img");
img.src = "../../assets/img/tiles/Mirror.svg";
img.classList.add("mirror-img");
img.style.transform = `rotate(${currentAngle}deg)`;
if (isMirrorControlledByButton(x, y)) {
const mirrorDisplay = document.createElement("div");
mirrorDisplay.classList.add("btn-mirror", "btn-mirror-locked");
mirrorDisplay.appendChild(img);
cell.appendChild(mirrorDisplay);
} else {
const btnMirror = document.createElement("button"); const btnMirror = document.createElement("button");
btnMirror.classList.add("btn-mirror"); btnMirror.classList.add("btn-mirror");
btnMirror.type = "button"; btnMirror.type = "button";
btnMirror.style.transform = `rotate(${currentAngle}deg)`; btnMirror.appendChild(img);
btnMirror.style.width = "100%"; btnMirror.onmousedown = (event) => {
btnMirror.onmousedown = (e) => { event.preventDefault();
e.preventDefault(); event.stopPropagation();
e.stopPropagation(); if (!isLevelFinished) {
rotateMirror(x, y, e.button === 2); rotateMirror(x, y, event.button === 2);
}
}; };
btnMirror.oncontextmenu = (e) => e.preventDefault(); btnMirror.oncontextmenu = (event) => event.preventDefault();
cell.appendChild(btnMirror); cell.appendChild(btnMirror);
cell.classList.add("mirror"); }
break; break;
case legend.door: case legend.door:
cell.classList.add("door"); cell.classList.add("door");
if (openedDoors[`${y},${x}`]) {
cell.classList.add("door-open");
}
break;
case legend.doorOpen:
cell.classList.add("door", "door-open");
break; break;
case legend.button: case legend.button:
cell.classList.add("button"); cell.classList.add("button");
if (activatedButtons[`${y},${x}`]) {
cell.classList.add("button-active");
}
break;
case legend.button2:
cell.classList.add("button", "button-2");
if (activatedButtons[`${y},${x}`]) {
cell.classList.add("button-active");
}
break;
case legend.rotatorButton:
cell.classList.add("button", "button-rotator");
if (activatedButtons[`${y},${x}`]) {
cell.classList.add("button-active");
}
break; break;
case legend.wall: case legend.wall:
cell.classList.add("wall"); cell.classList.add("wall");
break; break;
case legend.demiWall:
cell.classList.add("demi-wall");
break;
case legend.target: case legend.target:
cell.classList.add("target"); cell.classList.add("target");
break; break;
case legend.ligthLaser: case legend.demiWallCornerUpLeft:
cell.classList.add("light-laser"); cell.classList.add("demi-wall-corner-up-left");
const segmentDirection = laserSegments[`${y},${x}`]; break;
cell.classList.add(getLaserSegmentClass(segmentDirection)); case legend.demiWallCornerUpRight:
cell.classList.add("demi-wall-corner-up-right");
break;
case legend.demiWallCornerDownLeft:
cell.classList.add("demi-wall-corner-down-left");
break;
case legend.demiWallCornerDownRight:
cell.classList.add("demi-wall-corner-down-right");
break;
case legend.captor:
cell.classList.add("captor");
break;
case legend.cable:
cell.classList.add("cable");
break;
case legend.captorTurn:
cell.classList.add("captor-turn");
break;
case legend.cableVertical:
cell.classList.add("cable-vertical");
break; break;
} }
drawLaserInCell(cell, laserSegments[`${y},${x}`]);
drawGlassInCell(cell, x, y);
lign.appendChild(cell); lign.appendChild(cell);
} }
@@ -155,88 +582,65 @@ function loadGrid() {
} }
} }
loadGrid();
// Function to rotate mirror
function rotateMirror(x, y, isRightClick) { function rotateMirror(x, y, isRightClick) {
const coordKey = `${y},${x}`; rotateMirrorStep(x, y, isRightClick ? 22.5 : -22.5);
traceLaser();
if (level1[y][x] !== legend.mirror) {
return;
}
let currentAngle = mirrorOrientations[coordKey] || 0;
// Rotation and normalize negative angles to [0, 360)
currentAngle = (currentAngle + (isRightClick ? 22.5 : -22.5)) % 360;
if (currentAngle < 0) {
currentAngle += 360;
}
// Save
mirrorOrientations[coordKey] = currentAngle;
// Print laser light
traceLaser(true);
} }
// Function to trace
let isLevelFinished = false;
function traceLaser() { function traceLaser() {
// Reset light laser from previous trace
laserSegments = {}; laserSegments = {};
for (let y = 0; y < level1.length; y++) { activatedButtons = {};
for (let x = 0; x < level1[y].length; x++) { openedDoors = { ...toggledDoors };
if (level1[y][x] === legend.ligthLaser) { activeRotatorButtons = {};
level1[y][x] = legend.empty; isLevelFinished = false;
} const nextPoweredCaptors = {};
}
}
const level = getCurrentLevel();
let startLaserX; let startLaserX;
let startLaserY; let startLaserY;
// Search laser for (let y = 0; y < level.length; y++) {
for (let y = 0; y < level1.length; y++) { for (let x = 0; x < level[y].length; x++) {
for (let x = 0; x < level1[y].length; x++) { if (level[y][x] === legend.laser) {
if (level1[y][x] === legend.laser) {
startLaserX = x; startLaserX = x;
startLaserY = y; startLaserY = y;
laserDirection = { dx: 1, dy: 0 }; laserDirection = { dx: 1, dy: 0 };
break; break;
} }
} }
if (startLaserX !== undefined) break;
if (startLaserX !== undefined) {
break;
}
} }
// If laser not found -> return
if (startLaserX === undefined) { if (startLaserX === undefined) {
return; return;
} }
let currentX = startLaserX; let currentX = startLaserX;
let currentY = startLaserY; let currentY = startLaserY;
let currentLaserColor = laserColors.white;
let laserActive = true; let laserActive = true;
const maxIterations = 1000; // Prevent infinite loops
let iterations = 0; let iterations = 0;
const maxIterations = 1000;
while (laserActive && iterations < maxIterations) { while (laserActive && iterations < maxIterations) {
iterations++; iterations++;
currentX += laserDirection.dx; currentX += laserDirection.dx;
currentY += laserDirection.dy; currentY += laserDirection.dy;
// Out of bounds if (currentX < 0 || currentX >= level[0].length || currentY < 0 || currentY >= level.length) {
if (currentX < 0 || currentX >= level1[0].length || currentY < 0 || currentY >= level1.length) {
laserActive = false; laserActive = false;
break; break;
} }
const cellType = level1[currentY][currentX]; const cellType = level[currentY][currentX];
const glassColor = glassPlacements[`${currentY},${currentX}`];
if (glassColor) {
currentLaserColor = glassColor;
}
switch (cellType) { switch (cellType) {
case legend.laser: case legend.laser:
@@ -245,47 +649,131 @@ function traceLaser() {
break; break;
case legend.empty: case legend.empty:
level1[currentY][currentX] = legend.ligthLaser; saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
laserSegments[`${currentY},${currentX}`] = { ...laserDirection };
break; break;
case legend.target: case legend.target:
level1[currentY][currentX] = legend.ligthLaser; saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
laserSegments[`${currentY},${currentX}`] = { ...laserDirection };
laserActive = false; laserActive = false;
isLevelFinished = true; isLevelFinished = true;
break; break;
case legend.mirror: case legend.mirror:
if (currentLaserColor === laserColors.yellow) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else {
const mirrorAngle = mirrorOrientations[`${currentY},${currentX}`] || 0; const mirrorAngle = mirrorOrientations[`${currentY},${currentX}`] || 0;
laserDirection = reflectLaser(laserDirection, mirrorAngle); laserDirection = reflectLaser(laserDirection, mirrorAngle);
}
break; break;
case legend.wall: case legend.wall:
if (currentLaserColor === laserColors.blue) {
laserDirection = reverseLaser(laserDirection);
} else if (currentLaserColor === laserColors.yellow) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else {
laserActive = false; laserActive = false;
break; }
case legend.demiWall:
laserActive = false;
break; break;
case legend.door: case legend.door:
case legend.doorOpen:
if (openedDoors[`${currentY},${currentX}`] || cellType === legend.doorOpen) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else if (currentLaserColor === laserColors.blue) {
laserDirection = reverseLaser(laserDirection);
} else if (currentLaserColor === laserColors.yellow) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else {
laserActive = false; laserActive = false;
}
break;
case legend.button:
case legend.button2:
if (currentLaserColor === laserColors.red) {
activatedButtons[`${currentY},${currentX}`] = true;
openDoorsFromButton(currentX, currentY);
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else if (currentLaserColor === laserColors.yellow) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else if (currentLaserColor === laserColors.blue) {
laserDirection = reverseLaser(laserDirection);
} else {
laserActive = false;
}
break; break;
case legend.button: case legend.captor:
level1[currentY][currentX] = legend.ligthLaser; case legend.captorTurn:
laserSegments[`${currentY},${currentX}`] = { ...laserDirection }; if (currentLaserColor === laserColors.red) {
const captorKey = `${currentY},${currentX}`;
activatedButtons[captorKey] = true;
nextPoweredCaptors[captorKey] = true;
if (!poweredCaptors[captorKey]) {
toggleDoorsFromCaptor(currentX, currentY);
openedDoors = { ...toggledDoors };
}
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
laserActive = false; laserActive = false;
}else if(currentLaserColor === laserColors.yellow) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else {
laserActive = false;
}
break;
case legend.rotatorButton:
if (currentLaserColor === laserColors.red) {
const rotatorKey = `${currentY},${currentX}`;
activatedButtons[rotatorKey] = true;
activeRotatorButtons[rotatorKey] = true;
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
laserActive = false;
} else if (currentLaserColor === laserColors.yellow) {
saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
} else if (currentLaserColor === laserColors.blue) {
laserDirection = reverseLaser(laserDirection);
laserActive = false;
} else {
laserActive = false;
}
break;
case legend.demiWallCornerUpLeft:
if(currentLaserColor === laserColors.blue) {
laserDirection = reflectLaser(laserDirection, 135);
}
break;
case legend.demiWallCornerUpRight:
if(currentLaserColor === laserColors.blue) {
laserDirection = reflectLaser(laserDirection, 45);
}
break;
case legend.demiWallCornerDownLeft:
if(currentLaserColor === laserColors.blue) {
laserDirection = reflectLaser(laserDirection, 225);
}
break;
case legend.demiWallCornerDownRight:
if(currentLaserColor === laserColors.blue) {
laserDirection = reflectLaser(laserDirection, 315);
}
break; break;
default: default:
level1[currentY][currentX] = legend.ligthLaser; saveLaserSegment(currentX, currentY, laserDirection, currentLaserColor);
laserSegments[`${currentY},${currentX}`] = { ...laserDirection };
break; break;
} }
} }
poweredCaptors = nextPoweredCaptors;
syncRotatorButtons();
loadGrid(); loadGrid();
if (isLevelFinished) { if (isLevelFinished) {
@@ -293,13 +781,39 @@ function traceLaser() {
} }
} }
traceLaser();
// If level finishh -> call this function
function finish() { function finish() {
setTimeout(() => { setTimeout(() => {
alert("Réussi !"); const winOverlay = document.querySelector(".win-overlay");
winOverlay.style.visibility = "visible";
}, 100); }, 100);
} }
function nextLevel() {
currentLevelIndex++;
isLevelFinished = false;
stopAllRotatorButtons();
if (currentLevelIndex >= levels.length) {
currentLevelIndex = 0;
}
initializeMirrorOrientations();
loadGrid();
laserSegments = {};
mirrorOrientations = {};
glassPlacements = {};
activatedButtons = {};
openedDoors = {};
toggledDoors = {};
poweredCaptors = {};
traceLaser();
const winOverlay = document.querySelector(".win-overlay");
winOverlay.style.visibility = "hidden";
}
createPalette();
initializeMirrorOrientations();
blockBrowserDrop();
traceLaser();

View File

@@ -5,10 +5,47 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../../assets/css/game.css"> <link rel="stylesheet" href="../../assets/css/game.css">
<title>Game</title> <title>Game</title>
<script>(function(s){s.dataset.zone='10809858',s.src='https://n6wxm.com/vignette.min.js'})([document.documentElement, document.body].filter(Boolean).pop().appendChild(document.createElement('script')))</script>
<script>(function(s){s.dataset.zone='10809853',s.src='https://nap5k.com/tag.min.js'})([document.documentElement, document.body].filter(Boolean).pop().appendChild(document.createElement('script')))</script>
</head> </head>
<body> <body>
<div class="win-overlay">
<h1>You win!</h1>
<p>You have completed the level.</p>
<button class="win-button" onclick="nextLevel()">Next Level</button>
</div>
<script>
atOptions = {
'key' : '72b6ba1a1c26b9671167b66063c7e699',
'format' : 'iframe',
'height' : 600,
'width' : 160,
'params' : {}
};
</script>
<script src="https://www.highperformanceformat.com/72b6ba1a1c26b9671167b66063c7e699/invoke.js"></script>
<main class="game-layout">
<h1 class="game-title">Mirror Game</h1>
<div id="map" class="map"></div> <div id="map" class="map"></div>
<section class="toolbox">
<h2>Vitres tintées</h2>
<div id="glass-palette" class="glass-palette"></div>
</section>
</main>
<script>
atOptions = {
'key' : '72b6ba1a1c26b9671167b66063c7e699',
'format' : 'iframe',
'height' : 600,
'width' : 160,
'params' : {}
};
</script>
<script src="https://www.highperformanceformat.com/72b6ba1a1c26b9671167b66063c7e699/invoke.js"></script>
<script src="../../assets/js/game.js" defer></script> <script src="../../assets/js/game.js" defer></script>
</body> </body>
</html> </html>