// Rôle : définit le rendu commun des icônes SVG. .ui-icon { display: block; width: 20px; height: 20px; background: currentColor; mask-position: center; mask-repeat: no-repeat; mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; } .ui-icon-open { mask-image: url("/static/icons/open.svg"); -webkit-mask-image: url("/static/icons/open.svg"); } .ui-icon-home { mask-image: url("/static/icons/home.svg"); -webkit-mask-image: url("/static/icons/home.svg"); } .ui-icon-enter { mask-image: url("/static/icons/enter.svg"); -webkit-mask-image: url("/static/icons/enter.svg"); } .ui-icon-zoom { mask-image: url("/static/icons/zoom.svg"); -webkit-mask-image: url("/static/icons/zoom.svg"); } .ui-icon-save { mask-image: url("/static/icons/save.svg"); -webkit-mask-image: url("/static/icons/save.svg"); } .ui-icon-info { mask-image: url("/static/icons/info.svg"); -webkit-mask-image: url("/static/icons/info.svg"); } .ui-icon-export { mask-image: url("/static/icons/export.svg"); -webkit-mask-image: url("/static/icons/export.svg"); } .ui-icon-import { mask-image: url("/static/icons/import.svg"); -webkit-mask-image: url("/static/icons/import.svg"); } .ui-icon-link { mask-image: url("/static/icons/link.svg"); -webkit-mask-image: url("/static/icons/link.svg"); } .ui-icon-settings { mask-image: url("/static/icons/settings.svg"); -webkit-mask-image: url("/static/icons/settings.svg"); } .ui-icon-tasklist { mask-image: url("/static/icons/tasklist.svg"); -webkit-mask-image: url("/static/icons/tasklist.svg"); } .ui-icon-edit { mask-image: url("/static/icons/edit.svg"); -webkit-mask-image: url("/static/icons/edit.svg"); } .ui-icon-add { mask-image: url("/static/icons/add.svg"); -webkit-mask-image: url("/static/icons/add.svg"); } .ui-icon-book { mask-image: url("/static/icons/book.svg"); -webkit-mask-image: url("/static/icons/book.svg"); } .ui-icon-copy { mask-image: url("/static/icons/copy.svg"); -webkit-mask-image: url("/static/icons/copy.svg"); } .ui-icon-calculator { mask-image: url("/static/icons/calculator.svg"); -webkit-mask-image: url("/static/icons/calculator.svg"); } .ui-icon-clock { mask-image: url("/static/icons/clock.svg"); -webkit-mask-image: url("/static/icons/clock.svg"); } .ui-icon-stopwatch { mask-image: url("/static/icons/stopwatch.svg"); -webkit-mask-image: url("/static/icons/stopwatch.svg"); } .ui-icon-hourglass { mask-image: url("/static/icons/hourglass.svg"); -webkit-mask-image: url("/static/icons/hourglass.svg"); } .ui-icon-play-circle { mask-image: url("/static/icons/play-circle.svg"); -webkit-mask-image: url("/static/icons/play-circle.svg"); } .ui-icon-pause-circle { mask-image: url("/static/icons/pause-circle.svg"); -webkit-mask-image: url("/static/icons/pause-circle.svg"); } .ui-icon-record-circle { mask-image: url("/static/icons/record-circle.svg"); -webkit-mask-image: url("/static/icons/record-circle.svg"); } .ui-icon-stop-circle { mask-image: url("/static/icons/stop-circle.svg"); -webkit-mask-image: url("/static/icons/stop-circle.svg"); } .ui-icon-map { mask-image: url("/static/icons/map.svg"); -webkit-mask-image: url("/static/icons/map.svg"); } .ui-icon-scrollable { mask-image: url("/static/icons/scrollable.svg"); -webkit-mask-image: url("/static/icons/scrollable.svg"); } .ui-icon-sort-time { mask-image: url("/static/icons/sort-time.svg"); -webkit-mask-image: url("/static/icons/sort-time.svg"); } .ui-icon-sound-mute { mask-image: url("/static/icons/sound-mute.svg"); -webkit-mask-image: url("/static/icons/sound-mute.svg"); } .ui-icon-sound-min { mask-image: url("/static/icons/sound-min.svg"); -webkit-mask-image: url("/static/icons/sound-min.svg"); } .ui-icon-sound-max { mask-image: url("/static/icons/sound-max.svg"); -webkit-mask-image: url("/static/icons/sound-max.svg"); } .ui-icon-toast-left { mask-image: url("/static/icons/toast-left.svg"); -webkit-mask-image: url("/static/icons/toast-left.svg"); } .ui-icon-toast-right { mask-image: url("/static/icons/toast-right.svg"); -webkit-mask-image: url("/static/icons/toast-right.svg"); } .ui-icon-hide { mask-image: url("/static/icons/hide.svg"); -webkit-mask-image: url("/static/icons/hide.svg"); } .ui-icon-eye-closed { mask-image: url("/static/icons/eye-closed.svg"); -webkit-mask-image: url("/static/icons/eye-closed.svg"); } .ui-icon-eye-open { mask-image: url("/static/icons/eye-open.svg"); -webkit-mask-image: url("/static/icons/eye-open.svg"); } .ui-icon-chevron-down { mask-image: url("/static/icons/chevron-down.svg"); -webkit-mask-image: url("/static/icons/chevron-down.svg"); } .ui-icon-chevron-up { mask-image: url("/static/icons/chevron-up.svg"); -webkit-mask-image: url("/static/icons/chevron-up.svg"); } .ui-icon-drag { mask-image: url("/static/icons/drag.svg"); -webkit-mask-image: url("/static/icons/drag.svg"); } .ui-icon-dropdown { mask-image: url("/static/icons/dropdown.svg"); -webkit-mask-image: url("/static/icons/dropdown.svg"); } .ui-icon-flip { mask-image: url("/static/icons/flip.svg"); -webkit-mask-image: url("/static/icons/flip.svg"); } .ui-icon-rows { mask-image: url("/static/icons/rows.svg"); -webkit-mask-image: url("/static/icons/rows.svg"); } .ui-icon-columns { mask-image: url("/static/icons/columns.svg"); -webkit-mask-image: url("/static/icons/columns.svg"); } .ui-icon-add-row { mask-image: url("/static/icons/add-row.svg"); -webkit-mask-image: url("/static/icons/add-row.svg"); } .ui-icon-add-column { mask-image: url("/static/icons/add-column.svg"); -webkit-mask-image: url("/static/icons/add-column.svg"); } .ui-icon-remove-row { mask-image: url("/static/icons/remove-row.svg"); -webkit-mask-image: url("/static/icons/remove-row.svg"); } .ui-icon-remove-column { mask-image: url("/static/icons/remove-column.svg"); -webkit-mask-image: url("/static/icons/remove-column.svg"); } .ui-icon-table { mask-image: url("/static/icons/table.svg"); -webkit-mask-image: url("/static/icons/table.svg"); } .ui-icon-close { mask-image: url("/static/icons/close.svg"); -webkit-mask-image: url("/static/icons/close.svg"); } .ui-icon-rubber { mask-image: url("/static/icons/rubber.svg"); -webkit-mask-image: url("/static/icons/rubber.svg"); } .ui-icon-refresh { mask-image: url("/static/icons/refresh.svg"); -webkit-mask-image: url("/static/icons/refresh.svg"); } .ui-icon-back { mask-image: url("/static/icons/back.svg"); -webkit-mask-image: url("/static/icons/back.svg"); } .ui-icon-fist { mask-image: url("/static/icons/fist.svg"); -webkit-mask-image: url("/static/icons/fist.svg"); } .ui-icon-foot { mask-image: url("/static/icons/foot.svg"); -webkit-mask-image: url("/static/icons/foot.svg"); } .ui-icon-boot { mask-image: url("/static/icons/boot.svg"); -webkit-mask-image: url("/static/icons/boot.svg"); } .ui-icon-chest-armor { mask-image: url("/static/icons/chest-armor.svg"); -webkit-mask-image: url("/static/icons/chest-armor.svg"); } .ui-icon-helmet { mask-image: url("/static/icons/helmet.svg"); -webkit-mask-image: url("/static/icons/helmet.svg"); } .ui-icon-glove { mask-image: url("/static/icons/glove.svg"); -webkit-mask-image: url("/static/icons/glove.svg"); } .ui-icon-grab { mask-image: url("/static/icons/grab.svg"); -webkit-mask-image: url("/static/icons/grab.svg"); } .ui-icon-sword { mask-image: url("/static/icons/sword.svg"); -webkit-mask-image: url("/static/icons/sword.svg"); } .ui-icon-shield { mask-image: url("/static/icons/shield.svg"); -webkit-mask-image: url("/static/icons/shield.svg"); } .ui-icon-gun { mask-image: url("/static/icons/gun.svg"); -webkit-mask-image: url("/static/icons/gun.svg"); } .ui-icon-earring { mask-image: url("/static/icons/earring.svg"); -webkit-mask-image: url("/static/icons/earring.svg"); } .ui-icon-necklace { mask-image: url("/static/icons/necklace.svg"); -webkit-mask-image: url("/static/icons/necklace.svg"); } .ui-icon-ring { mask-image: url("/static/icons/ring.svg"); -webkit-mask-image: url("/static/icons/ring.svg"); } .ui-icon-hammer { mask-image: url("/static/icons/hammer.svg"); -webkit-mask-image: url("/static/icons/hammer.svg"); } .ui-icon-jewel { mask-image: url("/static/icons/jewel.svg"); -webkit-mask-image: url("/static/icons/jewel.svg"); } .ui-icon-ball { mask-image: url("/static/icons/ball.svg"); -webkit-mask-image: url("/static/icons/ball.svg"); } .ui-icon-trash { mask-image: url("/static/icons/trashcan.svg"); -webkit-mask-image: url("/static/icons/trashcan.svg"); } .game-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-4); margin-top: var(--space-6); }