Closed infacto closed 4 years ago
Thanks for the issue. I am going to close this as a duplicate of https://github.com/ionic-team/ionic-framework/issues/17544.
@liamdebeasi Hmm,,, 🤔 this issue is not exactly the duplicate of the issue you referred. It's about setting a box-shadow in ios-mode. Especially on page transition. My issue is about removing the shadow in md-mode, which is not a box-shaodw. It's a background image. A solution with a html attribute on the component. Not a css solution. Maybe the open issue can fix both problems, but I just notice. Not sure.
The iOS shadow/border on the toolbar and the MD shadow on the header are treated as platform equivalents even though they are added in different manners. Normally we would just say you can add/remove the box shadow yourself, but since you would need to apply 2 different styles, we should probably find an easy way to do it in one pass.
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.
Feature Request
Ionic version:
@ionic/angular: '5.3.2'
Describe the Feature Request Add an option / attribute to the ion-header / ion-toolbar to remove the shadow for a full flat header which can be combined with the page content (not line / shadow).
Describe Preferred Solution
<ion-header no-shadow></ion-header>
or<ion-header flat></ion-header>
Describe Alternatives My current solution is to hack the Ionic styles:
Because the shadow is a background image.
Related Code
html
scss
ts
StackBlitz Example
Additional Context
https://ionicframework.com/docs/api/header https://ionicframework.com/docs/api/toolbar