From 86866c9dd2cabb114737d8410e6a8af32867fef8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Mon, 19 Oct 2026 12:59:12 +0200 Subject: [PATCH 1/4] refactor uipage to be functional --- .../homebrew/pages/basePages/uiPage/uiPage.jsx | 17 +++++------------ 1 file changed, 5 insertions(+), 12 deletions(-) diff --git a/client/homebrew/pages/basePages/uiPage/uiPage.jsx b/client/homebrew/pages/basePages/uiPage/uiPage.jsx index 400dbb28e..bd16b85e5 100644 --- a/client/homebrew/pages/basePages/uiPage/uiPage.jsx +++ b/client/homebrew/pages/basePages/uiPage/uiPage.jsx @@ -1,7 +1,4 @@ import './uiPage.less'; -import React from 'react'; -import createReactClass from 'create-react-class'; - import Nav from '../../../navbar/nav.jsx'; import Navbar from '../../../navbar/navbar.jsx'; import NewBrewItem from '../../../navbar/newbrew.navitem.jsx'; @@ -10,15 +7,12 @@ import RecentNavItems from '../../../navbar/recent.navitem.jsx'; const { both: RecentNavItem } = RecentNavItems; import Account from '../../../navbar/account.navitem.jsx'; +const UIPage = ({brew, children})=>{ -const UIPage = createReactClass({ - displayName : 'UIPage', - - render : function(){ - return
+ return
- {this.props.brew.title} + {brew?.title} @@ -30,10 +24,9 @@ const UIPage = createReactClass({
- {this.props.children} + {children}
; - } -}); +}; export default UIPage; From eaa23f51fc97552ae0ca861cabf7556eedefe120 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Mon, 19 Oct 2026 13:00:57 +0200 Subject: [PATCH 2/4] lint --- .../pages/basePages/uiPage/uiPage.jsx | 36 +++++++++---------- 1 file changed, 16 insertions(+), 20 deletions(-) diff --git a/client/homebrew/pages/basePages/uiPage/uiPage.jsx b/client/homebrew/pages/basePages/uiPage/uiPage.jsx index bd16b85e5..9fa7e08bb 100644 --- a/client/homebrew/pages/basePages/uiPage/uiPage.jsx +++ b/client/homebrew/pages/basePages/uiPage/uiPage.jsx @@ -7,26 +7,22 @@ import RecentNavItems from '../../../navbar/recent.navitem.jsx'; const { both: RecentNavItem } = RecentNavItems; import Account from '../../../navbar/account.navitem.jsx'; -const UIPage = ({brew, children})=>{ +const UIPage = ({ brew, children })=>
+ + + {brew?.title} + + + + + + + + - return
- - - {brew?.title} - - - - - - - - - - -
- {children} -
-
; -}; +
+ {children} +
+
; export default UIPage; From d639caf245c8372f11fe5072d1290ae1fc0d26ff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Mon, 19 Oct 2026 14:48:09 +0200 Subject: [PATCH 3/4] make vault use similar styles to metadata editor --- .../homebrew/pages/vaultPage/vaultPage.less | 32 +++++++++++++++---- 1 file changed, 25 insertions(+), 7 deletions(-) diff --git a/client/homebrew/pages/vaultPage/vaultPage.less b/client/homebrew/pages/vaultPage/vaultPage.less index 85eabe7a0..dd10fc6fb 100644 --- a/client/homebrew/pages/vaultPage/vaultPage.less +++ b/client/homebrew/pages/vaultPage/vaultPage.less @@ -1,9 +1,20 @@ +@import '@themes/assets/assets.less'; @import '@sharedStyles/core.less'; .vaultPage { height : 100%; overflow-y : hidden; + --bg-clr : white; + --bg-image : @backgroundImageAlt; + --h1-clr : black; + --h2-clr : #000077; + --label-clr : black; + --input-bg : white; + --input-bg-hover : #DDDDDD; + --input-text-clr : black; + --input-placeholder-clr : grey; + *:not(input) { user-select : none; } .form { background : white; } @@ -13,8 +24,14 @@ height : 100%; &.form .brewLookup { + color : var(--label-clr); + background-color : var(--bg-clr); + background-image : var(--bg-image); + background-size : cover; + position : relative; padding : 50px clamp(20px, 4vw, 50px); + small { font-size : 10pt; @@ -33,6 +50,7 @@ h1, h2, h3, h4 { font-family : 'CodeBold'; letter-spacing : 2px; + color : var(--h1-clr); } legend { @@ -87,14 +105,14 @@ align-items : center; margin : 10px 0; } - select { margin : 0 10px; } - - input { + input[type='text'], textarea, select { margin : 0 10px; - - &:invalid { background : rgb(255, 188, 181); } - - + color : var(--input-text-clr); + background-color : var(--input-bg); + border : 1px solid var(--input-placeholder-clr); + &:hover, :focus { outline : 1px solid var(--input-placeholder-clr); background-color : var(--input-bg-hover); } + &::placeholder { color : var(--input-placeholder-clr); } + &:invalid { background : #ffbcb5; } } #searchButton { From f9aceeb296aede174ce83a29e69f9b503c8ed913 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?= Date: Mon, 19 Oct 2026 15:46:20 +0200 Subject: [PATCH 4/4] update form height vault --- client/homebrew/pages/vaultPage/vaultPage.less | 1 + 1 file changed, 1 insertion(+) diff --git a/client/homebrew/pages/vaultPage/vaultPage.less b/client/homebrew/pages/vaultPage/vaultPage.less index dd10fc6fb..72ff916fe 100644 --- a/client/homebrew/pages/vaultPage/vaultPage.less +++ b/client/homebrew/pages/vaultPage/vaultPage.less @@ -28,6 +28,7 @@ background-color : var(--bg-clr); background-image : var(--bg-image); background-size : cover; + height:100%; position : relative; padding : 50px clamp(20px, 4vw, 50px);