fixed design issues

app.vue

@@ -97,7 +97,7 @@ const scrollToSelectedItem = () => {
       const elementRect = element.getBoundingClientRect();
 
       const isAbove = elementRect.top < viewportRect.top;
-      const isBelow = elementRect.bottom > viewportRect.bottom - 48;
+      const isBelow = elementRect.bottom > viewportRect.bottom - 8;
 
       if (isAbove || isBelow) {
         let scrollOffset;
@@ -107,7 +107,7 @@ const scrollToSelectedItem = () => {
         } else if (isAbove) {
           scrollOffset = elementRect.top - viewportRect.top - 8;
         } else {
-          scrollOffset = elementRect.bottom - viewportRect.bottom + 48;
+          scrollOffset = elementRect.bottom - viewportRect.bottom + 9;
         }
 
         viewport.scrollBy({

assets/css/style.scss

@@ -53,8 +53,8 @@ body,
 }
 
 .bg {
-  width: 100vw;
+  width: 750px;
-  height: 100vh;
+  height: 474px;
   background-color: $primary;
   border: 1px solid $divider;
   border-radius: 12px;
@@ -84,13 +84,13 @@ body,
   width: 284px;
   top: 53px;
   left: 0;
-  height: calc(100vh - 55px);
+  height: calc(100vh - 96px);
   border-right: 1px solid $divider;
   display: flex;
   flex-direction: column;
   padding-inline: 8px;
   padding-top: 14px;
-  padding-bottom: 49px;
+  padding-bottom: 8px;
   overflow-y: auto;
   overflow-x: hidden;
 
@@ -136,14 +136,14 @@ body,
 
 .bottom-bar {
   height: 41px;
-  width: calc(100vw - 2px);
+  width: calc(100vw - 3px);
   backdrop-filter: blur(18px);
   background-color: rgba(46, 45, 43, 0.8);
   position: fixed;
-  bottom: 1px;
+  bottom: 2px;
   left: 1px;
   z-index: 100;
-  border-radius: 0 0 10px 10px;
+  border-radius: 0 0 12px 12px;
   display: flex;
   flex-direction: row;
   justify-content: space-between;

src-tauri/Cargo.lock

@@ -3146,6 +3146,7 @@ version = "0.1.0"
 dependencies = [
  "arboard",
  "base64 0.22.1",
+ "clipboard-win",
  "image 0.25.1",
  "rand 0.8.5",
  "rdev",

src-tauri/Cargo.toml

@@ -26,3 +26,4 @@ rand = "0.8"
 base64 = "0.22.1"
 arboard = "3.4.0"
 image = "0.25.1"
+clipboard-win = "5.3.1"

src-tauri/src/clipboard.rs

@@ -1,15 +1,15 @@
+use base64::engine::general_purpose::STANDARD;
+use base64::Engine;
+use clipboard_win::{formats, get_clipboard, is_format_avail};
+use rand::distributions::Alphanumeric;
+use rand::{thread_rng, Rng};
 use rdev::{listen, simulate, EventType, Key};
+use sqlx::SqlitePool;
 use std::sync::mpsc;
 use std::thread;
 use std::time::Duration;
 use tauri::Manager;
-use arboard::{Clipboard, ImageData};
-use sqlx::SqlitePool;
 use tokio::runtime::Runtime;
-use rand::{thread_rng, Rng};
-use rand::distributions::Alphanumeric;
-use base64::engine::general_purpose::STANDARD;
-use base64::Engine;
 
 #[tauri::command]
 pub fn simulate_paste() {
@@ -38,30 +38,43 @@ pub fn setup(app_handle: tauri::AppHandle) {
             }
             EventType::KeyRelease(Key::KeyC) => {
                 if rx.try_recv().is_ok() {
-                    let mut clipboard = Clipboard::new().unwrap();
                     let pool = app_handle.state::<SqlitePool>();
                     let rt = app_handle.state::<Runtime>();
 
-                    if let Ok(content) = clipboard.get_text() {
+                    if let Ok(content) = get_clipboard(formats::Unicode) {
                         rt.block_on(async {
                             insert_content_if_not_exists(&pool, "text", content).await;
                         });
                     }
 
-                    match clipboard.get_image() {
+                    if is_format_avail(formats::Bitmap.into()) {
+                        match get_clipboard(formats::Bitmap) {
                             Ok(image) => {
                                 println!("Image found in clipboard");
                                 rt.block_on(async {
-                                let base64_image = STANDARD.encode(&image.bytes);
+                                    let base64_image = STANDARD.encode(&image);
                                     println!("Image encoded to base64");
-                                insert_content_if_not_exists(&pool, "image", base64_image).await;
+                                    insert_content_if_not_exists(&pool, "image", base64_image)
+                                        .await;
                                     println!("Image inserted into database");
                                 });
-                        },
+                            }
                             Err(e) => {
                                 println!("Error reading image from clipboard: {:?}", e);
                             }
                         }
+                    } else {
+                        println!("No image format available in clipboard");
+                    }
+
+                    match get_clipboard(formats::RawData(0)) {
+                        Ok(data) => {
+                            println!("{:?}", data);
+                        }
+                        Err(e) => {
+                            println!("Error reading raw data from clipboard: {:?}", e);
+                        }
+                    }
                 }
             }
             _ => {}
@@ -71,8 +84,9 @@ pub fn setup(app_handle: tauri::AppHandle) {
 }
 
 async fn insert_content_if_not_exists(pool: &SqlitePool, content_type: &str, content: String) {
-    // Check if content already exists
+    let exists: bool = sqlx::query_scalar(
-    let exists: bool = sqlx::query_scalar("SELECT EXISTS(SELECT 1 FROM history WHERE content_type = ? AND content = ?)")
+        "SELECT EXISTS(SELECT 1 FROM history WHERE content_type = ? AND content = ?)",
+    )
     .bind(content_type)
     .bind(&content)
     .fetch_one(pool)