lucent/lucent-laravel
2
0
Fork 0
Code Issues 14 Pull Requests Releases 1 Activity

theming

Browse Source
This commit is contained in:
Alex Lingris
2024-08-18 19:04:32 +03:00
parent 5d6869c118
commit 50c8af7bda
10 changed files with 156 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/js/svelte/records/Info.svelte
+29 -44
View File
@@ -2,7 +2,7 @@
import {friendlyDate} from "../../helpers";
import Avatar from "../account/Avatar.svelte";
import {usernameById} from "../account/users";
import {isEqual, sortBy} from "lodash";
import {isEqual} from "lodash";
import Icon from "../common/Icon.svelte";
import RevisionCell from "./revisions/RevisionCell.svelte";
import {getContext} from "svelte";
@@ -123,19 +123,19 @@
</div>
</div>
</div>
<div class="lx-card mt-4">
<div class="revisions">
{#if schema.revisions > 0}
<div class="header-small mb-3">Revisions</div>
{#each revisions as revision}
{#if revision._sys.version != record._sys.version}
{#if revision._sys.version !== record._sys.version}
<div
class="row p-2 rounded"
class="revision"
class:active={revision._sys.version ===
selectedRevision?._sys.version}
>
<div class="col-2">version {revision._sys.version}</div>
<div class="col-5">
<div class="version">
<span>version {revision._sys.version}</span>
<Avatar
name={usernameById(users, revision._sys.updatedBy)}
side={24}
@@ -147,7 +147,7 @@
<button
disabled={revision._sys.version ===
selectedRevision?._sys.version}
class="btn btn-sm btn-outline-primary"
class="button"
on:click={(e) => compare(e, revision)}
>Compare
</button
@@ -164,14 +164,14 @@
</div>
<div bind:this={revisionSection}>
{#if selectedRevision}
<div class="mt-4">
<div class="selected-revision">
{#if fieldsWithDiff.length > 0}
<p class="text-center fw-bold mb-3 mt-5">
If you choose to rollback to this revision
</p>
<button
on:click={rollback}
class="btn btn-primary mb-5 d-block mx-auto"
class="button"
>
Rollback to version {selectedRevision._sys.version}
</button>
@@ -189,29 +189,25 @@
{field.label}
</div> -->
<div
class="lx-card row p-4 mb-4 w-100"
class="revision-field"
style="overflow:hidden"
>
<div class="col-5">
<div class="compare-left">
<RevisionCell
{field}
side={record.data[field.name]}
colorClass="text-danger"
/>
</div>
<div class="col-2">
<div
class="h-100 d-flex align-items-center justify-content-center text-secondary"
>
<span class="me-1">{field.label}</span>
<Icon
icon="angle-right"
width="12"
height="12"
/>
</div>
<div class="compare-center">
<span class="me-1">{field.label}</span>
<Icon
icon="angle-right"
width="12"
height="12"
/>
</div>
<div class="col-5">
<div class="compare-right">
<RevisionCell
edges={selectedRevision._edges}
{field}
@@ -235,22 +231,25 @@
</p>
{#each Object.entries(edgeFieldsDiff) as [field, edges]}
<div
class="lx-card row p-4 mb-4 w-100"
class="revision-references"
style="overflow:hidden"
>
<div class="col-4">
<div class="reference-field">
{field}:
</div>
<div class="col-8">
<p class="mb-2 text-danger">Record</p>
<div class="reference-compare">
<p class="">Record</p>
{#each edges.record as edge}
<RevisionEdgeRow {edge} />
<RevisionEdgeRow {edge}/>
{:else}
<p>No references</p>
{/each}
<p class="mt-4 mb-2 text-success">Revision</p>
</div>
<div class="reference-compare">
<p class="text-success">Revision</p>
{#each edges.revision as edge}
<RevisionEdgeRow {edge} />
<RevisionEdgeRow {edge}/>
{:else}
<p>No references</p>
{/each}
@@ -263,17 +262,3 @@
{/if}
</div>
<style>
.label {
width: 180px;
margin-right: 10px;
margin-bottom: 4px;
display: inline-block;
}
.active {
background-color: #eee;
border: 1px solid #ccc;
}
</style>