You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ma...@apache.org on 2025/05/15 07:24:23 UTC
(superset) 01/13: feat: less less is more
This is an automated email from the ASF dual-hosted git repository.
maximebeauchemin pushed a commit to branch no_antd_v4_less_less
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 3038d73f01e84d30628893a8287f4dd236005d76
Author: Maxime Beauchemin <ma...@gmail.com>
AuthorDate: Mon May 12 14:51:29 2025 -0700
feat: less less is more
---
.../src/components/ControlHeader.tsx | 1 -
.../src/components/ControlSubSectionHeader.tsx | 2 +-
.../superset-ui-core/src/theme/GlobalStyles.tsx | 7 +
.../assets/stylesheets/less/cosmo/bootswatch.less | 509 ---------------------
.../stylesheets/less/cosmo/bootswatch.less.hbs | 509 ---------------------
.../src/assets/stylesheets/less/index.less | 1 -
.../src/assets/stylesheets/less/index.less.hbs | 1 -
.../src/assets/stylesheets/superset.less | 28 ++
.../src/explore/components/ControlHeader.tsx | 1 +
.../explore/components/ControlPanelsContainer.tsx | 1 -
.../controls/DatasourceControl/index.jsx | 5 +-
11 files changed, 39 insertions(+), 1026 deletions(-)
diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlHeader.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlHeader.tsx
index 65d52fe557..c64cd86a20 100644
--- a/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlHeader.tsx
+++ b/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlHeader.tsx
@@ -100,7 +100,6 @@ export function ControlHeader({
tabIndex={0}
onClick={onClick}
className={labelClass}
- style={{ cursor: onClick ? 'pointer' : '' }}
>
{label}
</span>{' '}
diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlSubSectionHeader.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlSubSectionHeader.tsx
index 06e8233725..f87c5130c6 100644
--- a/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlSubSectionHeader.tsx
+++ b/superset-frontend/packages/superset-ui-chart-controls/src/components/ControlSubSectionHeader.tsx
@@ -21,8 +21,8 @@ import { styled, css } from '@superset-ui/core';
export const ControlSubSectionHeader = styled.div`
${({ theme }) => css`
font-weight: ${theme.fontWeightStrong};
- font-size: ${theme.fontSizeSM};
margin-bottom: ${theme.sizeUnit}px;
+ font-size: ${theme.fontSizeSM}px;
`}
`;
export default ControlSubSectionHeader;
diff --git a/superset-frontend/packages/superset-ui-core/src/theme/GlobalStyles.tsx b/superset-frontend/packages/superset-ui-core/src/theme/GlobalStyles.tsx
index 7399ff0d0a..3f49e0ee0e 100644
--- a/superset-frontend/packages/superset-ui-core/src/theme/GlobalStyles.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/theme/GlobalStyles.tsx
@@ -32,6 +32,7 @@ export const GlobalStyles = () => {
a {
color: ${theme.colorLink};
}
+ -webkit-font-smoothing: antialiased;
h1,
h2,
@@ -71,6 +72,12 @@ export const GlobalStyles = () => {
padding: 5px 10px 6px;
}
}
+
+ // Overriding bootstrap styles
+ // TODO - remove bootstrap .less and delete this section
+ label {
+ font-weight: ${theme.fontWeightNormal};
+ }
`}
/>
);
diff --git a/superset-frontend/src/assets/stylesheets/less/cosmo/bootswatch.less b/superset-frontend/src/assets/stylesheets/less/cosmo/bootswatch.less
deleted file mode 100644
index c9ece15bb6..0000000000
--- a/superset-frontend/src/assets/stylesheets/less/cosmo/bootswatch.less
+++ /dev/null
@@ -1,509 +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.
- */
-// Forked Cosmo 3.3.7
-// Bootswatch
-// -----------------------------------------------------
-
-// Navbar =====================================================================
-
-.navbar {
- border: none;
-
- li > a:focus {
- outline: 0;
- }
-
- &-inverse {
- .badge {
- background-color: @lightest;
- color: @brand-primary;
- }
- }
-
- .caret {
- display: inline-block;
- padding: 0 5px 18px 5px;
- }
-}
-
-.navbar-inverse {
- border: none;
-}
-
-.navbar-inverse .navbar-nav > .active > a,
-.navbar-inverse .navbar-nav > .active > a:hover,
-.navbar-inverse .navbar-nav > .active > a:focus {
- background: transparent;
-}
-
-.navbar-nav > li > a {
- padding-top: 18px;
-}
-
-// Buttons ====================================================================
-
-.btn:focus,
-.btn:active:focus {
- outline: none;
-}
-
-.nav-tabs {
- .dropdown-toggle.btn,
- .btn-group.open .dropdown-toggle.btn {
- &,
- &:hover,
- &:active,
- &:focus {
- border-color: transparent;
- background-color: transparent;
- box-shadow: none;
- }
- }
-}
-
-.caret {
- border: none;
- color: @gray;
-
- &:hover {
- color: @gray-darker;
- }
-
- &:before {
- font-family: 'FontAwesome';
- font-size: @font-size-xs;
- content: '\f078';
- }
-}
-
-// Typography =================================================================
-
-body {
- -webkit-font-smoothing: antialiased;
-}
-
-.text-primary,
-.text-primary:hover {
- color: @brand-primary;
-}
-
-.text-success,
-.text-success:hover {
- color: @success;
-}
-
-.text-danger,
-.text-danger:hover {
- color: @brand-danger;
-}
-
-.text-warning,
-.text-warning:hover {
- color: @brand-warning;
-}
-
-.text-info,
-.text-info:hover {
- color: @brand-info;
-}
-
-// Tables =====================================================================
-
-table,
-.table {
- .dropdown-menu a {
- text-decoration: none;
- }
-
- .success,
- .warning,
- .danger,
- .info {
- color: @lightest;
-
- a {
- color: @lightest;
- }
-
- .btn-default {
- color: @gray;
- }
- }
-}
-
-// Forms ======================================================================
-
-.form-control {
- box-shadow: none;
-}
-
-.has-warning {
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline,
- &.radio label,
- &.checkbox label,
- &.radio-inline label,
- &.checkbox-inline label,
- .form-control-feedback {
- color: @brand-warning;
- }
-
- .form-control,
- .form-control:focus,
- .input-group-addon {
- border: 1px solid @brand-warning;
- }
-}
-
-.has-error {
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline,
- &.radio label,
- &.checkbox label,
- &.radio-inline label,
- &.checkbox-inline label,
- .form-control-feedback {
- color: @brand-danger;
- }
-
- .form-control,
- .form-control:focus,
- .input-group-addon {
- border: 1px solid @brand-danger;
- }
-}
-
-.has-success {
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline,
- &.radio label,
- &.checkbox label,
- &.radio-inline label,
- &.checkbox-inline label,
- .form-control-feedback {
- color: @brand-success;
- }
-
- .form-control,
- .form-control:focus,
- .input-group-addon {
- border: 1px solid @brand-success;
- }
-}
-
-// Navs =======================================================================
-
-.nav-pills {
- & > li > a {
- border-radius: @border-radius-normal;
- }
-}
-
-.dropdown-menu {
- & > li > a:hover,
- & > li > a:focus {
- background-image: none;
- text-decoration: none;
- }
-}
-
-// Indicators =================================================================
-
-.close {
- text-decoration: none;
- text-shadow: none;
- opacity: 0.4;
-
- &:hover,
- &:focus {
- opacity: 1;
- }
-}
-
-.alert {
- border: none;
-}
-
-.alert-link {
- text-decoration: underline;
-}
-
-.alert-info .alert-link {
- color: @alert-info-text;
-}
-
-.alert-danger .alert-link {
- color: @alert-danger-text;
-}
-
-.alert-warning .alert-link {
- color: @alert-warning-text;
-}
-
-.alert-success .alert-link {
- color: @alert-success-text;
-}
-
-.label {
- border-radius: 21px;
- padding: 0.35em 0.8em 0.35em;
- font-weight: @font-weight-normal;
- font-size: @font-size-s;
-}
-.label-default:hover {
- background-color: darken(@label-default-bg, 5%);
-}
-.label-warning:hover {
- background-color: darken(@label-warning-bg, 5%);
-}
-.label-danger:hover {
- background-color: darken(@label-danger-bg, 5%);
-}
-.label-primary:hover {
- background-color: darken(@label-primary-bg, 5%);
-}
-
-label {
- font-weight: @font-weight-normal;
- font-size: @font-size-s;
-}
-
-// Progress bars ==============================================================
-
-.progress {
- height: 14px;
- .box-shadow(none);
-
- .progress-bar {
- font-size: @font-size-s;
- line-height: @line-height-tight;
- padding-top: 2px;
- }
-}
-
-// Containers =================================================================
-
-.panel {
- border: none;
-
- &-heading,
- &-footer {
- border-top-right-radius: 0;
- border-top-left-radius: 0;
- }
-
- &-default {
- .panel-heading {
- padding: 15px 15px 0 15px;
- background-color: transparent;
- }
-
- .panel-title {
- color: @text-color;
- padding-bottom: 5px;
- border-bottom: 1px solid @gray-light;
-
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- margin: 10px 0 0 0;
- font-weight: @font-weight-bold;
- }
- }
-
- .close {
- color: @text-color;
- }
- }
-
- &-primary {
- .panel-heading {
- padding: 15px 15px 0 15px;
- background-color: transparent;
- }
-
- .panel-title {
- color: @text-color;
- padding-bottom: 5px;
- border-bottom: 1px solid @gray-light;
-
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- margin: 10px 0 0 0;
- font-weight: @font-weight-bold;
- }
- }
-
- .close {
- color: @text-color;
- }
- }
-
- .accordion-toggle {
- display: flex;
- align-items: center;
- text-decoration: none;
-
- &:hover {
- text-decoration: none;
- }
-
- .caret {
- display: flex;
- width: auto;
- height: auto;
- margin-left: 5px;
-
- &:hover {
- color: @gray;
- }
- }
- }
-}
-
-.panel-title-large {
- font-size: 24px;
-}
-
-.list-group-item {
- padding-top: 5px;
- padding-bottom: 5px;
-}
-
-a.list-group-item {
- &-success {
- &.active {
- background-color: @state-success-bg;
- }
-
- &.active:hover,
- &.active:focus {
- background-color: darken(@state-success-bg, 5%);
- }
- }
-
- &-warning {
- &.active {
- background-color: @state-warning-bg;
- }
-
- &.active:hover,
- &.active:focus {
- background-color: darken(@state-warning-bg, 5%);
- }
- }
-
- &-danger {
- &.active {
- background-color: @state-danger-bg;
- }
-
- &.active:hover,
- &.active:focus {
- background-color: darken(@state-danger-bg, 5%);
- }
- }
-}
-
-.modal {
- .close {
- color: @text-color;
- }
-}
-
-.popover {
- color: @text-color;
-}
-
-// Tabs ==============================================================
-
-.nav-tabs > li > a {
- border-top: 3px solid transparent;
- color: @text-color;
-}
-
-.nav-tabs > li.active > a,
-.nav-tabs > li.active > a:hover,
-.nav-tabs > li.active > a:focus {
- background-color: @lightest;
- font-weight: @font-weight-bold;
- border-top: 3px solid @brand-primary;
-}
-
-// Tables ==============================================================
-
-.table {
- .info {
- color: @state-info-text;
- }
-
- .danger {
- color: @state-danger-text;
- }
-
- .warning {
- color: @state-warning-text;
- }
-
- .success {
- color: @state-success-text;
- }
-}
-
-// Utils ==============================================================
-hr {
- margin: 10px 0;
-}
-
-// generate space-n classes for vertical spacing
-.space-loop(@counter) when (@counter > 0) {
- .space-loop((@counter - 1)); // next iteration
- .space-@{counter} {
- margin-bottom: (10px * @counter); // code for each iteration
- }
-}
-.space-loop(6);
-
-a {
- cursor: pointer;
-}
-
-.control-label {
- color: @gray;
- font-size: @font-size-s;
-}
diff --git a/superset-frontend/src/assets/stylesheets/less/cosmo/bootswatch.less.hbs b/superset-frontend/src/assets/stylesheets/less/cosmo/bootswatch.less.hbs
deleted file mode 100644
index c9ece15bb6..0000000000
--- a/superset-frontend/src/assets/stylesheets/less/cosmo/bootswatch.less.hbs
+++ /dev/null
@@ -1,509 +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.
- */
-// Forked Cosmo 3.3.7
-// Bootswatch
-// -----------------------------------------------------
-
-// Navbar =====================================================================
-
-.navbar {
- border: none;
-
- li > a:focus {
- outline: 0;
- }
-
- &-inverse {
- .badge {
- background-color: @lightest;
- color: @brand-primary;
- }
- }
-
- .caret {
- display: inline-block;
- padding: 0 5px 18px 5px;
- }
-}
-
-.navbar-inverse {
- border: none;
-}
-
-.navbar-inverse .navbar-nav > .active > a,
-.navbar-inverse .navbar-nav > .active > a:hover,
-.navbar-inverse .navbar-nav > .active > a:focus {
- background: transparent;
-}
-
-.navbar-nav > li > a {
- padding-top: 18px;
-}
-
-// Buttons ====================================================================
-
-.btn:focus,
-.btn:active:focus {
- outline: none;
-}
-
-.nav-tabs {
- .dropdown-toggle.btn,
- .btn-group.open .dropdown-toggle.btn {
- &,
- &:hover,
- &:active,
- &:focus {
- border-color: transparent;
- background-color: transparent;
- box-shadow: none;
- }
- }
-}
-
-.caret {
- border: none;
- color: @gray;
-
- &:hover {
- color: @gray-darker;
- }
-
- &:before {
- font-family: 'FontAwesome';
- font-size: @font-size-xs;
- content: '\f078';
- }
-}
-
-// Typography =================================================================
-
-body {
- -webkit-font-smoothing: antialiased;
-}
-
-.text-primary,
-.text-primary:hover {
- color: @brand-primary;
-}
-
-.text-success,
-.text-success:hover {
- color: @success;
-}
-
-.text-danger,
-.text-danger:hover {
- color: @brand-danger;
-}
-
-.text-warning,
-.text-warning:hover {
- color: @brand-warning;
-}
-
-.text-info,
-.text-info:hover {
- color: @brand-info;
-}
-
-// Tables =====================================================================
-
-table,
-.table {
- .dropdown-menu a {
- text-decoration: none;
- }
-
- .success,
- .warning,
- .danger,
- .info {
- color: @lightest;
-
- a {
- color: @lightest;
- }
-
- .btn-default {
- color: @gray;
- }
- }
-}
-
-// Forms ======================================================================
-
-.form-control {
- box-shadow: none;
-}
-
-.has-warning {
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline,
- &.radio label,
- &.checkbox label,
- &.radio-inline label,
- &.checkbox-inline label,
- .form-control-feedback {
- color: @brand-warning;
- }
-
- .form-control,
- .form-control:focus,
- .input-group-addon {
- border: 1px solid @brand-warning;
- }
-}
-
-.has-error {
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline,
- &.radio label,
- &.checkbox label,
- &.radio-inline label,
- &.checkbox-inline label,
- .form-control-feedback {
- color: @brand-danger;
- }
-
- .form-control,
- .form-control:focus,
- .input-group-addon {
- border: 1px solid @brand-danger;
- }
-}
-
-.has-success {
- .help-block,
- .control-label,
- .radio,
- .checkbox,
- .radio-inline,
- .checkbox-inline,
- &.radio label,
- &.checkbox label,
- &.radio-inline label,
- &.checkbox-inline label,
- .form-control-feedback {
- color: @brand-success;
- }
-
- .form-control,
- .form-control:focus,
- .input-group-addon {
- border: 1px solid @brand-success;
- }
-}
-
-// Navs =======================================================================
-
-.nav-pills {
- & > li > a {
- border-radius: @border-radius-normal;
- }
-}
-
-.dropdown-menu {
- & > li > a:hover,
- & > li > a:focus {
- background-image: none;
- text-decoration: none;
- }
-}
-
-// Indicators =================================================================
-
-.close {
- text-decoration: none;
- text-shadow: none;
- opacity: 0.4;
-
- &:hover,
- &:focus {
- opacity: 1;
- }
-}
-
-.alert {
- border: none;
-}
-
-.alert-link {
- text-decoration: underline;
-}
-
-.alert-info .alert-link {
- color: @alert-info-text;
-}
-
-.alert-danger .alert-link {
- color: @alert-danger-text;
-}
-
-.alert-warning .alert-link {
- color: @alert-warning-text;
-}
-
-.alert-success .alert-link {
- color: @alert-success-text;
-}
-
-.label {
- border-radius: 21px;
- padding: 0.35em 0.8em 0.35em;
- font-weight: @font-weight-normal;
- font-size: @font-size-s;
-}
-.label-default:hover {
- background-color: darken(@label-default-bg, 5%);
-}
-.label-warning:hover {
- background-color: darken(@label-warning-bg, 5%);
-}
-.label-danger:hover {
- background-color: darken(@label-danger-bg, 5%);
-}
-.label-primary:hover {
- background-color: darken(@label-primary-bg, 5%);
-}
-
-label {
- font-weight: @font-weight-normal;
- font-size: @font-size-s;
-}
-
-// Progress bars ==============================================================
-
-.progress {
- height: 14px;
- .box-shadow(none);
-
- .progress-bar {
- font-size: @font-size-s;
- line-height: @line-height-tight;
- padding-top: 2px;
- }
-}
-
-// Containers =================================================================
-
-.panel {
- border: none;
-
- &-heading,
- &-footer {
- border-top-right-radius: 0;
- border-top-left-radius: 0;
- }
-
- &-default {
- .panel-heading {
- padding: 15px 15px 0 15px;
- background-color: transparent;
- }
-
- .panel-title {
- color: @text-color;
- padding-bottom: 5px;
- border-bottom: 1px solid @gray-light;
-
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- margin: 10px 0 0 0;
- font-weight: @font-weight-bold;
- }
- }
-
- .close {
- color: @text-color;
- }
- }
-
- &-primary {
- .panel-heading {
- padding: 15px 15px 0 15px;
- background-color: transparent;
- }
-
- .panel-title {
- color: @text-color;
- padding-bottom: 5px;
- border-bottom: 1px solid @gray-light;
-
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- margin: 10px 0 0 0;
- font-weight: @font-weight-bold;
- }
- }
-
- .close {
- color: @text-color;
- }
- }
-
- .accordion-toggle {
- display: flex;
- align-items: center;
- text-decoration: none;
-
- &:hover {
- text-decoration: none;
- }
-
- .caret {
- display: flex;
- width: auto;
- height: auto;
- margin-left: 5px;
-
- &:hover {
- color: @gray;
- }
- }
- }
-}
-
-.panel-title-large {
- font-size: 24px;
-}
-
-.list-group-item {
- padding-top: 5px;
- padding-bottom: 5px;
-}
-
-a.list-group-item {
- &-success {
- &.active {
- background-color: @state-success-bg;
- }
-
- &.active:hover,
- &.active:focus {
- background-color: darken(@state-success-bg, 5%);
- }
- }
-
- &-warning {
- &.active {
- background-color: @state-warning-bg;
- }
-
- &.active:hover,
- &.active:focus {
- background-color: darken(@state-warning-bg, 5%);
- }
- }
-
- &-danger {
- &.active {
- background-color: @state-danger-bg;
- }
-
- &.active:hover,
- &.active:focus {
- background-color: darken(@state-danger-bg, 5%);
- }
- }
-}
-
-.modal {
- .close {
- color: @text-color;
- }
-}
-
-.popover {
- color: @text-color;
-}
-
-// Tabs ==============================================================
-
-.nav-tabs > li > a {
- border-top: 3px solid transparent;
- color: @text-color;
-}
-
-.nav-tabs > li.active > a,
-.nav-tabs > li.active > a:hover,
-.nav-tabs > li.active > a:focus {
- background-color: @lightest;
- font-weight: @font-weight-bold;
- border-top: 3px solid @brand-primary;
-}
-
-// Tables ==============================================================
-
-.table {
- .info {
- color: @state-info-text;
- }
-
- .danger {
- color: @state-danger-text;
- }
-
- .warning {
- color: @state-warning-text;
- }
-
- .success {
- color: @state-success-text;
- }
-}
-
-// Utils ==============================================================
-hr {
- margin: 10px 0;
-}
-
-// generate space-n classes for vertical spacing
-.space-loop(@counter) when (@counter > 0) {
- .space-loop((@counter - 1)); // next iteration
- .space-@{counter} {
- margin-bottom: (10px * @counter); // code for each iteration
- }
-}
-.space-loop(6);
-
-a {
- cursor: pointer;
-}
-
-.control-label {
- color: @gray;
- font-size: @font-size-s;
-}
diff --git a/superset-frontend/src/assets/stylesheets/less/index.less b/superset-frontend/src/assets/stylesheets/less/index.less
index fc91c477db..a2a9279550 100644
--- a/superset-frontend/src/assets/stylesheets/less/index.less
+++ b/superset-frontend/src/assets/stylesheets/less/index.less
@@ -21,7 +21,6 @@
@import '~bootstrap/less/bootstrap.less';
@import './fonts.less';
@import './variables.less';
-@import './cosmo/bootswatch.less';
html,
body {
diff --git a/superset-frontend/src/assets/stylesheets/less/index.less.hbs b/superset-frontend/src/assets/stylesheets/less/index.less.hbs
index fc91c477db..a2a9279550 100644
--- a/superset-frontend/src/assets/stylesheets/less/index.less.hbs
+++ b/superset-frontend/src/assets/stylesheets/less/index.less.hbs
@@ -21,7 +21,6 @@
@import '~bootstrap/less/bootstrap.less';
@import './fonts.less';
@import './variables.less';
-@import './cosmo/bootswatch.less';
html,
body {
diff --git a/superset-frontend/src/assets/stylesheets/superset.less b/superset-frontend/src/assets/stylesheets/superset.less
index 1c244ccaed..7bf8c27fff 100644
--- a/superset-frontend/src/assets/stylesheets/superset.less
+++ b/superset-frontend/src/assets/stylesheets/superset.less
@@ -38,6 +38,10 @@ i {
white-space: nowrap;
}
+input.form-control {
+ background-color: @lightest;
+}
+
.disabledButton {
pointer-events: none;
}
@@ -183,6 +187,30 @@ table.table-no-hover tr:hover {
background-color: initial;
}
+.editable-title input {
+ outline: none;
+ background: transparent;
+ border: none;
+ box-shadow: none;
+ padding: 0;
+ cursor: initial;
+}
+
+.editable-title textarea {
+ outline: none;
+ background: transparent;
+ box-shadow: none;
+ cursor: initial;
+ border: 1px solid @gray;
+ border-radius: @border-radius-normal;
+}
+
+.editable-title input[type='text'] {
+ border: 1px solid @gray;
+ border-radius: @border-radius-normal;
+ padding: 2px;
+}
+
.editable-title.datasource-sql-expression {
font-feature-settings: @font-feature-settings;
font-family: @font-family-monospace;
diff --git a/superset-frontend/src/explore/components/ControlHeader.tsx b/superset-frontend/src/explore/components/ControlHeader.tsx
index 0ecfca0220..81abac0c9d 100644
--- a/superset-frontend/src/explore/components/ControlHeader.tsx
+++ b/superset-frontend/src/explore/components/ControlHeader.tsx
@@ -120,6 +120,7 @@ const ControlHeader: FC<ControlHeaderProps> = ({
css={(theme: SupersetTheme) => css`
margin-bottom: ${theme.sizeUnit * 0.5}px;
position: relative;
+ font-size: ${theme.fontSizeSM}px;
`}
>
{leftNode && <span>{leftNode} </span>}
diff --git a/superset-frontend/src/explore/components/ControlPanelsContainer.tsx b/superset-frontend/src/explore/components/ControlPanelsContainer.tsx
index 993aacf0a7..c44b56aae5 100644
--- a/superset-frontend/src/explore/components/ControlPanelsContainer.tsx
+++ b/superset-frontend/src/explore/components/ControlPanelsContainer.tsx
@@ -562,7 +562,6 @@ export const ControlPanelsContainer = (props: ControlPanelsContainerProps) => {
css={(theme: SupersetTheme) => css`
font-size: ${theme.fontSize}px;
line-height: 1.3;
- font-weight: ${theme.fontWeightMedium};
`}
>
{label}
diff --git a/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx b/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx
index 916c38303e..7e3a572399 100644
--- a/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx
+++ b/superset-frontend/src/explore/components/controls/DatasourceControl/index.jsx
@@ -84,7 +84,7 @@ const Styles = styled.div`
margin: ${({ theme }) => 2 * theme.sizeUnit}px;
}
.antd5-dropdown-trigger {
- margin-left: ${({ theme }) => 2 * theme.sizeUnit}px;
+ margin-left: ${({ theme }) => theme.sizeUnit}px;
}
.btn-group .open .dropdown-toggle {
box-shadow: none;
@@ -102,9 +102,8 @@ const Styles = styled.div`
.title-select {
flex: 1 1 100%;
display: inline-block;
- padding: ${({ theme }) => theme.sizeUnit * 2}px;
+ padding: ${({ theme }) => theme.sizeUnit * 2}px 0px;
border-radius: ${({ theme }) => theme.borderRadius}px;
- text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;