From 2e8368d08c43dfb647331be5ae24963263e65dee Mon Sep 17 00:00:00 2001 From: Gazook89 Date: Fri, 8 Nov 2024 21:56:35 -0600 Subject: [PATCH 1/3] give dismisskeys a default --- client/components/dialog.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/components/dialog.jsx b/client/components/dialog.jsx index 9e88afa33..c08cb539b 100644 --- a/client/components/dialog.jsx +++ b/client/components/dialog.jsx @@ -2,7 +2,7 @@ import React from "react"; const { useRef, useEffect } = React; -function Dialog({ dismisskeys, closeText = 'Close', blocking = false, ...rest }) { +function Dialog({ dismisskeys = [], closeText = 'Close', blocking = false, ...rest }) { const dialogRef = useRef(null); useEffect(()=>{ From b7b1981bdefcab631ea57de20a9a3c5fe8f75190 Mon Sep 17 00:00:00 2001 From: Gazook89 Date: Fri, 8 Nov 2024 21:56:45 -0600 Subject: [PATCH 2/3] lint --- client/components/dialog.jsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/client/components/dialog.jsx b/client/components/dialog.jsx index c08cb539b..0cdda2dee 100644 --- a/client/components/dialog.jsx +++ b/client/components/dialog.jsx @@ -1,25 +1,25 @@ // Dialog box, for popups and modal blocking messages -import React from "react"; +import React from 'react'; const { useRef, useEffect } = React; function Dialog({ dismisskeys = [], closeText = 'Close', blocking = false, ...rest }) { const dialogRef = useRef(null); useEffect(()=>{ - if (dismisskeys.length !== 0) { + if(dismisskeys.length !== 0) { blocking ? dialogRef.current?.showModal() : dialogRef.current?.show(); } }, [dialogRef.current, dismisskeys]); - const dismiss = () => { - dismisskeys.forEach(key => { - if (key) { + const dismiss = ()=>{ + dismisskeys.forEach((key)=>{ + if(key) { localStorage.setItem(key, 'true'); } }); dialogRef.current?.close(); }; - + return ( {rest.children} From 9bc4b1fb5689abd4ca052f4501095f3f64abbd35 Mon Sep 17 00:00:00 2001 From: Gazook89 Date: Thu, 31 Oct 2024 22:04:11 -0500 Subject: [PATCH 3/3] Changes to core.less, reset.less, and toolbar Making some changes to the reset.less so that some default UA button styling is removed. Then, changing core.less so that the classic "HB" button styling is scoped to a certain class `.colorButton`. This will make it easier to use the button element in other places. --- client/homebrew/brewRenderer/toolBar/toolBar.less | 8 +------- client/homebrew/editor/metadataEditor/metadataEditor.less | 7 ++++--- shared/naturalcrit/styles/core.less | 5 +---- shared/naturalcrit/styles/reset.less | 8 +++++++- 4 files changed, 13 insertions(+), 15 deletions(-) diff --git a/client/homebrew/brewRenderer/toolBar/toolBar.less b/client/homebrew/brewRenderer/toolBar/toolBar.less index 381e5eeed..c2f4ff148 100644 --- a/client/homebrew/brewRenderer/toolBar/toolBar.less +++ b/client/homebrew/brewRenderer/toolBar/toolBar.less @@ -13,6 +13,7 @@ height : auto; padding : 2px 0; font-family : 'Open Sans', sans-serif; + font-size : 13px; color : #CCCCCC; background-color : #555555; & > *:not(.toggleButton) { @@ -154,13 +155,6 @@ width : auto; min-width : 46px; height : 100%; - padding : 0 0px; - font-weight : unset; - color : inherit; - background-color : unset; - - &:not(button:has(i, svg)) { padding : 0 8px; } - &:hover { background-color : #444444; } &:focus { border : 1px solid #D3D3D3;outline : none;} &:disabled { diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.less b/client/homebrew/editor/metadataEditor/metadataEditor.less index 62ec6b37b..d29916a50 100644 --- a/client/homebrew/editor/metadataEditor/metadataEditor.less +++ b/client/homebrew/editor/metadataEditor/metadataEditor.less @@ -79,6 +79,7 @@ text-overflow : ellipsis; } button { + .colorButton(); padding : 0px 5px; color : white; background-color : black; @@ -138,16 +139,16 @@ margin-bottom : 15px; button { width : 100%; } button.publish { - .button(@blueLight); + .colorButton(@blueLight); } button.unpublish { - .button(@silver); + .colorButton(@silver); } } .delete.field .value { button { - .button(@red); + .colorButton(@red); } } .authors.field .value { diff --git a/shared/naturalcrit/styles/core.less b/shared/naturalcrit/styles/core.less index c742ad7b1..21a2687bc 100644 --- a/shared/naturalcrit/styles/core.less +++ b/shared/naturalcrit/styles/core.less @@ -21,10 +21,7 @@ html,body, #reactRoot{ *{ box-sizing : border-box; } -button{ - .button(); -} -.button(@backgroundColor : @green){ +.colorButton(@backgroundColor : @green){ .animate(background-color); display : inline-block; padding : 0.6em 1.2em; diff --git a/shared/naturalcrit/styles/reset.less b/shared/naturalcrit/styles/reset.less index be5bffc7e..df5564a21 100644 --- a/shared/naturalcrit/styles/reset.less +++ b/shared/naturalcrit/styles/reset.less @@ -1,4 +1,4 @@ -:where(html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video){ +:where(html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,button,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video){ border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0 } @@ -25,3 +25,9 @@ :where(table){ border-collapse:collapse;border-spacing:0 } + +:where(button) { + background-color: unset; + text-transform: unset; + color: unset; +}