355 lines
8.7 KiB
SCSS
355 lines
8.7 KiB
SCSS
// 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);
|
|
}
|