plexora 0.0.1__py3-none-any.whl

plexora/client/src/css/openProject.css

@@ -0,0 +1,363 @@
+/* Open Project page (open_project.html). Reuses the shared design tokens
+   from tokens.css (loaded by base.html on every page), same authoring
+   style as quickView.css. */
+
+.open-project-page {
+    background: var(--surface-0);
+    box-sizing: border-box;
+    margin: 0 auto;
+    max-width: 1200px;
+    min-height: 95vh;
+    padding: var(--space-6);
+}
+
+.open-project-header {
+    align-items: flex-start;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: var(--space-5);
+}
+
+.open-project-header h1 {
+    color: var(--text-primary);
+    font-size: 26px;
+    font-weight: 700;
+    margin: 0;
+}
+
+.open-project-subtitle {
+    color: var(--text-muted);
+    font-size: 13px;
+    margin: var(--space-1) 0 0;
+}
+
+.open-project-create {
+    align-items: center;
+    display: inline-flex;
+    gap: var(--space-2);
+    white-space: nowrap;
+}
+
+/* [ Projects ] [ Figures ] -- rendered only when a plugin contributes a tab.
+   Core's look, whoever contributed the entry: a plugin supplies a label and a
+   destination and gets no say in how either is drawn. */
+.open-project-tabs {
+    border-bottom: 1px solid var(--border-subtle);
+    display: flex;
+    gap: var(--space-4);
+    margin-bottom: var(--space-5);
+}
+
+.open-project-tab {
+    border-bottom: 2px solid transparent;
+    color: var(--text-muted);
+    cursor: pointer;
+    font-size: 14px;
+    font-weight: 600;
+    padding: 0 0 var(--space-2);
+    text-decoration: none;
+    transition: color var(--duration-fast) var(--ease-standard),
+        border-color var(--duration-fast) var(--ease-standard);
+}
+
+.open-project-tab:hover {
+    color: var(--text-primary);
+}
+
+.open-project-tab.is-active {
+    border-bottom-color: var(--accent-channel);
+    color: var(--text-primary);
+}
+
+.open-project-toolbar {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--space-3);
+    margin-bottom: var(--space-5);
+}
+
+.open-project-search {
+    align-items: center;
+    background: var(--surface-1);
+    border: 1px solid var(--border-subtle);
+    border-radius: var(--radius-md);
+    display: flex;
+    flex: 1 1 260px;
+    gap: var(--space-2);
+    padding: 0 var(--space-3);
+}
+
+.open-project-search .fa-magnifying-glass {
+    color: var(--text-muted);
+    font-size: 13px;
+}
+
+.open-project-search input {
+    background: transparent;
+    border: none;
+    color: var(--text-primary);
+    flex: 1;
+    font-size: 14px;
+    min-width: 0;
+    padding: 10px 0;
+}
+
+.open-project-search input:focus {
+    outline: none;
+}
+
+.open-project-sort {
+    background: var(--surface-1);
+    border: 1px solid var(--border-subtle);
+    border-radius: var(--radius-md);
+    color: var(--text-primary);
+    font-size: 13px;
+    padding: 10px var(--space-3);
+}
+
+.open-project-view-toggle {
+    display: flex;
+    gap: 2px;
+}
+
+.view-toggle-button {
+    background: var(--surface-1);
+    border: 1px solid var(--border-subtle);
+    color: var(--text-muted);
+    cursor: pointer;
+    padding: 9px var(--space-3);
+    transition: background var(--duration-fast) var(--ease-standard),
+        color var(--duration-fast) var(--ease-standard);
+}
+
+.view-toggle-button:first-child {
+    border-radius: var(--radius-md) 0 0 var(--radius-md);
+}
+
+.view-toggle-button:last-child {
+    border-left: none;
+    border-radius: 0 var(--radius-md) var(--radius-md) 0;
+}
+
+.view-toggle-button:hover {
+    color: var(--text-primary);
+}
+
+.view-toggle-button.active {
+    background: var(--accent-channel-soft);
+    color: var(--accent-channel);
+}
+
+/* Grid view */
+.project-grid {
+    display: grid;
+    gap: var(--space-4);
+    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+}
+
+.project-card {
+    background: var(--surface-1);
+    border: 1px solid var(--border-subtle);
+    border-radius: var(--radius-lg);
+    overflow: hidden;
+    position: relative;
+    transition: border-color var(--duration-base) var(--ease-standard),
+        transform var(--duration-base) var(--ease-standard);
+}
+
+.project-card:hover {
+    border-color: var(--accent-channel);
+    transform: translateY(-2px);
+}
+
+.project-card-link {
+    color: inherit;
+    display: block;
+    text-decoration: none;
+}
+
+.project-card .project-thumb {
+    aspect-ratio: 4 / 3;
+}
+
+.project-card-name {
+    color: var(--text-primary);
+    display: block;
+    font-size: 14px;
+    font-weight: 600;
+    overflow: hidden;
+    padding: var(--space-3) var(--space-3) 0;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.project-card-date {
+    color: var(--text-muted);
+    display: block;
+    font-size: 12px;
+    padding: 2px var(--space-3) var(--space-3);
+}
+
+.project-card .project-actions {
+    position: absolute;
+    right: var(--space-2);
+    top: var(--space-2);
+}
+
+/* Marks a project that lives on a shared data directory rather than this
+   user's own. Sits inside the date caption so it needs no layout of its own,
+   and is absent entirely on an install with no shared roots configured. */
+.project-shared {
+    align-items: center;
+    color: var(--text-muted);
+    display: inline-flex;
+    gap: 4px;
+    margin-left: var(--space-2);
+}
+
+.project-shared .fas {
+    font-size: 10px;
+}
+
+/* List view */
+.project-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-2);
+}
+
+.project-row {
+    align-items: center;
+    background: var(--surface-1);
+    border: 1px solid var(--border-subtle);
+    border-radius: var(--radius-md);
+    display: flex;
+    position: relative;
+    transition: border-color var(--duration-base) var(--ease-standard);
+}
+
+.project-row:hover {
+    border-color: var(--accent-channel);
+}
+
+.project-row-link {
+    align-items: center;
+    color: inherit;
+    display: flex;
+    flex: 1;
+    gap: var(--space-3);
+    min-width: 0;
+    padding: var(--space-2) var(--space-3);
+    text-decoration: none;
+}
+
+.project-row .project-thumb {
+    border-radius: var(--radius-sm);
+    flex: 0 0 auto;
+    height: 44px;
+    width: 44px;
+}
+
+.project-row-name {
+    color: var(--text-primary);
+    flex: 1;
+    font-size: 14px;
+    font-weight: 600;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.project-row-date {
+    color: var(--text-muted);
+    flex: 0 0 auto;
+    font-size: 12px;
+}
+
+.project-row .project-actions {
+    display: flex;
+    padding-right: var(--space-3);
+}
+
+/* Shared: thumbnail + action buttons */
+.project-thumb {
+    align-items: center;
+    background: linear-gradient(135deg, var(--surface-2), var(--surface-1));
+    display: flex;
+    justify-content: center;
+    overflow: hidden;
+    position: relative;
+}
+
+.project-thumb img {
+    height: 100%;
+    inset: 0;
+    object-fit: cover;
+    position: absolute;
+    width: 100%;
+}
+
+.project-thumb-icon {
+    color: var(--text-muted);
+    font-size: 20px;
+}
+
+.project-card .project-thumb-icon {
+    font-size: 28px;
+}
+
+.project-actions {
+    display: flex;
+    gap: var(--space-1);
+}
+
+.project-action {
+    align-items: center;
+    background: rgba(5, 7, 10, 0.82);
+    border: 1px solid var(--border-strong);
+    border-radius: var(--radius-sm);
+    box-shadow: var(--shadow-sm);
+    color: var(--text-primary);
+    display: flex;
+    font-size: 12px;
+    height: 26px;
+    justify-content: center;
+    text-decoration: none;
+    transition: background var(--duration-fast) var(--ease-standard),
+        border-color var(--duration-fast) var(--ease-standard);
+    width: 26px;
+}
+
+.project-action:hover {
+    background: rgba(5, 7, 10, 0.95);
+    border-color: var(--text-secondary);
+}
+
+.project-action-danger:hover {
+    border-color: var(--accent-danger);
+    color: var(--accent-danger);
+}
+
+/* Empty / no-results states */
+.open-project-state {
+    align-items: center;
+    color: var(--text-muted);
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-3);
+    padding: var(--space-6) 0;
+    text-align: center;
+}
+
+.open-project-state-icon {
+    color: var(--text-muted);
+    font-size: 32px;
+}
+
+.open-project-state p {
+    color: var(--text-secondary);
+    font-size: 14px;
+    margin: 0;
+}

