x-ipe 1.0.24__py3-none-any.whl → 1.0.25__py3-none-any.whl

x_ipe/static/css/homepage-infinity.css

@@ -0,0 +1,330 @@
+/**
+ * Homepage Infinity Loop Styles - FEATURE-026
+ */
+
+/* Container - transparent background to match mockup */
+.homepage-infinity-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    min-height: 100%;
+    padding: 2rem;
+    background: transparent;
+    color: var(--bs-body-color, #212529);
+}
+
+/* Header */
+.homepage-header {
+    text-align: center;
+    margin-bottom: 2rem;
+}
+
+.homepage-header h1 {
+    font-size: 3rem;
+    font-weight: 700;
+    background: linear-gradient(135deg, #4facfe, #a855f7);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    margin: 0 0 0.5rem 0;
+}
+
+.homepage-header p {
+    font-size: 1.25rem;
+    color: var(--bs-secondary-color, #6c757d);
+    margin: 0;
+}
+
+/* Infinity Loop Container */
+.infinity-loop-container {
+    position: relative;
+    width: 100%;
+    max-width: 900px;
+    aspect-ratio: 16 / 9;
+}
+
+.infinity-loop {
+    position: relative;
+    width: 100%;
+    height: 100%;
+}
+
+.infinity-bg {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+    opacity: 0.9;
+}
+
+/* Loop Labels */
+.loop-label {
+    position: absolute;
+    font-size: 1.2rem;
+    font-weight: 700;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.loop-label.control {
+    left: 19%;
+    top: 49%;
+    color: #00c6fb;
+}
+
+.loop-label.transparency {
+    left: 64%;
+    top: 49%;
+    color: #a855f7;
+}
+
+/* Stage Buttons - Circular like mockup */
+.stage-btn {
+    position: absolute;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 80px;
+    height: 80px;
+    border: none;
+    border-radius: 50%;
+    cursor: pointer;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    transform: translate(-50%, -50%);
+    box-shadow: 
+        0 4px 20px rgba(0, 0, 0, 0.15),
+        0 2px 8px rgba(0, 0, 0, 0.1);
+    z-index: 10;
+}
+
+/* Individual button colors - customized */
+.stage-btn[data-stage="ideation"] {
+    background: rgb(123, 68, 174);
+    color: #fff;
+}
+
+.stage-btn[data-stage="requirement"] {
+    background: rgb(165, 87, 194);
+    color: #fff;
+}
+
+.stage-btn[data-stage="implementation"] {
+    background: rgb(110, 99, 206);
+    color: #fff;
+}
+
+.stage-btn[data-stage="deployment"] {
+    background: rgb(67, 161, 231);
+    color: #fff;
+}
+
+.stage-btn[data-stage="validation"] {
+    background: rgb(66, 112, 203);
+    color: #fff;
+}
+
+.stage-btn[data-stage="monitoring"] {
+    background: rgb(62, 157, 226);
+    color: #fff;
+}
+
+.stage-btn[data-stage="feedback"] {
+    background: rgb(69, 124, 213);
+    color: #fff;
+}
+
+.stage-btn[data-stage="planning"] {
+    background: rgb(125, 72, 184);
+    color: #fff;
+}
+
+.stage-btn:hover {
+    transform: translate(-50%, -50%) scale(1.12);
+    box-shadow: 
+        0 8px 30px rgba(0, 0, 0, 0.2),
+        0 4px 12px rgba(0, 0, 0, 0.15);
+}
+
+.stage-btn.tbd {
+    background: linear-gradient(135deg, #94a3b8 0%, #cbd5e1 100%) !important;
+    opacity: 0.8;
+    cursor: not-allowed;
+}
+
+.stage-btn.tbd:hover {
+    transform: translate(-50%, -50%) scale(1.05);
+}
+
+/* Stage Icon & Label */
+.stage-icon {
+    font-size: 1.4rem;
+    margin-bottom: 2px;
+}
+
+.stage-label {
+    font-size: 0.6rem;
+    font-weight: 600;
+    letter-spacing: 0.03em;
+    text-transform: uppercase;
+    line-height: 1.1;
+    text-align: center;
+}
+
+/* TBD Badge */
+.tbd-badge {
+    position: absolute;
+    top: -8px;
+    right: -8px;
+    background: #ef4444;
+    color: #fff;
+    font-size: 0.6rem;
+    font-weight: 700;
+    padding: 2px 6px;
+    border-radius: 4px;
+}
+
+/* Legend */
+.homepage-legend {
+    display: flex;
+    gap: 2rem;
+    margin-top: 2rem;
+    font-size: 0.9rem;
+    color: var(--bs-secondary-color, #6c757d);
+}
+
+.legend-control::before {
+    color: #4facfe;
+}
+
+.legend-transparency::before {
+    color: #a855f7;
+}
+
+/* Tooltip */
+.homepage-tooltip {
+    position: fixed;
+    background: #1f2937;
+    color: #fff;
+    padding: 0.5rem 1rem;
+    border-radius: 6px;
+    font-size: 0.875rem;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
+    transform: translateX(-50%);
+    z-index: 1000;
+    pointer-events: none;
+}
+
+.homepage-tooltip::before {
+    content: '';
+    position: absolute;
+    top: -6px;
+    left: 50%;
+    transform: translateX(-50%);
+    border-left: 6px solid transparent;
+    border-right: 6px solid transparent;
+    border-bottom: 6px solid #1f2937;
+}
+
+/* Sidebar Highlight - Epic neon glow effect */
+.homepage-highlight {
+    position: relative;
+    overflow: hidden;
+    background: linear-gradient(90deg, 
+        rgba(139, 92, 246, 0.25) 0%, 
+        rgba(59, 130, 246, 0.15) 50%,
+        rgba(236, 72, 153, 0.2) 100%) !important;
+    border-left: 3px solid transparent !important;
+    border-image: linear-gradient(180deg, #8b5cf6, #3b82f6, #ec4899) 1 !important;
+    box-shadow: 
+        0 0 15px rgba(139, 92, 246, 0.5),
+        0 0 30px rgba(59, 130, 246, 0.3),
+        0 0 60px rgba(139, 92, 246, 0.15),
+        inset 0 0 15px rgba(139, 92, 246, 0.1);
+    animation: homepage-highlight-neon 2s ease-in-out infinite;
+    border-radius: 6px;
+    margin: 2px 4px;
+    padding-left: 8px !important;
+    z-index: 1;
+}
+
+/* Animated border gradient */
+.homepage-highlight::before {
+    content: '';
+    position: absolute;
+    top: -2px;
+    left: -2px;
+    right: -2px;
+    bottom: -2px;
+    background: linear-gradient(45deg, 
+        #8b5cf6, #3b82f6, #06b6d4, #ec4899, 
+        #8b5cf6, #3b82f6, #06b6d4, #ec4899);
+    background-size: 400% 400%;
+    border-radius: 8px;
+    z-index: -2;
+    animation: homepage-border-rotate 3s linear infinite;
+    opacity: 0.7;
+}
+
+/* Inner fill to create border effect */
+.homepage-highlight::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: linear-gradient(90deg,
+        rgba(15, 23, 42, 0.85) 0%,
+        rgba(15, 23, 42, 0.7) 50%,
+        rgba(15, 23, 42, 0.85) 100%);
+    border-radius: 6px;
+    z-index: -1;
+    animation: homepage-highlight-shimmer 2s ease-in-out infinite;
+}
+
+/* Neon pulse */
+@keyframes homepage-highlight-neon {
+    0%, 100% {
+        box-shadow: 
+            0 0 15px rgba(139, 92, 246, 0.5),
+            0 0 30px rgba(59, 130, 246, 0.3),
+            0 0 60px rgba(139, 92, 246, 0.15),
+            inset 0 0 15px rgba(139, 92, 246, 0.1);
+    }
+    33% {
+        box-shadow: 
+            0 0 20px rgba(59, 130, 246, 0.6),
+            0 0 40px rgba(6, 182, 212, 0.4),
+            0 0 80px rgba(59, 130, 246, 0.2),
+            inset 0 0 20px rgba(59, 130, 246, 0.15);
+    }
+    66% {
+        box-shadow: 
+            0 0 20px rgba(236, 72, 153, 0.5),
+            0 0 40px rgba(139, 92, 246, 0.35),
+            0 0 80px rgba(236, 72, 153, 0.2),
+            inset 0 0 20px rgba(236, 72, 153, 0.1);
+    }
+}
+
+/* Rotating gradient border */
+@keyframes homepage-border-rotate {
+    0% { background-position: 0% 50%; }
+    50% { background-position: 100% 50%; }
+    100% { background-position: 0% 50%; }
+}
+
+/* Inner shimmer */
+@keyframes homepage-highlight-shimmer {
+    0%, 100% { opacity: 0.85; }
+    50% { opacity: 0.7; }
+}
+
+/* Responsive - Hide on mobile */
+@media (max-width: 768px) {
+    .homepage-infinity-container {
+        display: none;
+    }
+}

x_ipe/static/css/kb-core.css

@@ -0,0 +1,301 @@
+/**
+ * FEATURE-025-A: Knowledge Base Core CSS
+ * 
+ * Two-column layout (like Ideation view) with tree on left of content area.
+ */
+
+/* Override content-body padding when KB container is displayed */
+.content-body:has(.kb-container) {
+    padding: 0;
+}
+
+/* Override content-area background when KB is displayed to avoid white gap */
+.content-area:has(.kb-container) {
+    background-color: var(--bg-primary, #1e1e1e);
+}
+
+/* KB Container - Two column layout */
+.kb-container {
+    display: flex;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+    background: var(--bg-primary, #1e1e1e);
+}
+
+/* KB Sidebar (within content area, not main sidebar) */
+.kb-sidebar {
+    width: 280px;
+    min-width: 240px;
+    max-width: 400px;
+    display: flex;
+    flex-direction: column;
+    background: var(--bg-secondary, #252526);
+    border-right: 1px solid var(--border-color, #3d3d3d);
+}
+
+.kb-sidebar-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0.75rem 1rem;
+    border-bottom: 1px solid var(--border-color, #3d3d3d);
+}
+
+.kb-sidebar-title {
+    font-weight: 600;
+    color: var(--text-primary, #e0e0e0);
+    font-size: 0.875rem;
+}
+
+.kb-refresh-btn {
+    background: transparent;
+    border: none;
+    color: var(--text-muted, #808080);
+    cursor: pointer;
+    padding: 0.25rem;
+    border-radius: 3px;
+    transition: all 0.15s;
+}
+
+.kb-refresh-btn:hover {
+    color: var(--text-primary, #e0e0e0);
+    background: var(--bg-hover, #2a2a2a);
+}
+
+.kb-search-box {
+    padding: 0.5rem 0.75rem;
+    border-bottom: 1px solid var(--border-color, #3d3d3d);
+}
+
+.kb-search-input {
+    width: 100%;
+    padding: 0.375rem 0.75rem;
+    background: var(--bg-darker, #1e1e1e);
+    border: 1px solid var(--border-color, #3d3d3d);
+    border-radius: 4px;
+    color: var(--text-primary, #e0e0e0);
+    font-size: 0.813rem;
+}
+
+.kb-search-input::placeholder {
+    color: var(--text-muted, #808080);
+}
+
+.kb-search-input:focus {
+    outline: none;
+    border-color: var(--accent-color, #0d6efd);
+}
+
+/* KB Tree */
+.kb-tree {
+    flex: 1;
+    overflow-y: auto;
+    padding: 0.5rem 0;
+}
+
+.kb-loading {
+    padding: 1rem;
+    text-align: center;
+    color: var(--text-muted, #808080);
+}
+
+/* KB Folder */
+.kb-folder {
+    margin-bottom: 0.25rem;
+}
+
+.kb-folder-header {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.375rem 0.75rem;
+    cursor: pointer;
+    color: var(--text-secondary, #cccccc);
+    font-size: 0.875rem;
+    transition: background-color 0.15s;
+}
+
+.kb-folder-header:hover {
+    background: var(--bg-hover, #2a2a2a);
+}
+
+.kb-folder-header i:first-child {
+    font-size: 0.75rem;
+    color: var(--text-muted, #808080);
+    width: 12px;
+}
+
+.kb-folder-files {
+    padding-left: 1.5rem;
+}
+
+.kb-folder.collapsed .kb-folder-files {
+    display: none;
+}
+
+/* KB File Item */
+.kb-file-item {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.25rem 0.75rem;
+    font-size: 0.813rem;
+    color: var(--text-primary, #e0e0e0);
+    cursor: pointer;
+    border-radius: 3px;
+    transition: background-color 0.15s;
+}
+
+.kb-file-item:hover {
+    background: var(--bg-hover, #2a2a2a);
+}
+
+.kb-file-item.active {
+    background: var(--accent-color-dim, rgba(13, 110, 253, 0.2));
+    color: var(--accent-color, #0d6efd);
+}
+
+.kb-file-item i {
+    font-size: 0.875rem;
+    width: 16px;
+    text-align: center;
+}
+
+.kb-file-name {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.kb-empty {
+    padding: 0.5rem 0.75rem;
+    font-size: 0.813rem;
+    color: var(--text-muted, #808080);
+    font-style: italic;
+}
+
+.kb-empty-state {
+    padding: 2rem 1rem;
+    text-align: center;
+    color: var(--text-muted, #808080);
+}
+
+.kb-empty-state i {
+    font-size: 2rem;
+    display: block;
+    margin-bottom: 0.5rem;
+}
+
+/* KB Content (right side) */
+.kb-content {
+    flex: 1;
+    overflow-y: auto;
+    padding: 1.5rem;
+    background: var(--bg-primary, #1e1e1e);
+}
+
+.kb-placeholder {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    color: var(--text-muted, #808080);
+}
+
+.kb-placeholder i {
+    font-size: 3rem;
+    margin-bottom: 1rem;
+}
+
+.kb-placeholder h5 {
+    color: var(--text-secondary, #cccccc);
+}
+
+/* KB Welcome/Stats View */
+.kb-welcome {
+    max-width: 800px;
+}
+
+.kb-stats {
+    display: flex;
+    align-items: center;
+}
+
+.kb-section h6 {
+    color: var(--text-secondary, #cccccc);
+    margin-bottom: 0.75rem;
+    display: flex;
+    align-items: center;
+}
+
+.kb-landing-list {
+    border: 1px solid var(--border-color, #3d3d3d);
+    border-radius: 4px;
+    background: var(--bg-darker, #252526);
+}
+
+.kb-landing-file {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.5rem 0.75rem;
+    border-bottom: 1px solid var(--border-color, #3d3d3d);
+    color: var(--text-primary, #e0e0e0);
+    font-size: 0.875rem;
+}
+
+.kb-landing-file:last-child {
+    border-bottom: none;
+}
+
+.kb-topics-grid {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+}
+
+.kb-topic-card {
+    display: flex;
+    align-items: center;
+    padding: 0.5rem 0.75rem;
+    background: var(--bg-darker, #252526);
+    border: 1px solid var(--border-color, #3d3d3d);
+    border-radius: 4px;
+    color: var(--text-primary, #e0e0e0);
+    font-size: 0.875rem;
+    transition: border-color 0.15s;
+}
+
+.kb-topic-card:hover {
+    border-color: var(--accent-color, #0d6efd);
+}
+
+/* KB File Preview */
+.kb-file-preview {
+    background: var(--bg-darker, #252526);
+    border: 1px solid var(--border-color, #3d3d3d);
+    border-radius: 6px;
+    padding: 1.5rem;
+}
+
+.kb-file-header {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+}
+
+.kb-file-info h6 {
+    color: var(--text-primary, #e0e0e0);
+}
+
+.kb-file-meta .badge {
+    font-weight: 400;
+}
+
+.kb-error {
+    padding: 2rem;
+    text-align: center;
+    color: var(--text-danger, #dc3545);
+}