silberengel
/
aitherboard
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix write button

master
Silberengel 1 month ago
parent
e80639a2d9
commit
020902a928
4 changed files with 115 additions and 106 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 64
      src/app.css
  2. 41
      src/routes/discussions/+page.svelte
  3. 9
      src/routes/feed/+page.svelte
  4. 7
      src/routes/lists/+page.svelte

64
src/app.css
Unescape View File

@ -214,63 +214,31 @@ main { @@ -214,63 +214,31 @@ main {
/* Common button styles */
.write-button {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.5rem;
border: 1px solid var(--fog-border, #e5e7eb);
border-radius: 0.375rem;
background: var(--fog-surface, #f8fafc);
color: var(--fog-text, #1f2937);
padding: 0.5rem 1rem;
border: 1px solid var(--fog-border, #cbd5e1);
border-radius: 4px;
background: var(--fog-post, #ffffff);
color: var(--fog-text, #1e293b);
text-decoration: none;
transition: all 0.2s;
min-width: 2.5rem;
min-height: 2.5rem;
flex-shrink: 0;
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
}
:global(.dark) .write-button {
border-color: var(--fog-dark-border, #374151);
background: var(--fog-dark-surface, #1e293b); /* Use surface color for contrast with page background */
color: var(--fog-dark-text, #f9fafb);
}
/* Ensure icon inherits color - the SVG's stroke="currentColor" will use this */
.write-button :global(.icon-wrapper) {
color: inherit;
}
/* Directly set stroke color on SVG paths for write-button */
/* This ensures the icon is visible even if currentColor doesn't resolve correctly */
.write-button :global(.icon-wrapper svg[stroke="currentColor"]),
.write-button :global(.icon-wrapper svg[stroke="currentColor"] path) {
stroke: currentColor;
fill: none;
}
/* Ensure write-button icon is always visible in dark mode */
:global(.dark) .write-button :global(.icon-wrapper) {
color: var(--fog-dark-text, #f9fafb);
}
/* Directly set stroke color on SVG paths for write-button in dark mode */
/* Use !important to override any conflicting rules */
:global(.dark) .write-button :global(.icon-wrapper svg[stroke="currentColor"]),
:global(.dark) .write-button :global(.icon-wrapper svg[stroke="currentColor"] path) {
stroke: var(--fog-dark-text, #f9fafb) !important;
fill: none !important;
.write-button:hover:not(:disabled) {
background: var(--fog-highlight, #f1f5f9);
border-color: var(--fog-accent, #94a3b8);
}
.write-button:hover {
background: var(--fog-highlight, #f3f4f6);
border-color: var(--fog-accent, #64748b);
:global(.dark) .write-button {
background: var(--fog-dark-post, #334155);
border-color: var(--fog-dark-border, #475569);
color: var(--fog-dark-text, #f1f5f9);
}
:global(.dark) .write-button:hover {
:global(.dark) .write-button:hover:not(:disabled) {
background: var(--fog-dark-highlight, #475569);
border-color: var(--fog-dark-accent, #94a3b8);
border-color: var(--fog-dark-accent, #64748b);
}
/* Action buttons (accent background) */

41
src/routes/discussions/+page.svelte
Unescape View File

@ -9,7 +9,6 @@ @@ -9,7 +9,6 @@
import type { NostrEvent } from '../../lib/types/nostr.js';
import { onMount } from 'svelte';
import { page } from '$app/stores';
import Icon from '../../lib/components/ui/Icon.svelte';
import Pagination from '../../lib/components/ui/Pagination.svelte';
import { getPaginatedItems, getCurrentPage, ITEMS_PER_PAGE } from '../../lib/utils/pagination.js';
@ -57,9 +56,6 @@ @@ -57,9 +56,6 @@
<h1 class="font-bold text-fog-text dark:text-fog-dark-text font-mono" style="font-size: 1.5em;">/Discussions</h1>
<p class="text-fog-text dark:text-fog-dark-text">Decentralized discussion board on Nostr.</p>
</div>
<a href="/write?kind=11" class="write-button" title="Write a new thread">
<Icon name="edit" size={20} />
</a>
</div>
<div class="discussions-controls">
@ -77,6 +73,9 @@ @@ -77,6 +73,9 @@
{#if discussionListComponent && !searchResults.events.length && !searchResults.profiles.length}
<div class="discussions-controls-row">
<a href="/write?kind=11" class="see-more-events-btn-header" title="Write a new thread">
Write
</a>
<select
bind:value={discussionListComponent.sortBy}
class="sort-select"
@ -208,6 +207,40 @@ @@ -208,6 +207,40 @@
color: var(--fog-dark-text, #f1f5f9);
}
.see-more-events-btn-header {
padding: 0.5rem 1rem;
border: 1px solid var(--fog-border, #cbd5e1);
border-radius: 4px;
background: var(--fog-post, #ffffff);
color: var(--fog-text, #1e293b);
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
text-decoration: none;
display: inline-block;
}
.see-more-events-btn-header:hover:not(:disabled) {
background: var(--fog-highlight, #f1f5f9);
border-color: var(--fog-accent, #94a3b8);
}
.see-more-events-btn-header:disabled {
opacity: 0.5;
cursor: not-allowed;
}
:global(.dark) .see-more-events-btn-header {
background: var(--fog-dark-post, #334155);
border-color: var(--fog-dark-border, #475569);
color: var(--fog-dark-text, #f1f5f9);
}
:global(.dark) .see-more-events-btn-header:hover:not(:disabled) {
background: var(--fog-dark-highlight, #475569);
border-color: var(--fog-dark-accent, #64748b);
}
.search-section :global(.unified-search-container) {
max-width: 100%;
width: 100%;

9
src/routes/feed/+page.svelte
Unescape View File

@ -3,7 +3,6 @@ @@ -3,7 +3,6 @@
import FeedPage from '../../lib/modules/feed/FeedPage.svelte';
import { nostrClient } from '../../lib/services/nostr/nostr-client.js';
import { onMount } from 'svelte';
import Icon from '../../lib/components/ui/Icon.svelte';
import type { NostrEvent } from '../../lib/types/nostr.js';
let feedPageComponent: {
@ -26,12 +25,12 @@ @@ -26,12 +25,12 @@
<div class="feed-header mb-6">
<div class="feed-header-top">
<h1 class="font-bold text-fog-text dark:text-fog-dark-text font-mono" style="font-size: 1.5em;">/Feed</h1>
<a href="/write?kind=1" class="write-button" title="Write a new post">
<Icon name="edit" size={20} />
</a>
</div>
<div class="feed-controls">
<div class="feed-header-buttons">
<a href="/write?kind=1" class="see-more-events-btn-header" title="Write a new post">
Write
</a>
{#if feedPageComponent && feedPageComponent.waitingRoomEvents.length > 0}
<button
onclick={() => feedPageComponent?.loadWaitingRoomEvents()}
@ -143,6 +142,8 @@ @@ -143,6 +142,8 @@
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
text-decoration: none;
display: inline-block;
}
.see-more-events-btn-header:hover:not(:disabled) {

7
src/routes/lists/+page.svelte
Unescape View File

@ -339,6 +339,7 @@ @@ -339,6 +339,7 @@
<Header />
<main class="container mx-auto px-4 py-8">
<div class="lists-content">
{#if !isLoggedIn}
<div class="text-center py-8">
<p>Please log in to view your lists.</p>
@ -397,9 +398,15 @@ @@ -397,9 +398,15 @@
{/if}
{/if}
{/if}
</div>
</main>
<style>
.lists-content {
max-width: var(--content-width);
margin: 0 auto;
}
.lists-header {
border-bottom: 1px solid var(--fog-border, #e5e7eb);
padding-bottom: 1rem;

Write Preview
Loading…
Cancel
Save