Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

132 lines
1.6KB

  1. body {
  2. display: flex;
  3. flex-flow: column wrap;
  4. max-width: 50em;
  5. line-height: 1.5em;
  6. }
  7. main {
  8. margin: auto;
  9. flex: 8 0;
  10. padding: 1.5rem;
  11. }
  12. img {
  13. max-width: 100%;
  14. }
  15. code, blockquote {
  16. background: #eee;
  17. }
  18. /* Homepage */
  19. .intro > h1 {
  20. color: #212121;
  21. font-size: 12vh;
  22. }
  23. .intro > h2 {
  24. color: #757575;
  25. font-size: 3vmin;
  26. }
  27. /* Page content */
  28. .content {
  29. padding-top: 20px;
  30. }
  31. /* Profile picture */
  32. .profile {
  33. width: 10vh;
  34. height: 10vh;
  35. border-radius: 50%;
  36. }
  37. /* Colored links */
  38. a:link, a:visited {
  39. color: var(--accent);
  40. }
  41. a.icon:hover {
  42. text-decoration: none;
  43. }
  44. a:hover {
  45. color: var(--accent) !important;
  46. }
  47. /* Copyright message */
  48. .copyright {
  49. margin: 15px 0;
  50. }
  51. /* Paginator */
  52. .pages {
  53. padding: 15px 0;
  54. }
  55. .pages-icon {
  56. padding: 0 15px;
  57. }
  58. /* List item for posts/projects */
  59. .item {
  60. padding: 10px 0;
  61. }
  62. .item-tag {
  63. background-color: var(--accent);
  64. }
  65. /* Navigation */
  66. .navbar-icon {
  67. width: 1em;
  68. height: 1em;
  69. display: inline-block !important;
  70. }
  71. .navbar-icon.email {
  72. background-image: url('/icons/email.svg');
  73. }
  74. .navbar-icon.twitter {
  75. background-image: url('/icons/twitter.svg');
  76. }
  77. .navbar-icon.git {
  78. background-image: url('/icons/share.svg');
  79. }
  80. nav{
  81. flex: 1 0 auto;
  82. }
  83. /* Colored borders at top/bottom of page */
  84. .navbar.navbar-default {
  85. border-bottom: var(--border-width) solid var(--accent);
  86. }
  87. footer {
  88. flex: 1 0 auto;
  89. border-top: var(--border-width) solid var(--accent);
  90. }
  91. /* helpers */
  92. .right {
  93. text-align: right;
  94. float: right;
  95. }
  96. .left {
  97. text-align: left;
  98. float: left;
  99. }