mirror of
				https://github.com/richard-loafle/fuse-angular.git
				synced 2025-11-04 01:03:33 +00:00 
			
		
		
		
	(apps/scrumboard) Dark mode fixes and tweaks
This commit is contained in:
		
							parent
							
								
									c2dd77d7a3
								
							
						
					
					
						commit
						ab3ad4fd2f
					
				@ -1,7 +1,7 @@
 | 
			
		||||
<div
 | 
			
		||||
    class="mt-11 w-64 py-2.5 px-2"
 | 
			
		||||
    [class.h-15]="!formVisible">
 | 
			
		||||
    <div class="relative flex w-full h-full overflow-hidden rounded-xl bg-gray-200">
 | 
			
		||||
    <div class="relative flex w-full h-full overflow-hidden rounded-xl bg-gray-200 dark:bg-gray-700">
 | 
			
		||||
        <button
 | 
			
		||||
            class="absolute inset-0 justify-start w-full px-3 rounded-xl bg-transparent"
 | 
			
		||||
            [ngClass]="{'opacity-0 pointer-events-none': formVisible}"
 | 
			
		||||
@ -18,7 +18,7 @@
 | 
			
		||||
            [ngClass]="{'opacity-0': !formVisible}"
 | 
			
		||||
            [formGroup]="form">
 | 
			
		||||
            <input
 | 
			
		||||
                class="w-full py-2 px-3 leading-5 rounded-md shadow-sm border border-gray-300 bg-white focus:border-primary"
 | 
			
		||||
                class="w-full py-2 px-3 leading-5 rounded-md shadow-sm border border-gray-300 bg-white focus:border-primary dark:border-gray-500 dark:focus:border-primary dark:bg-black dark:bg-opacity-5"
 | 
			
		||||
                [autocomplete]="'off'"
 | 
			
		||||
                [formControlName]="'title'"
 | 
			
		||||
                [placeholder]="'Enter list title...'"
 | 
			
		||||
 | 
			
		||||
@ -57,7 +57,7 @@
 | 
			
		||||
                        <div
 | 
			
		||||
                            class="flex items-center justify-between"
 | 
			
		||||
                            cdkDragHandle>
 | 
			
		||||
                            <div class="flex items-center w-full py-2 px-3 rounded-md cursor-text border border-transparent focus-within:bg-white focus-within:shadow-sm focus-within:border-primary">
 | 
			
		||||
                            <div class="flex items-center w-full py-2 px-3 rounded-md cursor-text border border-transparent focus-within:bg-white focus-within:shadow-sm focus-within:border-primary dark:focus-within:bg-gray-900">
 | 
			
		||||
                                <input
 | 
			
		||||
                                    class="w-full font-medium leading-5 bg-transparent"
 | 
			
		||||
                                    [spellcheck]="'false'"
 | 
			
		||||
@ -66,7 +66,7 @@
 | 
			
		||||
                                    (keydown.enter)="listTitleInput.blur()"
 | 
			
		||||
                                    #listTitleInput>
 | 
			
		||||
                            </div>
 | 
			
		||||
                            <div class="flex items-center justify-center min-w-6 ml-4 text-sm font-semibold leading-6 rounded-full bg-gray-300 text-secondary">
 | 
			
		||||
                            <div class="flex items-center justify-center min-w-6 ml-4 text-sm font-semibold leading-6 rounded-full bg-gray-300 text-secondary dark:bg-gray-700">
 | 
			
		||||
                                {{list.cards.length}}
 | 
			
		||||
                            </div>
 | 
			
		||||
                            <div class="ml-1">
 | 
			
		||||
@ -100,7 +100,7 @@
 | 
			
		||||
                        </div>
 | 
			
		||||
 | 
			
		||||
                        <!-- Cards -->
 | 
			
		||||
                        <div class="mt-2 rounded-xl bg-gray-400 bg-opacity-12">
 | 
			
		||||
                        <div class="mt-2 rounded-xl bg-gray-400 bg-opacity-12 dark:bg-transparent dark:border">
 | 
			
		||||
                            <div
 | 
			
		||||
                                [id]="list.id"
 | 
			
		||||
                                class="p-3 pb-0"
 | 
			
		||||
 | 
			
		||||
@ -16,7 +16,7 @@
 | 
			
		||||
                <a
 | 
			
		||||
                    class="flex flex-col items-start w-56 p-6 rounded-lg shadow bg-card rounded-lg hover:shadow-xl transition-shadow duration-150 ease-in-out"
 | 
			
		||||
                    [routerLink]="[board.id]">
 | 
			
		||||
                    <div class="flex items-center justify-center p-4 rounded-full bg-primary-50 text-primary-700">
 | 
			
		||||
                    <div class="flex items-center justify-center p-4 rounded-full bg-primary-50 text-primary-700 dark:bg-primary dark:text-on-primary">
 | 
			
		||||
                        <mat-icon
 | 
			
		||||
                            class="text-current"
 | 
			
		||||
                            [svgIcon]="board.icon"></mat-icon>
 | 
			
		||||
@ -31,12 +31,12 @@
 | 
			
		||||
                        <div class="flex items-center mt-6 -space-x-1.5">
 | 
			
		||||
                            <ng-container *ngFor="let member of board.members.slice(0, 5); trackBy: trackByFn">
 | 
			
		||||
                                <img
 | 
			
		||||
                                    class="flex-0 w-8 h-8 rounded-full ring ring-offset-1 ring-bg-card ring-offset-bg-card object-cover"
 | 
			
		||||
                                    class="flex-0 w-8 h-8 rounded-full ring ring-offset-1 ring-bg-card ring-offset-transparent object-cover"
 | 
			
		||||
                                    [src]="member.avatar"
 | 
			
		||||
                                    alt="Member avatar">
 | 
			
		||||
                            </ng-container>
 | 
			
		||||
                            <ng-container *ngIf="board.members.length > 5">
 | 
			
		||||
                                <div class="flex flex-0 items-center justify-center w-8 h-8 rounded-full ring ring-offset-1 ring-bg-card ring-offset-bg-card bg-gray-200 text-gray-500">
 | 
			
		||||
                                <div class="flex flex-0 items-center justify-center w-8 h-8 rounded-full ring ring-offset-1 ring-bg-card ring-offset-transparent bg-gray-200 text-gray-500">
 | 
			
		||||
                                    <div class="text-md font-semibold">
 | 
			
		||||
                                        +{{ board.members.slice(5).length }}
 | 
			
		||||
                                    </div>
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user