Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-23 08:58:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Fixes leftsidebar pinned btns styles when darkmode is true and false (#847)

Browse source
This commit is contained in:
Arpit 2021-09-27 16:23:07 +05:30 committed by GitHub
parent 5d0ae0ed69
commit 677e1e9d6a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
frontend/src/Editor/LeftSidebar/SidebarDebugger.jsx
View file

@ -130,6 +130,7 @@ export const LeftSidebarDebugger = ({ darkMode, errors }) => {
</button>
)}
<SidebarPinnedButton
darkMode={darkMode}
component={'Debugger'}
state={popoverPinned}
updateState={updatePopoverPinnedState}

5
frontend/src/Editor/LeftSidebar/SidebarPinnedButton.jsx
View file

@ -2,12 +2,13 @@ import React from 'react';
import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
import Tooltip from 'react-bootstrap/Tooltip';
export const SidebarPinnedButton = ({ state, component, updateState }) => {
export const SidebarPinnedButton = ({ state, component, updateState, darkMode }) => {
const tooltipMsg = state ? `Unpin ${component}` : `Pin ${component}`;
return (
<SidebarPinnedButton.OverlayContainer tip={tooltipMsg}>
<div
className={`btn btn-sm m-1 ${state ? 'btn-light' : 'btn-outline-secondary'} ${
className={`btn btn-sm m-1 ${darkMode ? 'btn-outline-secondary' : 'btn-default'} ${state && 'active'} ${
component === 'Inspector' && 'position-absolute end-0'
}`}
onClick={updateState}

7
frontend/src/Editor/LeftSidebar/sidebar-inspector.js
View file

@ -16,7 +16,12 @@ export const LeftSidebarInspector = ({ darkMode, globals, components, queries })
className={`left-sidebar-item ${open && 'active'}`}
/>
<div {...content} className={`card popover ${open || popoverPinned ? 'show' : 'hide'}`}>
<SidebarPinnedButton component={'Inspector'} state={popoverPinned} updateState={updatePopoverPinnedState} />
<SidebarPinnedButton
darkMode={darkMode}
component={'Inspector'}
state={popoverPinned}
updateState={updatePopoverPinnedState}
/>
<div style={{ marginTop: '1rem' }} className="card-body">
<ReactJson
src={queries}