plexora/client/src/css/quickView.css

@@ -0,0 +1,166 @@
+/* Quick-view landing page (index.html's {% else %} branch, no datasource
+   loaded yet). Reuses the shared design tokens from tokens.css (loaded by
+   base.html on every page) so this matches the viewer's look. */
+
+.quick-view-landing {
+    align-items: center;
+    background: var(--surface-0);
+    box-sizing: border-box;
+    display: flex;
+    height: 95vh;
+    justify-content: center;
+    overflow: hidden;
+    padding: var(--space-6);
+    position: relative;
+    width: 100vw;
+}
+
+.quick-view-landing::before {
+    animation: quick-view-drift 24s ease-in-out infinite alternate;
+    background:
+        radial-gradient(circle at 20% 30%, var(--accent-channel-soft), transparent 45%),
+        radial-gradient(circle at 80% 70%, var(--accent-gate-soft), transparent 45%);
+    content: "";
+    inset: -20%;
+    opacity: 0.35;
+    position: absolute;
+    z-index: 0;
+}
+
+@keyframes quick-view-drift {
+    0%   { transform: translate(-3%, -2%) scale(1); }
+    100% { transform: translate(3%, 2%) scale(1.08); }
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .quick-view-landing::before {
+        animation: none;
+    }
+}
+
+.quick-view-card {
+    box-sizing: border-box;
+    max-width: 640px;
+    position: relative;
+    text-align: center;
+    width: 100%;
+    z-index: 1;
+}
+
+.quick-view-card h1 {
+    color: var(--text-primary);
+    font-size: 28px;
+    font-weight: 700;
+    margin: var(--space-1) 0 var(--space-2);
+}
+
+.quick-view-subtitle {
+    color: var(--text-secondary);
+    font-size: 14px;
+    margin: 0 0 var(--space-5);
+}
+
+.quick-view-path-fallback {
+    margin-top: var(--space-5);
+}
+
+.quick-view-path-label {
+    color: var(--text-secondary);
+    display: block;
+    font-size: 12px;
+    font-weight: 600;
+    letter-spacing: 0.02em;
+    text-align: left;
+    text-transform: uppercase;
+    margin-bottom: var(--space-2);
+}
+
+.quick-view-path-row {
+    display: flex;
+    gap: var(--space-2);
+}
+
+.quick-view-path-row input[type="text"] {
+    background: var(--surface-1);
+    border: 1px solid var(--border-strong);
+    border-radius: var(--radius-md);
+    color: var(--text-primary);
+    flex: 1;
+    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
+    font-size: 15px;
+    min-width: 0;
+    padding: 14px var(--space-4);
+}
+
+.quick-view-path-row input[type="text"]:focus {
+    border-color: var(--accent-channel);
+    outline: none;
+}
+
+.quick-view-path-row input[type="text"].is-invalid {
+    border-color: var(--accent-danger);
+}
+
+.quick-view-path-row .sidebar-action {
+    /* .sidebar-action (viewer.css) is width: 100% for its usual full-width
+       sidebar buttons -- override back to content width so it doesn't eat
+       the flex row meant for the path input. */
+    flex: 0 0 auto;
+    font-size: 14px;
+    padding: 0 var(--space-5);
+    width: auto;
+}
+
+.quick-view-dropzone {
+    background: var(--surface-1);
+    border: 2px dashed var(--border-strong);
+    border-radius: var(--radius-lg);
+    cursor: pointer;
+    padding: var(--space-5) var(--space-4);
+    transition: border-color var(--duration-base) var(--ease-standard),
+        background var(--duration-base) var(--ease-standard);
+}
+
+.quick-view-dropzone:hover,
+.quick-view-dropzone:focus-visible {
+    background: var(--surface-2);
+    border-color: var(--accent-channel);
+}
+
+.quick-view-dropzone-icon {
+    color: var(--accent-channel);
+    font-size: 36px;
+}
+
+.quick-view-dropzone-text {
+    color: var(--text-primary);
+    font-size: 15px;
+    font-weight: 600;
+    margin-top: var(--space-3);
+}
+
+.quick-view-dropzone-hint {
+    color: var(--text-muted);
+    font-size: 12px;
+    margin-top: var(--space-1);
+}
+
+.quick-view-status {
+    color: var(--text-secondary);
+    font-size: 13px;
+    margin-top: var(--space-4);
+}
+
+.quick-view-status.error {
+    color: var(--accent-danger);
+}
+
+.quick-view-footer {
+    color: var(--text-muted);
+    font-size: 12px;
+    margin: var(--space-5) 0 0;
+}
+
+.quick-view-footer a {
+    color: var(--accent-channel);
+}

