nostr/blockcore-notes
1
0
Fork 0
mirror of https://github.com/block-core/blockcore-notes.git synced 2024-09-29 06:20:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Tune the thread layout

Browse Source
This commit is contained in:
SondreB 2023-03-14 21:33:06 +01:00
parent b2a4ec5450
commit adffefef4e
No known key found for this signature in database
GPG Key ID: D6CC44C75005FDBF
4 changed files with 51 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/shared/event-buttons/event-buttons.css
View File

@ -3,10 +3,11 @@
z-index: 3;
}
.thread-actions {
.thread-buttons {
padding-left: 1em;
margin-left: 27px;
padding-bottom: 0.3em;
padding-bottom: 0.2em;
padding-top: 0.4em;
}
.toolbar-icon {
@ -36,6 +37,10 @@
flex: 1 2 auto;
}
.thread-actions button {
.thread-buttons button {
margin-left: 0.4em;
}
.right-side {
float: right;
}

5
src/app/shared/event-buttons/event-buttons.html
View File

@ -1,9 +1,10 @@
<div class="thread-actions" [ngClass]="{ 'no-lines': !optionsService.values.showLines, 'lines': optionsService.values.showLines }">
<div class="thread-buttons" [ngClass]="{ 'no-lines': !optionsService.values.showLines, 'lines': optionsService.values.showLines }">
<ng-template [ngIf]="!replyOpen">
<mat-icon tabindex="0" class="reaction-icon toolbar-icon" (click)="isEmojiPickerVisible = !isEmojiPickerVisible;" matTooltip="Reaction to note">sentiment_satisfied</mat-icon>
<mat-icon tabindex="0" class="reaction-icon toolbar-icon" (click)="isEmojiPickerVisible = !isEmojiPickerVisible;" matTooltip="Reaction to note">favorite_border</mat-icon>
<mat-icon tabindex="0" class="reaction-icon toolbar-icon" (click)="openReply()" matTooltip="Reply to note">chat_bubble_outline</mat-icon>
<mat-icon tabindex="0" *ngIf="optionsService.values.enableZapping" class="reaction-icon toolbar-icon" (click)="openDialog()" matTooltip="Zap the note">offline_bolt</mat-icon>
<emoji-mart class="picker" *ngIf="isEmojiPickerVisible" emoji="point_up" [isNative]="true" [showPreview]="true" (emojiSelect)="addEmoji($event)" title="Choose your reaction"></emoji-mart>
<mat-icon tabindex="0" class="reaction-icon toolbar-icon right-side" (click)="saveNote()" matTooltip="Save Note">bookmark_border</mat-icon>
<!-- <button (click)="openReply()" mat-button>Reply</button> -->
</ng-template>
<!-- <button mat-button>

26
src/app/shared/event-buttons/event-buttons.ts
View File

@ -4,10 +4,11 @@ import { SafeResourceUrl } from '@angular/platform-browser';
import { Kind } from 'nostr-tools';
import { DataService } from 'src/app/services/data';
import { EventService } from 'src/app/services/event';
import { NotesService } from 'src/app/services/notes';
import { OptionsService } from 'src/app/services/options';
import { ProfileService } from 'src/app/services/profile';
import { Utilities } from 'src/app/services/utilities';
import { NostrEventDocument, NostrProfile, NostrProfileDocument } from '../../services/interfaces';
import { NostrEventDocument, NostrNoteDocument, NostrProfile, NostrProfileDocument } from '../../services/interfaces';
import { ProfileImageDialog } from '../profile-image-dialog/profile-image-dialog';
import { ZapDialogComponent } from '../zap-dialog/zap-dialog.component';
@ -37,13 +38,32 @@ export class EventButtonsComponent {
@ViewChild('replyInput') replyInput?: ElementRef;
constructor(private eventService: EventService, private dataService: DataService, public optionsService: OptionsService, private profileService: ProfileService, private utilities: Utilities, public dialog: MatDialog) { }
constructor(
private eventService: EventService,
private notesService: NotesService,
private dataService: DataService,
public optionsService: OptionsService,
private profileService: ProfileService,
private utilities: Utilities,
public dialog: MatDialog
) {}
async ngAfterViewInit() {
let pubkey = this.event?.pubkey ? this.event?.pubkey : "";
let pubkey = this.event?.pubkey ? this.event?.pubkey : '';
this.profile = await this.profileService.getProfile(pubkey);
}
async saveNote() {
if (!this.event) {
return;
}
const note = this.event as NostrNoteDocument;
note.saved = Math.floor(Date.now() / 1000);
await this.notesService.putNote(note);
}
openReply() {
this.replyOpen = true;
this.publishing = false;

18
src/styles.scss
View File

@ -205,7 +205,22 @@ h3 {
}
.lines {
border-left: 2px solid rgba(255, 255, 255, 0.15) !important;
border-left: 1px solid rgba(0, 0, 0, 0.25) !important;
// border-left: 2px solid red !important;
}
.dark .lines {
border-left: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.thread-buttons {
border-top: 1px solid rgba(0, 0, 0, 0.25) !important;
border-bottom: 1px solid rgba(0, 0, 0, 0.25) !important;
}
.dark .thread-buttons {
border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}
.image-grid {
@ -482,6 +497,7 @@ app-profile-actions {
}
.events-header {
padding-top: 1em;
gap: 0.4em;
display: flex;
flex-direction: row;