You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

129 lines
2.7 KiB

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