vc_modals.less 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. /** VC Modal block popup */
  2. .add_element_size(@counter, @max_width: 1330px) when (@counter >= 0) {
  3. .add_element_size((@counter - 1), (@max_width - @vc_add_element_button_width));
  4. @media (min-width: @max_width) {
  5. .vc_modal-dialog {
  6. width: (10px + @vc_add_element_width + @counter * @vc_add_element_button_width);
  7. }
  8. }
  9. }
  10. .vc_modal {
  11. display: none;
  12. overflow: auto;
  13. overflow-y: hidden;
  14. position: fixed;
  15. top: 0 !important;
  16. right: 0;
  17. bottom: 0;
  18. left: 0;
  19. -webkit-overflow-scrolling: touch;
  20. width: auto !important;
  21. margin-left: 0 !important;
  22. background-color: transparent !important;
  23. z-index: @vc_zindex_modal !important;
  24. &.fade .vc_modal-dialog {
  25. .translate(0, -25%);
  26. .transition-transform(~"0.3s ease-out");
  27. }
  28. &.in .vc_modal-dialog {
  29. .translate(0, 0)
  30. }
  31. *, & {
  32. .box-sizing(border-box);
  33. }
  34. }
  35. .add_element_size(4);
  36. .vc_modal-content {
  37. position: relative;
  38. background-color: @modal-content-bg;
  39. .box-shadow(0 3px 9px rgba(0, 0, 0, .5));
  40. background-clip: padding-box;
  41. // Remove focus outline from opened modal
  42. outline: 0;
  43. -webkit-border-radius: @vc_modal_content_radius;
  44. -moz-border-radius: 2px;
  45. border-radius: 2px;
  46. border: 1px solid @vc_modal_content_border_color;
  47. }
  48. .vc_modal-header {
  49. .vc_box-heading;
  50. }
  51. .vc_modal-title {
  52. .modal-title;
  53. .vc_heading(16px);
  54. cursor: default;
  55. border: 0 !important;
  56. }
  57. .vc_modal-body {
  58. .modal-body;
  59. overflow-y: auto;
  60. }
  61. .vc_modal-footer {
  62. .modal-footer;
  63. }
  64. // Default bootstrap classes for modal box
  65. .modal-open {
  66. .modal-open;
  67. }
  68. .clousus {
  69. z-index: @zindex-modal-background;
  70. }
  71. .modal-backdrop {
  72. .modal-backdrop;
  73. }
  74. // Measure scrollbar width for padding body during modal show/hide
  75. .modal-scrollbar-measure {
  76. .modal-scrollbar-measure;
  77. }