RMB on image can redirect to separate page

mjkuranda · Aug 25, 2022 · bda3b79 · bda3b79
1 parent 4c3f6bf
commit bda3b79
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 13 deletions.
diff --git a/public/css/search.css b/public/css/search.css
@@ -46,8 +46,8 @@ form {
     padding-top: 0.5em;
 }
 #filters div ul > li > input[type="checkbox"] + label,
-#filters div ul > li > input[type="checkbox"] + img,
-#filters div ul > li > label > img,
+#filters div ul > li > input[type="checkbox"] + .img-link,
+#filters div ul > li > label > .img-link,
 #filters div ul > li > label > p {
     margin-left: 0.2em;
     cursor: pointer;
@@ -164,7 +164,7 @@ form {
     width: var(--h);
     height: var(--h);
 }
-.result-image > img {
+.result-image img {
     width: var(--h);
     height: var(--h);
     object-fit: cover;

diff --git a/src/classes/Meal.ts b/src/classes/Meal.ts
@@ -10,7 +10,6 @@ export enum Type {
 
 interface IMeal {
     format(): void;
-    toString(): string;
 }
 
 export default class Meal implements IMeal {
@@ -49,8 +48,4 @@ export default class Meal implements IMeal {
     public format(): void {
         console.log(`Meal "${this.name}".`);
     }
-
-    public toString(): string {
-        return JSON.stringify(this);
-    }
 }
diff --git a/views/layouts/search.handlebars b/views/layouts/search.handlebars
@@ -55,11 +55,13 @@
         {{#each meals as |meal| }}
         <div class="result-container flex-center">
             <div class="result-image">
-                {{#if meal.image}}
-                <img src="uploads/{{meal.image}}" alt="Zdjęcie posiłku o nazwie {{meal.title}}" />
-                {{else}}
-                <img src="icons/no-image.png" alt="Brak zdjęcia posiłku o nazwie {{meal.title}}" />
-                {{/if}}
+                <a class="img-link" href="/result/{{meal._id}}?{{sourceUrl}}" target="_blank">
+                    {{#if meal.image}}
+                    <img src="uploads/{{meal.image}}" alt="Zdjęcie posiłku o nazwie {{meal.title}}" />
+                    {{else}}
+                    <img src="icons/no-image.png" alt="Brak zdjęcia posiłku o nazwie {{meal.title}}" />
+                    {{/if}}
+                </a>
             </div>
             <div class="result-label">
                 <div class="result-description">