mirror of
https://github.com/aliasvault/aliasvault.git
synced 2026-03-19 15:18:02 -04:00
Add logo to modal (#542)
This commit is contained in:
committed by
Leendert de Borst
parent
ea9c3c5683
commit
14ee466bec
@@ -41,7 +41,7 @@
|
||||
<div id="importServiceModal" class="relative top-20 mx-auto p-5 shadow-lg rounded-md bg-white dark:bg-gray-800 border-2 border-gray-300 dark:border-gray-400 md:min-w-[32rem]">
|
||||
<div class="bg-white dark:bg-gray-800 rounded-lg p-4 max-w-lg w-full mx-auto">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-xl font-semibold dark:text-white">Import from @ServiceName</h3>
|
||||
<div class="flex"><img src="@LogoUrl" alt="@ServiceName logo" class="w-8 h-8 float-left mr-4" /><h3 class="text-xl font-semibold dark:text-white">Import from @ServiceName</h3></div>
|
||||
<button @onclick="CloseModal" class="text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
|
||||
<ImportServiceCard
|
||||
ServiceName="KeePass"
|
||||
Description="Import passwords from your KeePass vault"
|
||||
Description="Import passwords from KeePass"
|
||||
LogoUrl="img/importers/keepass.svg"
|
||||
ProcessFileCallback="ProcessFile">
|
||||
<p class="text-gray-700 dark:text-gray-300 mb-4">In order to import your KeePass vault, you need to export it as a CSV file. You can do this by going to the 'File' menu and selecting 'Export' (to CSV).</p>
|
||||
|
||||
@@ -694,6 +694,10 @@ video {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.float-left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.\!m-0 {
|
||||
margin: 0px !important;
|
||||
}
|
||||
@@ -1381,9 +1385,9 @@ video {
|
||||
border-top-width: 2px;
|
||||
}
|
||||
|
||||
.border-blue-200 {
|
||||
.border-amber-400 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(191 219 254 / var(--tw-border-opacity));
|
||||
border-color: rgb(251 191 36 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-blue-700 {
|
||||
@@ -1436,11 +1440,6 @@ video {
|
||||
border-color: rgb(239 68 68 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-amber-400 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(251 191 36 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.bg-amber-50 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(255 251 235 / var(--tw-bg-opacity));
|
||||
@@ -2148,11 +2147,6 @@ video {
|
||||
border-width: 0px;
|
||||
}
|
||||
|
||||
.file\:bg-blue-50::file-selector-button {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(239 246 255 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.file\:bg-primary-50::file-selector-button {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(255 224 150 / var(--tw-bg-opacity));
|
||||
@@ -2177,11 +2171,6 @@ video {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.file\:text-blue-700::file-selector-button {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(29 78 216 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.file\:text-primary-700::file-selector-button {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(184 112 47 / var(--tw-text-opacity));
|
||||
@@ -2362,11 +2351,6 @@ video {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.hover\:file\:bg-blue-100::file-selector-button:hover {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(219 234 254 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:file\:bg-primary-100::file-selector-button:hover {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(253 222 133 / var(--tw-bg-opacity));
|
||||
@@ -2493,6 +2477,10 @@ video {
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.dark\:border-amber-500\/50:is(.dark *) {
|
||||
border-color: rgb(245 158 11 / 0.5);
|
||||
}
|
||||
|
||||
.dark\:border-blue-500:is(.dark *) {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(59 130 246 / var(--tw-border-opacity));
|
||||
@@ -2548,13 +2536,8 @@ video {
|
||||
border-color: rgb(234 179 8 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.dark\:border-amber-600:is(.dark *) {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(217 119 6 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.dark\:border-amber-500\/50:is(.dark *) {
|
||||
border-color: rgb(245 158 11 / 0.5);
|
||||
.dark\:bg-amber-800\/30:is(.dark *) {
|
||||
background-color: rgb(146 64 14 / 0.3);
|
||||
}
|
||||
|
||||
.dark\:bg-blue-600:is(.dark *) {
|
||||
@@ -2572,10 +2555,6 @@ video {
|
||||
background-color: rgb(30 58 138 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark\:bg-blue-900\/20:is(.dark *) {
|
||||
background-color: rgb(30 58 138 / 0.2);
|
||||
}
|
||||
|
||||
.dark\:bg-gray-500:is(.dark *) {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(107 114 128 / var(--tw-bg-opacity));
|
||||
@@ -2670,15 +2649,6 @@ video {
|
||||
background-color: rgb(113 63 18 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark\:bg-amber-900:is(.dark *) {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(120 53 15 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark\:bg-amber-800\/30:is(.dark *) {
|
||||
background-color: rgb(146 64 14 / 0.3);
|
||||
}
|
||||
|
||||
.dark\:bg-opacity-80:is(.dark *) {
|
||||
--tw-bg-opacity: 0.8;
|
||||
}
|
||||
@@ -2797,20 +2767,10 @@ video {
|
||||
--tw-ring-offset-color: #1f2937;
|
||||
}
|
||||
|
||||
.dark\:file\:bg-gray-700:is(.dark *)::file-selector-button {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark\:file\:bg-primary-900\/40:is(.dark *)::file-selector-button {
|
||||
background-color: rgb(123 74 30 / 0.4);
|
||||
}
|
||||
|
||||
.dark\:file\:text-gray-300:is(.dark *)::file-selector-button {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(209 213 219 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.dark\:file\:text-primary-300:is(.dark *)::file-selector-button {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(248 185 99 / var(--tw-text-opacity));
|
||||
@@ -2926,11 +2886,6 @@ video {
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.dark\:hover\:file\:bg-gray-600:is(.dark *)::file-selector-button:hover {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark\:hover\:file\:bg-primary-800\/60:is(.dark *)::file-selector-button:hover {
|
||||
background-color: rgb(154 93 38 / 0.6);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user