docs(content): add angular example styles

ionic-team · Sep 1, 2023 · 9bdfc83 · 9bdfc83
1 parent 0d37140
commit 9bdfc83
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 7 deletions.
diff --git a/static/usage/v7/content/theming/safe-area/angular/example_component_css.md b/static/usage/v7/content/theming/safe-area/angular/example_component_css.md
@@ -0,0 +1,8 @@
+```css
+ion-content::part(scroll) {
+  padding-top: var(--ion-safe-area-top, 0);
+  padding-bottom: var(--ion-safe-area-bottom, 0);
+  padding-left: var(--ion-safe-area-left, 0);
+  padding-right: var(--ion-safe-area-right, 0);
+}
+```
diff --git a/static/usage/v7/content/theming/safe-area/angular/global_css.md b/static/usage/v7/content/theming/safe-area/angular/global_css.md
@@ -9,11 +9,4 @@
   --ion-safe-area-left: 20px;
   --ion-safe-area-right: 20px;
 }
-
-ion-content::part(scroll) {
-  padding-top: var(--ion-safe-area-top, 0);
-  padding-bottom: var(--ion-safe-area-bottom, 0);
-  padding-left: var(--ion-safe-area-left, 0);
-  padding-right: var(--ion-safe-area-right, 0);
-}
 ```
diff --git a/static/usage/v7/content/theming/safe-area/index.md b/static/usage/v7/content/theming/safe-area/index.md
@@ -8,6 +8,7 @@ import react_main_css from './react/main_css.md';
 import vue from './vue.md';
 
 import angular_example_component_html from './angular/example_component_html.md';
+import angular_example_component_css from './angular/example_component_css.md';
 import angular_global_css from './angular/global_css.md';
 
 <Playground
@@ -24,6 +25,7 @@ import angular_global_css from './angular/global_css.md';
     angular: {
       files: {
         'src/app/example.component.html': angular_example_component_html,
+        'src/app/example.component.css': angular_example_component_css,
         'src/global.css': angular_global_css,
       },
     },