Terncode/pixel.horse
1
0
Fork 0
mirror of https://github.com/Terncode/pixel.horse.git synced 2026-09-25 22:25:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

Migrate bootstrap to version 5

Browse Source
This commit is contained in:
Terncode
2026-08-05 13:50:06 +02:00
parent 3cfdd34b6f
commit f74dba4da6
87 changed files with 853 additions and 647 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ts/components/app/about/about.pug
+1 -1
View File
@@ -29,7 +29,7 @@ h1(focusTitle) About
.row.team-members
.col-md-6(*ngFor="let c of credits")
.team-member
.team-avatar.float-left(
.team-avatar.float-start(
[style.background-image]="c.background"
[style.background-position]="c.position"
style="background-size: 328px 246px")
src/ts/components/app/account/account.pug
+10 -10
View File
@@ -16,7 +16,7 @@ h1(focusTitle) Account settings
.form-group
label(for="birthdate")
| Date of birth
fa-icon.ml-1.text-danger(*ngIf="showAccountAlert" [icon]="alertIcon" title="Missing field value")
fa-icon.ms-1.text-danger(*ngIf="showAccountAlert" [icon]="alertIcon" title="Missing field value")
date-picker([(date)]="data.birthdate")
.form-group(*ngIf="accountError")
.alert.alert-danger
@@ -24,7 +24,7 @@ h1(focusTitle) Account settings
.form-group(*ngIf="accountSaved")
.alert.alert-success
| Changes saved
.form-group.text-right
.form-group.text-end
button.btn.btn-default(type="submit" [disabled]="!canSubmit" style="min-width: 100px;")
| {{saveButtonText}}
@@ -40,8 +40,8 @@ h1(focusTitle) Account settings
ul.list-unstyled
li.item-connected-account.d-flex.justify-content-between(*ngFor="let s of sites")
a([href]="s.url" target="_blank" rel="noopener noreferrer")
fa-icon.mr-1([icon]="icon(s.icon)" [fixedWidth]="true")
b #[span.sr-only {{s.icon}}] {{s.name}}
fa-icon.me-1([icon]="icon(s.icon)" [fixedWidth]="true")
b #[span.visually-hidden {{s.icon}}] {{s.name}}
button.btn.btn-sm.btn-danger(*ngIf="sites.length > 1" (click)="removeSite(s)" [disabled]="removingSite")
| remove
@@ -57,8 +57,8 @@ h1(focusTitle) Account settings
| connect another social site to this account
.dropdown-menu(*dropdownMenu)
button.dropdown-item(*ngFor="let p of providers" (click)="connectSite(p)")
fa-icon.mr-1([icon]="icon(p.id)" [fixedWidth]="true")
| #[span.sr-only {{p.name}}] {{p.name}}
fa-icon.me-1([icon]="icon(p.id)" [fixedWidth]="true")
| #[span.visually-hidden {{p.name}}] {{p.name}}
.form-group(*ngIf="mergeError")
.alert.alert-danger
@@ -79,11 +79,11 @@ h1(focusTitle) Account settings
.col-md-6
div(style="margin-bottom: 100px;")
.form-group
.float-right
.float-end
span.text-muted Page: {{page + 1}}
button.btn.btn-sm.btn-outline-secondary.ml-2((click)="page = page - 1; pageChanged()" [disabled]="!hides || page === 0")
button.btn.btn-sm.btn-outline-secondary.ms-2((click)="page = page - 1; pageChanged()" [disabled]="!hides || page === 0")
| Previous page
button.btn.btn-sm.btn-outline-secondary.ml-1((click)="page = page + 1; pageChanged()" [disabled]="!hides || hides.length < hidesPerPage")
button.btn.btn-sm.btn-outline-secondary.ms-1((click)="page = page + 1; pageChanged()" [disabled]="!hides || hides.length < hidesPerPage")
| Next page
h3 Hidden players
@@ -94,6 +94,6 @@ h1(focusTitle) Account settings
.text-muted.text-center.p-4(*ngIf="!hides.length") no hidden players
li.item-connected-account.d-flex.align-items-center(*ngFor="let h of hides")
b.flex-grow-1 {{h.name}}
span.text-muted.mr-2 hidden {{h.date}}
span.text-muted.me-2 hidden {{h.date}}
button.btn.btn-sm.btn-danger((click)="unhidePlayer(h)")
| unhide player
src/ts/components/app/app.pug
+5 -5
View File
@@ -34,15 +34,15 @@
.app-version
| version #[b {{version}}]
.text-right
.text-end
.d-flex.flex-wrap
//- .text-nowrap.mr-2
//- .text-nowrap.me-2
| &copy; 2019-{{date | date:'yyyy'}}
| #[a.text-muted.mr-1([href]="twitterLink" target="_blank") {{copyright}}] |
| #[a.text-muted.me-1([href]="twitterLink" target="_blank") {{copyright}}] |
.text-nowrap
a.text-muted.mr-2(*ngIf="twitterLink" [href]="twitterLink" target="_blank" title="Twitter")
a.text-muted.me-2(*ngIf="twitterLink" [href]="twitterLink" target="_blank" title="Twitter")
fa-icon([icon]="twitterIcon" [fixedWidth]="true")
a.text-muted.mr-2(*ngIf="contactEmail" href="mailto:{{contactEmail}}" target="_blank" title="Email")
a.text-muted.me-2(*ngIf="contactEmail" href="mailto:{{contactEmail}}" target="_blank" title="Email")
fa-icon([icon]="emailIcon" [fixedWidth]="true")
div
a.text-muted.privacy-policy(href="/privacypolicy.html" target="_blank" rel="noopener") privacy policy
src/ts/components/app/app.scss
+3 -3
View File
@@ -17,7 +17,7 @@ main {
padding-bottom: 100px;
flex-grow: 1;
@include media-breakpoint-down(sm) {
@include media-breakpoint-down(md) {
padding-top: 20px;
padding-bottom: 50px;
}
@@ -28,7 +28,7 @@ footer {
justify-content: space-between;
padding-bottom: 20px;
@include media-breakpoint-down(xs) {
@include media-breakpoint-down(sm) {
white-space: normal !important;
display: block;
font-size: 16px;
@@ -37,7 +37,7 @@ footer {
padding-bottom: 10px;
}
.text-right {
.text-end {
text-align: left !important;
}
src/ts/components/app/character/character.pug
+15 -15
View File
@@ -1,5 +1,5 @@
ng-template(#descriptionTooltip)
.text-left
.text-start
p Description and tags help you organize and search for your ponies.
p Use # tags to be able to quickly find specific ponies like #oc #winter or #unicorn
p
@@ -10,8 +10,8 @@ page-loader(*ngIf="!playing")
.row(*ngIf="!playing && !loading")
.col-lg-6.text-center
h1.sr-only(focusTitle) Characters
h2.sr-only Character selection
h1.visually-hidden(focusTitle) Characters
h2.visually-hidden Character selection
.mx-auto(style="max-width: 400px;")
discord-button.mb-3
visit-pt-button.mb-3
@@ -27,16 +27,16 @@ page-loader(*ngIf="!playing")
.form-group.text-center
button.btn.btn-lg.btn-default([disabled]="!canDuplicate" (click)="duplicate()" aria-label="Duplicate character")
| Duplicate
button.btn.btn-lg.btn-default.ml-2([disabled]="!canRevert" (click)="revert()" aria-label="Revert changes")
button.btn.btn-lg.btn-default.ms-2([disabled]="!canRevert" (click)="revert()" aria-label="Revert changes")
| Revert
button.btn.btn-lg.btn-default.ml-2([disabled]="!canSave" (click)="save()" aria-label="Save character")
button.btn.btn-lg.btn-default.ms-2([disabled]="!canSave" (click)="save()" aria-label="Save character")
| Save
play-box(label="Save & Play" [(error)]="error")
play-notice
.col-lg-6.character-tabs([setOutlineHidden]="!customOutlines" [class.character-tab-warning]="updateWarning")
h2.sr-only Character customization
h2.visually-hidden Character customization
tabset(type="pills" *ngIf="loaded" saveActiveTab="character-active-tab" label="Character customization")
tab(title="body")
.character-tab(*tabContent)
@@ -71,8 +71,8 @@ page-loader(*ngIf="!playing")
label.col-sm-4.col-form-label Export/Import options
.col-sm-8
button.btn.btn-sm.btn-default((click)="exportPony()") Export pony
button.btn.btn-sm.btn-default.ml-1((click)="exportPonies()") Export all ponies
button.btn.btn-sm.btn-default.ml-1((click)="importFile.click()") Import ponies
button.btn.btn-sm.btn-default.ms-1((click)="exportPonies()") Export all ponies
button.btn.btn-sm.btn-default.ms-1((click)="importFile.click()") Import ponies
input.d-none(#importFile type="file" (change)="importPonies(importFile.files[0])")
.row.form-group
@@ -81,18 +81,18 @@ page-loader(*ngIf="!playing")
.dropdown.btn-group(dropdown)
button.btn.btn-default.dropdown-toggle(
dropdownToggle aria-labelledby="social-site-label" aria-describedby="social-site-help")
fa-icon.mr-1(
fa-icon.me-1(
*ngIf="site?.icon" [icon]="icon(site.icon)" [fixedWidth]="true" [style.color]="site.color"
size="lg" [attr.aria-label]="site.icon")
strong {{site?.name}}
.dropdown-menu(*dropdownMenu)
a.dropdown-item(*ngFor="let s of sites" (click)="site = s")
fa-icon.mr-1(
fa-icon.me-1(
*ngIf="s.icon" [icon]="icon(s.icon)" [fixedWidth]="true" [style.color]="s.color"
size="lg" [attr.aria-label]="s.icon")
strong {{s.name}}
.dropdown.btn-group.ml-1(dropdown *ngIf="tags.length > 1")
.dropdown.btn-group.ms-1(dropdown *ngIf="tags.length > 1")
button.btn.btn-default.dropdown-toggle(dropdownToggle aria-label="Show tag")
span.badge(*ngIf="tag.id" [ngClass]="'badge-' + tag.className") {{tag.id}}
strong(*ngIf="!tag.id") {{tag.name}}
@@ -107,7 +107,7 @@ page-loader(*ngIf="!playing")
.row.form-group
label.col-sm-4.col-form-label(for="description")
| Description
fa-icon.text-muted.ml-2([icon]="infoIcon" [tooltip]="descriptionTooltip" containerClass="tooltip-desc")
fa-icon.text-muted.ms-2([icon]="infoIcon" [tooltip]="descriptionTooltip" containerClass="tooltip-desc")
.col-sm-8
input.form-control#description(
[(ngModel)]="pony.desc" placeholder="example: with a hat #oc #winter" [maxlength]="maxDescLength")
@@ -125,7 +125,7 @@ page-loader(*ngIf="!playing")
.input-group-append.dropdown(*ngIf="canSaveFiles" dropdown)
button.btn.btn-default.dropdown-toggle(dropdownToggle *ngIf="canExport" aria-label="Export / Import")
fa-icon([icon]="codeIcon")
.dropdown-menu.dropdown-menu-right(*dropdownMenu)
.dropdown-menu.dropdown-menu-end(*dropdownMenu)
a.dropdown-item((click)="export()") export all
a.dropdown-item((click)="import()") import data
a.dropdown-item((click)="testSize()") print compressed
@@ -137,7 +137,7 @@ page-loader(*ngIf="!playing")
fa-icon([icon]="saveIcon")
button.btn.btn-default.dropdown-toggle(dropdownToggle style="min-width: 80px")
strong {{animations[activeAnimation]().name}}
.dropdown-menu.dropdown-menu-right(*dropdownMenu)
.dropdown-menu.dropdown-menu-end(*dropdownMenu)
a.dropdown-item(*ngFor="let a of animations; let i = index" (click)="setActiveAnimation(i)")
| {{a().name}}
@@ -382,7 +382,7 @@ page-loader(*ngIf="!playing")
.accessory-tab(*tabContent)
.form-group.d-flex.justify-content-center.pt-2
custom-checkbox([(checked)]="previewExtra") show preview
em.text-muted.ml-2
em.text-muted.ms-2
| (you have to enable these accessories in-game)
set-selection(
label="Extra accessories" [set]="info.extraAccessory" [sets]="extraAccessories"
src/ts/components/app/character/character.scss
+2 -2
View File
@@ -28,7 +28,7 @@
background: $grass-color;
border-radius: $border-radius-lg;
@include media-breakpoint-down(sm) {
@include media-breakpoint-down(md) {
width: 280px;
height: 280px;
}
@@ -49,7 +49,7 @@
justify-content: space-between;
> .lock-box {
@include media-breakpoint-down(xs) {
@include media-breakpoint-down(sm) {
margin-right: 0;
margin-bottom: 5px;
}
src/ts/components/app/editor-box/editor-box.pug
+13 -13
View File
@@ -2,17 +2,17 @@
button.game-button.px-2((click)="toggleEditor()")
fa-icon([icon]="editIcon")
.d-flex.align-items-start.pl-2.pt-1(*ngIf="hasEditor")
.d-flex.align-items-start.ps-2.pt-1(*ngIf="hasEditor")
.dropdown-menu.p-0(*ngIf="hasSelectedEntities" style="display: block; width: 500px; position: absolute; top: 36px; left: 0;")
.px-2
//- name
div
.row.form-group.mb-2
label.col-12.col-form-label
.float-right
button.btn.btn-xs.btn-dark.ml-1((click)="showEntitiesInfo()" title="Show info")
.float-end
button.btn.btn-xs.btn-dark.ms-1((click)="showEntitiesInfo()" title="Show info")
| info
button.btn.btn-xs.btn-danger.ml-1((click)="deleteEntities()" title="Delete entities")
button.btn.btn-xs.btn-danger.ms-1((click)="deleteEntities()" title="Delete entities")
fa-icon([icon]="deleteIcon")
| {{entityName}}
@@ -70,7 +70,7 @@
a.dropdown-item(*ngFor="let e of editorEntities" (click)="editorEntity = e")
| {{e}}
.dropdown.ml-1(dropdown)
.dropdown.ms-1(dropdown)
button.btn.btn-sm.btn-default.dropdown-toggle(dropdownToggle)
fa-icon([icon]="cogIcon")
.dropdown-menu(*dropdownMenu)
@@ -83,21 +83,21 @@
div(*ngIf="dev")
h6.dropdown-header Show (numpad 4)
a.dropdown-item(*ngFor="let field of showFields" (click)="toggleShow(field); $event.stopPropagation()")
fa-icon.mr-1([icon]="isShow(field) ? checkIcon : emptyIcon" [fixedWidth]="true")
fa-icon.me-1([icon]="isShow(field) ? checkIcon : emptyIcon" [fixedWidth]="true")
| {{field}}
button.btn.btn-sm.btn-default.ml-1(
button.btn.btn-sm.btn-default.ms-1(
[btnHighlight]="selectingEntities" (click)="toggleSelecting()" title="Select entities")
fa-icon([icon]="selectIcon")
.dropdown.ml-1(dropdown)
.dropdown.ms-1(dropdown)
button.btn.btn-sm.btn-default.dropdown-toggle(dropdownToggle)
| tile: {{tiles[editorTile + 1]}}
.dropdown-menu(*dropdownMenu)
a.dropdown-item(*ngFor="let t of tiles; let i = index" (click)="editorTile = i - 1")
| {{t}}
.dropdown.ml-1(dropdown)
.dropdown.ms-1(dropdown)
button.btn.btn-sm.btn-default.dropdown-toggle(dropdownToggle)
| brush: {{editor.brushSize}}
.dropdown-menu(*dropdownMenu)
@@ -108,7 +108,7 @@
a.dropdown-item((click)="editor.brushSize = 5") 5
a.dropdown-item((click)="editor.brushSize = 6") 6
.dropdown.ml-1(dropdown [autoClose]="false")
.dropdown.ms-1(dropdown [autoClose]="false")
button.btn.btn-sm.btn-default.dropdown-toggle(dropdownToggle)
| global
.dropdown-menu(*dropdownMenu style="width: 400px")
@@ -125,14 +125,14 @@
.col-7.py-2
slider-bar([(value)]="shadowOpacity" [min]="0" [max]="255")
.dropdown.ml-1(dropdown)
.dropdown.ms-1(dropdown)
button.btn.btn-sm.btn-default.dropdown-toggle(dropdownToggle)
| engine
.dropdown-menu(*dropdownMenu)
a.dropdown-item(*ngFor="let e of engines" (click)="setEngine(e)" [class.active]="isActiveEngine(e)")
| {{e.name}}
.btn.btn-sm.btn-default.disabled.ml-1(*ngIf="hasElevation")
.btn.btn-sm.btn-default.disabled.ms-1(*ngIf="hasElevation")
| elevation: {{editorElevation}}
.btn.btn-sm.btn-default.disabled.ml-1(*ngIf="hasElevation")
.btn.btn-sm.btn-default.disabled.ms-1(*ngIf="hasElevation")
| special: {{editorSpecial}}
src/ts/components/app/help/help.pug
+3 -3
View File
@@ -18,7 +18,7 @@ h1(focusTitle) Help
ul.spaced-list
li
b movement
.pl-2.mb-1.
.ps-2.mb-1.
Use
#[kbd-key(title="up arrow key"): fa-icon([icon]="upIcon")]
#[kbd-key(title="left arrow key"): fa-icon([icon]="leftIcon")]
@@ -36,7 +36,7 @@ h1(focusTitle) Help
Hold #[kbd-key(title="shift key") shift] to walk slowly.
li
b chat
.pl-2.mb-1.
.ps-2.mb-1.
Use #[kbd-key(title="enter key") enter]
or #[kbd-key.gamepad.gamepad-blue(title="Gamepad X button") X]
to open chat box and send a message.
@@ -167,7 +167,7 @@ h1(focusTitle) Help
.emotes
ul
li(*ngFor="let e of emotes")
span.emote-sample.mr-2
span.emote-sample.me-2
emote-box([emote]="e")
| :{{e}}:
src/ts/components/app/home/home.pug
+1 -1
View File
@@ -6,7 +6,7 @@ div(*ngIf="!playing")
page-loader
div(*ngIf="!loading")
h1.sr-only(focusTitle) Home
h1.visually-hidden(focusTitle) Home
.form-group(*ngIf="authError")
.alert.alert-danger(role="alert")
src/ts/components/app/home/home.scss
+3 -3
View File
@@ -3,7 +3,7 @@
.home-logo {
width: 574px;
@include media-breakpoint-down(sm) {
@include media-breakpoint-down(md) {
width: 287px;
}
}
@@ -12,7 +12,7 @@
max-width: 400px;
margin-top: 50px;
@include media-breakpoint-down(md) {
@include media-breakpoint-down(lg) {
margin-top: 15px;
}
}
@@ -20,7 +20,7 @@
.heading {
margin-bottom: 50px;
@include media-breakpoint-down(sm) {
@include media-breakpoint-down(md) {
margin-bottom: 20px;
}
}