mary.my.id / aglais
personal web client for Bluesky
typescript solidjs bluesky atcute
fork atom

fix: make dark overlay darker

mary.my.id c0360923 e2ef1a53

verified
options
unified split
Changed files
+7 -7
src
components
composer
composer-dialog.tsx
dialog.tsx
main
modal-renderer.tsx
menu.tsx
prompt.tsx
styles
app.css
views
bluemoji-emotes.tsx
+1 -1
src/components/composer/composer-dialog.tsx
··· 853 } 854 855 return ( 856 - <div class="pointer-events-none fixed inset-0 z-1 flex items-center justify-center bg-contrast-overlay/40"> 857 <div class="rounded-lg bg-background p-2"> 858 <p class="rounded border-2 border-dashed border-outline px-9 py-11">Drop to add images</p> 859 </div>
··· 853 } 854 855 return ( 856 + <div class="pointer-events-none fixed inset-0 z-1 flex items-center justify-center bg-contrast-overlay/75"> 857 <div class="rounded-lg bg-background p-2"> 858 <p class="rounded border-2 border-dashed border-outline px-9 py-11">Drop to add images</p> 859 </div>
+1 -1
src/components/dialog.tsx
··· 10 import CrossLargeOutlinedIcon from './icons-central/cross-large-outline'; 11 12 const DialogBackdrop = () => { 13 - return <div class="fixed inset-0 z-0 bg-contrast-overlay/40"></div>; 14 }; 15 16 export { DialogBackdrop as Backdrop };
··· 10 import CrossLargeOutlinedIcon from './icons-central/cross-large-outline'; 11 12 const DialogBackdrop = () => { 13 + return <div class="fixed inset-0 z-0 bg-contrast-overlay/75"></div>; 14 }; 15 16 export { DialogBackdrop as Backdrop };
+1 -1
src/components/main/modal-renderer.tsx
··· 62 return ( 63 <> 64 {/* <Dialog.Backdrop> */} 65 - <div class="fixed inset-0 z-0 bg-contrast-overlay/40"></div> 66 <div class="grid grow place-items-center"> 67 {/* <CircularProgress> */} 68 <svg viewBox="0 0 32 32" class="animate-spin" style="height:24px;width:24px">
··· 62 return ( 63 <> 64 {/* <Dialog.Backdrop> */} 65 + <div class="fixed inset-0 z-0 bg-contrast-overlay/75"></div> 66 <div class="grid grow place-items-center"> 67 {/* <CircularProgress> */} 68 <svg viewBox="0 0 32 32" class="animate-spin" style="height:24px;width:24px">
+1 -1
src/components/menu.tsx
··· 113 }); 114 } 115 }} 116 - class="flex grow snap-y snap-mandatory flex-col-reverse items-center self-stretch overflow-y-auto overscroll-none bg-contrast-overlay/40 scrollbar-hide" 117 > 118 <div class="relative max-h-[60svh] w-[540px] max-w-full shrink-0 grow"> 119 <div class="pointer-events-none absolute inset-0 z-10 flex flex-col justify-between">
··· 113 }); 114 } 115 }} 116 + class="flex grow snap-y snap-mandatory flex-col-reverse items-center self-stretch overflow-y-auto overscroll-none bg-contrast-overlay/75 scrollbar-hide" 117 > 118 <div class="relative max-h-[60svh] w-[540px] max-w-full shrink-0 grow"> 119 <div class="pointer-events-none absolute inset-0 z-10 flex flex-col justify-between">
+1 -1
src/components/prompt.tsx
··· 43 } else { 44 return ( 45 <Fieldset standalone disabled={isDisabled()}> 46 - <div class="flex grow flex-col items-center self-stretch overflow-y-auto bg-contrast-overlay/40"> 47 <div class="h-[40dvh] shrink-0"></div> 48 <div 49 ref={containerRef}
··· 43 } else { 44 return ( 45 <Fieldset standalone disabled={isDisabled()}> 46 + <div class="flex grow flex-col items-center self-stretch overflow-y-auto bg-contrast-overlay/75"> 47 <div class="h-[40dvh] shrink-0"></div> 48 <div 49 ref={containerRef}
+1 -1
src/styles/app.css
··· 58 --p-contrast: 255 255 255; 59 --p-contrast-hinted: 244 244 244; 60 --p-contrast-muted: 123 123 123; 61 - --p-contrast-overlay: 98 110 127; 62 --p-outline: 54 54 54; 63 --p-outline-md: 57 57 57; 64 --p-outline-lg: 113 113 113;
··· 58 --p-contrast: 255 255 255; 59 --p-contrast-hinted: 244 244 244; 60 --p-contrast-muted: 123 123 123; 61 + --p-contrast-overlay: 33 34 41; 62 --p-outline: 54 54 54; 63 --p-outline-md: 57 57 57; 64 --p-outline-lg: 113 113 113;
+1 -1
src/views/bluemoji-emotes.tsx
··· 212 } 213 214 return ( 215 - <div class="pointer-events-none fixed inset-0 z-[3] flex items-center justify-center bg-contrast-overlay/40"> 216 <div class="rounded-lg bg-background p-2"> 217 <p class="rounded border-2 border-dashed border-outline px-9 py-11">Drop to add emote</p> 218 </div>
··· 212 } 213 214 return ( 215 + <div class="pointer-events-none fixed inset-0 z-[3] flex items-center justify-center bg-contrast-overlay/75"> 216 <div class="rounded-lg bg-background p-2"> 217 <p class="rounded border-2 border-dashed border-outline px-9 py-11">Drop to add emote</p> 218 </div>