guibik.less 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400
  1. @import 'elements.less';
  2. /** table */
  3. @grey:#E0E0E0;
  4. @grey-lite:#F4F4F4;
  5. /** GENERAL FORM */
  6. a{color:#0092D2;}
  7. table th{background-color: @grey;}
  8. .block,
  9. .item-list,
  10. .help-items ul,
  11. .form-item,
  12. .confirmation ul,
  13. .admin-list,
  14. .node-type-list,
  15. .admin-panel {
  16. border-width:0px;
  17. border-style:solid;
  18. border-color:#fff;
  19. }
  20. .text-format-wrapper .form-item {
  21. background:#F4F4F4;
  22. margin:0px 0px 10px;
  23. border-width:0;
  24. border-style:solid;
  25. border-color:#ddd;
  26. padding: 9px;
  27. }
  28. .form-item label {
  29. color:#1A1A1A;
  30. font-weight:normal;
  31. font-size:12px;
  32. text-transform: none;
  33. }
  34. input.form-autocomplete,
  35. input.form-text,
  36. textarea.form-textarea,
  37. select.form-select {
  38. padding:3px;
  39. border-width:1px;
  40. border-style:solid;
  41. border-color:#BFBFBF;
  42. background:#fff;
  43. color:#1A1A1A;
  44. max-width:100%;
  45. }
  46. .fieldset {
  47. margin:0px 0px 10px;
  48. display:block;
  49. position:relative;
  50. min-height:28px;
  51. border: 0 solid #eee;
  52. }
  53. .item-list h3,
  54. .block .block-title,
  55. .fieldset-title,
  56. .collapsible .fieldset-legend a {
  57. display:block;
  58. font-size:14px;
  59. margin:0px;
  60. padding:4px 9px 5px;
  61. color:#1A1A1A;
  62. background:#E0E0E0;
  63. }
  64. .block .block-content,
  65. .container-inline .fieldset-content,
  66. .fieldset-content {
  67. padding:10px 9px 9px;
  68. background:#F4F4F4;
  69. }
  70. /** popup description */
  71. .page-content .form-item .description {
  72. color:#0092D2;
  73. border-top:1px solid #E0E0E0;
  74. a{text-decoration: underline;}
  75. }
  76. li{list-style: none inside url();}
  77. /** NODE FORM */
  78. .node-form{
  79. div.form-type-checkboxes>label, div.form-type-checkboxes>div.form-checkboxes{display:inline-block;}
  80. .form-item-language>label, .form-item-language>select{display: inline-block;}
  81. .form-type-textfield{
  82. &>label, &>input.form-text{display:inline-block; margin:0;}
  83. &>label{width:35%;}
  84. &>input.form-text{max-width:60%;}
  85. }
  86. fieldset.filter-wrapper{display:none;}
  87. input.fid.form-text{display:none;}
  88. .form-region-right{
  89. position:relative;
  90. fieldset.form-wrapper{max-width:100%; padding:0; margin:0;}
  91. .fieldset-wrapper{padding:0;}
  92. input.form-text{width:100%;}
  93. }
  94. tr.draggable{
  95. fieldset{
  96. legend{display:none;}
  97. .fieldset-content{
  98. padding:0;
  99. .date-padding{padding:0;}
  100. }
  101. }
  102. }
  103. }
  104. /** VERTICAL TABS */
  105. .vertical-tabs {
  106. background:@grey-lite;
  107. border:1px solid #BFBFBF;
  108. margin:0px 0px 10px;
  109. position:relative;
  110. }
  111. .vertical-tabs .fieldset-content,
  112. .vertical-tabs fieldset.titled .fieldset-content {
  113. border:0px;
  114. padding:10px;
  115. }
  116. .vertical-tabs .fieldset-content .fieldset-content {
  117. margin-top: 20px;
  118. }
  119. .vertical-tabs-list li a {
  120. display:block;
  121. text-shadow:#fff 0px 1px 0px;
  122. padding:5px 10px 4px 10px;
  123. border-bottom:1px solid #BFBFBF;
  124. border-right:1px solid #BFBFBF;
  125. color:#494949;
  126. background: @grey;
  127. }
  128. .vertical-tabs-list li.last a{
  129. border-bottom:0px solid #BFBFBF
  130. }
  131. .vertical-tabs-list .selected a ,
  132. .vertical-tabs-list li:hover a {
  133. background:@grey-lite;
  134. color:#1A1A1A;
  135. }
  136. .vertical-tabs-list .selected a{
  137. border-right:0 solid @grey-lite;
  138. }
  139. .vertical-tabs-list .summary { font-size:11px; }
  140. .page-admin table tr.even{
  141. background: #EFEFEF;
  142. }
  143. .page-admin table tr{
  144. &.even, &.odd{
  145. td, h3 {background-color: transparent;}
  146. &:hover{ background: #D4EFEE;}
  147. }
  148. }
  149. .admin-block-description,
  150. .help-items ul li,
  151. .confirmation ul li,
  152. .item-list ul li,
  153. .prose .item-list li,
  154. .menu li {
  155. border-bottom:0 solid #f4f4f4;
  156. }
  157. form .form-actions {
  158. background:#eee;
  159. border:0 solid #ddd;
  160. padding:9px;
  161. }
  162. /** boutons */
  163. input.teaser-button,
  164. input.form-submit,
  165. .node-edit, .button, .node-delete{
  166. cursor:pointer;
  167. padding:0.3em 0.9em;
  168. color:#333;
  169. text-align:center;
  170. font-size:12px;
  171. font-weight:normal;
  172. border-width:1px;
  173. border-style:solid;
  174. border-color:#ddd #ddd #ccc;
  175. background:#bdf url();
  176. -moz-border-radius: 5px;
  177. -webkit-border-radius: 5px;
  178. border-radius: 5px;
  179. }
  180. .node-edit, .button, .node-delete{font-size:10px;padding:0.1em 0.6em;}
  181. input.form-submit:hover,
  182. .node-edit:hover, .button:hover, .node-delete:hover{
  183. border-color:#ddd #ddd #ccc;
  184. -webkit-box-shadow:#ace 0px 0px 0px;
  185. color:#bdf;
  186. background-color: #848484;
  187. }
  188. input.button-yes, .node-edit{
  189. background-color: #CCFF2F;
  190. &:hover{
  191. color:#CCFF2F;
  192. }
  193. }
  194. input.button-no, .node-delete{
  195. background-color: #EA4B4A;
  196. &:hover{
  197. color:#EA4B4A;
  198. }
  199. }
  200. /** admin module */
  201. /**
  202. *
  203. * /!\ CUSTOM HERE /!\
  204. *
  205. * Provide better display for admin menu ==============================
  206. */
  207. body.admin-vertical #admin-menu{background:#222;background-image:none;}
  208. body.admin-vertical #admin-menu-wrapper{margin-left:35px!important;}
  209. body.admin-vertical.admin-expanded #admin-menu-wrapper{border-left:1px solid #323232;margin-left:260px!important;}
  210. #admin-toolbar{z-index:1000!important;}
  211. /* --- */
  212. /**
  213. * VIEW
  214. */
  215. #views-ui-edit-form{
  216. div.changed {
  217. background-color: #FFF98E;
  218. }
  219. .views-ui-display-tab-bucket h3{
  220. font-weight:bold;
  221. background-color: #D8D8D8;
  222. }
  223. .defaulted, .views-ui-display-tab-bucket .views-display-setting.even, .views-ui-display-tab-bucket .views-display-setting.odd{ //:not(.overriden)
  224. color: #666;
  225. background-color: #E0E0E0;
  226. font-style: italic;
  227. /* font-weight:bold;*/
  228. a{color: #3F80B3}
  229. }
  230. .views-ui-display-tab-bucket.overridden .views-display-setting, .views-ui-display-tab-bucket.overridden .views-display-setting,
  231. .views-display-setting.overridden{ //:not(.overriden)
  232. &, &.even, &.odd{
  233. color: #7F7F7F;
  234. background-color: #F9F9F9;
  235. font-style: normal;
  236. /* font-weight:bold;*/
  237. a{color: #3188D1;}
  238. }
  239. }
  240. }
  241. .view{
  242. .pager{
  243. padding:1em 0; margin:0; text-align: right; height:auto;
  244. ul{
  245. .inline-block; padding:0;
  246. li{
  247. height:20px;
  248. a, span{padding:1px 10px 2px;}
  249. }
  250. }
  251. }
  252. // EXPOSED
  253. .view-filters{
  254. padding:1em 0; margin:0 0 1em 0;
  255. border: 1px solid #CCC; .border-radius(5px,5px,5px,5px);
  256. &>span.title, &>form{.inline-block;width:auto;position:relative;vertical-align: top;}
  257. &>span.title{padding:0.7em 1em;}
  258. fieldset{
  259. .inline-block; padding:0 1em;
  260. .fieldset-content{padding:0;}
  261. legend{display:none;}
  262. }
  263. /* .views-exposed-form{ */
  264. label{font-weight:normal; font-size:0.75em;}
  265. .form-item{.inline-block; padding:0 0.5em 0 0;
  266. select, input{font-size:0.8em;}
  267. }
  268. /* }*/
  269. }
  270. // VBO
  271. fieldset#edit-select{
  272. padding:1em 0; margin:0 0 1em 0;
  273. border: 1px solid #CCC; .border-radius(5px,5px,5px,5px);
  274. legend, .fieldset-content{.inline-block;}
  275. legend{
  276. width:auto;
  277. *{background-color: transparent;}
  278. }
  279. .fieldset-content{
  280. padding:0;
  281. select, input{font-size:0.8em;}
  282. }
  283. }
  284. .vbo-fieldset-select-all{
  285. width:50%; text-align:left;
  286. .form-item{.inline-block;vertical-align:top;}
  287. em{padding:0 1em;}
  288. }
  289. }
  290. /** media browser */
  291. .view.inline-block-list{
  292. .views-row {
  293. .inline-block; vertical-align:top;
  294. padding: 5px; margin:5px; width:250px; min-height:150px; background-color: #E3E3E3;
  295. .border-radius(5px,5px,5px,5px); border: 1px solid #ddd;
  296. .drop-shadow;
  297. .float-left{
  298. float:left;
  299. &>div{margin:0 10px 10px 0;}
  300. }
  301. }
  302. }
  303. *:focus{
  304. border: 1px solid #BDF!important;
  305. }
  306. /* Contain floats: h5bp.com/q */
  307. .clearfix:before, .clearfix:after { content: ""; display: table; }
  308. .clearfix:after { clear: both; }
  309. .clearfix { zoom: 1; }
  310. .path-admin-content-nodes span.icon { background-position:0px -30px; }
  311. /** admin view */
  312. .custom-admin{
  313. table{
  314. caption{
  315. display:none;
  316. }
  317. th{line-height:1;}
  318. td{padding-top:1em;padding-bottom:1em;}
  319. td.views-field-views-bulk-operations{
  320. background: @grey!important;
  321. }
  322. td.views-field-field-media{
  323. width:100px;
  324. background: @grey!important;
  325. img{max-width:100%; height:auto;}
  326. }
  327. td.views-field-title{ width:350px; }
  328. a.node-title-link{font-size:1.1em; padding:0 0 0.3em; display:inline-block;}
  329. td.views-field-field-people{width:100px;}
  330. }
  331. }