You are here

style.css in farmOS 7

/**
 * Eliminate extra space at the top.
 */
.navbar.container, .navbar.container-fluid {
  margin-top: 0;
}

/**
 * Nudge the logo down a bit.
 */
.navbar .logo {
  padding-top: 5px;
}

/**
 * Increase the width at which Bootstrap navbar collapses to 1230px.
 * https://stackoverflow.com/questions/18192082/bootstrap-3-navbar-collapse
 */
@media (max-width: 1230px) {
  .navbar-header {
    float: none;
  }
  .navbar-toggle {
    display: block;
  }
  .navbar-collapse {
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  }
  .navbar-collapse.collapse {
    display: none!important;
  }
  .navbar-nav {
    float: none!important;
    margin: 7.5px -15px;
  }
  .navbar-nav>li {
    float: none;
  }
  .navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .navbar-text {
    float: none;
    margin: 15px 0;
  }
  /* since 3.1.0 */
  .navbar-collapse.collapse.in {
    display: block!important;
  }
  .collapsing {
    overflow: hidden!important;
  }
}

/**
 * Reset calendar class width in menu.
 */
.menu .calendar {
  width: auto;
}

/**
 * Hide page title on homepage.
 */
body.front h1.page-header {
  display: none;
}

/**
 * Add bottom margin back to the last items in form groups and panels
 * (Bootstrap theme overrides default).
 * Exception: date select fields.
 */
.form-group:last-child,
.panel:last-child {
  margin-bottom: 18px;
}
.container-inline-date .form-group:last-child {
  margin-bottom: 0;
}

/**
 * Style help text glyphicons.
 */
.page-header .glyphicon-question-sign {
  color: #3a87ad;
  cursor: pointer;
  font-size: 0.75em;
}
.region-help .glyphicon-remove {
  cursor: pointer;
}

/**
 * Remove padding and list style from user login block links (request new password).
 */
form#user-login-form ul {
  padding-left: 0;
}
form#user-login-form ul li {
  list-style: none;
}

/**
 * Override Views feed-icon img-responsive block display.
 */
.view .feed-icon .img-responsive {
  display: inline;
}

/**
 * Add up/down arrow to collapsible fieldset and accordion headings.
 */
.resp-accordion:after,
fieldset.collapsible .panel-heading .fieldset-legend:after {
  font-family: 'Glyphicons Halflings';
  content: "\e113";
  float: left;
  color: grey;
  margin-right: 10px;
  transition: all 0.5s;
}
.resp-accordion.resp-tab-active:after,
fieldset.collapsible .panel-heading .fieldset-legend.collapsed:after {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  transform: rotate(180deg);
}
.resp-accordion .resp-arrow {
  display: none;
}

/**
 * Override styles of responsive accordion tabs/content to match Bootstrap.
 */
h2.resp-accordion {
  background-color: #fcfcfc !important;
}
.resp-vtabs .resp-tabs-container,
.resp-vtabs li.resp-tab-active,
h2.resp-tab-active,
.resp-tab-content {
  border-color: #dddddd !important;
}
.resp-tabs-container {
  margin-bottom: 1em;
}

/**
 * Tweak widths of responsive vertical tabs.
 */
.resp-vtabs ul.resp-tabs-list {
  width: 15%;
}
.resp-vtabs .resp-tabs-container {
  width: 85%;
}
@media only screen and (max-width: 768px) {
  .resp-vtabs .resp-tabs-container {
    width: 100%;
  }
}

/**
 * Colorbox image styles.
 * @see farm_theme_preprocess_field() in template.php.
 */
.field-name-field-farm-images .field-item {
  float: left;
  padding: 5px;
}

/**
 * Fix DateAPI field styles.
 */
.container-inline-date {
  margin-bottom: 10px;
}
.container-inline-date .control-label {
  display: block;
}
.container-inline-date .date-padding {
  float: none;
}

/**
 * Fix Views exposed filters.
 */
