popover.wp.scss 1.4KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. @import "../../themes/ionic.globals";
  2. // Windows Popover
  3. // --------------------------------------------------
  4. /// @prop - Width of the popover content
  5. $popover-wp-width: 200px !default;
  6. /// @prop - Min width of the popover content
  7. $popover-wp-min-width: 0 !default;
  8. /// @prop - Minimum height of the popover content
  9. $popover-wp-min-height: 0 !default;
  10. /// @prop - Maximum height of the popover content
  11. $popover-wp-max-height: 90% !default;
  12. /// @prop - Border of the popover content
  13. $popover-wp-border: 2px solid #ccc !default;
  14. /// @prop - Border radius of the popover content
  15. $popover-wp-border-radius: 0 !default;
  16. /// @prop - Text color of the popover content
  17. $popover-wp-text-color: $text-wp-color !default;
  18. /// @prop - Background of the popover content
  19. $popover-wp-background: $background-wp-color !default;
  20. .popover-wp .popover-content {
  21. @include border-radius($popover-wp-border-radius);
  22. @include transform-origin(start, top);
  23. width: $popover-wp-width;
  24. min-width: $popover-wp-min-width;
  25. min-height: $popover-wp-min-height;
  26. max-height: $popover-wp-max-height;
  27. border: $popover-wp-border;
  28. color: $popover-wp-text-color;
  29. background: $popover-wp-background;
  30. }
  31. .popover-wp .popover-viewport {
  32. opacity: 0;
  33. transition-delay: 100ms;
  34. }