@nospt/plugin-dev-ai-hub 0.1.0 → 0.2.0

package/src/components/AssetDetailPanel/AssetDetailPanel.module.css

@@ -0,0 +1,207 @@
+@layer components {
+  .drawer {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 640px;
+    max-width: 100vw;
+    background-color: var(--bui-bg-neutral-1);
+    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
+    z-index: 1300;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .overlay {
+    position: fixed;
+    inset: 0;
+    background-color: rgba(0, 0, 0, 0.9);
+    z-index: 1299;
+  }
+
+  .panelContainer {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+  }
+
+  .header {
+    padding: var(--bui-space-4);
+    display: flex;
+    align-items: flex-start;
+    gap: var(--bui-space-4);
+    border-bottom: 1px solid var(--bui-border-1);
+  }
+
+  .headerContent {
+    flex: 1;
+  }
+
+  .loadingRow {
+    display: flex;
+    align-items: center;
+    gap: var(--bui-space-2);
+  }
+
+  .nameRow {
+    display: flex;
+    align-items: center;
+    gap: var(--bui-space-2);
+    margin-bottom: var(--bui-space-1);
+  }
+
+  .typeTag {
+    font-weight: 600;
+  }
+
+  .tabBar {
+    border-bottom: 1px solid var(--bui-border-1);
+    padding: 0 var(--bui-space-4);
+  }
+
+  .contentArea {
+    flex: 1;
+    overflow: auto;
+    padding: var(--bui-space-4);
+  }
+
+  .markdownContent {
+    font-size: 0.9375rem;
+    line-height: 1.7;
+  }
+
+  .markdownContent h1,
+  .markdownContent h2,
+  .markdownContent h3,
+  .markdownContent h4,
+  .markdownContent h5,
+  .markdownContent h6 {
+    margin-top: var(--bui-space-4);
+    margin-bottom: var(--bui-space-2);
+    font-weight: 700;
+  }
+
+  .markdownContent p {
+    margin-bottom: var(--bui-space-2);
+    line-height: 1.7;
+  }
+
+  .markdownContent ul,
+  .markdownContent ol {
+    padding-left: var(--bui-space-6);
+    margin-bottom: var(--bui-space-2);
+  }
+
+  .markdownContent li {
+    margin-bottom: var(--bui-space-1);
+  }
+
+  .markdownContent blockquote {
+    border-left: 3px solid var(--bui-ring);
+    padding-left: var(--bui-space-3);
+    color: var(--bui-fg-secondary);
+    margin: var(--bui-space-2) 0;
+    margin-left: 0;
+  }
+
+  .markdownContent table {
+    width: 100%;
+    border-collapse: collapse;
+    margin-bottom: var(--bui-space-2);
+  }
+
+  .markdownContent th,
+  .markdownContent td {
+    border: 1px solid var(--bui-border-1);
+    padding: var(--bui-space-2) var(--bui-space-3);
+    font-size: 0.875rem;
+  }
+
+  .markdownContent th {
+    background-color: var(--bui-bg-neutral-1-hover);
+    font-weight: 700;
+  }
+
+  .markdownContent code {
+    background-color: var(--bui-bg-neutral-1-hover);
+    padding: 1px var(--bui-space-1);
+    border-radius: var(--bui-radius-2);
+    font-family: monospace;
+    font-size: 0.875em;
+  }
+
+  .markdownContent pre code {
+    background-color: transparent;
+    padding: 0;
+  }
+
+  .codeBlockWrapper {
+    margin: var(--bui-space-2) 0;
+  }
+
+  .metaSection {
+    display: flex;
+    flex-direction: column;
+    gap: var(--bui-space-3);
+  }
+
+  .metaRow {
+    display: flex;
+    align-items: baseline;
+    gap: var(--bui-space-2);
+  }
+
+  .metaLabel {
+    min-width: 90px;
+    flex-shrink: 0;
+  }
+
+  .chipsRow {
+    display: flex;
+    gap: var(--bui-space-2);
+    flex-wrap: wrap;
+    margin-top: var(--bui-space-1);
+  }
+
+  .bundledHeader {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    margin-bottom: var(--bui-space-1);
+  }
+
+  .rawYaml {
+    margin: 0;
+    padding: var(--bui-space-4);
+    border-radius: var(--bui-radius-2);
+    border: 1px solid var(--bui-border-1);
+    overflow: auto;
+    font-size: 0.8rem;
+    font-family: monospace;
+    white-space: pre-wrap;
+    word-break: break-word;
+    background-color: var(--bui-bg-neutral-1-hover);
+  }
+
+  .actions {
+    padding: var(--bui-space-4);
+    border-top: 1px solid var(--bui-border-1);
+    display: flex;
+    gap: var(--bui-space-2);
+    flex-wrap: wrap;
+  }
+
+  .repoLink {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--bui-space-1);
+  }
+
+  .divider {
+    height: 1px;
+    background-color: var(--bui-border-1);
+    border: none;
+    margin: 0;
+  }
+}