From 981e7986ce4a9852da0b58c73fa62edfc76cfd79 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?=
 <losada.hernandez.victor@gmail.com>
Date: Sat, 31 Aug 2024 16:20:46 +0200
Subject: [PATCH] Added `className='renderer'` to two input elements in
 `vaultPage.jsx` and added CSS rules for `.renderer` in `vaultPage.less` to
 display an error message when no checkboxes are checked.

---
 client/homebrew/pages/vaultPage/vaultPage.jsx |  2 ++
 .../homebrew/pages/vaultPage/vaultPage.less   | 19 +++++++++++++++++++
 2 files changed, 21 insertions(+)

diff --git a/client/homebrew/pages/vaultPage/vaultPage.jsx b/client/homebrew/pages/vaultPage/vaultPage.jsx
index c279c26c4..7f9310a3c 100644
--- a/client/homebrew/pages/vaultPage/vaultPage.jsx
+++ b/client/homebrew/pages/vaultPage/vaultPage.jsx
@@ -249,6 +249,7 @@ const VaultPage = (props) => {
 
                 <label>
                     <input
+                        className='renderer'
                         ref={v3Ref}
                         type="checkbox"
                         defaultChecked={v3}
@@ -259,6 +260,7 @@ const VaultPage = (props) => {
 
                 <label>
                     <input
+                        className='renderer'
                         ref={legacyRef}
                         type="checkbox"
                         defaultChecked={legacy}
diff --git a/client/homebrew/pages/vaultPage/vaultPage.less b/client/homebrew/pages/vaultPage/vaultPage.less
index e89010ee4..300d5ee11 100644
--- a/client/homebrew/pages/vaultPage/vaultPage.less
+++ b/client/homebrew/pages/vaultPage/vaultPage.less
@@ -112,6 +112,25 @@ body {
 						}
 					}
 
+					&:after {
+						content: "Error:\A At least one renderer should be enabled to make a search";
+						display: block;
+						opacity:0;
+						transition: opacity 0.5s;
+						position: absolute;
+						white-space: pre-wrap;
+						top:0;
+						left:0;
+						right:0;
+						background:rgb(255, 60, 60);
+						color:white;
+						font-weight:900;
+						padding:10px;
+					}
+					&:not(:has(input[type="checkbox"]:checked)):after {
+						opacity:1;
+					}
+
 					#searchButton {
 						position : absolute;
 						right    : 10px;