Fix: Updated snackbar to Material 3

ollm · Aug 23, 2023 · ae8e195 · ae8e195
1 parent 50d8487
commit ae8e195
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 6 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,9 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### 🐛 Bug Fixes
 
+- Improved local artwork assets support [`f21cccd`](https://github.com/ollm/OpenComic/commit/f21cccd9c2c943f7ad8735e106afff453397cfbf)
+- Some errors on Tracking feature [`50d8487`](https://github.com/ollm/OpenComic/commit/50d84874ea99cdace27f2c3bfc994b3338f23a42)
+- Updated snackbar to Material 3
 
 ## [v1.0.0-beta.1](https://github.com/ollm/OpenComic/releases/tag/v1.0.0-beta.1) (22-08-2023)
 

diff --git a/templates/snackbar.html b/templates/snackbar.html
@@ -1,5 +1,5 @@
-<div class="snackbar elevation6">
-	<div class="snackbarText">{{snackbar.text}}</div>
+<div class="snackbar elevation-3">
+	<div class="snackbar-text body-medium">{{snackbar.text}}</div>
 	<div class="snackbar-buttons">
 		{{#each snackbar.buttons}}
 		<div class="simple-button transparent"{{#if right}} style="right: {{right}}px"{{/if}}>

diff --git a/themes/material-design/actions.css b/themes/material-design/actions.css
@@ -773,8 +773,8 @@
 .snackbars .snackbar
 {
 	min-height: 48px;
-	background-color: #323232;
-	border-radius: 4px;
+	background-color: var(--md-sys-color-inverse-surface);
+	border-radius: 8px;
 	position: fixed;
 	bottom: 8px;
 	left: 8px;
@@ -802,12 +802,12 @@
 	animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);
 }
 
-.snackbars .snackbarText
+.snackbars .snackbar-text
 {
 	padding: 14px 16px;
 	line-height: 20px;
 	font-size: 14px;
-	color: #fff;
+	color: var(--md-sys-color-inverse-on-surface);
 	box-sizing: border-box;
 	word-wrap: break-word;
 	word-break: break-all;
@@ -826,6 +826,11 @@
 	float: right;
 }
 
+.snackbars .snackbar .simple-button.transparent > div
+{
+	color: var(--md-sys-color-inverse-primary);
+}
+
 /* Input */
 .input
 {
@@ -861,6 +866,11 @@
 	float: left;
 	transition: opacity 0.15s cubic-bezier(0.4, 0.0, 0.2, 1);
 	cursor: pointer;
+	font-family: var(--md-sys-typescale-label-large-font-family-name);
+	font-style: var(--md-sys-typescale-label-large-font-family-style);
+	font-weight: var(--md-sys-typescale-label-large-font-weight);
+	font-size: var(--md-sys-typescale-label-large-font-size);
+	letter-spacing: var(--md-sys-typescale-label-large-letter-spacing);
 }
 
 .simple-button.disable