Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css] Bringing Bootswatch in line with external variables, and other CSS tweaks #8781

Merged
merged 15 commits into from Jan 13, 2020

Conversation

rusackas
Copy link
Member

@rusackas rusackas commented Dec 6, 2019

CATEGORY

Choose one

  • Bug Fix
  • Enhancement (new features, refinement)
  • Refactor
  • Add tests
  • Build / Development Environment
  • Documentation

SUMMARY

Bootstap and Bootswatch (Cosmo theme) have a bunch of colors and things in them that have not yet been brought inline with the global styles. This PR will aim to address that.

This PR also does the following:
• Updates Toasts to use global status (success/info/warn/error) colors.
• Updates those global status colors to be consistent, compromising between the two values used in the Cosmo theme and elsewhere in the CSS codebase
• Bumps LESS loader, because it seemed to cause no harm and fixes webpack watch mode.
• Includes the Cosmo variables.less file at the bottom of the main variables.less file, since it's now acting more like an extension of those global vars. It also lets us include only the main variables file in our components, reducing reliance on Cosmo in general.
• Prettier-ing of superset.less which points out a hole in the clean-css script I'll address in another quick PR.
• Expands the scope of CSS linting to include /superset/stylesheets and not just /sueperset/src
• Fixes a CSS-based issue with the Adhoc Metric Title editor, where the height jumps when entering/exiting edit mode. This was causing the Save button to be finnicky, and Cypress tests to fail. When the mouse went down, the field would lose focus and disappear, shrinking the popover, and then when the mouse went up, it would no longer be over the Save button, thus the click wouldn't register. The height now remains consistent. Animations below.
• Fixes an issue where eslint was failing due to the node_modules folder in superset/assets/cypress_base (fyi @nytai ). Added **/node_modules to .eslintignore

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

A few of the more significant/visible changes:

Before (using a "pink" color that's quite near the error/danger color):
image

After (using the 'info' color since this seems like, well, info):
image

Before (warning color that didn't match the Cosmo theme's warning color):
image

After (the middle ground color between the prior one and Cosmo's warning color):
image

Before (ad hoc metric title bar height changing)
form_before

After (ad hoc metric title bar height consistent)
form-after

ADDITIONAL INFORMATION

  • Changes UI

REVIEWERS

@mistercrunch

@rusackas rusackas changed the title [css] WiP: Bringing Bootswatch in line with external variables [css] Bringing Bootswatch in line with external variables, and other CSS tweaks Dec 19, 2019
@codecov-io
Copy link

Codecov Report

Merging #8781 into master will increase coverage by 0.09%.
The diff coverage is 100%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #8781      +/-   ##
==========================================
+ Coverage   58.87%   58.97%   +0.09%     
==========================================
  Files         359      359              
  Lines       11330    11333       +3     
  Branches     2784     2787       +3     
==========================================
+ Hits         6671     6684      +13     
+ Misses       4481     4471      -10     
  Partials      178      178
Impacted Files Coverage Δ
...explore/components/AdhocMetricEditPopoverTitle.jsx 70% <100%> (ø) ⬆️
...perset/assets/src/explore/components/SaveModal.jsx 92.63% <0%> (+4.21%) ⬆️
...sets/src/explore/components/ExploreChartHeader.jsx 71.05% <0%> (+19.62%) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update cbf8600...3c5bb88. Read the comment docs.

@mistercrunch mistercrunch merged commit d9e7db6 into apache:master Jan 13, 2020
@rusackas rusackas deleted the cleaning-bootswatch branch January 13, 2020 20:31
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 0.36.0 labels Feb 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels size/XXL 🚢 0.36.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants