tabshift/pocketbase
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

removed title loader to minimize layout jumps

Browse Source
This commit is contained in:
Gani Georgiev
2026-04-23 14:12:59 +03:00
parent ae7041a889
commit a3ac674f36
5 changed files with 18 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ui/dist/assets/index-C2jyM0t-.js → ui/dist/assets/index-Bpuqi2CW.js vendored
View File

File diff suppressed because one or more lines are too long

2
ui/dist/assets/index-h3OAAQQg.css → ui/dist/assets/index-C1IKppLj.css vendored
View File

File diff suppressed because one or more lines are too long

4
ui/dist/index.html vendored
View File

@@ -13,9 +13,9 @@
<!-- prism --> <!-- prism -->
<script src="./libs/prism/prism.js" data-manual></script> <script src="./libs/prism/prism.js" data-manual></script>
<script type="module" crossorigin src="./assets/index-C2jyM0t-.js"></script> <script type="module" crossorigin src="./assets/index-Bpuqi2CW.js"></script>
<link rel="modulepreload" crossorigin href="./assets/pocketbase.es-B_4DUNUU.js"> <link rel="modulepreload" crossorigin href="./assets/pocketbase.es-B_4DUNUU.js">
<link rel="stylesheet" crossorigin href="./assets/index-h3OAAQQg.css"> <link rel="stylesheet" crossorigin href="./assets/index-C1IKppLj.css">
</head> </head>
<body> <body>
</body> </body>

8
ui/src/css/base.css
View File

@@ -894,14 +894,14 @@ hr {
background: var(--surfaceAlt1Color); background: var(--surfaceAlt1Color);
background: linear-gradient( background: linear-gradient(
90deg, 90deg,
var(--surfaceAlt1Color) 8%, var(--surfaceAlt1Color) 10%,
var(--surfaceAlt2Color) 18%, var(--surfaceAlt2Color) 25%,
var(--surfaceAlt1Color) 33% var(--surfaceAlt1Color) 60%
); );
background-size: 200% 100%; background-size: 200% 100%;
animation: animation:
fadeIn var(--animationSpeed), fadeIn var(--animationSpeed),
shine 0.8s linear infinite; shine 1s linear infinite;
&.sm { &.sm {
height: 8px; height: 8px;
} }

25
ui/src/records/recordUpsertModal.js
View File

@@ -678,20 +678,15 @@ function recordUpsertModal(collection, rawRecord, modalSettings) {
{ className: "grid" }, { className: "grid" },
t.div( t.div(
{ className: "col-12 flex" }, { className: "col-12 flex" },
t.h6({ className: "modal-title" }, () => { t.h6(
if (data.isLoading) { { className: "modal-title" },
return t.span({ className: "loader sm" }); t.span(null, () => (data.isNew ? "Create " : "Edit ")),
} t.strong(
{ className: "txt-ellipsis collection-name", style: "max-width: 220px" },
return [ () => collection.name,
t.span(null, () => (data.isNew ? "Create " : "Edit ")), ),
t.strong( t.span(null, " record"),
{ className: "txt-ellipsis collection-name", style: "max-width: 220px" }, ),
() => collection.name,
),
t.span(null, " record"),
];
}),
t.div({ className: "flex-fill" }), t.div({ className: "flex-fill" }),
() => { () => {
if (app.utils.isEmpty(data.originalRecord?.id)) { if (app.utils.isEmpty(data.originalRecord?.id)) {
@@ -702,8 +697,8 @@ function recordUpsertModal(collection, rawRecord, modalSettings) {
t.button( t.button(
{ {
type: "button", type: "button",
className: "btn sm circle transparent",
title: "More options", title: "More options",
className: () => `btn sm circle transparent ${data.isLoading ? "loading" : ""}`,
disabled: () => data.isLoading, disabled: () => data.isLoading,
"html-popovertarget": uniqueId + "modal-header-dropdown", "html-popovertarget": uniqueId + "modal-header-dropdown",
}, },