misc.scss 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  1. //** Messages. */
  2. .messages(){
  3. padding: 9px;
  4. margin: 0.5em 0 0;
  5. color: #3a87ad;//#360;
  6. background: #d9edf7;//#cf8;
  7. border: 1px solid #bce8f1;//#be7;
  8. -moz-border-radius: 5px;
  9. -webkit-border-radius: 5px;
  10. border-radius: 5px;
  11. .12;
  12. &.warning {
  13. color: #c09853;//#840;
  14. background-color: #fcf8e3;//#fe6;
  15. border-color: #fbeed5;//#ed5;
  16. }
  17. &.error {
  18. color: #b94a48;//#fff;
  19. background-color: #f2dede;//#e63;
  20. border-color: #eed3d7;//#d52;
  21. }
  22. &.status {
  23. color: #468847;//#036;
  24. background-color: #dff0d8;//#bdf;
  25. border-color:#d6e9c6;//#ace;
  26. .14;
  27. }
  28. }
  29. div.messages { .messages();}
  30. .messages-label{display:none;}
  31. #better-messages-wrapper{
  32. background-color: rgba(255,255,255,0.7); .p(10px); .rounded(5px); .drop-shadow(0, 0, 6px, 0.4);
  33. #better-messages-default{
  34. div.messages{
  35. .messages(); margin:0 0 10px 0;
  36. }
  37. .footer{
  38. border:none; padding:0; margin:0;
  39. a.message-close{
  40. background: #fff url('../img/close.png') no-repeat center center;
  41. width:15px; height:15px; .rounded(3px); display:block;
  42. }
  43. }
  44. }
  45. }
  46. /** Tab navigation */
  47. // .primary(){
  48. // font:13px/1.231 sans-serif; *font-size:small;
  49. // border-collapse: collapse;
  50. // padding: 0 0 0 1em; /* LTR */
  51. // white-space: nowrap;
  52. // list-style: none;
  53. // margin: 0;
  54. // height: auto;
  55. // line-height: normal;
  56. // border-bottom: 0 solid #bbb;
  57. // li{
  58. // display: inline;
  59. // a {
  60. // background-color: #ddd;
  61. // border-color: #bbb;
  62. // border-width: 1px;
  63. // border-style: solid solid none solid;
  64. // height: auto;
  65. // margin-right: 0.5em; /* LTR */
  66. // padding: 0 1em;
  67. // text-decoration: none;
  68. // -moz-border-radius: 5px;
  69. // -webkit-border-radius: 5px;
  70. // border-radius: 5px;
  71. // &:hover{
  72. // background-color: #eee;
  73. // border-color: #ccc;
  74. // border-bottom-color: #eee;
  75. // }
  76. // }
  77. // &.active a {
  78. // background-color: #fff;
  79. // border: 1px solid #bbb;
  80. // border-bottom: #fff 1px solid;
  81. // }
  82. // }
  83. // }
  84. // ul.primary, .views-admin-links ul { .primary(); }
  85. // .secondary(){
  86. // border-bottom: 1px solid #bbb;
  87. // padding: 0.5em 1em;
  88. // margin: 5px;
  89. // li {
  90. // display: inline;
  91. // padding: 0 1em;
  92. // border-right: 1px solid #ccc; /* LTR */
  93. // a {
  94. // padding: 0;
  95. // text-decoration: none;
  96. // &.active {
  97. // border-bottom: 4px solid #999;
  98. // }
  99. // }
  100. // }
  101. // }
  102. // ul.secondary { .secondary(); }
  103. /**
  104. * icons
  105. */
  106. .icon(@w, @x, @y, @color : #fff){
  107. background-image: url('../img/sprite.png');
  108. width:@w; height:@w; line-height:@w;
  109. background-position: @x @y ;
  110. background-color: @color;
  111. }
  112. // [class^="icon-materio-viewmode-"], [class*=" icon-materio-viewmode-"]{
  113. // .icon(20px);
  114. // }
  115. i.icon-materio-viewmode-cardsmall{
  116. .icon(20px, -42px, 0);
  117. &.active{.icon(21px, 0, 0); }
  118. &:hover:not(.active){.icon(21px, -21px, 0); }
  119. }
  120. i.icon-materio-viewmode-cardmedium{
  121. .icon(21px, -42px, -21px);
  122. &.active{.icon(21px, 0, -21px); }
  123. &:hover:not(.active){.icon(21px, -21px, -21px); }
  124. }
  125. i.icon-materio-viewmode-cardbig{
  126. .icon(21px, -42px, -42px);
  127. &.active{.icon(21px, 0, -42px); }
  128. &:hover:not(.active){.icon(21px, -21px, -42px); }
  129. }
  130. i.icon-materio-viewmode-cardfull{
  131. .icon(21px, -42px, -63px);
  132. &.active{.icon(21px, 0, -63px); }
  133. &:hover:not(.active){.icon(21px, -21px, -63px); }
  134. }
  135. i.icon-materio-search{
  136. .icon(21px, -63px, -63px);
  137. }
  138. i.icon-materio-folder{
  139. .icon(21px, -84px, -63px);
  140. }
  141. /**
  142. * figures
  143. */
  144. figure{
  145. figcaption{
  146. display:none;
  147. }
  148. .blank{ position:absolute; top:0; left:0; width:100%; height:100%;}
  149. }
  150. /* ==|== print styles =======================================================
  151. Print styles.
  152. Inlined to avoid required HTTP connection: h5bp.com/r
  153. ========================================================================== */
  154. // @media print {
  155. // * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  156. // a, a:visited { text-decoration: underline; }
  157. // a[href]:after { content: " (" attr(href) ")"; }
  158. // abbr[title]:after { content: " (" attr(title) ")"; }
  159. // .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
  160. // pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  161. // thead { display: table-header-group; } /* h5bp.com/t */
  162. // tr, img { page-break-inside: avoid; }
  163. // img { max-width: 100% !important; }
  164. // @page { margin: 0.5cm; }
  165. // p, h2, h3 { orphans: 3; widows: 3; }
  166. // h2, h3 { page-break-after: avoid; }
  167. // }
  168. a:focus {
  169. outline: 0;
  170. }
  171. /*
  172. * Improves readability when focused and also mouse hovered in all browsers.
  173. */
  174. a:active,
  175. a:hover {
  176. outline: 0;
  177. }
  178. /** COLORBOX */
  179. #colorbox{
  180. .rounded; .drop-shadow(0, 0, 5px, 0.4);
  181. #cboxLoadedContent{ background-color: #fff; }
  182. }
  183. /** embed player */
  184. .embedded-video{
  185. .player iframe{
  186. @media @max-768{
  187. max-width:100%;
  188. height:auto;
  189. }
  190. }
  191. }
  192. /** devel */
  193. .not-logged-in{
  194. #tasks ul.tabs.primary{display:none;}
  195. }