thirdparty-gritter.less 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. //jquery gritter
  2. .enable_plugin_gritter() when(@enable-plugin-gritter = true) {
  3. .gritter-item-wrapper {
  4. background-image:none !important;
  5. box-shadow:0 2px 10px rgba(50, 50, 50, 0.5);
  6. background:rgba(50,50,50,0.92);
  7. &.gritter-info {
  8. background:rgba(49, 81, 133, 0.92);
  9. }
  10. &.gritter-error {
  11. background:rgba(153, 40, 18, 0.92);
  12. }
  13. &.gritter-success {
  14. background:rgba(89, 131, 75, 0.92);
  15. }
  16. &.gritter-warning {
  17. background:rgba(190, 112, 31, 0.92);
  18. }
  19. &.gritter-light {
  20. background:rgba(245,245,245,0.95);
  21. border:1px solid #BBB;
  22. &.gritter-info {
  23. background:rgba(232, 242, 255, 0.95);
  24. .gritter-item { color:#4A577D; }
  25. }
  26. &.gritter-error {
  27. background:rgba(255, 235, 235, 0.95);
  28. .gritter-item { color:#894A38; }
  29. }
  30. &.gritter-success {
  31. background:rgba(239, 250, 227, 0.95);
  32. .gritter-item { color:#416131; }
  33. }
  34. &.gritter-warning {
  35. background:rgba(252, 248, 227, 0.95);
  36. .gritter-item { color:#946446; }
  37. }
  38. }
  39. }
  40. .gritter-item p {
  41. line-height:1.8;
  42. }
  43. .gritter-top , .gritter-bottom , .gritter-item {
  44. background-image:none;
  45. }
  46. .gritter-close {
  47. left: auto;
  48. right: 3px;
  49. background-image:none;
  50. width: 18px;
  51. height: 18px;
  52. line-height: 17px;
  53. text-align: center;
  54. border: 2px solid transparent;
  55. border-radius: 16px;
  56. color: #E17B67;
  57. &:before {
  58. font-family: FontAwesome;
  59. font-size: @font-size-gritter-close;
  60. content: "\f00d";
  61. }
  62. }
  63. .gritter-info .gritter-close {
  64. color:#FFA500;
  65. }
  66. .gritter-error , .gritter-success , .gritter-warning {
  67. .gritter-close {
  68. color:#FFEA07;
  69. }
  70. }
  71. .gritter-close:hover{
  72. color:#FFF !important;
  73. }
  74. .gritter-title {
  75. text-shadow:none;
  76. }
  77. .gritter-light {
  78. .gritter-item , .gritter-bottom , .gritter-top , .gritter-close {
  79. background-image: none;
  80. color: #444;
  81. }
  82. .gritter-title {
  83. text-shadow: none;
  84. }
  85. .gritter-close:hover {
  86. color:#8A3104 !important;
  87. }
  88. }
  89. .gritter-center {
  90. position:fixed;
  91. left:33%; right:33%; top:33%;
  92. }
  93. @media only screen and (max-width: @screen-xs-max) {
  94. .gritter-center {
  95. left:16%; right:16%; top:30%;
  96. }
  97. }
  98. @media only screen and (max-width: @screen-xs) {
  99. .gritter-center {
  100. left:30px; right:30px;
  101. }
  102. }
  103. @media only screen and (max-width: @screen-tiny) {
  104. .gritter-center {
  105. left:10px; right:10px;
  106. }
  107. }
  108. }
  109. .enable_plugin_gritter();