nag.css 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. /*!
  2. * # Semantic UI 2.3.3 - Nag
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Released under the MIT license
  7. * http://opensource.org/licenses/MIT
  8. *
  9. */
  10. /*******************************
  11. Nag
  12. *******************************/
  13. .ui.nag {
  14. display: none;
  15. opacity: 0.95;
  16. position: relative;
  17. top: 0em;
  18. left: 0px;
  19. z-index: 999;
  20. min-height: 0em;
  21. width: 100%;
  22. margin: 0em;
  23. padding: 0.75em 1em;
  24. background: #555555;
  25. -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  26. box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  27. font-size: 1rem;
  28. text-align: center;
  29. color: rgba(0, 0, 0, 0.87);
  30. border-radius: 0em 0em 0.28571429rem 0.28571429rem;
  31. -webkit-transition: 0.2s background ease;
  32. transition: 0.2s background ease;
  33. }
  34. a.ui.nag {
  35. cursor: pointer;
  36. }
  37. .ui.nag > .title {
  38. display: inline-block;
  39. margin: 0em 0.5em;
  40. color: #FFFFFF;
  41. }
  42. .ui.nag > .close.icon {
  43. cursor: pointer;
  44. opacity: 0.4;
  45. position: absolute;
  46. top: 50%;
  47. right: 1em;
  48. font-size: 1em;
  49. margin: -0.5em 0em 0em;
  50. color: #FFFFFF;
  51. -webkit-transition: opacity 0.2s ease;
  52. transition: opacity 0.2s ease;
  53. }
  54. /*******************************
  55. States
  56. *******************************/
  57. /* Hover */
  58. .ui.nag:hover {
  59. background: #555555;
  60. opacity: 1;
  61. }
  62. .ui.nag .close:hover {
  63. opacity: 1;
  64. }
  65. /*******************************
  66. Variations
  67. *******************************/
  68. /*--------------
  69. Static
  70. ---------------*/
  71. .ui.overlay.nag {
  72. position: absolute;
  73. display: block;
  74. }
  75. /*--------------
  76. Fixed
  77. ---------------*/
  78. .ui.fixed.nag {
  79. position: fixed;
  80. }
  81. /*--------------
  82. Bottom
  83. ---------------*/
  84. .ui.bottom.nags,
  85. .ui.bottom.nag {
  86. border-radius: 0.28571429rem 0.28571429rem 0em 0em;
  87. top: auto;
  88. bottom: 0em;
  89. }
  90. /*--------------
  91. White
  92. ---------------*/
  93. .ui.inverted.nags .nag,
  94. .ui.inverted.nag {
  95. background-color: #F3F4F5;
  96. color: rgba(0, 0, 0, 0.85);
  97. }
  98. .ui.inverted.nags .nag .close,
  99. .ui.inverted.nags .nag .title,
  100. .ui.inverted.nag .close,
  101. .ui.inverted.nag .title {
  102. color: rgba(0, 0, 0, 0.4);
  103. }
  104. /*******************************
  105. Groups
  106. *******************************/
  107. .ui.nags .nag {
  108. border-radius: 0em !important;
  109. }
  110. .ui.nags .nag:last-child {
  111. border-radius: 0em 0em 0.28571429rem 0.28571429rem;
  112. }
  113. .ui.bottom.nags .nag:last-child {
  114. border-radius: 0.28571429rem 0.28571429rem 0em 0em;
  115. }
  116. /*******************************
  117. Theme Overrides
  118. *******************************/
  119. /*******************************
  120. User Overrides
  121. *******************************/