UI for Zipcoin Blue

content.ios.scss 1.8KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. @import "../../themes/ionic.globals.ios";
  2. // iOS Content
  3. // --------------------------------------------------
  4. /// @prop - Background color of the outer content
  5. $content-ios-outer-background: #efeff4 !default;
  6. /// @prop - Background color of the content when making transition
  7. $content-ios-transition-background: #000 !default;
  8. .content-ios {
  9. color: $text-ios-color;
  10. background-color: $background-ios-color;
  11. }
  12. .content-ios.outer-content {
  13. background: $content-ios-outer-background;
  14. }
  15. .content-ios hr {
  16. height: $hairlines-width;
  17. background-color: rgba(0, 0, 0, .12);
  18. }
  19. .ios .ion-page.show-page ~ .nav-decor {
  20. @include position(0, null, null, 0);
  21. // when ios pages transition, the leaving page grays out
  22. // this is the black square behind all pages so they gray out
  23. position: absolute;
  24. z-index: 0;
  25. display: block;
  26. width: 100%;
  27. height: 100%;
  28. background: $content-ios-transition-background;
  29. pointer-events: none;
  30. }
  31. // iOS Content Padding
  32. // --------------------------------------------------
  33. @include content-padding('ios', $content-ios-padding);
  34. // iOS Content Margin
  35. // --------------------------------------------------
  36. @include content-margin('ios', $content-ios-margin);
  37. // iOS Content Scroll
  38. // --------------------------------------------------
  39. .content-ios:not([no-bounce]) > .scroll-content::before,
  40. .content-ios:not([no-bounce]) > .scroll-content::after {
  41. position: absolute;
  42. width: 1px;
  43. height: 1px;
  44. content: "";
  45. }
  46. .content-ios:not([no-bounce]) > .scroll-content::before {
  47. bottom: -1px;
  48. }
  49. .content-ios:not([no-bounce]) > .scroll-content::after {
  50. top: -1px;
  51. }
  52. .platform-core .content-ios .scroll-content::after,
  53. .platform-core .content-ios .scroll-content::before {
  54. position: initial;
  55. top: initial;
  56. bottom: initial;
  57. width: initial;
  58. height: initial;
  59. }