Heuzef - Les notes excentriques d'un bidouilleur.
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

theme.css 2.1 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144
  1. :root {
  2. --alchemy-border: rgba(0,0,0,.1);
  3. }
  4. ::selection {
  5. background: var(--primary);
  6. color: var(--secondary);
  7. text-shadow: none;
  8. }
  9. blockquote {
  10. opacity: .7;
  11. font-style: italic;
  12. }
  13. hr {
  14. margin: 1.5rem 0;
  15. }
  16. /* ------------------------------------------------------------------------- */
  17. .container {
  18. max-width: 960px;
  19. }
  20. .header,
  21. .footer {
  22. padding: 1.5rem 0 .5rem;
  23. }
  24. .header {
  25. border-bottom: 1px solid var(--alchemy-border);
  26. }
  27. .header img {
  28. margin-bottom: 1rem;
  29. }
  30. .header .title {
  31. font-weight: bold;
  32. margin-bottom: 1rem;
  33. }
  34. .header ul,
  35. .header li {
  36. margin-bottom: .5rem;
  37. }
  38. .header ul {
  39. font-size: 1.25rem;
  40. font-weight: 300;
  41. text-transform: lowercase;
  42. }
  43. .main {
  44. padding: 1.5rem 0;
  45. }
  46. .footer {
  47. border-top: 1px solid var(--alchemy-border);
  48. }
  49. .highlight pre {
  50. border: 1px solid var(--alchemy-border);
  51. padding: 1rem;
  52. }
  53. .teaser header ul {
  54. list-style: none;
  55. padding-left: 0;
  56. }
  57. .teaser header li {
  58. margin-bottom: .5rem;
  59. }
  60. .teaser .content p {
  61. margin-bottom: 0;
  62. }
  63. .article header ul,
  64. .article header li {
  65. margin-bottom: .5rem;
  66. }
  67. .article header li:not(:last-child) {
  68. margin-right: 10px;
  69. }
  70. .article .content a {
  71. text-decoration: underline
  72. }
  73. .admonition {
  74. border: thin solid gray;
  75. background-color: lightgrey;
  76. padding: .25em .5em;
  77. margin-bottom: 1rem;
  78. }
  79. .admonition .admonition-title {
  80. font-weight: bold;
  81. background-color: rgba(255,255,255,0.66);
  82. text-align: center;
  83. }
  84. .admonition p.last {
  85. margin-bottom: 0;
  86. }
  87. .admonition.important, .admonition.note, .admonition.warning {
  88. border-color: goldenrod;
  89. background-color: lightgoldenrodyellow;
  90. }
  91. .admonition.attention, .admonition.caution, .admonition.danger, .admonition.error {
  92. border-color: red;
  93. background-color: lightpink;
  94. }
  95. .admonition.hint, .admonition.tip {
  96. border-color: limegreen;
  97. background-color: palegreen;
  98. }
  99. @media (min-width: 576px) {
  100. .header .title {
  101. font-size: 3rem;
  102. }
  103. }
  104. @media (max-width: 576px) {
  105. .header,
  106. .footer {
  107. text-align: center;
  108. }
  109. .teaser header li {
  110. display: inline-block;
  111. }
  112. .teaser header li:not(:last-child) {
  113. margin-right: 10px;
  114. }
  115. }