mirror of
https://github.com/apache/superset.git
synced 2024-09-12 08:39:45 -04:00
Moving static colors over to Less vars (#8563)
* Sweep #1 * moving a few more colors, fixing an import issue. * another include, another color nabbed. * more whittling. * moving filterbox css to less, standardizing colors in there. * nixing the css file I meant to nab in the last commit * Moving the variables file to a more global/sensible (I hope?) location. * FilterableTable moved from CSS to LESS, using color vars now. * more whittling * standardizing opacity stops * nails more colors, removes some old (seemingly unused) css * removing more dead css * DatasourceControl moved from CSS to LESS * BootstrapSliderWrapper CSS -> LESS * reactable-pagination CSS->LESS, color-conformed * FilterBadgeIcon CSS->LESS, conformed * deleting unused/deprecated css * welcome.css -> welcome.less (is this even being used?) * main.css -> main.less, standardized * there were two main.css files - this should have been in the last commit. * explore.css -> explore.less (not used anywhere?) * sql.css -> sql.less (also not used anywhere?) * another main.css -> main.less, standardized on colors * time to add shades and tints! * caught some colors in SVG that should be in LESS. * nixing commented css * deleting commented code * pulling in z-index vars lost in a conflict resolution
This commit is contained in:
parent
e490414484
commit
6919ee4ef4
@ -32,8 +32,8 @@ import { BYTES_PER_CHAR, KB_STORAGE } from './constants';
|
|||||||
import setupApp from '../setup/setupApp';
|
import setupApp from '../setup/setupApp';
|
||||||
|
|
||||||
import './main.less';
|
import './main.less';
|
||||||
import '../../stylesheets/reactable-pagination.css';
|
import '../../stylesheets/reactable-pagination.less';
|
||||||
import '../components/FilterableTable/FilterableTableStyles.css';
|
import '../components/FilterableTable/FilterableTableStyles.less';
|
||||||
|
|
||||||
setupApp();
|
setupApp();
|
||||||
|
|
||||||
|
@ -17,6 +17,7 @@
|
|||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
@import "../../stylesheets/less/cosmo/variables.less";
|
@import "../../stylesheets/less/cosmo/variables.less";
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
body {
|
body {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -48,7 +49,7 @@ body {
|
|||||||
.tab-content {
|
.tab-content {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
background-color: #fff;
|
background-color: @lightest;
|
||||||
|
|
||||||
> .tab-pane {
|
> .tab-pane {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -60,7 +61,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.Workspace .btn-sm {
|
.Workspace .btn-sm {
|
||||||
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
|
box-shadow: 1px 1px 2px fade(@darkest, @opacity-light);
|
||||||
margin-top: 2px;
|
margin-top: 2px;
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
}
|
}
|
||||||
@ -117,10 +118,10 @@ div.Workspace {
|
|||||||
}
|
}
|
||||||
.sql-toolbar {
|
.sql-toolbar {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background-color: #e8e8e8;
|
background-color: @gray-bg;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid @gray-light;
|
||||||
border-top: 0;
|
border-top: 0;
|
||||||
|
|
||||||
form {
|
form {
|
||||||
@ -140,7 +141,7 @@ div.Workspace {
|
|||||||
width: 10px;
|
width: 10px;
|
||||||
height: 10px;
|
height: 10px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background-color: #ccc;
|
background-color: @gray-light;
|
||||||
line-height: 8px;
|
line-height: 8px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
@ -149,14 +150,14 @@ div.Workspace {
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
.running {
|
.running {
|
||||||
background-color: lime;
|
background-color: fade(@success, @opacity-heavy);
|
||||||
color: black;
|
color: @darkest;
|
||||||
}
|
}
|
||||||
.success {
|
.success {
|
||||||
background-color: #4ac15f;
|
background-color: @success;
|
||||||
}
|
}
|
||||||
.failed {
|
.failed {
|
||||||
background-color: red;
|
background-color: @error;
|
||||||
}
|
}
|
||||||
|
|
||||||
.handle {
|
.handle {
|
||||||
@ -167,9 +168,9 @@ div.Workspace {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
width: 300px;
|
width: 300px;
|
||||||
opacity: 0.85;
|
opacity: 0.85;
|
||||||
border: 1px solid #aaa;
|
border: 1px solid @gray-heading;
|
||||||
max-height: 600px;
|
max-height: 600px;
|
||||||
box-shadow: rgba(0, 0, 0, 0.8) 5px 5px 25px;
|
box-shadow: fade(@darkest, @opacity-heavy) 5px 5px 25px;
|
||||||
}
|
}
|
||||||
.SqlLab pre {
|
.SqlLab pre {
|
||||||
padding: 0px !important;
|
padding: 0px !important;
|
||||||
@ -235,11 +236,6 @@ div.Workspace {
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
|
||||||
.clock {
|
|
||||||
background-color: orange;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.schemaPane {
|
.schemaPane {
|
||||||
flex: 0 0 300px;
|
flex: 0 0 300px;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
@ -250,42 +246,6 @@ div.Workspace {
|
|||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.schemaPane-enter-done,
|
|
||||||
.schemaPane-exit {
|
|
||||||
transform: translateX(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.schemaPane-exit-active {
|
|
||||||
transform: translateX(-120%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.schemaPane-enter-active {
|
|
||||||
transform: translateX(0);
|
|
||||||
max-width: 300px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.schemaPane-enter,
|
|
||||||
.schemaPane-exit-done {
|
|
||||||
max-width: 0;
|
|
||||||
transform: translateX(-120%);
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.schemaPane-exit-done + .queryPane {
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gutter {
|
|
||||||
border-top: 1px solid #ccc;
|
|
||||||
border-bottom: 1px solid #ccc;
|
|
||||||
width: 3%;
|
|
||||||
margin: 3px 47%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.gutter.gutter-vertical {
|
|
||||||
cursor: row-resize;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.SqlEditorLeftBar {
|
.SqlEditorLeftBar {
|
||||||
@ -294,7 +254,7 @@ div.Workspace {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
.divider {
|
.divider {
|
||||||
border-bottom: 1px solid #f2f2f2;
|
border-bottom: 1px solid @gray-bg;
|
||||||
margin: 15px 0;
|
margin: 15px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -327,7 +287,7 @@ div.tablePopover:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ace_editor {
|
.ace_editor {
|
||||||
border: 1px solid #ccc;
|
border: 1px solid @gray-light;
|
||||||
}
|
}
|
||||||
|
|
||||||
.Select-menu-outer {
|
.Select-menu-outer {
|
||||||
@ -345,7 +305,7 @@ div.tablePopover:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ace_scroller {
|
.ace_scroller {
|
||||||
background-color: #f4f4f4;
|
background-color: @gray-bg;
|
||||||
}
|
}
|
||||||
|
|
||||||
.TableElement {
|
.TableElement {
|
||||||
@ -385,7 +345,7 @@ a.Link {
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
color: white;
|
color: @lightest;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
}
|
}
|
||||||
.tooltip-inner {
|
.tooltip-inner {
|
||||||
|
@ -19,7 +19,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactBootstrapSlider from 'react-bootstrap-slider';
|
import ReactBootstrapSlider from 'react-bootstrap-slider';
|
||||||
import 'bootstrap-slider/dist/css/bootstrap-slider.min.css';
|
import 'bootstrap-slider/dist/css/bootstrap-slider.min.css';
|
||||||
import './BootstrapSliderWrapper.css';
|
import './BootstrapSliderWrapper.less';
|
||||||
|
|
||||||
export default function BootstrapSliderWrapper(props) {
|
export default function BootstrapSliderWrapper(props) {
|
||||||
return (
|
return (
|
||||||
|
@ -16,10 +16,12 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.BootstrapSliderWrapper .slider-selection {
|
.BootstrapSliderWrapper .slider-selection {
|
||||||
background: #efefef;
|
background: @gray-bg;
|
||||||
}
|
}
|
||||||
|
|
||||||
.BootstrapSliderWrapper .slider-handle {
|
.BootstrapSliderWrapper .slider-handle {
|
||||||
background: #b3b3b3;
|
background: @gray-light;
|
||||||
}
|
}
|
@ -19,7 +19,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import './FilterBadgeIcon.css';
|
import './FilterBadgeIcon.less';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
colorCode: PropTypes.string,
|
colorCode: PropTypes.string,
|
||||||
@ -28,7 +28,7 @@ const propTypes = {
|
|||||||
export default function FilterBadgeIcon({ colorCode = '' }) {
|
export default function FilterBadgeIcon({ colorCode = '' }) {
|
||||||
return (
|
return (
|
||||||
<svg className={`filter-badge ${colorCode}`} width="20" height="20" viewBox="0 0 20 20">
|
<svg className={`filter-badge ${colorCode}`} width="20" height="20" viewBox="0 0 20 20">
|
||||||
<path d="M4 5H16V7H4V5ZM6 9H14V11H6V9ZM12 13H8V15H12V13Z" fill="#fff" />
|
<path d="M4 5H16V7H4V5ZM6 9H14V11H6V9ZM12 13H8V15H12V13Z" />
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -16,19 +16,24 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.filter-badge {
|
.filter-badge {
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
background-color: #bababa;
|
background-color: @gray-light;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
path {
|
||||||
|
fill: @lightest;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.filter-badge:hover {
|
.filter-badge:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
background-color: #9e9e9e;
|
background-color: @gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
.color-bar.badge-group,
|
.color-bar.badge-group,
|
||||||
.filter-badge.badge-group {
|
.filter-badge.badge-group {
|
||||||
background-color: rgb(72, 72, 72);
|
background-color: @gray-dark;
|
||||||
}
|
}
|
@ -19,7 +19,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import './FilterEditIcon.css';
|
import './FilterEditIcon.less';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
clickIconHandler: PropTypes.func,
|
clickIconHandler: PropTypes.func,
|
||||||
@ -34,7 +34,7 @@ export default function FilterEditIcon({ clickIconHandler = () => {} }) {
|
|||||||
className="filter-edit"
|
className="filter-edit"
|
||||||
viewBox="0 0 12 12"
|
viewBox="0 0 12 12"
|
||||||
>
|
>
|
||||||
<path d="M11.8049 1.75476C12.0649 2.01472 12.0649 2.43466 11.8049 2.69463L10.5851 3.91446L8.08547 1.4148L9.3053 0.194973C9.56526 -0.064991 9.9852 -0.064991 10.2452 0.194973L11.8049 1.75476ZM0 12V9.50035L7.37231 2.12804L9.87196 4.62769L2.49965 12H0Z" fill="#fff" />
|
<path d="M11.8049 1.75476C12.0649 2.01472 12.0649 2.43466 11.8049 2.69463L10.5851 3.91446L8.08547 1.4148L9.3053 0.194973C9.56526 -0.064991 9.9852 -0.064991 10.2452 0.194973L11.8049 1.75476ZM0 12V9.50035L7.37231 2.12804L9.87196 4.62769L2.49965 12H0Z" />
|
||||||
</svg>
|
</svg>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -16,6 +16,11 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.filter-edit {
|
.filter-edit {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
path {
|
||||||
|
fill: @lightest;
|
||||||
|
}
|
||||||
}
|
}
|
@ -16,15 +16,18 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
@import '../../../stylesheets/less/variables.less';
|
||||||
|
|
||||||
.ReactVirtualized__Grid__innerScrollContainer {
|
.ReactVirtualized__Grid__innerScrollContainer {
|
||||||
border: 1px solid #ccc;
|
border: 1px solid;
|
||||||
}
|
}
|
||||||
.ReactVirtualized__Table__headerRow {
|
.ReactVirtualized__Table__headerRow {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid @gray-light;
|
||||||
}
|
}
|
||||||
.ReactVirtualized__Table__row {
|
.ReactVirtualized__Table__row {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -42,7 +45,7 @@
|
|||||||
.ReactVirtualized__Table__rowColumn,
|
.ReactVirtualized__Table__rowColumn,
|
||||||
.grid-cell {
|
.grid-cell {
|
||||||
min-width: 0px;
|
min-width: 0px;
|
||||||
border-right: 1px solid #ccc;
|
border-right: 1px solid @gray-light;
|
||||||
align-self: center;
|
align-self: center;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
@ -75,8 +78,8 @@
|
|||||||
width: 1em;
|
width: 1em;
|
||||||
fill: currentColor;
|
fill: currentColor;
|
||||||
}
|
}
|
||||||
.even-row { background: #f2f2f2; }
|
.even-row { background: @gray-bg; }
|
||||||
.odd-row { background: #ffffff; }
|
.odd-row { background: @lightest; }
|
||||||
.header-style {
|
.header-style {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
@ -86,7 +89,7 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
color: #aaa;
|
color: @gray-heading;
|
||||||
}
|
}
|
||||||
.cell-text-for-measuring {
|
.cell-text-for-measuring {
|
||||||
font-family: Helvetica, Arial, sans-serif;
|
font-family: Helvetica, Arial, sans-serif;
|
@ -24,7 +24,7 @@ import { SupersetClient } from '@superset-ui/connection';
|
|||||||
|
|
||||||
import withToasts from '../messageToasts/enhancers/withToasts';
|
import withToasts from '../messageToasts/enhancers/withToasts';
|
||||||
import Loading from '../components/Loading';
|
import Loading from '../components/Loading';
|
||||||
import '../../stylesheets/reactable-pagination.css';
|
import '../../stylesheets/reactable-pagination.less';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
dataEndpoint: PropTypes.string.isRequired,
|
dataEndpoint: PropTypes.string.isRequired,
|
||||||
|
@ -50,12 +50,12 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
width: @builder-pane-width;
|
width: @builder-pane-width;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-shadow: -4px 0 4px 0 rgba(0, 0, 0, 0.1);
|
box-shadow: -4px 0 4px 0 fade(@darkest, @opacity-light);
|
||||||
}
|
}
|
||||||
|
|
||||||
.slider-container {
|
.slider-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background: white;
|
background: @lightest;
|
||||||
width: @builder-pane-width * 2;
|
width: @builder-pane-width * 2;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -97,7 +97,7 @@
|
|||||||
margin: 0 16px 16px 16px;
|
margin: 0 16px 16px 16px;
|
||||||
position: relative;
|
position: relative;
|
||||||
cursor: move;
|
cursor: move;
|
||||||
background: rgba(255, 255, 255, 0.4);
|
background: fade(@lightest, @opacity-medium-light);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: @gray-bg;
|
background: @gray-bg;
|
||||||
@ -132,7 +132,7 @@
|
|||||||
|
|
||||||
.is-added-label {
|
.is-added-label {
|
||||||
background: @almost-black;
|
background: @almost-black;
|
||||||
color: white;
|
color: @lightest;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
|
@ -22,13 +22,13 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dashboard-header {
|
.dashboard-header {
|
||||||
background: white;
|
background: @lightest;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
padding: 0 24px;
|
padding: 0 24px;
|
||||||
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1); /* @TODO color */
|
box-shadow: 0 4px 4px 0 fade(@darkest, @opacity-light); /* @TODO color */
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard-content {
|
.dashboard-content {
|
||||||
@ -45,7 +45,7 @@
|
|||||||
|
|
||||||
/* drop shadow for top-level tabs only */
|
/* drop shadow for top-level tabs only */
|
||||||
.dashboard .dashboard-component-tabs {
|
.dashboard .dashboard-component-tabs {
|
||||||
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1);
|
box-shadow: 0 4px 4px 0 fade(@darkest, @opacity-light);
|
||||||
padding-left: 8px; /* note this is added to tab-level padding, to match header */
|
padding-left: 8px; /* note this is added to tab-level padding, to match header */
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -61,7 +61,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dropdown-toggle.btn.btn-primary .caret {
|
.dropdown-toggle.btn.btn-primary .caret {
|
||||||
color: white;
|
color: @lightest;
|
||||||
}
|
}
|
||||||
|
|
||||||
.background--transparent {
|
.background--transparent {
|
||||||
@ -69,5 +69,5 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.background--white {
|
.background--white {
|
||||||
background-color: white;
|
background-color: @lightest;
|
||||||
}
|
}
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
color: @gray-dark;
|
color: @gray-dark;
|
||||||
background-color: white;
|
background-color: @lightest;
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
|
|
||||||
@ -42,7 +42,7 @@
|
|||||||
|
|
||||||
&.fade-in {
|
&.fade-in {
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
box-shadow: inset 0 0 0 2px rgba(0, 166, 153, 1), 0 0 0 3px rgba(0, 166, 153, .15);
|
box-shadow: inset 0 0 0 2px fade(@shadow-highlight, 1), 0 0 0 3px fade(@shadow-highlight, @opacity-light);
|
||||||
transition: box-shadow 1s ease-in-out;
|
transition: box-shadow 1s ease-in-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -22,7 +22,7 @@
|
|||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
background: white;
|
background: @lightest;
|
||||||
cursor: move;
|
cursor: move;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -36,7 +36,7 @@
|
|||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
margin-right: 16px;
|
margin-right: 16px;
|
||||||
border: 1px solid white;
|
border: 1px solid @lightest;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@ -18,7 +18,7 @@
|
|||||||
*/
|
*/
|
||||||
.dashboard-component-tabs {
|
.dashboard-component-tabs {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: white;
|
background-color: @lightest;
|
||||||
|
|
||||||
& .nav-tabs {
|
& .nav-tabs {
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
@ -43,7 +43,7 @@
|
|||||||
|
|
||||||
& > a:focus {
|
& > a:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
background: #fff;
|
background: @lightest;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .dragdroppable-tab {
|
& .dragdroppable-tab {
|
||||||
@ -90,7 +90,7 @@
|
|||||||
height: 3px;
|
height: 3px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background: linear-gradient(to right, #e32464, #2c2261);
|
background: linear-gradient(to right, @indicator-color, shade(@indicator-color, @colorstop-two));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -102,7 +102,7 @@ body {
|
|||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
|
||||||
&.btn.btn-primary {
|
&.btn.btn-primary {
|
||||||
border-left-color: white;
|
border-left-color: @lightest;
|
||||||
}
|
}
|
||||||
|
|
||||||
& + .dropdown-menu.dropdown-menu-right {
|
& + .dropdown-menu.dropdown-menu-right {
|
||||||
@ -242,9 +242,9 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
i.danger {
|
i.danger {
|
||||||
color: red;
|
color: @danger;
|
||||||
}
|
}
|
||||||
|
|
||||||
i.warning {
|
i.warning {
|
||||||
color: orange;
|
color: @warning;
|
||||||
}
|
}
|
||||||
|
@ -88,7 +88,7 @@
|
|||||||
|
|
||||||
.drag-handle-dot:after {
|
.drag-handle-dot:after {
|
||||||
content: '';
|
content: '';
|
||||||
background: #aaa;
|
background: @gray;
|
||||||
float: left;
|
float: left;
|
||||||
height: 2px;
|
height: 2px;
|
||||||
margin: -1px;
|
margin: -1px;
|
||||||
|
@ -22,7 +22,7 @@
|
|||||||
|
|
||||||
> .tooltip-arrow {
|
> .tooltip-arrow {
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
border-left-color: #484848;
|
border-left-color: @gray-dark;
|
||||||
}
|
}
|
||||||
|
|
||||||
> .tooltip-inner {
|
> .tooltip-inner {
|
||||||
@ -31,7 +31,7 @@
|
|||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
padding: 16px 12px;
|
padding: 16px 12px;
|
||||||
background-color: #484848;
|
background-color: @gray-dark;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -34,7 +34,7 @@
|
|||||||
height: 20px;
|
height: 20px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
display: flex;
|
display: flex;
|
||||||
background-color: #bababa;
|
background-color: @gray-light;
|
||||||
transition: width 0.3s;
|
transition: width 0.3s;
|
||||||
border-top-right-radius: 2px;
|
border-top-right-radius: 2px;
|
||||||
border-bottom-right-radius: 2px;
|
border-bottom-right-radius: 2px;
|
||||||
@ -54,12 +54,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.filter-indicator-group {
|
.filter-indicator-group {
|
||||||
box-shadow: rgb(255, 255, 255) -2px 0 0 0, rgb(219, 219, 219) -4px 0 0 0;
|
box-shadow: @lightest -2px 0 0 0, @gray-light -4px 0 0 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.show-outline .filter-indicator-group {
|
.show-outline .filter-indicator-group {
|
||||||
box-shadow: rgba(0, 166, 153, 1) -2px 0 0 0, rgb(255, 255, 255) -4px 0 0 0, rgb(219, 219, 219) -6px 0 0 0;
|
box-shadow: @shadow-highlight -2px 0 0 0, @lightest -4px 0 0 0, @gray-light -6px 0 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard-component-chart-holder,
|
.dashboard-component-chart-holder,
|
||||||
@ -82,7 +82,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.filter-indicator-group {
|
.filter-indicator-group {
|
||||||
box-shadow: rgb(255, 255, 255) -4px 0 0 0, rgb(219, 219, 219) -6px 0 0 0;
|
box-shadow: @lightest -4px 0 0 0, @gray-light -6px 0 0 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -44,9 +44,9 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
background-color: rgba(68, 192, 255, 0.05);
|
background-color: fade(@indicator-color, @opacity-light);
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
box-shadow: inset 0 0 0 1px rgba(68, 192, 255, 0.5);
|
box-shadow: inset 0 0 0 1px fade(@indicator-color, @opacity-medium-heavy);
|
||||||
}
|
}
|
||||||
|
|
||||||
.grid-row-guide {
|
.grid-row-guide {
|
||||||
|
@ -56,7 +56,7 @@
|
|||||||
/* A row within a column has inset hover menu */
|
/* A row within a column has inset hover menu */
|
||||||
.dragdroppable-column .dragdroppable-row .hover-menu--left {
|
.dragdroppable-column .dragdroppable-row .hover-menu--left {
|
||||||
left: -12px;
|
left: -12px;
|
||||||
background: white;
|
background: @lightest;
|
||||||
border: 1px solid @gray-light;
|
border: 1px solid @gray-light;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -64,7 +64,7 @@
|
|||||||
.dragdroppable-column .dragdroppable-column .hover-menu--top,
|
.dragdroppable-column .dragdroppable-column .hover-menu--top,
|
||||||
.dashboard-component-tabs .dragdroppable-column .hover-menu--top {
|
.dashboard-component-tabs .dragdroppable-column .hover-menu--top {
|
||||||
top: -12px;
|
top: -12px;
|
||||||
background: white;
|
background: @lightest;
|
||||||
border: 1px solid @gray-light;
|
border: 1px solid @gray-light;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -16,7 +16,7 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
@import './variables.less';
|
@import './../../../stylesheets/less/variables.less';
|
||||||
|
|
||||||
@import './builder.less';
|
@import './builder.less';
|
||||||
@import './builder-sidepane.less';
|
@import './builder-sidepane.less';
|
||||||
|
@ -49,8 +49,8 @@
|
|||||||
top: -42px;
|
top: -42px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
background: white;
|
background: @lightest;
|
||||||
box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.2);
|
box-shadow: 0 1px 2px 1px fade(@darkest, @opacity-medium-light);
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
@ -139,7 +139,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.background-style-option.background--white:before {
|
.background-style-option.background--white:before {
|
||||||
background: white;
|
background: @lightest;
|
||||||
border: 1px solid @gray-light;
|
border: 1px solid @gray-light;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,65 +0,0 @@
|
|||||||
/**
|
|
||||||
* Licensed to the Apache Software Foundation (ASF) under one
|
|
||||||
* or more contributor license agreements. See the NOTICE file
|
|
||||||
* distributed with this work for additional information
|
|
||||||
* regarding copyright ownership. The ASF licenses this file
|
|
||||||
* to you under the Apache License, Version 2.0 (the
|
|
||||||
* "License"); you may not use this file except in compliance
|
|
||||||
* with the License. You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing,
|
|
||||||
* software distributed under the License is distributed on an
|
|
||||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
||||||
* KIND, either express or implied. See the License for the
|
|
||||||
* specific language governing permissions and limitations
|
|
||||||
* under the License.
|
|
||||||
*/
|
|
||||||
@indicator-color: #44c0ff;
|
|
||||||
|
|
||||||
@almost-black: #263238;
|
|
||||||
@gray-dark: #484848;
|
|
||||||
@gray: #879399;
|
|
||||||
@gray-light: #cfd8dc;
|
|
||||||
@gray-bg: #f5f5f5;
|
|
||||||
@gray-heading: #a3a3a3;
|
|
||||||
@menu-hover: #f2f3f5;
|
|
||||||
|
|
||||||
/* builder component pane */
|
|
||||||
@builder-pane-width: 374px;
|
|
||||||
|
|
||||||
/* toasts */
|
|
||||||
@pink: #e32364;
|
|
||||||
@purple: #2c2261;
|
|
||||||
|
|
||||||
@success: #00bfa5;
|
|
||||||
@warning: #ffab00;
|
|
||||||
@danger: @pink;
|
|
||||||
|
|
||||||
/* filter indicators */
|
|
||||||
/* make sure be consistent with FILTER_COLORS_COUNT in
|
|
||||||
dashboardFiltersColorMap.js
|
|
||||||
*/
|
|
||||||
@badge-colors: #228be6, #40c057, #fab005, #f76707, #e64980, #15aabf, #7950f2, #fa5252, #74b816,
|
|
||||||
#12b886, #1864ab, #2b8a3e, #e67700, #d9480f, #a61e4d, #0b7285, #5f3dc4, #c92a2a, #5c940d, #087f5b;
|
|
||||||
|
|
||||||
@iterations: length(@badge-colors);
|
|
||||||
.badge-loop (@i) when (@i > 0) {
|
|
||||||
.filter-badge.badge-@{i},
|
|
||||||
.active .color-bar.badge-@{i},
|
|
||||||
.dashboard-filter-indicators-container:hover .color-bar.badge-@{i},
|
|
||||||
.dashboard-component-chart-holder:hover .color-bar.badge-@{i} {
|
|
||||||
@value: extract(@badge-colors, @i);
|
|
||||||
background-color: @value;
|
|
||||||
}
|
|
||||||
.badge-loop(@i - 1);
|
|
||||||
}
|
|
||||||
.badge-loop (@iterations);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// z-index values:
|
|
||||||
// use these variables, over magic numbers, to specify the stack ordering of elements
|
|
||||||
@z-index-max: 1000;
|
|
||||||
@z-index-dropdown: 11;
|
|
@ -40,7 +40,7 @@ import Field from '../CRUD/Field';
|
|||||||
|
|
||||||
import withToasts from '../messageToasts/enhancers/withToasts';
|
import withToasts from '../messageToasts/enhancers/withToasts';
|
||||||
|
|
||||||
import './main.css';
|
import './main.less';
|
||||||
|
|
||||||
const checkboxGenerator = (d, onChange) => <CheckboxControl value={d} onChange={onChange} />;
|
const checkboxGenerator = (d, onChange) => <CheckboxControl value={d} onChange={onChange} />;
|
||||||
const DATA_TYPES = ['STRING', 'NUMERIC', 'DATETIME'];
|
const DATA_TYPES = ['STRING', 'NUMERIC', 'DATETIME'];
|
||||||
|
@ -16,6 +16,8 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.Datasource .tab-content {
|
.Datasource .tab-content {
|
||||||
height: 600px;
|
height: 600px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
@ -23,7 +25,7 @@
|
|||||||
|
|
||||||
.Datasource .change-warning {
|
.Datasource .change-warning {
|
||||||
margin: 16px 10px 0;
|
margin: 16px 10px 0;
|
||||||
color: #fe4a49;
|
color: @warning;
|
||||||
}
|
}
|
||||||
|
|
||||||
.Datasource .change-warning .bold {
|
.Datasource .change-warning .bold {
|
@ -32,8 +32,8 @@ import rootReducer from './reducers/index';
|
|||||||
|
|
||||||
import setupApp from '../setup/setupApp';
|
import setupApp from '../setup/setupApp';
|
||||||
import setupPlugins from '../setup/setupPlugins';
|
import setupPlugins from '../setup/setupPlugins';
|
||||||
import './main.css';
|
import './main.less';
|
||||||
import '../../stylesheets/reactable-pagination.css';
|
import '../../stylesheets/reactable-pagination.less';
|
||||||
|
|
||||||
setupApp();
|
setupApp();
|
||||||
setupPlugins();
|
setupPlugins();
|
||||||
|
@ -37,7 +37,7 @@ import MetricOption from '../../../components/MetricOption';
|
|||||||
import DatasourceModal from '../../../datasource/DatasourceModal';
|
import DatasourceModal from '../../../datasource/DatasourceModal';
|
||||||
import ChangeDatasourceModal from '../../../datasource/ChangeDatasourceModal';
|
import ChangeDatasourceModal from '../../../datasource/ChangeDatasourceModal';
|
||||||
import TooltipWrapper from '../../../components/TooltipWrapper';
|
import TooltipWrapper from '../../../components/TooltipWrapper';
|
||||||
import './DatasourceControl.css';
|
import './DatasourceControl.less';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
onChange: PropTypes.func,
|
onChange: PropTypes.func,
|
||||||
|
@ -16,6 +16,8 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
#datasource_menu {
|
#datasource_menu {
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding-left: 8px;
|
padding-left: 8px;
|
||||||
@ -26,7 +28,7 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
padding-right: 8px;
|
padding-right: 8px;
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
color: #fff;
|
color: @lightest;
|
||||||
top: -8px;
|
top: -8px;
|
||||||
}
|
}
|
||||||
|
|
@ -16,6 +16,8 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.scrollbar-container {
|
.scrollbar-container {
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -190,18 +192,18 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.adhoc-filter-sql-editor {
|
.adhoc-filter-sql-editor {
|
||||||
border: rgb(187, 187, 187) solid thin;
|
border: @gray-light solid thin;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label-default {
|
.label-default {
|
||||||
background-color: #808e95;
|
background-color: @gray;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn.label-btn {
|
.btn.label-btn {
|
||||||
background-color: #808e95;
|
background-color: @gray;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
color: #fff;
|
color: @lightest;
|
||||||
padding: 5px 4px 4px;
|
padding: 5px 4px 4px;
|
||||||
border: 0;
|
border: 0;
|
||||||
}
|
}
|
||||||
@ -215,8 +217,8 @@
|
|||||||
|
|
||||||
.label-btn:hover,
|
.label-btn:hover,
|
||||||
.label-btn-label:hover {
|
.label-btn-label:hover {
|
||||||
background-color: #667177;
|
background-color: @gray-dark;
|
||||||
color: #fff;
|
color: @lightest;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label-btn-label {
|
.label-btn-label {
|
||||||
@ -242,7 +244,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.custom-sql-disabled-message {
|
.custom-sql-disabled-message {
|
||||||
color: gray;
|
color: @gray;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-top: 60px;
|
margin-top: 60px;
|
@ -16,7 +16,7 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
@import '../../dashboard/stylesheets/variables.less';
|
@import '../../../stylesheets/less/variables.less';
|
||||||
|
|
||||||
.toast-presenter {
|
.toast-presenter {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
@ -28,12 +28,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.toast {
|
.toast {
|
||||||
background: white;
|
background: @lightest;
|
||||||
color: @almost-black;
|
color: @almost-black;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
position: relative;
|
position: relative;
|
||||||
white-space: pre-line;
|
white-space: pre-line;
|
||||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.35);
|
box-shadow: 0 2px 4px 0 fade(@darkest, @opacity-medium-light);
|
||||||
will-change: transform, opacity;
|
will-change: transform, opacity;
|
||||||
transform: translateY(-100%);
|
transform: translateY(-100%);
|
||||||
transition: transform 0.3s, opacity 0.3s;
|
transition: transform 0.3s, opacity 0.3s;
|
||||||
|
@ -27,7 +27,7 @@ import messageToastReducer from '../messageToasts/reducers';
|
|||||||
import { initEnhancer } from '../reduxUtils';
|
import { initEnhancer } from '../reduxUtils';
|
||||||
import setupApp from '../setup/setupApp';
|
import setupApp from '../setup/setupApp';
|
||||||
|
|
||||||
import './main.css';
|
import './main.less';
|
||||||
|
|
||||||
setupApp();
|
setupApp();
|
||||||
|
|
||||||
|
@ -16,10 +16,12 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.tab-pane {
|
.tab-pane {
|
||||||
min-height: 400px;
|
min-height: 400px;
|
||||||
background: white;
|
background: @lightest;
|
||||||
border: 1px solid #bbb;
|
border: 1px solid @gray-light;
|
||||||
border-top: 0px;
|
border-top: 0px;
|
||||||
}
|
}
|
||||||
|
|
@ -16,11 +16,11 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
@import '../../dashboard/stylesheets/variables.less';
|
@import '../../../stylesheets/less/variables.less';
|
||||||
|
|
||||||
.select2-highlighted > .filter_box {
|
.select2-highlighted > .filter_box {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border: 1px superset black;
|
border: 1px superset @darkest;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard .filter_box .slice_container > div:not(.alert) {
|
.dashboard .filter_box .slice_container > div:not(.alert) {
|
||||||
@ -29,19 +29,19 @@
|
|||||||
|
|
||||||
.input-inline {
|
.input-inline {
|
||||||
float: left;
|
float: left;
|
||||||
display: inline-block;
|
// display: inline-block; //Ignored when float is applied. Leaving it here in case we lose the floats later.
|
||||||
padding-right: 3px;
|
padding-right: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.select2-results li.select2-highlighted div.filter_box {
|
ul.select2-results li.select2-highlighted div.filter_box {
|
||||||
color: black;
|
color: @darkest;
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-color: #666;
|
border-color: @gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.select2-results div.filter_box {
|
ul.select2-results div.filter_box {
|
||||||
color: black;
|
color: @darkest;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
|
@ -24,7 +24,7 @@ import { t } from '@superset-ui/translation';
|
|||||||
|
|
||||||
import withToasts from '../messageToasts/enhancers/withToasts';
|
import withToasts from '../messageToasts/enhancers/withToasts';
|
||||||
import Loading from '../components/Loading';
|
import Loading from '../components/Loading';
|
||||||
import '../../stylesheets/reactable-pagination.css';
|
import '../../stylesheets/reactable-pagination.less';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
search: PropTypes.string,
|
search: PropTypes.string,
|
||||||
|
@ -1,199 +0,0 @@
|
|||||||
/**
|
|
||||||
* Licensed to the Apache Software Foundation (ASF) under one
|
|
||||||
* or more contributor license agreements. See the NOTICE file
|
|
||||||
* distributed with this work for additional information
|
|
||||||
* regarding copyright ownership. The ASF licenses this file
|
|
||||||
* to you under the Apache License, Version 2.0 (the
|
|
||||||
* "License"); you may not use this file except in compliance
|
|
||||||
* with the License. You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing,
|
|
||||||
* software distributed under the License is distributed on an
|
|
||||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
||||||
* KIND, either express or implied. See the License for the
|
|
||||||
* specific language governing permissions and limitations
|
|
||||||
* under the License.
|
|
||||||
*/
|
|
||||||
/* header has mysterious extra margin */
|
|
||||||
header.top {
|
|
||||||
margin-bottom: -20px;
|
|
||||||
}
|
|
||||||
h1.outer-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.v2-preview-badge {
|
|
||||||
margin-left: 8px;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 400;
|
|
||||||
background: linear-gradient(to bottom right, #E32364, #2C2261);
|
|
||||||
color: white;
|
|
||||||
padding: 4px 8px;
|
|
||||||
line-height: 1em;
|
|
||||||
cursor: pointer;
|
|
||||||
opacity: 0.9;
|
|
||||||
}
|
|
||||||
|
|
||||||
.v2-preview-badge:hover {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard a i {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.dashboard i.drag {
|
|
||||||
cursor: move !important;
|
|
||||||
}
|
|
||||||
.dashboard .slice-grid .preview-holder {
|
|
||||||
z-index: 1;
|
|
||||||
position: absolute;
|
|
||||||
background-color: #AAA;
|
|
||||||
border-color: #AAA;
|
|
||||||
opacity: 0.3;
|
|
||||||
}
|
|
||||||
div.widget .chart-controls {
|
|
||||||
background-clip: content-box;
|
|
||||||
position: absolute;
|
|
||||||
z-index: 100;
|
|
||||||
right: 0;
|
|
||||||
top: 5px;
|
|
||||||
padding: 5px 5px;
|
|
||||||
opacity: 0;
|
|
||||||
transition: opacity 0.5s ease-in-out;
|
|
||||||
}
|
|
||||||
div.widget:hover .chart-controls {
|
|
||||||
opacity: 0.75;
|
|
||||||
transition: opacity 0.5s ease-in-out;
|
|
||||||
}
|
|
||||||
.slice-grid div.widget {
|
|
||||||
border-radius: 0;
|
|
||||||
border: 0;
|
|
||||||
box-shadow: none;
|
|
||||||
background-color: #fff;
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slice-grid .slice_container {
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard .slice-grid .dragging,
|
|
||||||
.dashboard .slice-grid .resizing {
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
.dashboard img.loading {
|
|
||||||
width: 20px;
|
|
||||||
margin: 5px;
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard .slice_title {
|
|
||||||
text-align: center;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 14px;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
.dashboard div.slice_content {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.modal img.loading {
|
|
||||||
width: 50px;
|
|
||||||
margin: 0;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-bs-container-body {
|
|
||||||
max-height: 400px;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden, #pageDropDown {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slice-grid div.separator.widget {
|
|
||||||
border: 1px solid transparent;
|
|
||||||
box-shadow: none;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
.slice-grid div.separator.widget:hover {
|
|
||||||
border: 1px solid #EEE;
|
|
||||||
}
|
|
||||||
.slice-grid div.separator.widget .chart-header {
|
|
||||||
background-color: transparent;
|
|
||||||
color: transparent;
|
|
||||||
}
|
|
||||||
.slice-grid div.separator.widget h1,h2,h3,h4 {
|
|
||||||
margin-top: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slice-cell {
|
|
||||||
box-shadow: 0px 0px 20px 5px rgba(0,0,0,0);
|
|
||||||
transition: box-shadow 1s ease-in;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slice-cell-highlight {
|
|
||||||
box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.2);
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.slice-cell .editable-title input[type="button"] {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard .separator.widget .slice_container {
|
|
||||||
padding: 0;
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
.dashboard .separator.widget .slice_container hr {
|
|
||||||
margin-top: 5px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
.separator .chart-container {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard .title {
|
|
||||||
margin: 0 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard .title .favstar {
|
|
||||||
font-size: 20px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chart-header .header {
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0 -10px;
|
|
||||||
}
|
|
||||||
.ace_gutter {
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
.ace_content {
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
.ace_scrollbar {
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
.slice_container .alert {
|
|
||||||
margin: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
i.danger {
|
|
||||||
color: red;
|
|
||||||
}
|
|
||||||
|
|
||||||
i.warning {
|
|
||||||
color: orange;
|
|
||||||
}
|
|
@ -16,6 +16,8 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.widget {
|
.widget {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
@ -24,7 +26,7 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
background-color: #fff;
|
background-color: @lightest;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar {
|
.navbar {
|
125
superset/assets/stylesheets/less/variables.less
Normal file
125
superset/assets/stylesheets/less/variables.less
Normal file
@ -0,0 +1,125 @@
|
|||||||
|
/**
|
||||||
|
* Licensed to the Apache Software Foundation (ASF) under one
|
||||||
|
* or more contributor license agreements. See the NOTICE file
|
||||||
|
* distributed with this work for additional information
|
||||||
|
* regarding copyright ownership. The ASF licenses this file
|
||||||
|
* to you under the Apache License, Version 2.0 (the
|
||||||
|
* "License"); you may not use this file except in compliance
|
||||||
|
* with the License. You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/************************************************************************/
|
||||||
|
/* COLORS */
|
||||||
|
/* Please attempt to use and standardize on these colors, */
|
||||||
|
/* rather than including specific color values in */
|
||||||
|
/* component styles. This will allow us to more easily adjust theming */
|
||||||
|
/************************************************************************/
|
||||||
|
|
||||||
|
@indicator-color: #44C0FF;
|
||||||
|
|
||||||
|
@almost-black: #263238;
|
||||||
|
@gray-dark: #484848;
|
||||||
|
@gray: #879399;
|
||||||
|
@gray-light: #CFD8DC;
|
||||||
|
@gray-bg: #f5f5f5;
|
||||||
|
@gray-heading: #A3A3A3;
|
||||||
|
@menu-hover: #F2F3F5;
|
||||||
|
@lightest: #ffffff;
|
||||||
|
@darkest: #000000;
|
||||||
|
|
||||||
|
/* toasts */
|
||||||
|
@pink: #E32364;
|
||||||
|
@purple: #2C2261;
|
||||||
|
|
||||||
|
/* status colors */
|
||||||
|
@success: #00BFA5;
|
||||||
|
@warning: #FFAB00;
|
||||||
|
@error: #FF0000;
|
||||||
|
@danger: @pink;
|
||||||
|
|
||||||
|
/* general component effects */
|
||||||
|
@shadow-highlight: rgb(0, 166, 153);
|
||||||
|
|
||||||
|
/* filter indicators */
|
||||||
|
/* make sure be consistent with FILTER_COLORS_COUNT in
|
||||||
|
dashboardFiltersColorMap.js
|
||||||
|
*/
|
||||||
|
@badge-colors:
|
||||||
|
#228be6,
|
||||||
|
#40c057,
|
||||||
|
#fab005,
|
||||||
|
#f76707,
|
||||||
|
#e64980,
|
||||||
|
#15aabf,
|
||||||
|
#7950f2,
|
||||||
|
#fa5252,
|
||||||
|
#74b816,
|
||||||
|
#12b886,
|
||||||
|
#1864ab,
|
||||||
|
#2b8a3e,
|
||||||
|
#e67700,
|
||||||
|
#d9480f,
|
||||||
|
#a61e4d,
|
||||||
|
#0b7285,
|
||||||
|
#5f3dc4,
|
||||||
|
#c92a2a,
|
||||||
|
#5c940d,
|
||||||
|
#087f5b;
|
||||||
|
|
||||||
|
@iterations: length(@badge-colors);
|
||||||
|
.badge-loop (@i) when (@i > 0) {
|
||||||
|
.filter-badge.badge-@{i},
|
||||||
|
.active .color-bar.badge-@{i},
|
||||||
|
.dashboard-filter-indicators-container:hover .color-bar.badge-@{i},
|
||||||
|
.dashboard-component-chart-holder:hover .color-bar.badge-@{i} {
|
||||||
|
@value: extract(@badge-colors, @i);
|
||||||
|
background-color: @value;
|
||||||
|
}
|
||||||
|
.badge-loop(@i - 1);
|
||||||
|
}
|
||||||
|
.badge-loop(@iterations);
|
||||||
|
|
||||||
|
/************************************************************************/
|
||||||
|
/* OPACITIES */
|
||||||
|
/* Used in LESS filters, e.g. fade(@someColorVar, @someOpacityBelow) */
|
||||||
|
/************************************************************************/
|
||||||
|
@opacity-light: 10%;
|
||||||
|
@opacity-medium-light: 35%;
|
||||||
|
@opacity-medium-heavy: 60%;
|
||||||
|
@opacity-heavy: 80%;
|
||||||
|
|
||||||
|
/************************************************************************/
|
||||||
|
/* SHADES & TINTS */
|
||||||
|
/* Used in LESS filters for shadint/tinting, */
|
||||||
|
/* e.g. shade(@someColorVar, @colorstop-one) to darken */
|
||||||
|
/* or tint(@someColorVar, @colorstop-one) to lighten */
|
||||||
|
/************************************************************************/
|
||||||
|
@colorstop-one: 20%;
|
||||||
|
@colorstop-two: 40%;
|
||||||
|
@colorstop-three: 60%;
|
||||||
|
@colorstop-four: 80%;
|
||||||
|
|
||||||
|
/************************************************************************/
|
||||||
|
/* LAYOUT */
|
||||||
|
/* Widths and heights of things, that might be referred to often */
|
||||||
|
/************************************************************************/
|
||||||
|
|
||||||
|
/* builder component pane */
|
||||||
|
@builder-pane-width: 374px;
|
||||||
|
|
||||||
|
/************************************************************************/
|
||||||
|
/* Z-INDEX */
|
||||||
|
/* Think of the site as "layers" rather than an arms race of numbers */
|
||||||
|
/* Try to keep these to a minimum */
|
||||||
|
/************************************************************************/
|
||||||
|
@z-index-max: 1000;
|
||||||
|
@z-index-dropdown: 11;
|
@ -16,8 +16,10 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../../stylesheets/less/variables.less";
|
||||||
|
|
||||||
@import "~react-select/less/select.less";
|
@import "~react-select/less/select.less";
|
||||||
@select-primary-color: black;
|
@select-primary-color: @darkest;
|
||||||
@select-input-height: 30px;
|
@select-input-height: 30px;
|
||||||
|
|
||||||
// imports
|
// imports
|
||||||
@ -55,7 +57,7 @@
|
|||||||
padding: 0 .5rem;
|
padding: 0 .5rem;
|
||||||
}
|
}
|
||||||
.VirtualizedSelectFocusedOption {
|
.VirtualizedSelectFocusedOption {
|
||||||
background-color: rgba(0, 0, 0, 0.1);
|
background-color: fade(@darkest, @opacity-light);
|
||||||
}
|
}
|
||||||
.VirtualizedSelectFocusedOption:hover {
|
.VirtualizedSelectFocusedOption:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -16,21 +16,23 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.reactable-pagination td {
|
.reactable-pagination td {
|
||||||
padding: 15px 0 0 0!important;
|
padding: 15px 0 0 0!important;
|
||||||
}
|
}
|
||||||
.reactable-pagination a:focus {
|
.reactable-pagination a:focus {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: #555555;
|
color: @gray-dark;
|
||||||
outline: 1;
|
outline: 1;
|
||||||
}
|
}
|
||||||
.reactable-page-button,
|
.reactable-page-button,
|
||||||
.reactable-next-page,
|
.reactable-next-page,
|
||||||
.reactable-previous-page {
|
.reactable-previous-page {
|
||||||
background: #fff;
|
background: @lightest;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
border: 1px solid #b3b3b3;
|
border: 1px solid @gray-light ;
|
||||||
color: #555555;
|
color: @gray-dark;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
@ -42,8 +44,8 @@
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
.reactable-current-page {
|
.reactable-current-page {
|
||||||
border: 1px solid #b3b3b3;
|
border: 1px solid @gray-light;
|
||||||
color: #555555;
|
color: @gray-dark;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
opacity: 0.65;
|
opacity: 0.65;
|
||||||
@ -51,8 +53,8 @@
|
|||||||
.reactable-page-button:hover,
|
.reactable-page-button:hover,
|
||||||
.reactable-next-page:hover,
|
.reactable-next-page:hover,
|
||||||
.reactable-previous-page:hover {
|
.reactable-previous-page:hover {
|
||||||
background-color: #efefef;
|
background-color: @gray-bg;
|
||||||
border-color: #949494;
|
border-color: @gray;
|
||||||
color: #555555;
|
color: @gray-dark;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
@ -16,6 +16,8 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.topsql {
|
.topsql {
|
||||||
height: 250px;
|
height: 250px;
|
||||||
}
|
}
|
||||||
@ -25,9 +27,9 @@
|
|||||||
}
|
}
|
||||||
.bordered {
|
.bordered {
|
||||||
padding: 0px 0px;
|
padding: 0px 0px;
|
||||||
border: 1px solid grey;
|
border: 1px solid @gray;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
background-color: #EEE;
|
background-color: @gray-bg;
|
||||||
}
|
}
|
||||||
div.alert {
|
div.alert {
|
||||||
padding: 5px;
|
padding: 5px;
|
@ -18,6 +18,8 @@
|
|||||||
*/
|
*/
|
||||||
@import './less/index.less';
|
@import './less/index.less';
|
||||||
@import "./less/cosmo/variables.less";
|
@import "./less/cosmo/variables.less";
|
||||||
|
@import './less/index.less';
|
||||||
|
@import "./less/variables.less";
|
||||||
|
|
||||||
@datasource-sql-expression-width: 450px;
|
@datasource-sql-expression-width: 450px;
|
||||||
|
|
||||||
@ -26,7 +28,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.alert.alert-danger > .debugger {
|
.alert.alert-danger > .debugger {
|
||||||
color: red;
|
color: @error;
|
||||||
}
|
}
|
||||||
|
|
||||||
.modal-dialog {
|
.modal-dialog {
|
||||||
@ -41,11 +43,11 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
input.form-control {
|
input.form-control {
|
||||||
background-color: white;
|
background-color: @lightest;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chart-header a.danger {
|
.chart-header a.danger {
|
||||||
color: red;
|
color: @error;
|
||||||
}
|
}
|
||||||
|
|
||||||
.disabledButton {
|
.disabledButton {
|
||||||
@ -64,8 +66,8 @@ input.form-control {
|
|||||||
.slice_description {
|
.slice_description {
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
border: 1px solid #DDD;
|
border: 1px solid @gray-light;
|
||||||
background-color: #F8F8F8;
|
background-color: @gray-bg;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
@ -109,7 +111,7 @@ input[type="checkbox"] {
|
|||||||
.notbtn {
|
.notbtn {
|
||||||
cursor: default;
|
cursor: default;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid @gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
@ -118,7 +120,7 @@ hr {
|
|||||||
}
|
}
|
||||||
|
|
||||||
span.title-block {
|
span.title-block {
|
||||||
background-color: #EEE;
|
background-color: @gray-bg;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
padding: 6px 12px;
|
padding: 6px 12px;
|
||||||
margin: 0px 10px;
|
margin: 0px 10px;
|
||||||
@ -165,7 +167,7 @@ img.loading {
|
|||||||
}
|
}
|
||||||
img.viz-thumb-option {
|
img.viz-thumb-option {
|
||||||
width: 100px;
|
width: 100px;
|
||||||
border: 1px solid gray;
|
border: 1px solid @gray;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
@ -178,17 +180,11 @@ li.widget:hover {
|
|||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.widget .chart-header {
|
|
||||||
padding-top: 8px;
|
|
||||||
color: #333;
|
|
||||||
margin: 0 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chart-header .header-text {
|
.chart-header .header-text {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
padding-bottom: 8px;
|
padding-bottom: 8px;
|
||||||
border-bottom: 1px solid #888;
|
border-bottom: 1px solid @gray;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
@ -203,26 +199,6 @@ div.widget .chart-header {
|
|||||||
opacity: .2;
|
opacity: .2;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.widget {
|
|
||||||
.slice_container {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.stack-trace-container.has-trace {
|
|
||||||
.alert-warning:hover {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.is-loading {
|
|
||||||
.stack-trace-container,
|
|
||||||
.slice_container {
|
|
||||||
opacity: 0.5;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar .alert {
|
.navbar .alert {
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
@ -255,12 +231,12 @@ table.table-no-hover tr:hover {
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
cursor: initial;
|
cursor: initial;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid @gray;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.editable-title input[type="text"] {
|
.editable-title input[type="text"] {
|
||||||
border: 1px solid #ccc;
|
border: 1px solid @gray;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
}
|
}
|
||||||
@ -391,7 +367,7 @@ table.table-no-hover tr:hover {
|
|||||||
width: 98%;
|
width: 98%;
|
||||||
padding: 2rem;
|
padding: 2rem;
|
||||||
margin: 0 1% 20px 1%;
|
margin: 0 1% 20px 1%;
|
||||||
background: #f8f8f8;
|
background: @gray-bg;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** table on both sides of the gap **/
|
/** table on both sides of the gap **/
|
||||||
@ -470,19 +446,19 @@ table.table-no-hover tr:hover {
|
|||||||
padding-bottom: 15px;
|
padding-bottom: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-container .filters-container table tr:first-child td {
|
// .list-container .filters-container table tr:first-child td {
|
||||||
border-top: none;
|
// border-top: none;
|
||||||
}
|
// }
|
||||||
.list-container .filters-container table tr:last-child td {
|
// .list-container .filters-container table tr:last-child td {
|
||||||
border-bottom: 1px solid #b3b3b3;
|
// border-bottom: 1px solid @gray-light;
|
||||||
}
|
// }
|
||||||
|
|
||||||
.list-add-action .btn.btn-sm {
|
.list-add-action .btn.btn-sm {
|
||||||
padding: 5px 6px;
|
padding: 5px 6px;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
line-height: 2px;
|
line-height: 2px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
box-shadow: 2px 2px 4px -1px rgba(0, 0, 0, 1);
|
box-shadow: 2px 2px 4px -1px fade(@darkest, @opacity-light);
|
||||||
}
|
}
|
||||||
|
|
||||||
iframe {
|
iframe {
|
||||||
@ -564,7 +540,7 @@ tr.reactable-column-header th.reactable-header-sortable {
|
|||||||
|
|
||||||
.dismiss-overlay-btn {
|
.dismiss-overlay-btn {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
background: white;
|
background: @lightest;
|
||||||
color: @brand-primary;
|
color: @brand-primary;
|
||||||
border-color: @brand-primary;
|
border-color: @brand-primary;
|
||||||
}
|
}
|
||||||
@ -575,7 +551,7 @@ tr.reactable-column-header th.reactable-header-sortable {
|
|||||||
&,
|
&,
|
||||||
&:hover,
|
&:hover,
|
||||||
&:active {
|
&:active {
|
||||||
color: #263238;
|
color: @almost-black;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -16,6 +16,8 @@
|
|||||||
* specific language governing permissions and limitations
|
* specific language governing permissions and limitations
|
||||||
* under the License.
|
* under the License.
|
||||||
*/
|
*/
|
||||||
|
@import "../stylesheets/less/variables.less";
|
||||||
|
|
||||||
.table i {
|
.table i {
|
||||||
padding-top: 6px;
|
padding-top: 6px;
|
||||||
}
|
}
|
||||||
@ -40,7 +42,7 @@ input {
|
|||||||
|
|
||||||
.cal-heatmap-panel {
|
.cal-heatmap-panel {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
background-color: #fff;
|
background-color: @lightest;
|
||||||
}
|
}
|
||||||
.search input {
|
.search input {
|
||||||
width: 400px;
|
width: 400px;
|
Loading…
Reference in New Issue
Block a user