mirror of
https://github.com/usebruno/bruno.git
synced 2024-12-22 23:02:40 +01:00
feat: github star button blends with dark mode
This commit is contained in:
parent
a0903a5842
commit
0efd782bcb
@ -45,6 +45,7 @@
|
|||||||
"react-dnd": "^16.0.1",
|
"react-dnd": "^16.0.1",
|
||||||
"react-dnd-html5-backend": "^16.0.1",
|
"react-dnd-html5-backend": "^16.0.1",
|
||||||
"react-dom": "18.2.0",
|
"react-dom": "18.2.0",
|
||||||
|
"react-github-btn": "^1.4.0",
|
||||||
"react-hot-toast": "^2.4.0",
|
"react-hot-toast": "^2.4.0",
|
||||||
"react-redux": "^7.2.6",
|
"react-redux": "^7.2.6",
|
||||||
"react-tooltip": "^5.5.2",
|
"react-tooltip": "^5.5.2",
|
||||||
|
@ -14,6 +14,16 @@ const StyledWrapper = styled.div`
|
|||||||
|
|
||||||
// Todo: dark mode temporary fix
|
// Todo: dark mode temporary fix
|
||||||
// Clean this
|
// Clean this
|
||||||
|
.CodeMirror.cm-s-monokai {
|
||||||
|
.CodeMirror-overlayscroll-horizontal div, .CodeMirror-overlayscroll-vertical div {
|
||||||
|
background: #444444;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cm-s-monokai span.cm-property, .cm-s-monokai span.cm-attribute {
|
||||||
|
color: #9cdcfe !important;
|
||||||
|
}
|
||||||
|
|
||||||
.cm-s-monokai span.cm-property, .cm-s-monokai span.cm-attribute {
|
.cm-s-monokai span.cm-property, .cm-s-monokai span.cm-attribute {
|
||||||
color: #9cdcfe !important;
|
color: #9cdcfe !important;
|
||||||
}
|
}
|
||||||
|
@ -51,6 +51,7 @@ export default class QueryEditor extends React.Component {
|
|||||||
autoCloseBrackets: true,
|
autoCloseBrackets: true,
|
||||||
matchBrackets: true,
|
matchBrackets: true,
|
||||||
showCursorWhenSelecting: true,
|
showCursorWhenSelecting: true,
|
||||||
|
scrollbarStyle: "overlay",
|
||||||
readOnly: this.props.readOnly ? 'nocursor' : false,
|
readOnly: this.props.readOnly ? 'nocursor' : false,
|
||||||
foldGutter: {
|
foldGutter: {
|
||||||
minFoldSize: 4
|
minFoldSize: 4
|
||||||
|
@ -2,11 +2,13 @@ import MenuBar from './MenuBar';
|
|||||||
import TitleBar from './TitleBar';
|
import TitleBar from './TitleBar';
|
||||||
import Collections from './Collections';
|
import Collections from './Collections';
|
||||||
import StyledWrapper, { BottomWrapper, VersionNumber } from './StyledWrapper';
|
import StyledWrapper, { BottomWrapper, VersionNumber } from './StyledWrapper';
|
||||||
|
import GitHubButton from 'react-github-btn'
|
||||||
|
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect } from 'react';
|
||||||
import { useSelector, useDispatch } from 'react-redux';
|
import { useSelector, useDispatch } from 'react-redux';
|
||||||
import { IconChevronsRight } from '@tabler/icons';
|
import { IconChevronsRight } from '@tabler/icons';
|
||||||
import { updateLeftSidebarWidth, updateIsDragging, toggleLeftMenuBar } from 'providers/ReduxStore/slices/app';
|
import { updateLeftSidebarWidth, updateIsDragging, toggleLeftMenuBar } from 'providers/ReduxStore/slices/app';
|
||||||
|
import { useTheme } from 'providers/Theme';
|
||||||
|
|
||||||
const MIN_LEFT_SIDEBAR_WIDTH = 222;
|
const MIN_LEFT_SIDEBAR_WIDTH = 222;
|
||||||
const MAX_LEFT_SIDEBAR_WIDTH = 600;
|
const MAX_LEFT_SIDEBAR_WIDTH = 600;
|
||||||
@ -17,6 +19,10 @@ const Sidebar = () => {
|
|||||||
|
|
||||||
const [asideWidth, setAsideWidth] = useState(leftSidebarWidth);
|
const [asideWidth, setAsideWidth] = useState(leftSidebarWidth);
|
||||||
|
|
||||||
|
const {
|
||||||
|
storedTheme
|
||||||
|
} = useTheme();
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const [dragging, setDragging] = useState(false);
|
const [dragging, setDragging] = useState(false);
|
||||||
|
|
||||||
@ -89,17 +95,27 @@ const Sidebar = () => {
|
|||||||
<div className="flex items-center ml-1 text-xs ">
|
<div className="flex items-center ml-1 text-xs ">
|
||||||
{!leftMenuBarOpen && <IconChevronsRight size={24} strokeWidth={1.5} className="mr-2 hover:text-gray-700" onClick={() => dispatch(toggleLeftMenuBar())} />}
|
{!leftMenuBarOpen && <IconChevronsRight size={24} strokeWidth={1.5} className="mr-2 hover:text-gray-700" onClick={() => dispatch(toggleLeftMenuBar())} />}
|
||||||
{/* <IconLayoutGrid size={20} strokeWidth={1.5} className="mr-2"/> */}
|
{/* <IconLayoutGrid size={20} strokeWidth={1.5} className="mr-2"/> */}
|
||||||
{/* Need to ut github stars link here */}
|
|
||||||
</div>
|
</div>
|
||||||
<div className="pl-1">
|
<div className="pl-1">
|
||||||
<iframe
|
{storedTheme === 'dark' ? (
|
||||||
src="https://ghbtns.com/github-btn.html?user=usebruno&repo=bruno&type=star&count=true"
|
<GitHubButton
|
||||||
frameBorder="0"
|
href="https://github.com/usebruno/bruno"
|
||||||
scrolling="0"
|
data-color-scheme="no-preference: dark; light: dark; dark: light;"
|
||||||
width="100"
|
data-show-count="true"
|
||||||
height="20"
|
aria-label="Star usebruno/bruno on GitHub"
|
||||||
title="GitHub"
|
>
|
||||||
></iframe>
|
Star
|
||||||
|
</GitHubButton>
|
||||||
|
) : (
|
||||||
|
<GitHubButton
|
||||||
|
href="https://github.com/usebruno/bruno"
|
||||||
|
data-color-scheme="no-preference: light; light: light; dark: light;"
|
||||||
|
data-show-count="true"
|
||||||
|
aria-label="Star usebruno/bruno on GitHub"
|
||||||
|
>
|
||||||
|
Star
|
||||||
|
</GitHubButton>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-grow items-center justify-end text-xs mr-2">v0.8.0</div>
|
<div className="flex flex-grow items-center justify-end text-xs mr-2">v0.8.0</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -32,7 +32,7 @@ const darkTheme = {
|
|||||||
color: '#ccc',
|
color: '#ccc',
|
||||||
muted: '#9d9d9d',
|
muted: '#9d9d9d',
|
||||||
bg: '#252526',
|
bg: '#252526',
|
||||||
dragbar: '#8a8a8a',
|
dragbar: '#666666',
|
||||||
|
|
||||||
badge: {
|
badge: {
|
||||||
bg: '#3D3D3D'
|
bg: '#3D3D3D'
|
||||||
|
@ -50,6 +50,11 @@ app.on('ready', async () => {
|
|||||||
mainWindow.loadURL(url);
|
mainWindow.loadURL(url);
|
||||||
watcher = new Watcher();
|
watcher = new Watcher();
|
||||||
|
|
||||||
|
mainWindow.webContents.on('new-window', function(e, url) {
|
||||||
|
e.preventDefault();
|
||||||
|
require('electron').shell.openExternal(url);
|
||||||
|
});
|
||||||
|
|
||||||
// register all ipc handlers
|
// register all ipc handlers
|
||||||
registerNetworkIpc(mainWindow, watcher, lastOpenedCollections);
|
registerNetworkIpc(mainWindow, watcher, lastOpenedCollections);
|
||||||
registerCollectionsIpc(mainWindow, watcher, lastOpenedCollections);
|
registerCollectionsIpc(mainWindow, watcher, lastOpenedCollections);
|
||||||
|
Loading…
Reference in New Issue
Block a user