modals.less 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. //
  2. // Misago Modals
  3. // --------------------------------------------------
  4. // Modals displaying messages
  5. // Small displays
  6. @media screen and (max-width: @screen-sm-max) {
  7. .modal-message {
  8. text-align: center;
  9. .message-icon {
  10. margin: @line-height-computed * 1.5;
  11. .material-icon {
  12. font-size: @message-page-icon-size * 2;
  13. }
  14. }
  15. }
  16. }
  17. // Full displays
  18. @media screen and (min-width: @screen-md-min) {
  19. .modal-message {
  20. .modal-body {
  21. padding-top: @line-height-computed;
  22. padding-bottom: @line-height-computed * 1.5;
  23. }
  24. .message-icon {
  25. float: left;
  26. position: relative;
  27. left: 7px;
  28. .material-icon {
  29. font-size: @line-height-computed * 2.5;
  30. }
  31. }
  32. .message-body {
  33. margin-left: @line-height-computed * 3.75;
  34. margin-top: @line-height-computed * .6 - 2px;
  35. p {
  36. margin-top: @line-height-computed;
  37. }
  38. .lead {
  39. margin-top: 0px;
  40. margin-bottom: 0px;
  41. }
  42. }
  43. }
  44. }
  45. // Modal loader
  46. .modal-loader {
  47. padding: @line-height-computed * 2.5 0px;
  48. .loader {
  49. width: 100%;
  50. height: @loader-size;
  51. text-align: center;
  52. }
  53. .loader-spinning-wheel {
  54. width: @loader-size;
  55. height: @loader-size;
  56. }
  57. }
  58. // Registration modal
  59. .modal-register .modal-footer a {
  60. float: left;
  61. margin-top: @line-height-computed / 3;
  62. }
  63. @media screen and (max-width: @screen-sm-max) {
  64. .modal-register .modal-footer {
  65. text-align: center;
  66. a {
  67. display: block;
  68. }
  69. .btn {
  70. display: block;
  71. float: none;
  72. margin-top: @line-height-computed / 2;
  73. width: 100%;
  74. }
  75. }
  76. }
  77. // Errors modal
  78. .list-item-errors {
  79. margin-bottom: @line-height-computed;
  80. }
  81. .list-errored-items li:last-child .list-item-errors {
  82. margin-bottom: 0px;
  83. }