Skip to content

Commit

Permalink
Merge pull request #84 from getAlby/task-fix-dark
Browse files Browse the repository at this point in the history 
fix: dark theme for nwc
  • Loading branch information
@kiwiidb
kiwiidb authored Jun 15, 2023
2 parents 0ee7552 + 93b1e3f commit 490833d
Show file tree
Hide file tree
Showing 11 changed files with 278 additions and 168 deletions.
138 changes: 108 additions & 30 deletions public/css/application.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -826,12 +826,12 @@ select {
margin-top: 2rem;
}

.block {
display: block;
.mt-2 {
margin-top: 0.5rem;
}

.inline-block {
display: inline-block;
.block {
display: block;
}

.inline {
Expand Down Expand Up @@ -942,6 +942,17 @@ select {
justify-content: space-between;
}

.divide-y > :not([hidden]) ~ :not([hidden]) {
--tw-divide-y-reverse: 0;
border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}

.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
--tw-divide-opacity: 1;
border-color: rgb(229 231 235 / var(--tw-divide-opacity));
}

.overflow-hidden {
overflow: hidden;
}
Expand All @@ -958,11 +969,6 @@ select {
border-radius: 0.375rem;
}

.rounded-b {
border-bottom-right-radius: 0.25rem;
border-bottom-left-radius: 0.25rem;
}

.rounded-t-lg {
border-top-left-radius: 0.5rem;
border-top-right-radius: 0.5rem;
Expand All @@ -972,10 +978,6 @@ select {
border-width: 1px;
}

.border-2 {
border-width: 2px;
}

.border-b {
border-bottom-width: 1px;
}
Expand All @@ -998,11 +1000,6 @@ select {
border-color: rgb(209 213 219 / var(--tw-border-opacity));
}

.border-gray-600 {
--tw-border-opacity: 1;
border-color: rgb(75 85 99 / var(--tw-border-opacity));
}

.border-green-500 {
--tw-border-opacity: 1;
border-color: rgb(34 197 94 / var(--tw-border-opacity));
Expand All @@ -1013,11 +1010,6 @@ select {
border-color: rgb(248 113 113 / var(--tw-border-opacity));
}

.border-slate-200 {
--tw-border-opacity: 1;
border-color: rgb(226 232 240 / var(--tw-border-opacity));
}

.bg-blue-50 {
--tw-bg-opacity: 1;
background-color: rgb(239 246 255 / var(--tw-bg-opacity));
Expand Down Expand Up @@ -1151,6 +1143,10 @@ select {
padding-right: 1rem;
}

.pt-4 {
padding-top: 1rem;
}

.text-left {
text-align: left;
}
Expand Down Expand Up @@ -1252,6 +1248,11 @@ select {
color: rgb(34 197 94 / var(--tw-text-opacity));
}

.text-green-700 {
--tw-text-opacity: 1;
color: rgb(21 128 61 / var(--tw-text-opacity));
}

.text-orange-700 {
--tw-text-opacity: 1;
color: rgb(194 65 12 / var(--tw-text-opacity));
Expand All @@ -1267,11 +1268,6 @@ select {
color: rgb(126 34 206 / var(--tw-text-opacity));
}

.text-red-400 {
--tw-text-opacity: 1;
color: rgb(248 113 113 / var(--tw-text-opacity));
}

.text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
Expand Down Expand Up @@ -1339,6 +1335,11 @@ select {
background-color: rgb(88 28 135 / var(--tw-bg-opacity));
}

.hover\:text-gray-600:hover {
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity));
}

.focus\:border-purple-500:focus {
--tw-border-opacity: 1;
border-color: rgb(168 85 247 / var(--tw-border-opacity));
Expand Down Expand Up @@ -1376,6 +1377,10 @@ select {
}

@media (prefers-color-scheme: dark) {
.dark\:divide-white\/10 > :not([hidden]) ~ :not([hidden]) {
border-color: rgb(255 255 255 / 0.1);
}

.dark\:border-gray-500 {
--tw-border-opacity: 1;
border-color: rgb(107 114 128 / var(--tw-border-opacity));
Expand All @@ -1396,6 +1401,15 @@ select {
border-color: rgb(38 38 38 / var(--tw-border-opacity));
}

.dark\:border-white\/10 {
border-color: rgb(255 255 255 / 0.1);
}

.dark\:border-gray-800 {
--tw-border-opacity: 1;
border-color: rgb(31 41 55 / var(--tw-border-opacity));
}

.dark\:bg-gray-600 {
--tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
Expand All @@ -1406,16 +1420,41 @@ select {
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
}

.dark\:bg-gray-800 {
.dark\:bg-green-900 {
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
background-color: rgb(20 83 45 / var(--tw-bg-opacity));
}

.dark\:bg-orange-900 {
--tw-bg-opacity: 1;
background-color: rgb(124 45 18 / var(--tw-bg-opacity));
}

.dark\:bg-surface-00dp {
--tw-bg-opacity: 1;
background-color: rgb(18 18 18 / var(--tw-bg-opacity));
}

.dark\:bg-surface-01dp {
--tw-bg-opacity: 1;
background-color: rgb(31 31 31 / var(--tw-bg-opacity));
}

.dark\:bg-surface-02dp {
--tw-bg-opacity: 1;
background-color: rgb(36 36 36 / var(--tw-bg-opacity));
}

.dark\:bg-surface-08dp {
--tw-bg-opacity: 1;
background-color: rgb(49 49 49 / var(--tw-bg-opacity));
}

.dark\:text-gray-100 {
--tw-text-opacity: 1;
color: rgb(243 244 246 / var(--tw-text-opacity));
}

.dark\:text-gray-300 {
--tw-text-opacity: 1;
color: rgb(209 213 219 / var(--tw-text-opacity));
Expand All @@ -1426,16 +1465,46 @@ select {
color: rgb(156 163 175 / var(--tw-text-opacity));
}

.dark\:text-green-400 {
--tw-text-opacity: 1;
color: rgb(74 222 128 / var(--tw-text-opacity));
}

.dark\:text-neutral-200 {
--tw-text-opacity: 1;
color: rgb(229 229 229 / var(--tw-text-opacity));
}

.dark\:text-neutral-300 {
--tw-text-opacity: 1;
color: rgb(212 212 212 / var(--tw-text-opacity));
}

.dark\:text-neutral-400 {
--tw-text-opacity: 1;
color: rgb(163 163 163 / var(--tw-text-opacity));
}

.dark\:text-orange-400 {
--tw-text-opacity: 1;
color: rgb(251 146 60 / var(--tw-text-opacity));
}

.dark\:text-purple-400 {
--tw-text-opacity: 1;
color: rgb(192 132 252 / var(--tw-text-opacity));
}

.dark\:text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}

.dark\:text-gray-200 {
--tw-text-opacity: 1;
color: rgb(229 231 235 / var(--tw-text-opacity));
}

.dark\:placeholder-gray-400::-moz-placeholder {
--tw-placeholder-opacity: 1;
color: rgb(156 163 175 / var(--tw-placeholder-opacity));
Expand All @@ -1454,11 +1523,20 @@ select {
--tw-ring-offset-color: #1f2937;
}

.dark\:\[color-scheme\:dark\] {
color-scheme: dark;
}

.dark\:hover\:bg-surface-16dp:hover {
--tw-bg-opacity: 1;
background-color: rgb(56 56 56 / var(--tw-bg-opacity));
}

.dark\:hover\:text-gray-300:hover {
--tw-text-opacity: 1;
color: rgb(209 213 219 / var(--tw-text-opacity));
}

.dark\:focus\:border-purple-500:focus {
--tw-border-opacity: 1;
border-color: rgb(168 85 247 / var(--tw-border-opacity));
Expand Down
1 change: 1 addition & 0 deletions public/images/alby-logo-with-text-dark.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions public/images/copy.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 490833d

Please sign in to comment.