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.

130 lines
1.5KB

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