From e893dc03279a34553c9d75882052944013f3b944 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Aneta=20Jastrz=C4=99bska?=
 <1544710+anetaj@users.noreply.github.com>
Date: Sat, 21 Sep 2024 13:12:22 +0200
Subject: [PATCH] add default style for small button

---
 .../src/sidebar/MarkdownRender/BlockCode.tsx  | 16 ++++----
 extensions/void/src/sidebar/styles.css        | 40 ++++++++++---------
 2 files changed, 30 insertions(+), 26 deletions(-)

diff --git a/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx b/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx
index 812c7e2a..e165ce1e 100644
--- a/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx
+++ b/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx
@@ -7,7 +7,7 @@ enum CopyButtonState {
 	Error = "Could not copy",
 }
 
-const COPY_FEEDBACK_TIMEOUT = 2000
+const COPY_FEEDBACK_TIMEOUT = 1000
 
 // code block with Apply button at top
 const BlockCode = ({
@@ -42,9 +42,15 @@ const BlockCode = ({
 		<div className="relative group">
 			<div className="absolute top-0 right-0 invisible group-hover:visible">
 				<div className="flex space-x-2 p-2">
+					<button
+						className="btn btn-secondary btn-sm border border-vscode-input-border rounded"
+						onClick={onCopy}
+					>
+						{copyButtonState}
+					</button>
 					{!disableApplyButton && (
 						<button
-							className="btn btn-secondary px-3 py-1 text-sm border border-vscode-input-border rounded"
+							className="btn btn-secondary btn-sm border border-vscode-input-border rounded"
 							onClick={async () => {
 								getVSCodeAPI().postMessage({ type: "applyCode", code: text })
 							}}
@@ -52,12 +58,6 @@ const BlockCode = ({
 							Apply
 						</button>
 					)}
-					<button
-						className="btn btn-secondary px-3 py-1 text-sm border border-vscode-input-border rounded"
-						onClick={onCopy}
-					>
-						{copyButtonState}
-					</button>
 				</div>
 			</div>
 			<div
diff --git a/extensions/void/src/sidebar/styles.css b/extensions/void/src/sidebar/styles.css
index 8e6ff79f..6a1d2159 100644
--- a/extensions/void/src/sidebar/styles.css
+++ b/extensions/void/src/sidebar/styles.css
@@ -3,33 +3,37 @@
 @tailwind utilities;
 
 html {
-    font-size: var(--vscode-font-size);
+	font-size: var(--vscode-font-size);
 }
 
 .btn {
-    @apply cursor-pointer transition-colors;
+	@apply cursor-pointer transition-colors;
 
-    &.btn-primary {
-        @apply bg-vscode-button-bg text-vscode-button-fg;
+	&.btn-primary {
+		@apply bg-vscode-button-bg text-vscode-button-fg;
 
-        &:not(:disabled) {
-            @apply hover:bg-vscode-button-hoverBg;
-        }
-    }
+		&:not(:disabled) {
+			@apply hover:bg-vscode-button-hoverBg;
+		}
+	}
 
-    &.btn-secondary {
-        @apply bg-vscode-button-secondary-bg text-vscode-button-secondary-fg;
+	&.btn-sm {
+		@apply px-3 py-1 text-sm;
+	}
 
-        &:not(:disabled) {
-            @apply hover:bg-vscode-button-secondary-hoverBg;
-        }
-    }
+	&.btn-secondary {
+		@apply bg-vscode-button-secondary-bg text-vscode-button-secondary-fg;
 
-    &:disabled {
-        @apply opacity-75 cursor-not-allowed;
-    }
+		&:not(:disabled) {
+			@apply hover:bg-vscode-button-secondary-hoverBg;
+		}
+	}
+
+	&:disabled {
+		@apply opacity-75 cursor-not-allowed;
+	}
 }
 
 .input {
-    @apply bg-vscode-input-bg text-vscode-input-fg border-vscode-input-border;
+	@apply bg-vscode-input-bg text-vscode-input-fg border-vscode-input-border;
 }