😎 Give your xaringan slides some style
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.

257 lines
4.5KB

  1. /* Sticky footer */
  2. /**
  3. * Basic idea: https://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/
  4. * Details: https://github.com/philipwalton/solved-by-flexbox/blob/master/assets/css/components/site.css
  5. *
  6. * .Site -> body > .container
  7. * .Site-content -> body > .container .row
  8. * .footer -> footer
  9. *
  10. * Key idea seems to be to ensure that .container and __all its parents__
  11. * have height set to 100%
  12. *
  13. */
  14. html, body {
  15. height: 100%;
  16. }
  17. body > .container {
  18. display: flex;
  19. height: 100%;
  20. flex-direction: column;
  21. }
  22. body > .container .row {
  23. flex: 1 0 auto;
  24. }
  25. footer {
  26. margin-top: 45px;
  27. padding: 35px 0 36px;
  28. border-top: 1px solid #e5e5e5;
  29. color: #666;
  30. display: flex;
  31. flex-shrink: 0;
  32. }
  33. footer p {
  34. margin-bottom: 0;
  35. }
  36. footer div {
  37. flex: 1;
  38. }
  39. footer .pkgdown {
  40. text-align: right;
  41. }
  42. footer p {
  43. margin-bottom: 0;
  44. }
  45. img.icon {
  46. float: right;
  47. }
  48. img {
  49. max-width: 100%;
  50. }
  51. /* Fix bug in bootstrap (only seen in firefox) */
  52. summary {
  53. display: list-item;
  54. }
  55. /* Typographic tweaking ---------------------------------*/
  56. .contents .page-header {
  57. margin-top: calc(-60px + 1em);
  58. }
  59. /* Section anchors ---------------------------------*/
  60. a.anchor {
  61. margin-left: -30px;
  62. display:inline-block;
  63. width: 30px;
  64. height: 30px;
  65. visibility: hidden;
  66. background-image: url(./link.svg);
  67. background-repeat: no-repeat;
  68. background-size: 20px 20px;
  69. background-position: center center;
  70. }
  71. .hasAnchor:hover a.anchor {
  72. visibility: visible;
  73. }
  74. @media (max-width: 767px) {
  75. .hasAnchor:hover a.anchor {
  76. visibility: hidden;
  77. }
  78. }
  79. /* Fixes for fixed navbar --------------------------*/
  80. .contents h1, .contents h2, .contents h3, .contents h4 {
  81. padding-top: 60px;
  82. margin-top: -40px;
  83. }
  84. /* Sidebar --------------------------*/
  85. #sidebar {
  86. margin-top: 30px;
  87. position: -webkit-sticky;
  88. position: sticky;
  89. top: 70px;
  90. }
  91. #sidebar h2 {
  92. font-size: 1.5em;
  93. margin-top: 1em;
  94. }
  95. #sidebar h2:first-child {
  96. margin-top: 0;
  97. }
  98. #sidebar .list-unstyled li {
  99. margin-bottom: 0.5em;
  100. }
  101. .orcid {
  102. height: 16px;
  103. /* margins are required by official ORCID trademark and display guidelines */
  104. margin-left:4px;
  105. margin-right:4px;
  106. vertical-align: middle;
  107. }
  108. /* Reference index & topics ----------------------------------------------- */
  109. .ref-index th {font-weight: normal;}
  110. .ref-index td {vertical-align: top;}
  111. .ref-index .icon {width: 40px;}
  112. .ref-index .alias {width: 40%;}
  113. .ref-index-icons .alias {width: calc(40% - 40px);}
  114. .ref-index .title {width: 60%;}
  115. .ref-arguments th {text-align: right; padding-right: 10px;}
  116. .ref-arguments th, .ref-arguments td {vertical-align: top;}
  117. .ref-arguments .name {width: 20%;}
  118. .ref-arguments .desc {width: 80%;}
  119. /* Nice scrolling for wide elements --------------------------------------- */
  120. table {
  121. display: block;
  122. overflow: auto;
  123. }
  124. /* Syntax highlighting ---------------------------------------------------- */
  125. pre {
  126. word-wrap: normal;
  127. word-break: normal;
  128. border: 1px solid #eee;
  129. }
  130. pre, code {
  131. background-color: #f8f8f8;
  132. color: #333;
  133. }
  134. pre code {
  135. overflow: auto;
  136. word-wrap: normal;
  137. white-space: pre;
  138. }
  139. pre .img {
  140. margin: 5px 0;
  141. }
  142. pre .img img {
  143. background-color: #fff;
  144. display: block;
  145. height: auto;
  146. }
  147. code a, pre a {
  148. color: #375f84;
  149. }
  150. a.sourceLine:hover {
  151. text-decoration: none;
  152. }
  153. .fl {color: #1514b5;}
  154. .fu {color: #000000;} /* function */
  155. .ch,.st {color: #036a07;} /* string */
  156. .kw {color: #264D66;} /* keyword */
  157. .co {color: #888888;} /* comment */
  158. .message { color: black; font-weight: bolder;}
  159. .error { color: orange; font-weight: bolder;}
  160. .warning { color: #6A0366; font-weight: bolder;}
  161. /* Clipboard --------------------------*/
  162. .hasCopyButton {
  163. position: relative;
  164. }
  165. .btn-copy-ex {
  166. position: absolute;
  167. right: 0;
  168. top: 0;
  169. visibility: hidden;
  170. }
  171. .hasCopyButton:hover button.btn-copy-ex {
  172. visibility: visible;
  173. }
  174. /* headroom.js ------------------------ */
  175. .headroom {
  176. will-change: transform;
  177. transition: transform 200ms linear;
  178. }
  179. .headroom--pinned {
  180. transform: translateY(0%);
  181. }
  182. .headroom--unpinned {
  183. transform: translateY(-100%);
  184. }
  185. /* mark.js ----------------------------*/
  186. mark {
  187. background-color: rgba(255, 255, 51, 0.5);
  188. border-bottom: 2px solid rgba(255, 153, 51, 0.3);
  189. padding: 1px;
  190. }
  191. /* vertical spacing after htmlwidgets */
  192. .html-widget {
  193. margin-bottom: 10px;
  194. }
  195. /* fontawesome ------------------------ */
  196. .fab {
  197. font-family: "Font Awesome 5 Brands" !important;
  198. }
  199. /* don't display links in code chunks when printing */
  200. /* source: https://stackoverflow.com/a/10781533 */
  201. @media print {
  202. code a:link:after, code a:visited:after {
  203. content: "";
  204. }
  205. }