Add MyPet and Warps components with HTML, SCSS

Implemented the MyPet and Warps components, including their HTML structure, styles, and unit tests. These components provide detailed information and features for MyPet and Player Warps systems for a Minecraft-inspired application.
This commit is contained in:
Peter 2025-04-19 16:37:27 +02:00
parent 6be6944dea
commit d54a7e51ee
9 changed files with 561 additions and 0 deletions

View File

@ -56,6 +56,14 @@ export const routes: Routes = [
{
path: 'claiming',
loadComponent: () => import('./claiming/claiming.component').then(m => m.ClaimingComponent)
},
{
path: 'mypet',
loadComponent: () => import('./mypet/mypet.component').then(m => m.MypetComponent)
},
{
path: 'warps',
loadComponent: () => import('./warps/warps.component').then(m => m.WarpsComponent)
}
];

View File

@ -0,0 +1,221 @@
<ng-container>
<app-header [current_page]="'mypet'" height="460px" background_image="/public/img/backgrounds/babywither.png"
[overlay_gradient]="0.5">
<div class="title" header-content>
<h1>MyPet</h1>
<h2>Tame almost any mob in-game as your pet and train it to fight along your side, collect dropped items for you,
and more!</h2>
</div>
</app-header>
<main>
<section class="darkmodeSection">
<section class="columnSection">
<div class="columnContainer">
<div class="columnParagraph">
<h2>Claim a Pet</h2>
<p>To claim a pet you will need to find the mob you want in the survival world and <span
style="font-family: 'opensans-bold', sans-serif;">kill it with a lead in your hand</span>. You must have a
lead in your hand when you kill the mob or it will die instead of becoming your pet.</p>
<p>New players can have up to 3 pets in storage and 1 active pet at a time. More pets can be stored by
ranking up. To claim an additional pet you must first store your current pet with <span
style="font-family: 'opensans-bold', sans-serif;">/petstore</span>. Once you have stored your current
pet you can simply kill another mob to make it your pet. You will not be able to call it or interact with
your other pets while they are in storage. To interact with your MyPet you will need to make it your
active MyPet by doing <span style="font-family: 'opensans-bold', sans-serif;">/petswitch</span> and
selecting the one you want to use.</p>
<img ngSrc="/public/img/items/lead.png" alt="Minecraft lead/leash" style="width: 20%;" height="96"
width="96">
</div>
<div class="columnParagraph">
<h2>Skilltrees and Levels</h2>
<p>Pets can be assigned to a skilltree with <span
style="font-family: 'opensans-bold', sans-serif;">/pcst</span>, which allows it to level up and unlock new
skills. There are 8 skilltrees to choose from, but Mage, Tank, Marksman, and Warrior all require you to
start with "Fighter". Pets earn XP when they kill mobs, and also earn a small amount of XP any time you
kill a mob.</p>
<p><b>Note:</b> pets with inventories will drop it on player death.</p>
<ul>
<li><span style="font-family: 'opensans-bold', sans-serif;">Utility</span> - Specializes in mining with
pickup and inventory skills + a Haste II beacon at level 150. (150 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Mount</span> - A rideable pet specializes in
speed and jump height + jump beacon at level 150, and inventory at level 200. (200 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Defender</span> - Specializes in defending
you, it absorbs damage dealt towards you. High HP + regen beacon at level 200. (200 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Fighter</span> - Starter rank for all other
fighter categories. Increases pet attack damage. (50 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Mage</span> - Specializes in specialty attacks
like fireballs and lightning. No melee abilities. (100 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Tank</span> - Specializes in defense with
lots of HP, redirecting damage, and sweeping attacks. Resistance beacon at level 100. (100 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Marksman</span> - Specializes in ranged
attacks with arrow and poison damage, no melee abilities + invisibility beacon at level 50. (100 levels)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Warrior</span> - An all-around class with no
speciality, has some skills from every other class + a strength beacon at level 100. (100 levels)
</li>
</ul>
</div>
<div class="columnParagraph">
<h2>Equip Your Pet</h2>
<p>Some pets can hold items in their hands or wear armor. To equip a pet with something to hold or wear,
simply right click on your pet while shifting with the item in your hand. To remove the equipment right
click on your MyPet while shifting with shears in your hand.</p>
</div>
<div class="columnParagraph">
<h2>Naming Your Pet</h2>
<p>You can name your pet with <span
style="font-family: 'opensans-bold', sans-serif;">/petname &lt;name&gt;</span>. Please note that
inappropriate names (anything that wouldn't be allowed to be said in chat) are not allowed.</p>
<p>Duke members and above can change the color of their pet's name. To get a list of all the color codes
please do <span style="font-family: 'opensans-bold', sans-serif;">/colors</span> in-game.</p>
</div>
<div class="columnParagraph">
<h2>Pet Behavior</h2>
<p>You can change the way your pet attacks by changing its behavior. Different behaviors are unlocked as
your pet levels up. The available behaviors are listed below.</p>
<ul>
<li><span style="font-family: 'opensans-bold', sans-serif;">Friendly:</span> Won't fight, even if it's
attacked by anything
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Normal:</span> Acts like a normal wolf</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Aggressive:</span> Attacks everything within
15 blocks of the owner
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Farm:</span> Attacks every hostile mob within
15 blocks of the owner
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Raid:</span> Like normal, but the MyPet won't
attack players and their pets
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">Duel</span> Attacks other pets with active
duel behavior within a 5 block radius
</li>
</ul>
</div>
</div>
<div class="columnContainer">
<div class="columnParagraph">
<h2>Feed Your Pet</h2>
<p>You must feed your pet to keep its health up or it will die from hunger! If your pet is hungry it will
also be weaker and will deal less damage when attacking.</p>
<p>Each pet has a special food that it must be fed. You can see which food is right for your pet by doing
<span style="font-family: 'opensans-bold', sans-serif;">/petinfo</span>.</p>
<div class="inlineIcons">
<img ngSrc="/public/img/items/potato.png" alt="Minecraft potato" height="81" width="77">
<img ngSrc="/public/img/items/carrot.png" alt="Minecraft carrot" height="81" width="89">
<img ngSrc="/public/img/items/steak.png" alt="Minecraft steak" height="81" width="88">
</div>
</div>
<div class="columnParagraph">
<h2>How to Hide/Disable a MyPet</h2>
<p>There are two ways to disable a pet, and they work very differently. The first, <span
style="font-family: 'opensans-bold', sans-serif;">/petsendaway</span>, will hide your active MyPet until
you un-hide it with <span style="font-family: 'opensans-bold', sans-serif;">/petcall</span>. A pet that
has been hidden is still considered your "active MyPet", it just isn't visible right now. It also only
hides your pet during your current session.</p>
<p>The second way to disable a pet is to put it into storage with <span
style="font-family: 'opensans-bold', sans-serif;">/petstore</span>. Pets that are in storage are
completely deactivated until you use <span
style="font-family: 'opensans-bold', sans-serif;">/petswitch</span> to choose one you want to use. If
all of your pets are in storage, the server will tell you that you do not have a MyPet. This is also how
you can claim additional MyPets - by completely deactivating your current one first.</p>
</div>
<div class="columnParagraph">
<h2>Blocked Mob Types</h2>
<p>The following mobs are not allowed to be claimed as a pet: the enderdragon, villagers and villager-like
mobs, shulkers, ghasts, and elder guardians. If you kill any of these mobs it will die and will NOT become
your pet.</p>
<p>Furthermore, all horses (including donkeys and mules) are currently disabled as pets due to them being
buggy.</p>
<div class="inlineIcons">
<img ngSrc="/public/img/items/enderdragon.png"
style="padding: 25px 25px;"
alt="Minecraft enderdragon mob"
height="100" width="100">
<img ngSrc="/public/img/items/villager.png"
style="padding: 25px 25px;"
alt="Minecraft villager mob"
height="100" width="100">
<img ngSrc="/public/img/items/zombievillager.png"
style="padding: 25px 25px;"
alt="Minecraft zombie villager mob"
height="100" width="100">
<img ngSrc="/public/img/items/shulker.png"
style="padding: 25px 25px;"
alt="Minecraft shulker mob"
height="100" width="100">
<img ngSrc="/public/img/items/ghast.png"
style="padding: 25px 25px;"
alt="Minecraft ghast mob"
height="100" width="100">
<img ngSrc="/public/img/items/elderguardian.png"
style="padding: 25px 25px;"
alt="Minecraft elder guardian mob"
height="100" width="100">
</div>
</div>
<div class="columnParagraph">
<h2>Disclaimer</h2>
<p>When you die with your MyPet out, the MyPet will drop all of the items in its inventory. This means that
if your MyPet is in a dangerous area when you die, your items can be lost. And if you die in pvp the items
won't be protected. If your MyPet dies on its own, it will not drop its inventory.</p>
<p>Some skill trees require a base skill to be able to select them. The fighter skill tree is a base skill
and will not level beyond 50. When you reach level 50, you will need to switch to one of the secondary
skill trees with <span style="font-family: 'opensans-bold', sans-serif;">/pcst.</span></p>
</div>
<div class="columnParagraph">
<h2>Useful Commands</h2>
<ul>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petcall -</span> Make your pet come to you if
it vanished
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petsendaway -</span> Make your pet vanish
temporarily
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petrelease &lt;name&gt;-</span> Release
your pet forever
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petinfo -</span> Check your pet's health and
food as well as other stats
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/pcst -</span> Choose a skilltree for your
pet.
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petskill -</span> Check your pet's skills and
strengths
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petname &lt;name&gt;-</span> Change the name
of your pet (see Naming Your Pet above)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petinventory -</span> Open your pet's
inventory to see what it has picked up
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petpickup -</span> Toggle whether your pet
will pick up items or not
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petbehavior -</span> Change the behavior
class of your pet (see Pet Behavior above)
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petbeacon -</span> Turn your pet into a
walking beacon to give you strength, speed, and other power-ups
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petswitch -</span> Allows you to switch
between your MyPets
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/petstore -</span> Store your current pet to
claim another
</li>
</ul>
</div>
</div>
</section>
</section>
</main>
</ng-container>

View File

@ -0,0 +1,15 @@
main ul {
font-family: opensans, sans-serif;
text-align: left;
}
main li {
margin-left: 30px;
padding-bottom: 10px;
}
.inlineIcons {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MypetComponent } from './mypet.component';
describe('MypetComponent', () => {
let component: MypetComponent;
let fixture: ComponentFixture<MypetComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [MypetComponent]
})
.compileComponents();
fixture = TestBed.createComponent(MypetComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,16 @@
import {Component} from '@angular/core';
import {HeaderComponent} from '../header/header.component';
import {NgOptimizedImage} from '@angular/common';
@Component({
selector: 'app-mypet',
imports: [
HeaderComponent,
NgOptimizedImage
],
templateUrl: './mypet.component.html',
styleUrl: './mypet.component.scss'
})
export class MypetComponent {
}

View File

@ -0,0 +1,223 @@
<ng-container>
<app-header [current_page]="'economy'" height="460px" background_image="/public/img/backgrounds/path.jpg"
[overlay_gradient]="0.5">
<div class="title" header-content>
<h1>Player Warps</h1>
<h2>Set up your own public warp to let everyone visit your town, shop, and more!</h2>
</div>
</app-header>
<main>
<section class="darkmodeSection">
<section class="columnSection">
<div class="columnContainer">
<div class="columnParagraph">
<h2>What are Warps?</h2>
<p>Warps allow everyone to teleport to a specific place within the world. They work just like homes
(/sethome), but everyone has access to the warps. We are very excited to have our own custom warp system
that allows players to easily apply for their own warp wherever they want and maintain their warp (the
name, description, and icon) on their own! This lets you easily promote your town, shop, farm, or just
about anything else.</p>
<p>All warps are separated into categories so it's easy to find the category of warp you're looking for.</p>
<img ngSrc="/public/img/random/warpgui.png"
alt="In-game warp GUI"
style="width: 80%; padding-bottom: 15px;"
height="232" width="356">
</div>
</div>
<div class="columnContainer">
<div class="columnParagraph">
<h2>Applying for a Warp</h2>
<p>Once you've built something that you want to share, and made sure that it meets the "Warp Requirements",
you can apply for a warp in-game! Applying is easy, just do <span
style="font-family: 'opensans-bold', sans-serif;">/warps apply</span> and follow the prompts.</p>
<p>The application process will ask you for a name, description, icon, category, and location for your warp.
Before beginning the application process, be sure you are standing where you want the warp to be! Make
sure you are also facing the direction you want players to face when they teleport to your warp. Don't
look at the ground! Your warp name must be under 30 characters and your description must be under 120. Do
not use any color codes. When it asks for the item you want to have as an icon, simply hold the desired
item in your hand.</p>
<p><span style="font-family: 'opensans-bold', sans-serif;">Attention</span>: Warps cost $25000. If your
application is denied, you will be refunded $15000. To continue, type continue, or to cancel, type cancel.
However, if your warp is approved, but you fail to maintain it, your warp will be deleted without a
refund!</p>
</div>
</div>
</section>
<section class="columnSection" style="padding-top: 0;">
<div class="columnParagraph" style="padding-left: 15px;">
<h2>Warp Requirements</h2>
<p>You need to be the owner of the claim your warp is placed in. It should look good, and be as finished as
your warp type allows you to have it. Safety is an important aspect as well, visitors should not be
accidently dying by falling in dangerous areas or having mobs spawn on them. Phantoms are an exception to
this rule as you can't easily prevent those spawns. Your warp should be in one claim*, and divided with
subclaims if you need to allow different levels of trust in different areas (house plots in towns, shop
plots in malls, etc).</p>
<p><sub>*If a warp cannot be done in one claim due to surrounding claims, you are allowed to use up to 3
separate claims to claim everything. If you can reduce the total size of your claim by at least roughly 30%
by using an extra claim, you may do so for up to a total of 3 claims.</sub></p>
<p>It should be easy for players to find where they want to go. You can accomplish this through signs or by
designing it in such a way that players can see their destination when they warp in. Your warp's claim
border should be 500 blocks away from any other warp's claim border, and two warps can not lead to the same
area. We encourage making it possible for players to leave the warp, either by walking or elytra use, so
that they can use it as a starting point for exploring as well.</p>
<p>If you have any farms in the area of your warp that players don't benefit from through your warp it should
not be possible for players to load those farms during regular use. We don't want players being used as
chunkloaders.</p>
<p>It's important to make sure your warp is as lag friendly as possible. Our rules on lag can be found here on
the <a [routerLink]="['/lag']">lag</a> page. If we find your warp creates more lag than necessary for its
function
we will deny the application.</p>
</div>
<div class="columnContainer">
<div class="columnParagraph">
<h3>Towns</h3>
<span
style="font-family: 'opensans-bold', sans-serif;">Any warp that is designed to house other players</span>
<ul>
<li>It should be clear how to navigate the town and how to get a plot</li>
<li>You need to be active enough to regularly assign players new plots</li>
<li>Your town must have a community that actively participates in your town by living/building there or
using your towns features both before applying and while it's a warp (Minimum 3 active players other
than you)
</li>
<li>Players should be able to leave the town area in order to use the warp as a travel hub</li>
</ul>
</div>
<div class="columnParagraph">
<h3>Shops</h3>
<span style="font-family: 'opensans-bold', sans-serif;">Any warp that sells/trades/buys items using shops. This also includes malls.</span>
<ul>
<li>It should be clear where to go to find the items that are being sold from the warp spawn point</li>
<li>Your shops should sell items players want and arent readily available elsewhere</li>
<li>Your prices should be competitive with spawn and other warps</li>
<li>You are responsible for keeping stock up. Staff will regularly check random shops within your warp, if
they find understocked shops they will issue warnings for it and eventually remove it. This counts for
mall owners as well!
</li>
<li>Players should be able to leave the area in order to use the warp as a travel hub</li>
</ul>
<span style="font-family: 'opensans-bold', sans-serif;">General stock requirements</span>
<ul>
<li>Easily obtainable items such as concrete: full chest</li>
<li>Hard to obtain, common items such as diamonds: 1 stack</li>
<li>Hard to obtain, uncommon items such as netherite/beacons: 16</li>
<li>Maps: 16 for 1x1, 8 for anything over 1x1 up to 2x2, and 4 for anything over 2x2</li>
</ul>
</div>
<div class="columnParagraph">
<h2>Warp Notes</h2>
<p><span style="font-family: 'opensans-bold', sans-serif;">-</span> If a new warp application has
improvements or additional, useful features that a current warp lacks, the current warp may be replaced
with the new one. For example, if there already is a single-spawner spider farm that offers drops at a
certain price, and a warp application is submitted for a spider farm with multiple spawners and offers
free drops, the new warp is likely to be favored.</p>
<p><span style="font-family: 'opensans-bold', sans-serif;">-</span> Warps that are malls (primarily focused
on having many shop plots for many players) are limited to 2.</p>
<p><span style="font-family: 'opensans-bold', sans-serif;">-</span> Smaller shop warps are limited to 1 shop
per type. For example, only 1 warp for redstone-related shops.</p>
<p><span style="font-family: 'opensans-bold', sans-serif;">-</span> In order to always keep our warps fair
and updated, we will automatically remove a warp if the warp owner has been offline for 30+ days. We need
to be able to contact our warp owners in a timely manner incase any issues with the warp happen to pop up.
If we notice that a player is fairly inactive and another warp application comes in for a similar warp,
the application will be more likely to be accepted if the warp meets all of our requirements. If you plan
on being gone for an extended period of time, 14+ days, you can let a staff member know and they will note
it down and try to work with you.</p>
<p><span style="font-family: 'opensans-bold', sans-serif;">-</span> The staff team does weekly warp checks
to make sure our warps continue to stay up to meet our requirements. They will mail a warp owner if they
notice an issue (low stock, sudden lighting issue, farm isn't working, etc.), and we expect all issues to
be fixed within a week of receiving that mail. If an issue goes unfixed, we will remove the warp due to
the lack of upkeep. If the issue is something you need help fixing or you're unable to work on it during
the week, you can reach out to any member of the staff team and they will work with you!</p>
</div>
<div class="columnParagraph">
<h2>Useful Commands</h2>
<ul>
<li><span style="font-family: 'opensans-bold', sans-serif;">/warps -</span> Open a GUI showing all warps
</li>
<li><span style="font-family: 'opensans-bold', sans-serif;">/warps apply -</span> Apply for your own warp
</li>
</ul>
</div>
</div>
<div class="columnContainer">
<div class="columnParagraph">
<h3>Farms</h3>
<span style="font-family: 'opensans-bold', sans-serif;">Any warps that give XP</span>
<ul>
<li>It should be easy to find where to go and how to use the farm</li>
<li>Players should have access to all of the drops either through shops with competitive prices, or for
free
</li>
<li>XP farms should not attempt to bypass our anti lag systems</li>
<li>Kill chambers should be 1x1 or 1x2, exceptions to this rule are listed below</li>
<li>Amount of farms allowed as warps:
<ul>
<li>Skeleton/spider - 1 each</li>
<li>Zombie/drowned - 1</li>
<li>Bad Omen - 1</li>
<li>Raid - 2</li>
<li>Guardian - 2</li>
<li>Endermen - 2</li>
<li>Creeper - 2</li>
<li>Shulker - 2</li>
<li>Wither skeleton - 2</li>
</ul>
</li>
<p>Exceptions can be made for this rule if the farms have different, unique designs (such as a one-player
vs two-player farm). Head Staff will approve these exceptions on a case-by-case basis</p>
</ul>
<span style="font-family: 'opensans-bold', sans-serif;">Kill chamber size exceptions</span>
<ul>
<li>Magma kill chamber may be up to 3x3</li>
<li>Hoglin kill chamber may be up to 2x2</li>
<li>Ravagers during pillager raids must be killed automatically and the kill chamber should still be 2x1
for the rest of the mobs
</li>
<li>Enderman kill chamber may be up to 3x3</li>
</ul>
</div>
<div class="columnParagraph">
<h3>Other</h3>
<span style="font-family: 'opensans-bold', sans-serif;">Any warp that doesn't fit in the other categories can go in here</span>
<ul>
<li>Warps designed for player events need to look aesthetically pleasing and accommodate a large amount of
players
</li>
<li>Casino warps should, at a minimum, display or list the prizes that can be won from each game
<ul>
<li style="padding-top: 2px;">If the game allows you to win crate items, listing the rarity of prizes
that can be won is acceptable
</li>
</ul>
</li>
<li>Casino warps should have a disclaimer posted visibly that tells players that they can lose money and
should expect to lose money playing any gambling machines
</li>
<li>Portal warps need to be the only one of its kind</li>
<li>Villager trading areas have their villagers on no AI blocks and be named public for public
accessibility
</li>
</ul>
</div>
<div class="columnParagraph">
<h2>Maintaining a Warp</h2>
<p>We've made it easy for you to maintain your warp on your own. As the warp owner you can change the name,
description, and icon anytime. There is no charge for modifying a warp. To access the GUI to manage your
warp, just do <span style="font-family: 'opensans-bold', sans-serif;">/warps</span> and click on the chest
labeled "<span style="font-family: 'opensans-bold', sans-serif;">My Warps</span>" in the bottom left
corner.</p>
<img ngSrc="/public/img/random/editwarpgui.png"
alt="In-game warp edit GUI"
style="width: 80%;"
width="384" height="170">
<p>Maintaining a warp also involves making sure it looks nice, shops are well stocked, and, if it's a town,
open plots are always available for residents to move in. Make sure you keep up on maintaining your warp
or it could be deleted! If a warp is deleted by a staff member you will not receive a refund for the
creation cost.</p>
</div>
</div>
</section>
</section>
</main>
</ng-container>

View File

@ -0,0 +1,14 @@
main ul {
font-family: opensans, sans-serif;
text-align: left;
}
main li {
margin-left: 30px;
padding-bottom: 10px;
}
.columnParagraph > span {
color: var(--font-color);
transition: 0.5s ease;
}

View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { WarpsComponent } from './warps.component';
describe('WarpsComponent', () => {
let component: WarpsComponent;
let fixture: ComponentFixture<WarpsComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [WarpsComponent]
})
.compileComponents();
fixture = TestBed.createComponent(WarpsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,18 @@
import {Component} from '@angular/core';
import {HeaderComponent} from '../header/header.component';
import {NgOptimizedImage} from '@angular/common';
import {RouterLink} from '@angular/router';
@Component({
selector: 'app-warps',
imports: [
HeaderComponent,
NgOptimizedImage,
RouterLink
],
templateUrl: './warps.component.html',
styleUrl: './warps.component.scss'
})
export class WarpsComponent {
}