mirror of
				https://github.com/KevinMidboe/immich.git
				synced 2025-10-29 17:40:28 +00:00 
			
		
		
		
	chore(web): modal max-width to 95 viewport width (#1297)
This commit is contained in:
		| @@ -14,7 +14,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| > | ||||
| 	<div | ||||
| 		class="flex flex-col place-items-center place-content-center gap-4 px-4 text-immich-primary dark:text-immich-dark-primary" | ||||
|   | ||||
| @@ -14,7 +14,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| > | ||||
| 	<div | ||||
| 		class="flex flex-col place-items-center place-content-center gap-4 px-4 text-immich-primary dark:text-immich-dark-primary" | ||||
|   | ||||
| @@ -52,7 +52,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| > | ||||
| 	<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> | ||||
| 		<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> | ||||
|   | ||||
| @@ -16,7 +16,7 @@ | ||||
|  | ||||
| <FullScreenModal on:clickOutside={() => handleCancel()}> | ||||
| 	<div | ||||
| 		class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 		class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	> | ||||
| 		<div | ||||
| 			class="flex flex-col place-items-center place-content-center gap-4 px-4 text-immich-primary dark:text-immich-dark-primary" | ||||
|   | ||||
| @@ -27,7 +27,7 @@ | ||||
|  | ||||
| <FullScreenModal> | ||||
| 	<div | ||||
| 		class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 		class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	> | ||||
| 		<div | ||||
| 			class="flex flex-col place-items-center place-content-center gap-4 px-4 text-immich-primary dark:text-immich-dark-primary" | ||||
|   | ||||
| @@ -44,7 +44,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| > | ||||
| 	<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> | ||||
| 		<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> | ||||
|   | ||||
| @@ -77,7 +77,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| > | ||||
| 	<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> | ||||
| 		<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> | ||||
|   | ||||
| @@ -66,7 +66,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| > | ||||
| 	<div | ||||
| 		class="flex flex-col place-items-center place-content-center gap-4 px-4 text-immich-primary dark:text-immich-dark-primary" | ||||
|   | ||||
| @@ -72,7 +72,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div | ||||
| 	class="border bg-white dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-md py-8" | ||||
| 	class="border bg-white dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-md py-8" | ||||
| > | ||||
| 	<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> | ||||
| 		<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> | ||||
|   | ||||
| @@ -15,7 +15,7 @@ | ||||
|  | ||||
| <div class="absolute top-0 left-0 w-screen h-screen"> | ||||
| 	<FullScreenModal on:clickOutside={() => console.log('Click outside')}> | ||||
| 		<div class="max-w-[500px] z-[99999] border bg-immich-bg p-10 rounded-xl"> | ||||
| 		<div class="max-w-[500px] max-w-[95vw] z-[99999] border bg-immich-bg p-10 rounded-xl"> | ||||
| 			<p class="text-2xl ">🎉 NEW VERSION AVAILABLE 🎉</p> | ||||
| 			<br /> | ||||
|  | ||||
|   | ||||
| @@ -14,7 +14,7 @@ | ||||
|  | ||||
| <FullScreenModal on:clickOutside={() => handleCancel()}> | ||||
| 	<div | ||||
| 		class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 		class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" | ||||
| 	> | ||||
| 		<div | ||||
| 			class="flex flex-col place-items-center place-content-center gap-4 px-4 text-immich-primary dark:text-immich-dark-primary" | ||||
|   | ||||
| @@ -3,7 +3,7 @@ | ||||
| </script> | ||||
|  | ||||
| <div class="h-screen w-screen  flex place-items-center place-content-center flex-col"> | ||||
| 	<div class="min-w-[500px]  bg-gray-300 rounded-2xl my-4 p-4"> | ||||
| 	<div class="min-w-[500px] max-w-[95vw]  bg-gray-300 rounded-2xl my-4 p-4"> | ||||
| 		<code class="text-xs text-red-500">Error code {$page.status}</code> | ||||
| 		<br /> | ||||
| 		<code class="text-sm"> | ||||
|   | ||||
| @@ -144,7 +144,7 @@ | ||||
|  | ||||
| 	{#if shouldShowInfoPanel} | ||||
| 		<FullScreenModal on:clickOutside={() => (shouldShowInfoPanel = false)}> | ||||
| 			<div class="border bg-white shadow-sm w-[500px] rounded-3xl p-8 text-sm"> | ||||
| 			<div class="border bg-white shadow-sm w-[500px] max-w-[95vw] rounded-3xl p-8 text-sm"> | ||||
| 				<h1 class="font-medium text-immich-primary text-lg mb-4">Password reset success</h1> | ||||
|  | ||||
| 				<p> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user