feat: theme + ux overhaul (#6520)

* feat: theme + ux overhaul

* chore: moved @opencollection/types at root of monorepo

* chore: fixed review comments

* chore: addressed review comments

* chore: fix playwright tests

---------

Co-authored-by: Bijin A B <bijin@usebruno.com>
This commit is contained in:
Anoop M D
2025-12-27 13:52:20 +05:30
committed by GitHub
parent 84f572fa88
commit f40e4d2d79
127 changed files with 10380 additions and 1437 deletions

View File

@@ -49,7 +49,7 @@ const Wrapper = styled.div`
.infotip-text {
visibility: hidden;
width: auto;
background-color: ${(props) => props.theme.requestTabs.active.bg};
background-color: ${(props) => props.theme.background.surface2};
color: ${(props) => props.theme.text};
text-align: center;
border-radius: 4px;
@@ -72,7 +72,7 @@ const Wrapper = styled.div`
margin-left: -4px;
border-width: 4px;
border-style: solid;
border-color: ${(props) => props.theme.requestTabs.active.bg} transparent transparent transparent;
border-color: ${(props) => props.theme.background.surface2} transparent transparent transparent;
}
.shortcut {

View File

@@ -348,7 +348,7 @@ const GrpcQueryUrl = ({ item, collection, handleRun }) => {
<IconRefresh
color={theme.requestTabs.icon.color}
strokeWidth={1.5}
size={22}
size={20}
className={`${(isReflectionMode ? reflectionManagement.isLoadingMethods : protoFileManagement.isLoadingMethods) ? 'animate-spin' : 'cursor-pointer'}`}
data-testid="refresh-methods-icon"
/>
@@ -367,7 +367,7 @@ const GrpcQueryUrl = ({ item, collection, handleRun }) => {
<IconCode
color={theme.requestTabs.icon.color}
strokeWidth={1.5}
size={22}
size={20}
/>
<span className="infotip-text text-xs">Generate grpcurl command</span>
</div>
@@ -383,7 +383,7 @@ const GrpcQueryUrl = ({ item, collection, handleRun }) => {
<IconDeviceFloppy
color={item.draft ? theme.colors.text.yellow : theme.requestTabs.icon.color}
strokeWidth={1.5}
size={22}
size={20}
className={`${item.draft ? 'cursor-pointer' : 'cursor-default'}`}
/>
<span className="infotip-text text-xs">
@@ -394,7 +394,7 @@ const GrpcQueryUrl = ({ item, collection, handleRun }) => {
{isConnectionActive && isStreamingMethod && (
<div className="connection-controls relative flex items-center h-full gap-3">
<div className="infotip" onClick={handleCancelConnection} data-testid="grpc-cancel-connection-button">
<IconX color={theme.requestTabs.icon.color} strokeWidth={1.5} size={22} className="cursor-pointer" />
<IconX color={theme.requestTabs.icon.color} strokeWidth={1.5} size={20} className="cursor-pointer" />
<span className="infotip-text text-xs">Cancel</span>
</div>
@@ -403,7 +403,7 @@ const GrpcQueryUrl = ({ item, collection, handleRun }) => {
<IconCheck
color={theme.colors.text.green}
strokeWidth={2}
size={22}
size={20}
className="cursor-pointer"
/>
</div>
@@ -420,7 +420,7 @@ const GrpcQueryUrl = ({ item, collection, handleRun }) => {
handleRun(e);
}}
>
<IconArrowRight color={theme.requestTabPanel.url.icon} strokeWidth={1.5} size={22} />
<IconArrowRight color={theme.requestTabPanel.url.icon} strokeWidth={1.5} size={20} />
</div>
)}
</div>