Theming: panel with rounded corners and no padding?

I am working on a new theme based on grey theme. The theme is being created with SA 3.0.3.



I'd like to have rounded corners on two main panels. The setting for radius (4px) was selected in the theme UI for this panel.



However, this setting has two unwanted effects that can't be cancelled with the theme settings:

• padding of 4 px is added to the panel


• inset box shadow is applied to the header


• small rounded images are added into the corners

Shall the theme be fine tuned with additional scss (or css) or is there another (recommended) approach for theming?



A few screenshots are attached for demonstration.



No radius: header fits the width of the panel



Attachment 48542



Radius: unwanted padding is applied



Attachment 48543



Cancelled padding in Chrome (border image is still there):



Attachment 48544



Removed CSS settings for the panel:



Attachment 48545



Removed CSS settings for the panel header:



Attachment 48546

Attached Images

• panel-no-radius.png‎ (14.8 KB)


• panel-radius.png‎ (10.0 KB)


• panel-radius-desired.png‎ (18.0 KB)


• panel-overrides.png‎ (35.4 KB)


• header-overrides.png‎ (47.6 KB)