insomnia/app/ui/css/components/wrapper.less
Gregory Schier 2cdd4761c8 Remaining V5 Features (#122)
* Add digest auth and response timeline

* Some css fixes

* Fixed Button

* More auth methods, fixed URL regex, and fix gzip

* Get rid of negotiate auth

* Fix proxy

* Fixed GA tracking

* Some very small changes and fixes

* Fix content type names

* Even better auth switching and timeline syntax

* Some auth tweaks

* CSS tweaks

* Reworked toasts

* Fixed timer rounding quirk

* Request settings and render errors

* Fixed tests

* Vertical dragging and stuff

* Remove beta
2017-03-28 15:45:23 -07:00

105 lines
1.9 KiB
Plaintext

@import '../constants/dimensions';
@import '../constants/colors';
.wrapper {
background-color: var(--color-bg);
color: var(--color-font);
display: grid;
// These are set in JS
//grid-template-rows: ...;
//grid-template-columns: ...;
height: 100%;
width: 100%;
.sidebar {
grid-column-start: 1;
grid-row-start: 1;
grid-row-end: span 3;
min-width: 0;
}
.drag {
grid-row-start: 1;
grid-row-end: span 3;
position: relative;
&.drag--pane-vertical {
display: none;
}
& > * {
//background-color: rgba(255, 0, 0, 0.5);
cursor: ew-resize;
position: absolute;
height: 100%;
z-index: 9;
width: @drag-width;
top: 0;
// More to the right so it doesn't cover scroll bars
left: -@drag-width / 8;
}
}
.request-pane {
min-width: 0;
grid-column-start: 3;
grid-row-start: 1;
grid-row-end: span 3;
background: inherit;
}
.response-pane {
min-width: 0;
grid-column-start: 5;
grid-row-start: 1;
grid-row-end: span 3;
background: inherit;
}
}
.wrapper--vertical {
.request-pane {
grid-column-start: 3;
grid-column-end: span 3;
grid-row-start: 1;
grid-row-end: span 1;
}
.response-pane {
grid-column-start: 3;
grid-column-end: span 3;
grid-row-start: 3;
grid-row-end: span 1;
//z-index: 2; // So it covers the URL Bar and stuff
}
.drag--pane-horizontal {
display: none !important;
}
.drag--pane-vertical {
display: block !important;
grid-column-start: 3;
grid-column-end: span 3;
grid-row-start: 2;
grid-row-end: span 1;
& > * {
cursor: ns-resize;
height: @drag-width;
width: 100%;
left: 0;
// More to the right so it doesn't cover scroll bars
top: -@drag-width / 2;
}
}
}
@media (max-width: @breakpoint-md) {
.wrapper {
.wrapper--vertical();
}
}