[GitHub] [superset] mihir174 opened a new issue #12634: Explore control panel minor cosmetic issues

[GitBox]

mihir174 opened a new issue #12634:
URL: https://github.com/apache/superset/issues/12634


   Hey all, here are just a few tweaks to the explore control panel to make 
things look nicer 
   
   I compiled all the correct icons for explore here for reference/use. You can 
export them as SVGs if needed!
   
https://www.figma.com/file/JWaGztdhZS0kS5ruG7x9tB/Control-Panel?node-id=813%3A47391
   
   ### 1. Horizontal padding around input fields 
   
   Currently, the input fields are indented on the left
   <img width="329" alt="Screen Shot 2021-01-20 at 3 13 34 PM" 
src="https://user-images.githubusercontent.com/64227069/105252390-2d36f180-5b32-11eb-82e4-2607724dafc8.png";>
   
   The input fields should be aligned with the section headers like this (with 
8px padding on both the left and right) - 
   <img width="477" alt="Screen Shot 2021-01-20 at 3 18 09 PM" 
src="https://user-images.githubusercontent.com/64227069/105252647-b5b59200-5b32-11eb-89ee-c395b9e530c1.png";>
   
   ### 2. Caret icons
   
   The fields section and control panel have different caret icons
   <img width="616" alt="Screen Shot 2021-01-20 at 3 18 55 PM" 
src="https://user-images.githubusercontent.com/64227069/105252776-f7ded380-5b32-11eb-8cfa-67ef9c2b2370.png";>
   
   They should be the same one from the Superset design system - 
   <img width="728" alt="Screen Shot 2021-01-20 at 3 20 48 PM" 
src="https://user-images.githubusercontent.com/64227069/105252817-1513a200-5b33-11eb-8e7e-a76a00c2f8c7.png";>
   
   Here's the link to the correct icon - 
   
https://www.figma.com/file/JWaGztdhZS0kS5ruG7x9tB/Control-Panel?node-id=813%3A47391
   
   ### 3. Alignment of icons within input fields 
   
   The f(x) icon is vertically off-center a tiny bit
   <img width="209" alt="Screen Shot 2021-01-20 at 3 31 47 PM" 
src="https://user-images.githubusercontent.com/64227069/105253578-9e77a400-5b34-11eb-8bcf-14fdfc8b51cc.png";>
   
   Here's a spec - 
   <img width="779" alt="Screen Shot 2021-01-20 at 3 35 28 PM" 
src="https://user-images.githubusercontent.com/64227069/105253845-2493ea80-5b35-11eb-8a7f-a17f5ed70b7a.png";>
   
   ### 4. Icons in fields/dataset panel
   <img width="95" alt="Screen Shot 2021-01-20 at 3 37 12 PM" 
src="https://user-images.githubusercontent.com/64227069/105253951-5efd8780-5b35-11eb-90dc-1367cee7615a.png";>
   These are a bit inconsistent, the correct set is in the Figma link at the top
   
   cc: @junlincc 


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
us...@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscr...@superset.apache.org
For additional commands, e-mail: notifications-h...@superset.apache.org