mirror of
https://github.com/usebruno/bruno.git
synced 2024-11-21 23:43:15 +01:00
chore: style updates
This commit is contained in:
parent
178b92f975
commit
6812494d6b
@ -2,7 +2,7 @@ import styled from 'styled-components';
|
||||
|
||||
const StyledWrapper = styled.div`
|
||||
div.CodeMirror {
|
||||
border: solid 1px #e1e1e1;
|
||||
border: solid 1px var(--color-codemirror-border);
|
||||
height: 96%;
|
||||
}
|
||||
|
||||
|
@ -4,21 +4,21 @@ const Wrapper = styled.div`
|
||||
height: 2.3rem;
|
||||
|
||||
div.method-selector {
|
||||
border: solid 1px #cfcfcf;
|
||||
border: solid 1px var(--color-layout-border);
|
||||
border-right: none;
|
||||
background-color: #f3f3f3;
|
||||
background-color: var(--color-sidebar-background);
|
||||
border-top-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
|
||||
div.input-container {
|
||||
border: solid 1px #cfcfcf;
|
||||
background-color: #f3f3f3;
|
||||
border: solid 1px var(--color-layout-border);
|
||||
background-color: var(--color-sidebar-background);
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
|
||||
input {
|
||||
background-color: #f3f3f3;
|
||||
background-color: var(--color-sidebar-background);
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
|
||||
|
@ -107,7 +107,7 @@ const RequestTabPanel = ({dispatch, actions, collections, activeRequestTabId, re
|
||||
<div
|
||||
className="pb-4 px-4"
|
||||
style={{
|
||||
borderBottom: 'solid 1px #e1e1e1'
|
||||
borderBottom: 'solid 1px var(--color-layout-border)'
|
||||
}}
|
||||
>
|
||||
<div className="pt-2 text-gray-600">{item.name}</div>
|
||||
|
@ -6,7 +6,7 @@ const Wrapper = styled.div`
|
||||
padding: 0;
|
||||
margin: 0 0 10px;
|
||||
padding-left: 1rem;
|
||||
border-bottom: 1px solid #cfcfcf;
|
||||
border-bottom: 1px solid var(--color-layout-border);
|
||||
|
||||
li {
|
||||
display: inline-flex;
|
||||
@ -31,7 +31,7 @@ const Wrapper = styled.div`
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-color: #cfcfcf;
|
||||
border-color: var(--color-layout-border);
|
||||
background: #fff;
|
||||
border-radius: 5px 5px 0 0;
|
||||
|
||||
|
@ -49,7 +49,7 @@ const RequestTabs = ({actions, dispatch, activeRequestTabId, requestTabs}) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<StyledWrapper className="mt-3 flex items-center">
|
||||
<StyledWrapper className="mt-2 flex items-center">
|
||||
{requestTabs && requestTabs.length ? (
|
||||
<ul role="tablist">
|
||||
{requestTabs && requestTabs.length ? requestTabs.map((rt, index) => {
|
||||
|
@ -2,7 +2,7 @@ import styled from 'styled-components';
|
||||
|
||||
const StyledWrapper = styled.div`
|
||||
div.CodeMirror {
|
||||
border: solid 1px #e1e1e1;
|
||||
border: solid 1px var(--color-codemirror-border);
|
||||
}
|
||||
|
||||
div.overlay{
|
||||
|
@ -2,7 +2,8 @@ import { createGlobalStyle } from 'styled-components';
|
||||
|
||||
const GlobalStyle = createGlobalStyle`
|
||||
.CodeMirror-gutters {
|
||||
background-color: #f6f8fa;
|
||||
background-color: var(--color-codemirror-background);
|
||||
border-right: solid 1px var(--color-codemirror-border);
|
||||
}
|
||||
|
||||
.grafnode-form {
|
||||
|
@ -9,7 +9,7 @@ const Wrapper = styled.div`
|
||||
aside {
|
||||
min-width: 230px;
|
||||
width: 230px;
|
||||
border-right: solid 1px #e1e1e1;
|
||||
border-right: solid 1px var(--color-layout-border);
|
||||
background-color: #F6F8FA;
|
||||
}
|
||||
|
||||
@ -25,7 +25,7 @@ const Wrapper = styled.div`
|
||||
width: 1px;
|
||||
padding: 0;
|
||||
cursor: col-resize;
|
||||
background: #e1e1e1;
|
||||
background: var(--color-request-dragbar-background);
|
||||
|
||||
&:hover {
|
||||
background: silver;
|
||||
|
@ -1,3 +1,15 @@
|
||||
|
||||
:root {
|
||||
--color-brand: #546de5;
|
||||
--color-sidebar-collection-item-focused-indent-border: #7b8de3;
|
||||
--color-sidebar-background: #f6f8fa;
|
||||
--color-request-dragbar-background: #e2e2e2;
|
||||
--color-tab-active-border: #4d4d4d;
|
||||
--color-layout-border: #dedede;
|
||||
--color-codemirror-border: #efefef;
|
||||
--color-codemirror-background: #f6f8fa;
|
||||
}
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
@ -15,8 +27,15 @@ body {
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
:root {
|
||||
--color-brand: #546de5;
|
||||
--color-sidebar-collection-item-focused-indent-border: #7b8de3;
|
||||
--color-tab-active-border: #4d4d4d;
|
||||
body::-webkit-scrollbar, .CodeMirror-vscrollbar::-webkit-scrollbar {
|
||||
width: 0.6rem;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-track, .CodeMirror-vscrollbar::-webkit-scrollbar-track {
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-thumb, .CodeMirror-vscrollbar::-webkit-scrollbar-thumb {
|
||||
background-color: #cdcdcd;
|
||||
border-radius: 5rem;
|
||||
}
|
Loading…
Reference in New Issue
Block a user