tech title icons

diff --git a/app/Models/Technique.php b/app/Models/Technique.php
index 446967125c8e98ebad935fb2a45d20cbeed1ada7..2eb0a941125434b8b68712f11ad3d2c164a08209 100644 (file)
--- a/app/Models/Technique.php
+++ b/app/Models/Technique.php
@@ -32,6 +32,7 @@ class Technique extends Model
                'index' => 'boolean',
                'requirements' => 'array',
                'rulesets' => 'array',
+               'title_icons' => 'array',
        ];
 
        protected $with = [

diff --git a/database/migrations/2023_07_28_095933_tech_title_icons.php b/database/migrations/2023_07_28_095933_tech_title_icons.php
new file mode 100644 (file)
index 0000000..8314b0e
--- /dev/null
+++ b/database/migrations/2023_07_28_095933_tech_title_icons.php
@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+       /**
+        * Run the migrations.
+        *
+        * @return void
+        */
+       public function up()
+       {
+               Schema::table('techniques', function(Blueprint $table) {
+                       $table->text('title_icons')->nullable()->default(null);
+               });
+       }
+
+       /**
+        * Reverse the migrations.
+        *
+        * @return void
+        */
+       public function down()
+       {
+               Schema::table('techniques', function(Blueprint $table) {
+                       $table->dropColumn('title_icons');
+               });
+       }
+};

diff --git a/resources/js/components/common/ZeldaIcon.js b/resources/js/components/common/ZeldaIcon.js
index 067dfbc2e986e4de3a5a3e37a835a29d72cb1cad..9194cde7fc2f58b250f2e021a58c47e59bde9910 100644 (file)
--- a/resources/js/components/common/ZeldaIcon.js
+++ b/resources/js/components/common/ZeldaIcon.js
@@ -88,14 +88,17 @@ const ZeldaIcon = ({ name }) => {
 
        const invert = name.startsWith('not-');
        const strippedName = invert ? name.substr(4) : name;
+       const src = getIconURL(strippedName);
        const title = t(`icon.zelda.${name}`);
 
        return <span className="zelda-icon">
-               <img
-                       alt={title}
-                       src={getIconURL(strippedName)}
-                       title={title}
-               />
+               {src ?
+                       <img
+                               alt={title}
+                               src={src}
+                               title={title}
+                       />
+               : null}
                {invert ?
                        <span className="strike">
                                <Icon.SLASH title="" />

diff --git a/resources/js/components/map/Popover.js b/resources/js/components/map/Popover.js
index 02d407061c5422a8b61538b706eeabaf83e093d0..7fbbcef0c3c2c6dc24705e14a2d5ff2e2c847478 100644 (file)
--- a/resources/js/components/map/Popover.js
+++ b/resources/js/components/map/Popover.js
@@ -3,6 +3,8 @@ import React from 'react';
 import { Card, ListGroup } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 
+import ZeldaIcon from '../common/ZeldaIcon';
+
 import {
        getLink,
        getRelations,
@@ -35,6 +37,13 @@ const Popover = ({ show, technique }) =>
                                                        title={getTranslation(r, 'short', i18n.language)}
                                                >
                                                        <Link to={getLink(r)}>
+                                                               {r.title_icons ?
+                                                                       <span className="tech-title-icons">
+                                                                               {r.title_icons.map(icon =>
+                                                                                       <ZeldaIcon key={icon} name={icon} />
+                                                                               )}
+                                                                       </span>
+                                                               : null}
                                                                {getTranslation(r, 'title', i18n.language)}
                                                        </Link>
                                                </ListGroup.Item>

diff --git a/resources/js/i18n/de.js b/resources/js/i18n/de.js
index 58732c5f60adbd8a2cf5ae1567e35a2134e4aee6..ae88eaa5ba34d017eaed84bfe9cc3db7594893c4 100644 (file)
--- a/resources/js/i18n/de.js
+++ b/resources/js/i18n/de.js
@@ -423,6 +423,7 @@ export default {
                                moonpearl: 'Moonpearl',
                                mushroom: 'Mushroom',
                                'not-flippers': 'Keine Flippers',
+                               'not-mirror': 'Kein Mirror',
                                'not-moonpearl': 'Keine Moonpearl',
                                powder: 'Powder',
                                quake: 'Quake',

diff --git a/resources/js/i18n/en.js b/resources/js/i18n/en.js
index 8976017684f96f71bb57bf8a9a8d2c371d34b39d..dc84f67e90c6421b008691b4871da1581d7d96df 100644 (file)
--- a/resources/js/i18n/en.js
+++ b/resources/js/i18n/en.js
@@ -423,6 +423,7 @@ export default {
                                moonpearl: 'Moonpearl',
                                mushroom: 'Mushroom',
                                'not-flippers': 'No Flippers',
+                               'not-mirror': 'No Mirror',
                                'not-moonpearl': 'No Moonpearl',
                                powder: 'Powder',
                                quake: 'Quake',

diff --git a/resources/sass/map.scss b/resources/sass/map.scss
index 3f8ae067d65ed629b4e6157ef051c07074ae4804..78c9a2b7ed36eb008e207810ba2d629df160ffcb 100644 (file)
--- a/resources/sass/map.scss
+++ b/resources/sass/map.scss
@@ -15,6 +15,10 @@
        &.hidden {
                display: none;
        }
+
+       .tech-title-icons {
+               margin-right: 1ex;
+       }
 }
 
 .pin-list {

diff --git a/resources/sass/techniques.scss b/resources/sass/techniques.scss
index eff0c62ee9ca1f7dbe04a2c5cd2f7101081bd524..55e3c7cad45052626f8c9393910a2c46752de2cd 100644 (file)
--- a/resources/sass/techniques.scss
+++ b/resources/sass/techniques.scss
@@ -61,6 +61,11 @@
        }
 }
 
+.tech-title-icons {
+       display: inline-flex;
+       vertical-align: middle;
+}
+
 .tech-outline {
        float: right;
 }