diff --git a/src/slices/file-operations/CreateFileViewEncrypted.ts b/src/slices/file-operations/CreateFileViewEncrypted.ts index 26ab359..6a42ef2 100644 --- a/src/slices/file-operations/CreateFileViewEncrypted.ts +++ b/src/slices/file-operations/CreateFileViewEncrypted.ts @@ -216,17 +216,9 @@ export class CreateFileViewEncrypted extends ItemView { const iconContainer = contentBox.createDiv('streams-create-file-encrypted-icon'); setIcon(iconContainer, 'lock'); - // Stream info display - const streamContainer = contentBox.createDiv('streams-create-file-encrypted-stream-container'); - const streamIcon = streamContainer.createSpan('streams-create-file-encrypted-stream-icon'); - setIcon(streamIcon, this.stream.icon || 'book'); - - const streamName = streamContainer.createSpan('streams-create-file-encrypted-stream'); - streamName.setText(this.stream.name); - - // Encryption indicator - const encryptionIndicator = contentBox.createDiv('streams-create-file-encrypted-encryption-indicator'); - encryptionIndicator.setText('This stream is encrypted'); + // Private indicator + const privateIndicator = contentBox.createDiv('streams-create-file-encrypted-private-indicator'); + privateIndicator.setText('Private'); // Date display const dateEl = contentBox.createDiv('streams-create-file-encrypted-date'); diff --git a/styles.css b/styles.css index b3ec943..21f1152 100644 --- a/styles.css +++ b/styles.css @@ -1598,10 +1598,6 @@ box-shadow: 0 4px 12px rgba(var(--interactive-accent-rgb), 0.3); } -.streams-install-meld-button::before { - content: '🔓'; - font-size: 14px; -} .streams-install-meld-button:hover { transform: translateY(-2px); @@ -1684,8 +1680,23 @@ border: 1px solid var(--background-modifier-border); } +.streams-create-file-encrypted-content::before { + content: '🔒 ENCRYPTED'; + position: absolute; + top: -8px; + right: 16px; + background: var(--interactive-accent); + color: var(--text-on-accent); + padding: 4px 12px; + border-radius: 12px; + font-size: 0.75em; + font-weight: 600; + z-index: 3; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); +} + .streams-create-file-encrypted-icon { - margin-bottom: 32px; + margin-bottom: 20px; } .streams-create-file-encrypted-icon svg { @@ -1695,56 +1706,29 @@ opacity: 0.9; } -.streams-create-file-encrypted-stream-container { - display: flex; - align-items: center; - justify-content: center; - margin-bottom: 20px; - padding: 12px 16px; - background-color: var(--background-primary); - border-radius: 8px; - border: 1px solid var(--background-modifier-border); -} - -.streams-create-file-encrypted-stream-icon { - margin-right: 8px; - display: flex; - align-items: center; -} - -.streams-create-file-encrypted-stream-icon svg { - width: 18px; - height: 18px; - color: var(--text-muted); -} - -.streams-create-file-encrypted-stream { +.streams-create-file-encrypted-private-indicator { font-size: 1em; font-weight: 600; - color: var(--text-normal); -} - -.streams-create-file-encrypted-encryption-indicator { - font-size: 0.9em; - font-weight: 500; - color: var(--text-accent); - margin-bottom: 20px; - padding: 8px 16px; - background-color: var(--background-primary); - border: 1px solid var(--text-accent); - border-radius: 8px; + color: var(--text-muted); + margin-bottom: 12px; + padding: 0; + background: none; + border: none; display: flex; align-items: center; justify-content: center; gap: 8px; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + box-shadow: none; } -.streams-create-file-encrypted-encryption-indicator::before { +.streams-create-file-encrypted-private-indicator::before { content: "🔒"; font-size: 16px; + color: var(--text-muted); } + + .streams-create-file-encrypted-date { font-size: 1.4em; font-weight: 700;