.views-exposed-form .views-exposed-widget .form-submit {
  margin-top: 1.6em;
  padding: 6px 12px;
}

/**
 * Fix checkboxes in Views Bulk Operations.
 */
.views-field-views-bulk-operations .checkbox input[type="checkbox"] {
  margin-left: 0;
  position: relative;
}

/**
 * Display VBO checkboxes inline in Views Tree displays.
 * Note: the .views-tree class must be added manually to the View's
 * "Advanced > CSS class" setting.
 */
.views-tree .views-field-views-bulk-operations div.checkbox {
  display: inline;
}
.views-tree .views-field-views-bulk-operations .checkbox label {
  padding-left: 0;
}

/**
 * Fix Modal popup close button (x).
 * See https://www.drupal.org/node/2563967
 */
.modal-header .close {
  color: #222222;
}

/**
 * Style flags checkboxes inline.
 */
#edit-field-farm-flags .form-checkboxes .form-item {
  display: inline;
  padding-left: 0.5em;
  padding-right: 1em;
}

/**
 * Improve Bootstrap Tour styling.
 */
.tour .btn {
  padding: 6px 12px;
}
.tour .popover-content {
  font-size: 16px;
}

File

themes/farm_theme/css/style.css
View source
  1. /**
  2. * Eliminate extra space at the top.
  3. */
  4. .navbar.container, .navbar.container-fluid {
  5. margin-top: 0;
  6. }
  7. /**
  8. * Nudge the logo down a bit.
  9. */
  10. .navbar .logo {
  11. padding-top: 5px;
  12. }
  13. /**
  14. * Increase the width at which Bootstrap navbar collapses to 1230px.
  15. * https://stackoverflow.com/questions/18192082/bootstrap-3-navbar-collapse
  16. */
  17. @media (max-width: 1230px) {
  18. .navbar-header {
  19. float: none;
  20. }
  21. .navbar-toggle {
  22. display: block;
  23. }
  24. .navbar-collapse {
  25. border-top: 1px solid transparent;
  26. box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  27. }
  28. .navbar-collapse.collapse {
  29. display: none!important;
  30. }
  31. .navbar-nav {
  32. float: none!important;
  33. margin: 7.5px -15px;
  34. }
  35. .navbar-nav>li {
  36. float: none;
  37. }
  38. .navbar-nav>li>a {
  39. padding-top: 10px;
  40. padding-bottom: 10px;
  41. }
  42. .navbar-text {
  43. float: none;
  44. margin: 15px 0;
  45. }
  46. /* since 3.1.0 */
  47. .navbar-collapse.collapse.in {
  48. display: block!important;
  49. }
  50. .collapsing {
  51. overflow: hidden!important;
  52. }
  53. }
  54. /**
  55. * Reset calendar class width in menu.
  56. */
  57. .menu .calendar {
  58. width: auto;
  59. }
  60. /**
  61. * Hide page title on homepage.
  62. */
  63. body.front h1.page-header {
  64. display: none;
  65. }
  66. /**
  67. * Add bottom margin back to the last items in form groups and panels
  68. * (Bootstrap theme overrides default).
  69. * Exception: date select fields.
  70. */
  71. .form-group:last-child,
  72. .panel:last-child {
  73. margin-bottom: 18px;
  74. }
  75. .container-inline-date .form-group:last-child {
  76. margin-bottom: 0;
  77. }
  78. /**
  79. * Style help text glyphicons.
  80. */
  81. .page-header .glyphicon-question-sign {
  82. color: #3a87ad;
  83. cursor: pointer;
  84. font-size: 0.75em;
  85. }
  86. .region-help .glyphicon-remove {
  87. cursor: pointer;
  88. }
  89. /**
  90. * Remove padding and list style from user login block links (request new password).
  91. */
  92. form#user-login-form ul {
  93. padding-left: 0;
  94. }
  95. form#user-login-form ul li {
  96. list-style: none;
  97. }
  98. /**
  99. * Override Views feed-icon img-responsive block display.
  100. */
  101. .view .feed-icon .img-responsive {
  102. display: inline;
  103. }
  104. /**
  105. * Add up/down arrow to collapsible fieldset and accordion headings.
  106. */
  107. .resp-accordion:after,
  108. fieldset.collapsible .panel-heading .fieldset-legend:after {
  109. font-family: 'Glyphicons Halflings';
  110. content: "\e113";
  111. float: left;
  112. color: grey;
  113. margin-right: 10px;
  114. transition: all 0.5s;
  115. }
  116. .resp-accordion.resp-tab-active:after,
  117. fieldset.collapsible .panel-heading .fieldset-legend.collapsed:after {
  118. -webkit-transform: rotate(180deg);
  119. -moz-transform: rotate(180deg);
  120. transform: rotate(180deg);
  121. }
  122. .resp-accordion .resp-arrow {
  123. display: none;
  124. }
  125. /**
  126. * Override styles of responsive accordion tabs/content to match Bootstrap.
  127. */
  128. h2.resp-accordion {
  129. background-color: #fcfcfc !important;
  130. }
  131. .resp-vtabs .resp-tabs-container,
  132. .resp-vtabs li.resp-tab-active,
  133. h2.resp-tab-active,
  134. .resp-tab-content {
  135. border-color: #dddddd !important;
  136. }
  137. .resp-tabs-container {
  138. margin-bottom: 1em;
  139. }
  140. /**
  141. * Tweak widths of responsive vertical tabs.
  142. */
  143. .resp-vtabs ul.resp-tabs-list {
  144. width: 15%;
  145. }
  146. .resp-vtabs .resp-tabs-container {
  147. width: 85%;
  148. }
  149. @media only screen and (max-width: 768px) {
  150. .resp-vtabs .resp-tabs-container {
  151. width: 100%;
  152. }
  153. }
  154. /**
  155. * Colorbox image styles.
  156. * @see farm_theme_preprocess_field() in template.php.
  157. */
  158. .field-name-field-farm-images .field-item {
  159. float: left;
  160. padding: 5px;
  161. }
  162. /**
  163. * Fix DateAPI field styles.
  164. */
  165. .container-inline-date {
  166. margin-bottom: 10px;
  167. }
  168. .container-inline-date .control-label {
  169. display: block;
  170. }
  171. .container-inline-date .date-padding {
  172. float: none;
  173. }
  174. /**
  175. * Fix Views exposed filters.
  176. */
  177. .views-exposed-form .views-exposed-widget .form-submit {
  178. margin-top: 1.6em;
  179. padding: 6px 12px;
  180. }
  181. /**
  182. * Fix checkboxes in Views Bulk Operations.
  183. */
  184. .views-field-views-bulk-operations .checkbox input[type="checkbox"] {
  185. margin-left: 0;
  186. position: relative;
  187. }
  188. /**
  189. * Display VBO checkboxes inline in Views Tree displays.
  190. * Note: the .views-tree class must be added manually to the View's
  191. * "Advanced > CSS class" setting.
  192. */
  193. .views-tree .views-field-views-bulk-operations div.checkbox {
  194. display: inline;
  195. }
  196. .views-tree .views-field-views-bulk-operations .checkbox label {
  197. padding-left: 0;
  198. }
  199. /**
  200. * Fix Modal popup close button (x).
  201. * See https://www.drupal.org/node/2563967
  202. */
  203. .modal-header .close {
  204. color: #222222;
  205. }
  206. /**
  207. * Style flags checkboxes inline.
  208. */
  209. #edit-field-farm-flags .form-checkboxes .form-item {
  210. display: inline;
  211. padding-left: 0.5em;
  212. padding-right: 1em;
  213. }
  214. /**
  215. * Improve Bootstrap Tour styling.
  216. */
  217. .tour .btn {
  218. padding: 6px 12px;
  219. }
  220. .tour .popover-content {
  221. font-size: 16px;
  222. }