Design stuff shit
This commit is contained in:
parent
5dbf3d9af2
commit
23aefa268a
35 changed files with 5846 additions and 68 deletions
|
|
@ -1,5 +1,5 @@
|
||||||
<div class="note">
|
<div class="note">
|
||||||
{{!-- TODO: figure out how to make the entire note clickable for opening with something like {{on "click" (fn this.openFullView)}} --}}
|
<!-- TODO: figure out how to make the entire note clickable for opening with something like {{on "click" (fn this.openFullView)}} -->
|
||||||
<Note::UserHeader
|
<Note::UserHeader
|
||||||
@displayname="{{@note.displayname}}"
|
@displayname="{{@note.displayname}}"
|
||||||
@handle="@{{@note.username}}@{{@note.server}}"
|
@handle="@{{@note.username}}@{{@note.server}}"
|
||||||
|
|
@ -7,8 +7,11 @@
|
||||||
<Note::Content @content="{{@note.content}}" />
|
<Note::Content @content="{{@note.content}}" />
|
||||||
<div class="note-timestamps-container">
|
<div class="note-timestamps-container">
|
||||||
{{#if @note.editedAt}}
|
{{#if @note.editedAt}}
|
||||||
<p class="note-timestamp" id="note-edited-timestamp">Edited: {{moment-format @note.editedAt}}</p>
|
<p class="note-timestamp" id="note-edited-timestamp">Edited: {{moment-format @note.editedAt "MMM DD, YYYY H:mm"}}</p>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
<p class="note-timestamp" id="note-created-timestamp">Posted: {{moment-format @note.createdAt ""}}</p>
|
<p class="note-timestamp" id="note-created-timestamp">Posted: {{moment-format @note.createdAt "MMM DD, YYYY H:mm"}}</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="separator-horizontal" />
|
||||||
|
<!-- TODO: Hardcoded values here, make them dynamic -->
|
||||||
|
<Note::Interactions @boostCount="25" @totalLikeCount="300" @hasBoosted="true" @hasReacted="false" />
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -1,34 +1,34 @@
|
||||||
import { action } from "@ember/object";
|
import { action } from '@ember/object';
|
||||||
import Component from "@glimmer/component";
|
import Component from '@glimmer/component';
|
||||||
|
|
||||||
export interface NoteSignature {
|
export interface NoteSignature {
|
||||||
// The arguments accepted by the component
|
// The arguments accepted by the component
|
||||||
Args: {
|
Args: {
|
||||||
isInTimeline: boolean;
|
isInTimeline: boolean;
|
||||||
note: {
|
note: {
|
||||||
content: string;
|
content: string;
|
||||||
server: string;
|
server: string;
|
||||||
username: string;
|
username: string;
|
||||||
displayname: string;
|
displayname: string;
|
||||||
createdAt: number;
|
createdAt: number;
|
||||||
editedAt?: number;
|
editedAt?: number;
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
// Any blocks yielded by the component
|
// Any blocks yielded by the component
|
||||||
Blocks: {
|
Blocks: {
|
||||||
default: [];
|
default: [];
|
||||||
};
|
};
|
||||||
// The element to which `...attributes` is applied in the component template
|
// The element to which `...attributes` is applied in the component template
|
||||||
Element: null;
|
Element: null;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default class Note extends Component<NoteSignature> {
|
export default class Note extends Component<NoteSignature> {
|
||||||
@action
|
@action
|
||||||
openFullView() {
|
openFullView() {
|
||||||
if (this.args.isInTimeline) {
|
if (this.args.isInTimeline) {
|
||||||
alert("Would have opened note's own view");
|
alert("Would have opened note's own view");
|
||||||
} else {
|
} else {
|
||||||
console.log("Alread in note specific view, can't open it again");
|
console.log("Alread in note specific view, can't open it again");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
53
frontend-reactive/app/components/note/interactions.hbs
Normal file
53
frontend-reactive/app/components/note/interactions.hbs
Normal file
|
|
@ -0,0 +1,53 @@
|
||||||
|
<div class="resource-preload">
|
||||||
|
<link rel="preload" type="image" href="assets/svgs/reload-black.svg">
|
||||||
|
<link rel="preload" type="image" href="assets/svgs/reload-coloured.svg">
|
||||||
|
<link rel="preload" type="image" href="assets/svgs/heart-rainbow.svg">
|
||||||
|
<link rel="preload" type="image" href="assets/svgs/heart-black-outline.svg">
|
||||||
|
</div>
|
||||||
|
<div class="note-interactions-wrapper">
|
||||||
|
<div type="button" class="note-interactions-interaction-button" {{on "click" this.toggleBoost}}>
|
||||||
|
{{#if this.hasBoosted}}
|
||||||
|
<Svgs::ReloadOutline @class="note-interactions-interaction-icon"/>
|
||||||
|
{{else}}
|
||||||
|
<Svgs::ReloadColoured @class="note-interactions-interaction-icon"/>
|
||||||
|
{{/if}}
|
||||||
|
<p class="note-interactions-interaction-counter noselect">{{this.args.boostCount}}</p>
|
||||||
|
<EmberTooltip @text="Boost this note" @side="top-start"/>
|
||||||
|
</div>
|
||||||
|
<div class="note-interactions-interaction-button">
|
||||||
|
<div
|
||||||
|
type="button"
|
||||||
|
class="note-interactions-interactions-button-like"
|
||||||
|
aria-label="Like or unlike"
|
||||||
|
aria-description="Send a like reaction or retract the current reaction"
|
||||||
|
{{on "click" this.toggleDefaultLike}}
|
||||||
|
>
|
||||||
|
{{#if this.hasReacted}}
|
||||||
|
<Svgs::HeartOutline @class="note-interactions-interaction-icon"/>
|
||||||
|
{{else}}
|
||||||
|
<Svgs::HeartFilled @class="note-interactions-interaction-icon"/>
|
||||||
|
{{/if}}
|
||||||
|
<p class="note-interactions-interaction-counter noselect">{{this.args.totalLikeCount}}</p>
|
||||||
|
<EmberTooltip @text="Like this note"/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="note-interactions-interactions-button-custom"
|
||||||
|
aria-label="Send a custom reaction"
|
||||||
|
aria-description="Choose an emote and send that as custom reaction"
|
||||||
|
type="button"
|
||||||
|
{{on "click" this.openCustomReactionSelector}}
|
||||||
|
>
|
||||||
|
<Svgs::PlusBlack @class="note-interactions-interaction-icon"/>
|
||||||
|
<EmberTooltip @text="Send a custom reaction"/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="note-interactions-interactions-button-custom"
|
||||||
|
type="button"
|
||||||
|
aria-label="Expand existing reactions"
|
||||||
|
{{on "click" this.openAllReactions}}
|
||||||
|
>
|
||||||
|
<Svgs::ArrowDownBlack @class="note-interactions-interaction-icon"/>
|
||||||
|
<EmberTooltip @text="Expand reactions"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
53
frontend-reactive/app/components/note/interactions.ts
Normal file
53
frontend-reactive/app/components/note/interactions.ts
Normal file
|
|
@ -0,0 +1,53 @@
|
||||||
|
import { action } from "@ember/object";
|
||||||
|
import Component from "@glimmer/component";
|
||||||
|
import { tracked } from "@glimmer/tracking";
|
||||||
|
import isLandscape from "frontend-reactive/helpers/isLandscape";
|
||||||
|
|
||||||
|
export interface NoteInteractionsSignature {
|
||||||
|
// The arguments accepted by the component
|
||||||
|
Args: {
|
||||||
|
boostCount: number;
|
||||||
|
totalLikeCount: number;
|
||||||
|
reactions: {
|
||||||
|
[key: string]: number;
|
||||||
|
};
|
||||||
|
hasBoosted: boolean;
|
||||||
|
hasReacted: boolean;
|
||||||
|
};
|
||||||
|
// Any blocks yielded by the component
|
||||||
|
Blocks: {
|
||||||
|
default: [];
|
||||||
|
};
|
||||||
|
// The element to which `...attributes` is applied in the component template
|
||||||
|
Element: null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class NoteInteractions extends Component<NoteInteractionsSignature> {
|
||||||
|
@tracked hasBoosted = this.args.hasBoosted;
|
||||||
|
@tracked hasReacted = this.args.hasReacted;
|
||||||
|
@tracked expandReactions = false;
|
||||||
|
|
||||||
|
@action
|
||||||
|
toggleBoost() {
|
||||||
|
this.hasBoosted = !this.hasBoosted;
|
||||||
|
console.log("boosted", this.hasBoosted);
|
||||||
|
}
|
||||||
|
|
||||||
|
@action
|
||||||
|
toggleDefaultLike() {
|
||||||
|
this.hasReacted = !this.hasReacted;
|
||||||
|
console.log("reacted", this.hasReacted);
|
||||||
|
}
|
||||||
|
|
||||||
|
@action
|
||||||
|
openCustomReactionSelector() {
|
||||||
|
this.hasReacted = !this.hasReacted;
|
||||||
|
console.log("sent custom reaction", this.hasReacted);
|
||||||
|
}
|
||||||
|
|
||||||
|
@action
|
||||||
|
openAllReactions() {
|
||||||
|
console.log("Toggle all reactions overview");
|
||||||
|
this.expandReactions = !this.expandReactions;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
{{!--Source: https://www.iconpacks.net/free-icon/arrow-down-3101.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 90 24.25 c 0 -0.896 -0.342 -1.792 -1.025 -2.475 c -1.366 -1.367 -3.583 -1.367 -4.949 0 L 45 60.8 L 5.975 21.775 c -1.367 -1.367 -3.583 -1.367 -4.95 0 c -1.366 1.367 -1.366 3.583 0 4.95 l 41.5 41.5 c 1.366 1.367 3.583 1.367 4.949 0 l 41.5 -41.5 C 89.658 26.042 90 25.146 90 24.25 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
<!--Source: https://www.iconpacks.net/free-icon/arrow-right-3098.html-->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 24.25 90 c -0.896 0 -1.792 -0.342 -2.475 -1.025 c -1.367 -1.366 -1.367 -3.583 0 -4.949 L 60.8 45 L 21.775 5.975 c -1.367 -1.367 -1.367 -3.583 0 -4.95 c 1.367 -1.366 3.583 -1.366 4.95 0 l 41.5 41.5 c 1.367 1.366 1.367 3.583 0 4.949 l -41.5 41.5 C 26.042 89.658 25.146 90 24.25 90 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
14
frontend-reactive/app/components/svgs/heart-filled.hbs
Normal file
14
frontend-reactive/app/components/svgs/heart-filled.hbs
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
{{!--Source: https://www.iconpacks.net/free-icon/rainbow-heart-4025.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 22.353 72.146 c 6.131 5.349 13.628 10.42 22.647 14.93 c 9.019 -4.509 16.516 -9.58 22.647 -14.93 C 51.886 71.433 38.115 71.433 22.353 72.146 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(162,0,247); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 9.921 58.519 c 3.683 5.228 8.467 10.41 14.444 15.327 h 41.27 c 5.977 -4.917 10.761 -10.099 14.444 -15.327 C 54.42 56.482 35.58 56.482 9.921 58.519 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(1,104,248); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 2.868 45.313 c 1.777 4.764 4.411 9.652 7.991 14.49 h 68.283 c 3.58 -4.838 6.214 -9.726 7.991 -14.49 C 55.317 43.478 34.683 43.478 2.868 45.313 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(3,143,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 0.011 31.231 c 0.114 4.567 1.084 9.479 3.021 14.53 h 83.936 c 1.937 -5.051 2.907 -9.963 3.021 -14.53 C 55.571 27.636 34.429 27.636 0.011 31.231 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(248,245,1); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 3.063 16.796 c -2.176 4.208 -3.251 9.31 -3.037 14.923 h 89.947 c 0.214 -5.613 -0.861 -10.715 -3.037 -14.923 C 55.299 13.301 34.701 13.301 3.063 16.796 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(248,146,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 2.622 17.677 h 84.756 C 81.379 4.833 65.599 -0.363 45 12.219 C 24.401 -0.363 8.621 4.833 2.622 17.677 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(247,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
10
frontend-reactive/app/components/svgs/heart-outline.hbs
Normal file
10
frontend-reactive/app/components/svgs/heart-outline.hbs
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
{{!--Source: https://www.iconpacks.net/free-icon/heart-2930.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 45 86.215 c -0.307 0 -0.613 -0.07 -0.895 -0.211 C 12.38 70.141 0.53 47.275 0.019 31.165 C -0.32 20.477 4.083 11.415 11.799 6.924 C 20.661 1.766 32.416 2.997 45 10.373 c 12.585 -7.375 24.338 -8.605 33.201 -3.449 c 7.716 4.491 12.119 13.553 11.78 24.241 c -0.511 16.11 -12.361 38.976 -44.087 54.839 C 45.613 86.145 45.307 86.215 45 86.215 z M 23.93 7.787 c -3.729 0 -7.139 0.86 -10.119 2.594 c -6.521 3.795 -10.09 11.324 -9.794 20.657 C 4.486 45.847 15.519 66.926 45 81.975 c 29.481 -15.049 40.514 -36.128 40.983 -50.937 c 0.296 -9.333 -3.273 -16.862 -9.795 -20.657 c -7.777 -4.528 -18.483 -3.095 -30.146 4.028 c -0.641 0.392 -1.446 0.392 -2.085 0 C 36.764 10.016 29.933 7.787 23.93 7.787 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 11.953 39.751 c -0.855 0 -1.646 -0.553 -1.911 -1.413 c -2.26 -7.346 -0.825 -15.376 3.655 -20.458 c 3.241 -3.678 7.71 -5.331 12.273 -4.536 c 1.088 0.19 1.816 1.226 1.626 2.314 c -0.19 1.088 -1.23 1.818 -2.314 1.626 c -3.199 -0.557 -6.251 0.592 -8.585 3.24 c -3.58 4.062 -4.692 10.592 -2.832 16.638 c 0.325 1.056 -0.268 2.175 -1.324 2.5 C 12.346 39.722 12.148 39.751 11.953 39.751 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
10
frontend-reactive/app/components/svgs/plus-black.hbs
Normal file
10
frontend-reactive/app/components/svgs/plus-black.hbs
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
{{!--Source: https://www.iconpacks.net/free-icon/plus-11960.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 45 90 c -2.761 0 -5 -2.238 -5 -5 V 5 c 0 -2.761 2.239 -5 5 -5 c 2.762 0 5 2.239 5 5 v 80 C 50 87.762 47.762 90 45 90 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 85 50 H 5 c -2.761 0 -5 -2.238 -5 -5 c 0 -2.761 2.239 -5 5 -5 h 80 c 2.762 0 5 2.239 5 5 C 90 47.762 87.762 50 85 50 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
10
frontend-reactive/app/components/svgs/plus-pink.hbs
Normal file
10
frontend-reactive/app/components/svgs/plus-pink.hbs
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
{{!--Source: https://www.iconpacks.net/free-icon/pink-plus-11966.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 45 90 c -2.761 0 -5 -2.238 -5 -5 V 5 c 0 -2.761 2.239 -5 5 -5 c 2.762 0 5 2.239 5 5 v 80 C 50 87.762 47.762 90 45 90 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,49,250); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 85 50 H 5 c -2.761 0 -5 -2.238 -5 -5 c 0 -2.761 2.239 -5 5 -5 h 80 c 2.762 0 5 2.239 5 5 C 90 47.762 87.762 50 85 50 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,49,250); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
10
frontend-reactive/app/components/svgs/reload-coloured.hbs
Normal file
10
frontend-reactive/app/components/svgs/reload-coloured.hbs
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
{{!--https://www.iconpacks.net/free-icon/arrows-reload-2848.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 78.39 55.325 c -2.02 -0.89 -4.383 0.024 -5.273 2.047 C 68.207 68.512 57.17 75.709 45 75.709 c -12.697 0 -23.618 -7.746 -28.288 -18.76 l 1.808 -0.168 c 1.547 -0.144 2.871 -1.17 3.396 -2.633 c 0.524 -1.462 0.155 -3.096 -0.948 -4.19 l -7.859 -7.797 c -0.019 -0.019 -0.043 -0.031 -0.062 -0.049 c -0.18 -0.171 -0.373 -0.327 -0.583 -0.463 c -0.074 -0.048 -0.154 -0.083 -0.231 -0.125 c -0.165 -0.092 -0.332 -0.179 -0.51 -0.248 c -0.095 -0.036 -0.192 -0.061 -0.289 -0.09 c -0.166 -0.05 -0.332 -0.094 -0.506 -0.122 c -0.116 -0.019 -0.232 -0.027 -0.35 -0.035 C 10.482 41.022 10.39 41 10.292 41 c -0.068 0 -0.132 0.017 -0.2 0.02 c -0.057 0.003 -0.113 -0.008 -0.169 -0.003 c -0.066 0.006 -0.128 0.03 -0.193 0.04 c -0.166 0.024 -0.327 0.056 -0.485 0.1 c -0.109 0.03 -0.215 0.061 -0.32 0.099 c -0.16 0.059 -0.313 0.129 -0.462 0.207 c -0.095 0.049 -0.19 0.096 -0.281 0.153 c -0.15 0.094 -0.287 0.201 -0.422 0.313 c -0.077 0.063 -0.158 0.12 -0.23 0.19 C 7.37 42.269 7.231 42.437 7.1 42.612 c -0.031 0.041 -0.071 0.073 -0.1 0.115 l -0.025 0.036 c 0 0 -0.001 0.001 -0.001 0.001 l -6.266 9.072 c -0.883 1.278 -0.945 2.952 -0.161 4.294 c 0.722 1.233 2.041 1.979 3.452 1.979 c 0.123 0 0.247 -0.006 0.37 -0.017 l 4.078 -0.378 C 13.721 72.83 28.11 83.709 45 83.709 c 15.339 0 29.249 -9.071 35.437 -23.11 C 81.327 58.577 80.411 56.216 78.39 55.325 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,123,123); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 89.291 38.164 c 0.883 -1.278 0.946 -2.952 0.161 -4.293 c -0.784 -1.341 -2.271 -2.108 -3.821 -1.963 l -4.078 0.378 C 76.28 17.17 61.89 6.292 45 6.292 c -15.339 0 -29.249 9.071 -35.436 23.11 c -0.891 2.021 0.025 4.382 2.047 5.273 c 2.021 0.892 4.382 -0.025 5.273 -2.047 C 21.794 21.489 32.83 14.292 45 14.292 c 12.697 0 23.619 7.746 28.289 18.76 l -1.808 0.168 c -1.547 0.144 -2.871 1.169 -3.396 2.632 c -0.525 1.462 -0.155 3.096 0.947 4.19 l 7.859 7.798 c 0.061 0.061 0.134 0.105 0.199 0.162 c 0.129 0.113 0.256 0.229 0.399 0.325 c 0.083 0.055 0.174 0.093 0.261 0.142 c 0.14 0.079 0.276 0.163 0.425 0.225 c 0.104 0.043 0.214 0.066 0.322 0.1 c 0.14 0.045 0.277 0.098 0.424 0.128 C 79.179 48.972 79.443 49 79.709 49 c 0.122 0 0.246 -0.006 0.369 -0.017 c 0.068 -0.006 0.131 -0.031 0.198 -0.041 c 0.163 -0.023 0.321 -0.055 0.476 -0.098 c 0.111 -0.03 0.22 -0.062 0.327 -0.102 c 0.158 -0.058 0.308 -0.128 0.456 -0.204 c 0.097 -0.05 0.193 -0.097 0.285 -0.155 c 0.149 -0.093 0.286 -0.201 0.421 -0.312 c 0.077 -0.064 0.158 -0.12 0.23 -0.19 c 0.158 -0.152 0.298 -0.32 0.43 -0.496 c 0.03 -0.04 0.069 -0.072 0.098 -0.113 l 0.024 -0.035 c 0.001 -0.001 0.002 -0.002 0.002 -0.003 L 89.291 38.164 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(123,222,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
10
frontend-reactive/app/components/svgs/reload-outline.hbs
Normal file
10
frontend-reactive/app/components/svgs/reload-outline.hbs
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
{{!--Source: https://www.iconpacks.net/free-icon/reload-arrows-2846.html--}}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve" class="{{@class}}">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 79.133 57.837 c -1.012 -0.443 -2.19 0.014 -2.637 1.023 C 70.996 71.339 58.633 79.401 45 79.401 c -17.205 0 -31.5 -12.696 -34.01 -29.211 l 4.442 4.407 c 0.784 0.777 2.051 0.773 2.829 -0.012 c 0.778 -0.783 0.773 -2.05 -0.011 -2.828 l -8.242 -8.178 c -0.012 -0.012 -0.027 -0.019 -0.039 -0.031 c -0.088 -0.083 -0.181 -0.158 -0.283 -0.224 c -0.037 -0.024 -0.076 -0.041 -0.114 -0.062 c -0.083 -0.047 -0.168 -0.091 -0.258 -0.125 c -0.043 -0.017 -0.088 -0.028 -0.132 -0.041 c -0.088 -0.027 -0.176 -0.05 -0.269 -0.065 c -0.053 -0.008 -0.106 -0.012 -0.16 -0.016 C 8.7 43.012 8.651 43 8.598 43 c -0.034 0 -0.066 0.008 -0.1 0.01 c -0.028 0.001 -0.056 -0.004 -0.084 -0.002 c -0.034 0.003 -0.065 0.015 -0.099 0.02 c -0.081 0.012 -0.16 0.028 -0.238 0.049 c -0.055 0.015 -0.11 0.031 -0.163 0.051 c -0.079 0.029 -0.154 0.064 -0.228 0.102 c -0.048 0.025 -0.097 0.049 -0.143 0.078 c -0.074 0.046 -0.142 0.1 -0.209 0.155 c -0.039 0.032 -0.08 0.061 -0.116 0.096 c -0.079 0.075 -0.148 0.159 -0.214 0.246 c -0.015 0.021 -0.035 0.036 -0.05 0.058 L 6.94 43.881 c 0 0 0 0.001 -0.001 0.001 l -6.585 9.535 c -0.628 0.909 -0.4 2.154 0.509 2.782 c 0.347 0.24 0.743 0.354 1.135 0.354 c 0.635 0 1.259 -0.302 1.647 -0.863 l 3.389 -4.907 C 9.832 69.224 25.791 83.401 45 83.401 c 15.218 0 29.018 -9 35.156 -22.928 C 80.602 59.463 80.144 58.282 79.133 57.837 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 89.646 36.583 c 0.628 -0.909 0.4 -2.155 -0.509 -2.782 c -0.909 -0.628 -2.156 -0.4 -2.782 0.509 l -3.389 4.907 C 80.168 20.776 64.209 6.598 45 6.598 c -15.218 0 -29.017 9 -35.156 22.928 c -0.445 1.011 0.013 2.191 1.023 2.637 c 1.01 0.446 2.192 -0.012 2.637 -1.023 C 19.004 18.661 31.367 10.598 45 10.598 c 17.204 0 31.499 12.695 34.009 29.21 l -4.441 -4.407 c -0.785 -0.778 -2.05 -0.773 -2.829 0.011 c -0.777 0.784 -0.772 2.05 0.011 2.829 l 8.236 8.171 c 0.001 0.001 0.001 0.001 0.002 0.002 l 0.005 0.005 c 0.022 0.022 0.049 0.038 0.072 0.058 c 0.073 0.066 0.146 0.13 0.227 0.185 c 0.039 0.026 0.083 0.044 0.124 0.067 c 0.072 0.041 0.142 0.084 0.219 0.116 c 0.05 0.021 0.104 0.031 0.155 0.048 c 0.072 0.023 0.142 0.05 0.217 0.065 c 0.129 0.026 0.261 0.04 0.394 0.04 c 0.062 0 0.123 -0.003 0.185 -0.009 c 0.032 -0.003 0.062 -0.015 0.094 -0.019 c 0.084 -0.012 0.166 -0.028 0.246 -0.05 c 0.054 -0.015 0.106 -0.03 0.158 -0.049 c 0.08 -0.029 0.156 -0.064 0.231 -0.103 c 0.048 -0.025 0.096 -0.049 0.143 -0.077 c 0.073 -0.046 0.14 -0.098 0.206 -0.153 c 0.04 -0.033 0.082 -0.062 0.119 -0.099 c 0.078 -0.075 0.147 -0.158 0.212 -0.245 c 0.016 -0.021 0.036 -0.037 0.051 -0.059 l 0.013 -0.018 c 0 0 0 -0.001 0.001 -0.001 L 89.646 36.583 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
6
frontend-reactive/app/helpers/isLandscape.ts
Normal file
6
frontend-reactive/app/helpers/isLandscape.ts
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
export default function isLandscape(): boolean {
|
||||||
|
return (
|
||||||
|
Math.min(screen.availHeight, window.innerHeight) <
|
||||||
|
Math.min(screen.availWidth, window.innerWidth)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -1,11 +1,11 @@
|
||||||
import EmberRouter from "@ember/routing/router";
|
import EmberRouter from '@ember/routing/router';
|
||||||
import config from "frontend-reactive/config/environment";
|
import config from 'frontend-reactive/config/environment';
|
||||||
|
|
||||||
export default class Router extends EmberRouter {
|
export default class Router extends EmberRouter {
|
||||||
location = config.locationType;
|
location = config.locationType;
|
||||||
rootURL = config.rootURL;
|
rootURL = config.rootURL;
|
||||||
}
|
}
|
||||||
|
|
||||||
Router.map(function () {
|
Router.map(function () {
|
||||||
this.route("about");
|
this.route('about');
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -1,19 +1,30 @@
|
||||||
import Route from "@ember/routing/route";
|
import Route from '@ember/routing/route';
|
||||||
|
|
||||||
export default class ApplicationRoute extends Route {
|
export default class ApplicationRoute extends Route {
|
||||||
model() {
|
model() {
|
||||||
console.log("root route loaded");
|
console.log('root route loaded');
|
||||||
return {
|
return {
|
||||||
notes: [
|
notes: [
|
||||||
{
|
{
|
||||||
displayname: "alice",
|
displayname: 'alice',
|
||||||
username: "bob",
|
username: 'bob',
|
||||||
server: "example.com",
|
server: 'example.com',
|
||||||
content: "lorem ipsum",
|
content: 'lorem ipsum',
|
||||||
createdAt: Date.now() - 360000,
|
createdAt: Date.now() - 360000,
|
||||||
editedAt: Date.now() - 60000,
|
editedAt: Date.now() - 60000,
|
||||||
},
|
},
|
||||||
],
|
{
|
||||||
};
|
displayname: 'Melody',
|
||||||
}
|
username: 'mstar',
|
||||||
|
server: 'woem.men',
|
||||||
|
content: `Grapple keel reef fathom haul wind bilge rat swing the lead belay line pink. Man-of-war mizzenmast killick lookout yo-ho-ho Sail ho gabion careen sutler stern. Draught wherry lookout schooner prow hail-shot spanker Letter of Marque lateen sail strike colors.
|
||||||
|
|
||||||
|
Lad heave to topgallant scallywag scuppers Spanish Main poop deck spike hulk broadside. Snow take a caulk hornswaggle gaff swab quarter lugger spanker bilge provost. Man-of-war measured fer yer chains lugger cable loaded to the gunwalls prow piracy snow doubloon furl.
|
||||||
|
|
||||||
|
Dead men tell no tales jib chase guns gunwalls Gold Road smartly nipperkin topsail bilge water Pirate Round. Gaff gunwalls bilged on her anchor bilge water scourge of the seven seas parley ho sheet chase guns squiffy. Scuppers fathom ho quarter gally heave to yardarm coxswain red ensign pink.`,
|
||||||
|
createdAt: Date.now() - 3600,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,8 @@
|
||||||
/* Ember supports plain CSS out of the box. More info: https://cli.emberjs.com/release/advanced-use/stylesheets/ */
|
/* Ember supports plain CSS out of the box. More info: https://cli.emberjs.com/release/advanced-use/stylesheets/ */
|
||||||
@import url("notes.css");
|
@import url("notes.css");
|
||||||
|
@import url("util.css");
|
||||||
|
|
||||||
|
/* TODO: Find a cool font to use throughout the entire project */
|
||||||
* {
|
* {
|
||||||
font-family:
|
font-family:
|
||||||
system-ui,
|
system-ui,
|
||||||
|
|
@ -15,3 +17,4 @@
|
||||||
"Helvetica Neue",
|
"Helvetica Neue",
|
||||||
sans-serif;
|
sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
height: fit-content;
|
height: fit-content;
|
||||||
|
|
||||||
/* align-items: center; */
|
/* align-items: center; */
|
||||||
border: 1px dashed green;
|
border: 1px dashed red;
|
||||||
max-width: 50em;
|
max-width: 50em;
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
background-color: #eee;
|
background-color: #eee;
|
||||||
|
|
@ -75,7 +75,7 @@
|
||||||
.note-content-toggle {
|
.note-content-toggle {
|
||||||
margin-top: 0.3em;
|
margin-top: 0.3em;
|
||||||
margin-bottom: 0.3em;
|
margin-bottom: 0.3em;
|
||||||
cursor: default;
|
cursor: pointer;
|
||||||
background-color: #ccc;
|
background-color: #ccc;
|
||||||
padding: 0.1em 0.3em 0.2em;
|
padding: 0.1em 0.3em 0.2em;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
|
|
@ -85,3 +85,46 @@
|
||||||
.note-content-toggle:hover {
|
.note-content-toggle:hover {
|
||||||
background-color: #aaa;
|
background-color: #aaa;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.note-interactions-wrapper {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note-interactions-interaction-button {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
padding-right: 1em;
|
||||||
|
align-items: center;
|
||||||
|
border: 1px solid #aaa;
|
||||||
|
padding: 0.3em;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-right: 0.5em;
|
||||||
|
margin-top: 0.2em;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note-interactions-interaction-icon {
|
||||||
|
height: 2.5ex;
|
||||||
|
padding-right: 0.2em;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note-interactions-interaction-counter {
|
||||||
|
font-weight: bolder;
|
||||||
|
margin-top: -0.08em;
|
||||||
|
margin-bottom: -0.08em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note-interactions-interactions-button-like {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note-interactions-interactions-button-custom {
|
||||||
|
border-left: 1px black solid;
|
||||||
|
margin-left: 0.3em;
|
||||||
|
padding-left: 0.3em;
|
||||||
|
padding-top: 0.2em;
|
||||||
|
margin-bottom: -0.1em;
|
||||||
|
}
|
||||||
|
|
|
||||||
22
frontend-reactive/app/styles/util.css
Normal file
22
frontend-reactive/app/styles/util.css
Normal file
|
|
@ -0,0 +1,22 @@
|
||||||
|
.hide {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Copied from: https://stackoverflow.com/a/4407335 */
|
||||||
|
.noselect {
|
||||||
|
-webkit-touch-callout: none; /* iOS Safari */
|
||||||
|
-webkit-user-select: none; /* Safari */
|
||||||
|
-khtml-user-select: none; /* Konqueror HTML */
|
||||||
|
-moz-user-select: none; /* Old versions of Firefox */
|
||||||
|
-ms-user-select: none; /* Internet Explorer/Edge */
|
||||||
|
user-select: none; /* Non-prefixed version, currently
|
||||||
|
supported by Chrome, Edge, Opera and Firefox */
|
||||||
|
}
|
||||||
|
|
||||||
|
.separator-horizontal {
|
||||||
|
width: 100%;
|
||||||
|
border: 1px solid black;
|
||||||
|
margin-top: 0.2em;
|
||||||
|
margin-bottom: 0.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -8,4 +8,4 @@
|
||||||
/>
|
/>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
|
|
||||||
<!--<Timeline />-->
|
{{!--<Timeline />--}}
|
||||||
BIN
frontend-reactive/bun.lockb
Executable file
BIN
frontend-reactive/bun.lockb
Executable file
Binary file not shown.
|
|
@ -1,19 +1,19 @@
|
||||||
"use strict";
|
'use strict';
|
||||||
|
|
||||||
const EmberApp = require("ember-cli/lib/broccoli/ember-app");
|
const EmberApp = require('ember-cli/lib/broccoli/ember-app');
|
||||||
|
|
||||||
module.exports = function (defaults) {
|
module.exports = function (defaults) {
|
||||||
const app = new EmberApp(defaults, {
|
const app = new EmberApp(defaults, {
|
||||||
"ember-cli-babel": { enableTypeScriptTransform: true },
|
'ember-cli-babel': { enableTypeScriptTransform: true },
|
||||||
minifyCSS: {
|
minifyCSS: {
|
||||||
options: { processImport: true },
|
options: { processImport: true },
|
||||||
},
|
},
|
||||||
|
|
||||||
// Add options here
|
// Add options here
|
||||||
autoImport: {
|
autoImport: {
|
||||||
watchDependencies: ["ember-moment"],
|
watchDependencies: ['ember-moment'],
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
return app.toTree();
|
return app.toTree();
|
||||||
};
|
};
|
||||||
|
|
|
||||||
5292
frontend-reactive/package-lock.json
generated
5292
frontend-reactive/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -88,6 +88,7 @@
|
||||||
"ember-resolver": "^11.0.1",
|
"ember-resolver": "^11.0.1",
|
||||||
"ember-source": "~5.11.0",
|
"ember-source": "~5.11.0",
|
||||||
"ember-template-lint": "^5.13.0",
|
"ember-template-lint": "^5.13.0",
|
||||||
|
"ember-tooltips": "^3.6.0",
|
||||||
"ember-welcome-page": "^7.0.2",
|
"ember-welcome-page": "^7.0.2",
|
||||||
"eslint": "^8.57.0",
|
"eslint": "^8.57.0",
|
||||||
"eslint-config-prettier": "^9.1.0",
|
"eslint-config-prettier": "^9.1.0",
|
||||||
|
|
|
||||||
5
frontend-reactive/public/assets/svgs/credit.txt
Normal file
5
frontend-reactive/public/assets/svgs/credit.txt
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
https://www.iconpacks.net:
|
||||||
|
- heart-black-outline.svg
|
||||||
|
- heart-rainbow.svg
|
||||||
|
- reload-black.svg
|
||||||
|
- reload-coloured.svg
|
||||||
|
|
@ -0,0 +1,8 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 45 85.465 L 7.098 47.563 C 2.521 42.986 0 36.9 0 30.426 c 0 -6.473 2.521 -12.559 7.099 -17.136 c 4.577 -4.577 10.663 -7.098 17.136 -7.098 s 12.559 2.521 17.137 7.098 L 45 16.919 l 3.63 -3.629 c 4.576 -4.577 10.662 -7.098 17.136 -7.098 s 12.56 2.521 17.136 7.099 v 0 c 0 0 0 0 0 0 C 87.479 17.867 90 23.953 90 30.426 c 0 6.474 -2.521 12.56 -7.099 17.136 L 45 85.465 z M 24.234 14.192 c -4.336 0 -8.413 1.688 -11.479 4.755 C 9.689 22.013 8 26.09 8 30.426 c 0 4.336 1.689 8.414 4.755 11.479 L 45 74.15 l 32.244 -32.244 C 80.312 38.84 82 34.763 82 30.426 c 0 -4.336 -1.688 -8.413 -4.755 -11.479 v 0 c -3.066 -3.066 -7.144 -4.755 -11.479 -4.755 s -8.413 1.688 -11.479 4.755 L 45 28.233 l -9.286 -9.286 C 32.647 15.881 28.571 14.192 24.234 14.192 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,9 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 45 86.215 c -0.307 0 -0.613 -0.07 -0.895 -0.211 C 12.38 70.141 0.53 47.275 0.019 31.165 C -0.32 20.477 4.083 11.415 11.799 6.924 C 20.661 1.766 32.416 2.997 45 10.373 c 12.585 -7.375 24.338 -8.605 33.201 -3.449 c 7.716 4.491 12.119 13.553 11.78 24.241 c -0.511 16.11 -12.361 38.976 -44.087 54.839 C 45.613 86.145 45.307 86.215 45 86.215 z M 23.93 7.787 c -3.729 0 -7.139 0.86 -10.119 2.594 c -6.521 3.795 -10.09 11.324 -9.794 20.657 C 4.486 45.847 15.519 66.926 45 81.975 c 29.481 -15.049 40.514 -36.128 40.983 -50.937 c 0.296 -9.333 -3.273 -16.862 -9.795 -20.657 c -7.777 -4.528 -18.483 -3.095 -30.146 4.028 c -0.641 0.392 -1.446 0.392 -2.085 0 C 36.764 10.016 29.933 7.787 23.93 7.787 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 11.953 39.751 c -0.855 0 -1.646 -0.553 -1.911 -1.413 c -2.26 -7.346 -0.825 -15.376 3.655 -20.458 c 3.241 -3.678 7.71 -5.331 12.273 -4.536 c 1.088 0.19 1.816 1.226 1.626 2.314 c -0.19 1.088 -1.23 1.818 -2.314 1.626 c -3.199 -0.557 -6.251 0.592 -8.585 3.24 c -3.58 4.062 -4.692 10.592 -2.832 16.638 c 0.325 1.056 -0.268 2.175 -1.324 2.5 C 12.346 39.722 12.148 39.751 11.953 39.751 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2 KiB |
13
frontend-reactive/public/assets/svgs/heart-rainbow.svg
Normal file
13
frontend-reactive/public/assets/svgs/heart-rainbow.svg
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 22.353 72.146 c 6.131 5.349 13.628 10.42 22.647 14.93 c 9.019 -4.509 16.516 -9.58 22.647 -14.93 C 51.886 71.433 38.115 71.433 22.353 72.146 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(162,0,247); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 9.921 58.519 c 3.683 5.228 8.467 10.41 14.444 15.327 h 41.27 c 5.977 -4.917 10.761 -10.099 14.444 -15.327 C 54.42 56.482 35.58 56.482 9.921 58.519 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(1,104,248); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 2.868 45.313 c 1.777 4.764 4.411 9.652 7.991 14.49 h 68.283 c 3.58 -4.838 6.214 -9.726 7.991 -14.49 C 55.317 43.478 34.683 43.478 2.868 45.313 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(3,143,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 0.011 31.231 c 0.114 4.567 1.084 9.479 3.021 14.53 h 83.936 c 1.937 -5.051 2.907 -9.963 3.021 -14.53 C 55.571 27.636 34.429 27.636 0.011 31.231 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(248,245,1); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 3.063 16.796 c -2.176 4.208 -3.251 9.31 -3.037 14.923 h 89.947 c 0.214 -5.613 -0.861 -10.715 -3.037 -14.923 C 55.299 13.301 34.701 13.301 3.063 16.796 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(248,146,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 2.622 17.677 h 84.756 C 81.379 4.833 65.599 -0.363 45 12.219 C 24.401 -0.363 8.621 4.833 2.622 17.677 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(247,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.8 KiB |
9
frontend-reactive/public/assets/svgs/reload-black.svg
Normal file
9
frontend-reactive/public/assets/svgs/reload-black.svg
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 79.133 57.837 c -1.012 -0.443 -2.19 0.014 -2.637 1.023 C 70.996 71.339 58.633 79.401 45 79.401 c -17.205 0 -31.5 -12.696 -34.01 -29.211 l 4.442 4.407 c 0.784 0.777 2.051 0.773 2.829 -0.012 c 0.778 -0.783 0.773 -2.05 -0.011 -2.828 l -8.242 -8.178 c -0.012 -0.012 -0.027 -0.019 -0.039 -0.031 c -0.088 -0.083 -0.181 -0.158 -0.283 -0.224 c -0.037 -0.024 -0.076 -0.041 -0.114 -0.062 c -0.083 -0.047 -0.168 -0.091 -0.258 -0.125 c -0.043 -0.017 -0.088 -0.028 -0.132 -0.041 c -0.088 -0.027 -0.176 -0.05 -0.269 -0.065 c -0.053 -0.008 -0.106 -0.012 -0.16 -0.016 C 8.7 43.012 8.651 43 8.598 43 c -0.034 0 -0.066 0.008 -0.1 0.01 c -0.028 0.001 -0.056 -0.004 -0.084 -0.002 c -0.034 0.003 -0.065 0.015 -0.099 0.02 c -0.081 0.012 -0.16 0.028 -0.238 0.049 c -0.055 0.015 -0.11 0.031 -0.163 0.051 c -0.079 0.029 -0.154 0.064 -0.228 0.102 c -0.048 0.025 -0.097 0.049 -0.143 0.078 c -0.074 0.046 -0.142 0.1 -0.209 0.155 c -0.039 0.032 -0.08 0.061 -0.116 0.096 c -0.079 0.075 -0.148 0.159 -0.214 0.246 c -0.015 0.021 -0.035 0.036 -0.05 0.058 L 6.94 43.881 c 0 0 0 0.001 -0.001 0.001 l -6.585 9.535 c -0.628 0.909 -0.4 2.154 0.509 2.782 c 0.347 0.24 0.743 0.354 1.135 0.354 c 0.635 0 1.259 -0.302 1.647 -0.863 l 3.389 -4.907 C 9.832 69.224 25.791 83.401 45 83.401 c 15.218 0 29.018 -9 35.156 -22.928 C 80.602 59.463 80.144 58.282 79.133 57.837 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 89.646 36.583 c 0.628 -0.909 0.4 -2.155 -0.509 -2.782 c -0.909 -0.628 -2.156 -0.4 -2.782 0.509 l -3.389 4.907 C 80.168 20.776 64.209 6.598 45 6.598 c -15.218 0 -29.017 9 -35.156 22.928 c -0.445 1.011 0.013 2.191 1.023 2.637 c 1.01 0.446 2.192 -0.012 2.637 -1.023 C 19.004 18.661 31.367 10.598 45 10.598 c 17.204 0 31.499 12.695 34.009 29.21 l -4.441 -4.407 c -0.785 -0.778 -2.05 -0.773 -2.829 0.011 c -0.777 0.784 -0.772 2.05 0.011 2.829 l 8.236 8.171 c 0.001 0.001 0.001 0.001 0.002 0.002 l 0.005 0.005 c 0.022 0.022 0.049 0.038 0.072 0.058 c 0.073 0.066 0.146 0.13 0.227 0.185 c 0.039 0.026 0.083 0.044 0.124 0.067 c 0.072 0.041 0.142 0.084 0.219 0.116 c 0.05 0.021 0.104 0.031 0.155 0.048 c 0.072 0.023 0.142 0.05 0.217 0.065 c 0.129 0.026 0.261 0.04 0.394 0.04 c 0.062 0 0.123 -0.003 0.185 -0.009 c 0.032 -0.003 0.062 -0.015 0.094 -0.019 c 0.084 -0.012 0.166 -0.028 0.246 -0.05 c 0.054 -0.015 0.106 -0.03 0.158 -0.049 c 0.08 -0.029 0.156 -0.064 0.231 -0.103 c 0.048 -0.025 0.096 -0.049 0.143 -0.077 c 0.073 -0.046 0.14 -0.098 0.206 -0.153 c 0.04 -0.033 0.082 -0.062 0.119 -0.099 c 0.078 -0.075 0.147 -0.158 0.212 -0.245 c 0.016 -0.021 0.036 -0.037 0.051 -0.059 l 0.013 -0.018 c 0 0 0 -0.001 0.001 -0.001 L 89.646 36.583 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.4 KiB |
9
frontend-reactive/public/assets/svgs/reload-coloured.svg
Normal file
9
frontend-reactive/public/assets/svgs/reload-coloured.svg
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve">
|
||||||
|
|
||||||
|
<defs>
|
||||||
|
</defs>
|
||||||
|
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
|
||||||
|
<path d="M 78.39 55.325 c -2.02 -0.89 -4.383 0.024 -5.273 2.047 C 68.207 68.512 57.17 75.709 45 75.709 c -12.697 0 -23.618 -7.746 -28.288 -18.76 l 1.808 -0.168 c 1.547 -0.144 2.871 -1.17 3.396 -2.633 c 0.524 -1.462 0.155 -3.096 -0.948 -4.19 l -7.859 -7.797 c -0.019 -0.019 -0.043 -0.031 -0.062 -0.049 c -0.18 -0.171 -0.373 -0.327 -0.583 -0.463 c -0.074 -0.048 -0.154 -0.083 -0.231 -0.125 c -0.165 -0.092 -0.332 -0.179 -0.51 -0.248 c -0.095 -0.036 -0.192 -0.061 -0.289 -0.09 c -0.166 -0.05 -0.332 -0.094 -0.506 -0.122 c -0.116 -0.019 -0.232 -0.027 -0.35 -0.035 C 10.482 41.022 10.39 41 10.292 41 c -0.068 0 -0.132 0.017 -0.2 0.02 c -0.057 0.003 -0.113 -0.008 -0.169 -0.003 c -0.066 0.006 -0.128 0.03 -0.193 0.04 c -0.166 0.024 -0.327 0.056 -0.485 0.1 c -0.109 0.03 -0.215 0.061 -0.32 0.099 c -0.16 0.059 -0.313 0.129 -0.462 0.207 c -0.095 0.049 -0.19 0.096 -0.281 0.153 c -0.15 0.094 -0.287 0.201 -0.422 0.313 c -0.077 0.063 -0.158 0.12 -0.23 0.19 C 7.37 42.269 7.231 42.437 7.1 42.612 c -0.031 0.041 -0.071 0.073 -0.1 0.115 l -0.025 0.036 c 0 0 -0.001 0.001 -0.001 0.001 l -6.266 9.072 c -0.883 1.278 -0.945 2.952 -0.161 4.294 c 0.722 1.233 2.041 1.979 3.452 1.979 c 0.123 0 0.247 -0.006 0.37 -0.017 l 4.078 -0.378 C 13.721 72.83 28.11 83.709 45 83.709 c 15.339 0 29.249 -9.071 35.437 -23.11 C 81.327 58.577 80.411 56.216 78.39 55.325 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,123,123); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
<path d="M 89.291 38.164 c 0.883 -1.278 0.946 -2.952 0.161 -4.293 c -0.784 -1.341 -2.271 -2.108 -3.821 -1.963 l -4.078 0.378 C 76.28 17.17 61.89 6.292 45 6.292 c -15.339 0 -29.249 9.071 -35.436 23.11 c -0.891 2.021 0.025 4.382 2.047 5.273 c 2.021 0.892 4.382 -0.025 5.273 -2.047 C 21.794 21.489 32.83 14.292 45 14.292 c 12.697 0 23.619 7.746 28.289 18.76 l -1.808 0.168 c -1.547 0.144 -2.871 1.169 -3.396 2.632 c -0.525 1.462 -0.155 3.096 0.947 4.19 l 7.859 7.798 c 0.061 0.061 0.134 0.105 0.199 0.162 c 0.129 0.113 0.256 0.229 0.399 0.325 c 0.083 0.055 0.174 0.093 0.261 0.142 c 0.14 0.079 0.276 0.163 0.425 0.225 c 0.104 0.043 0.214 0.066 0.322 0.1 c 0.14 0.045 0.277 0.098 0.424 0.128 C 79.179 48.972 79.443 49 79.709 49 c 0.122 0 0.246 -0.006 0.369 -0.017 c 0.068 -0.006 0.131 -0.031 0.198 -0.041 c 0.163 -0.023 0.321 -0.055 0.476 -0.098 c 0.111 -0.03 0.22 -0.062 0.327 -0.102 c 0.158 -0.058 0.308 -0.128 0.456 -0.204 c 0.097 -0.05 0.193 -0.097 0.285 -0.155 c 0.149 -0.093 0.286 -0.201 0.421 -0.312 c 0.077 -0.064 0.158 -0.12 0.23 -0.19 c 0.158 -0.152 0.298 -0.32 0.43 -0.496 c 0.03 -0.04 0.069 -0.072 0.098 -0.113 l 0.024 -0.035 c 0.001 -0.001 0.002 -0.002 0.002 -0.003 L 89.291 38.164 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(123,222,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.4 KiB |
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupRenderingTest } from 'frontend-reactive/tests/helpers';
|
||||||
|
import { render } from '@ember/test-helpers';
|
||||||
|
import { hbs } from 'ember-cli-htmlbars';
|
||||||
|
|
||||||
|
module('Integration | Component | note/interactions', function (hooks) {
|
||||||
|
setupRenderingTest(hooks);
|
||||||
|
|
||||||
|
test('it renders', async function (assert) {
|
||||||
|
// Set any properties with this.set('myProperty', 'value');
|
||||||
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||||
|
|
||||||
|
await render(hbs`<Note::Interactions />`);
|
||||||
|
|
||||||
|
assert.dom().hasText('');
|
||||||
|
|
||||||
|
// Template block usage:
|
||||||
|
await render(hbs`
|
||||||
|
<Note::Interactions>
|
||||||
|
template block text
|
||||||
|
</Note::Interactions>
|
||||||
|
`);
|
||||||
|
|
||||||
|
assert.dom().hasText('template block text');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupRenderingTest } from 'frontend-reactive/tests/helpers';
|
||||||
|
import { render } from '@ember/test-helpers';
|
||||||
|
import { hbs } from 'ember-cli-htmlbars';
|
||||||
|
|
||||||
|
module('Integration | Component | svgs/heart-filled', function (hooks) {
|
||||||
|
setupRenderingTest(hooks);
|
||||||
|
|
||||||
|
test('it renders', async function (assert) {
|
||||||
|
// Set any properties with this.set('myProperty', 'value');
|
||||||
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||||
|
|
||||||
|
await render(hbs`<Svgs::HeartFilled />`);
|
||||||
|
|
||||||
|
assert.dom().hasText('');
|
||||||
|
|
||||||
|
// Template block usage:
|
||||||
|
await render(hbs`
|
||||||
|
<Svgs::HeartFilled>
|
||||||
|
template block text
|
||||||
|
</Svgs::HeartFilled>
|
||||||
|
`);
|
||||||
|
|
||||||
|
assert.dom().hasText('template block text');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupRenderingTest } from 'frontend-reactive/tests/helpers';
|
||||||
|
import { render } from '@ember/test-helpers';
|
||||||
|
import { hbs } from 'ember-cli-htmlbars';
|
||||||
|
|
||||||
|
module('Integration | Component | svgs/heart-outline', function (hooks) {
|
||||||
|
setupRenderingTest(hooks);
|
||||||
|
|
||||||
|
test('it renders', async function (assert) {
|
||||||
|
// Set any properties with this.set('myProperty', 'value');
|
||||||
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||||
|
|
||||||
|
await render(hbs`<Svgs::HeartOutline />`);
|
||||||
|
|
||||||
|
assert.dom().hasText('');
|
||||||
|
|
||||||
|
// Template block usage:
|
||||||
|
await render(hbs`
|
||||||
|
<Svgs::HeartOutline>
|
||||||
|
template block text
|
||||||
|
</Svgs::HeartOutline>
|
||||||
|
`);
|
||||||
|
|
||||||
|
assert.dom().hasText('template block text');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupRenderingTest } from 'frontend-reactive/tests/helpers';
|
||||||
|
import { render } from '@ember/test-helpers';
|
||||||
|
import { hbs } from 'ember-cli-htmlbars';
|
||||||
|
|
||||||
|
module('Integration | Component | svgs/reload-coloured', function (hooks) {
|
||||||
|
setupRenderingTest(hooks);
|
||||||
|
|
||||||
|
test('it renders', async function (assert) {
|
||||||
|
// Set any properties with this.set('myProperty', 'value');
|
||||||
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||||
|
|
||||||
|
await render(hbs`<Svgs::ReloadColoured />`);
|
||||||
|
|
||||||
|
assert.dom().hasText('');
|
||||||
|
|
||||||
|
// Template block usage:
|
||||||
|
await render(hbs`
|
||||||
|
<Svgs::ReloadColoured>
|
||||||
|
template block text
|
||||||
|
</Svgs::ReloadColoured>
|
||||||
|
`);
|
||||||
|
|
||||||
|
assert.dom().hasText('template block text');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupRenderingTest } from 'frontend-reactive/tests/helpers';
|
||||||
|
import { render } from '@ember/test-helpers';
|
||||||
|
import { hbs } from 'ember-cli-htmlbars';
|
||||||
|
|
||||||
|
module('Integration | Component | svgs/reload-outline', function (hooks) {
|
||||||
|
setupRenderingTest(hooks);
|
||||||
|
|
||||||
|
test('it renders', async function (assert) {
|
||||||
|
// Set any properties with this.set('myProperty', 'value');
|
||||||
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||||
|
|
||||||
|
await render(hbs`<Svgs::ReloadOutline />`);
|
||||||
|
|
||||||
|
assert.dom().hasText('');
|
||||||
|
|
||||||
|
// Template block usage:
|
||||||
|
await render(hbs`
|
||||||
|
<Svgs::ReloadOutline>
|
||||||
|
template block text
|
||||||
|
</Svgs::ReloadOutline>
|
||||||
|
`);
|
||||||
|
|
||||||
|
assert.dom().hasText('template block text');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import { module, test } from 'qunit';
|
||||||
|
import { setupRenderingTest } from 'frontend-reactive/tests/helpers';
|
||||||
|
import { render } from '@ember/test-helpers';
|
||||||
|
import { hbs } from 'ember-cli-htmlbars';
|
||||||
|
|
||||||
|
module('Integration | Component | util/hover-info', function (hooks) {
|
||||||
|
setupRenderingTest(hooks);
|
||||||
|
|
||||||
|
test('it renders', async function (assert) {
|
||||||
|
// Set any properties with this.set('myProperty', 'value');
|
||||||
|
// Handle any actions with this.set('myAction', function(val) { ... });
|
||||||
|
|
||||||
|
await render(hbs`<Util::HoverInfo />`);
|
||||||
|
|
||||||
|
assert.dom().hasText('');
|
||||||
|
|
||||||
|
// Template block usage:
|
||||||
|
await render(hbs`
|
||||||
|
<Util::HoverInfo>
|
||||||
|
template block text
|
||||||
|
</Util::HoverInfo>
|
||||||
|
`);
|
||||||
|
|
||||||
|
assert.dom().hasText('template block text');
|
||||||
|
});
|
||||||
|
});
|
||||||
Loading…
Reference in a new issue