plexora/client/src/css/tokens.css

@@ -0,0 +1,51 @@
+/* Shared design tokens, loaded once in base.html so every page (including
+   ones that don't load viewer.css/import.css, e.g. the navbar on the plain
+   quick-view/channel-match pages) has them available. Previously this :root
+   block was duplicated separately in viewer.css and import.css, and had
+   already drifted between the two (different --duration-base, import.css
+   missing --accent-gate tokens, viewer.css missing --accent-warning,
+   --accent-success and --accent-danger-soft). This file is the single
+   source of truth; the --duration-base value below (180ms) is viewer.css's
+   former value, kept since it's the larger/more actively maintained
+   consumer. */
+:root {
+    --surface-0: #05070a;
+    --surface-1: #0b0f15;
+    --surface-2: #121820;
+    --border-subtle: rgba(255, 255, 255, 0.12);
+    --border-strong: rgba(255, 255, 255, 0.22);
+    --text-primary: #f8fafc;
+    --text-secondary: #d8e1ed;
+    --text-muted: #8ea0b8;
+    --accent-gate: #f36f45;
+    --accent-gate-soft: rgba(243, 111, 69, 0.34);
+    --accent-channel: #38bdf8;
+    --accent-channel-soft: rgba(56, 189, 248, 0.36);
+    --accent-danger: #f87171;
+    --accent-danger-soft: rgba(248, 113, 113, 0.14);
+    --accent-warning: #f3b845;
+    --accent-warning-soft: rgba(243, 184, 69, 0.14);
+    --accent-success: #34d399;
+    --space-1: 4px;
+    --space-2: 8px;
+    --space-3: 12px;
+    --space-4: 16px;
+    --space-5: 20px;
+    --space-6: 24px;
+    --radius-sm: 6px;
+    --radius-md: 8px;
+    --radius-lg: 12px;
+    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.25);
+    --shadow-md: 0 10px 28px rgba(0, 0, 0, 0.35);
+    --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.4);
+    --ease-standard: cubic-bezier(0.2, 0, 0, 1);
+    --duration-fast: 120ms;
+    --duration-base: 180ms;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    :root {
+        --duration-fast: 0ms;
+        --duration-base: 0ms;
+    }
+}