Altitude/AltitudeWeb
5
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Wiki Activity

Update particle-related styles and improve forms' structure in particle components.

Browse Source
This commit is contained in:
stijn
2025-12-27 21:13:49 +01:00
parent d9b60d8a94
commit 37d7c37f3b
6 changed files with 61 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/pages/particles/components/properties/properties.component.html
+22 -37
View File
@@ -9,9 +9,6 @@
<mat-label>Particle Name</mat-label>
<input matInput [(ngModel)]="particleData.particle_name" placeholder="Enter particle name">
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Display Name</mat-label>
<input matInput [(ngModel)]="particleData.display_name" placeholder="Enter display name">
@@ -27,16 +24,6 @@
}
</mat-select>
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Lore</mat-label>
<textarea matInput [(ngModel)]="particleData.lore" placeholder="Enter lore"></textarea>
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Display Item</mat-label>
<input matInput [(ngModel)]="particleData.display_item" placeholder="Enter display item">
@@ -44,20 +31,29 @@
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Permission</mat-label>
<input matInput [(ngModel)]="particleData.permission" placeholder="Enter permission">
<mat-form-field appearance="outline" class="lore-double">
<mat-label>Lore</mat-label>
<textarea matInput [(ngModel)]="particleData.lore" placeholder="Enter lore"></textarea>
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Package Permission</mat-label>
<mat-label>Permission name</mat-label>
<input matInput [(ngModel)]="particleData.permission" placeholder="Enter permission">
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Package name</mat-label>
<input matInput [(ngModel)]="particleData.package_permission" placeholder="Enter package permission">
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Random Offset</mat-label>
<input matInput type="number" [(ngModel)]="particleData.random_offset"
placeholder="Enter random offset">
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Frame Delay</mat-label>
<input matInput type="number" [(ngModel)]="particleData.frame_delay" placeholder="Enter frame delay">
@@ -69,27 +65,16 @@
<mat-label>Repeat</mat-label>
<input matInput type="number" [(ngModel)]="particleData.repeat" placeholder="Enter repeat count">
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Repeat Delay</mat-label>
<input matInput type="number" [(ngModel)]="particleData.repeat_delay"
placeholder="Enter repeat delay">
</mat-form-field>
</div>
placeholder="Enter repeat delay">
</mat-form-field>
</div>
<div class="form-row">
<mat-form-field appearance="outline">
<mat-label>Random Offset</mat-label>
<input matInput type="number" [(ngModel)]="particleData.random_offset"
placeholder="Enter random offset">
</mat-form-field>
</div>
<div class="form-row">
<mat-checkbox [(ngModel)]="particleData.stationary"><span>Stationary</span></mat-checkbox>
</div>
</mat-card-content>
</mat-card>
</div>
<div class="form-row">
<mat-checkbox [(ngModel)]="particleData.stationary"><span>Stationary</span></mat-checkbox>
</div>
</mat-card-content>
</mat-card>
</div>
frontend/src/app/pages/particles/components/properties/properties.component.scss
+8 -1
View File
@@ -1,5 +1,12 @@
.form-row {
margin-bottom: 15px;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
align-items: start;
}
.lore-double {
grid-column: span 2;
}
.card-div {
frontend/src/app/pages/particles/components/properties/properties.component.spec.ts
-23
View File
@@ -1,23 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { PropertiesComponent } from './properties.component';
describe('PropertiesComponent', () => {
let component: PropertiesComponent;
let fixture: ComponentFixture<PropertiesComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [PropertiesComponent]
})
.compileComponents();
fixture = TestBed.createComponent(PropertiesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});