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.

layout.html 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Microblog Admin</title>
  7. <style>
  8. * {
  9. box-sizing: border-box;
  10. margin: 0;
  11. padding: 0;
  12. }
  13. body {
  14. background: #aab5a9;
  15. color: #000;
  16. font-family: Verdana, Geneva, Tahoma, sans-serif;
  17. font-size: 12px;
  18. }
  19. a {
  20. color: #000;
  21. }
  22. a:hover {
  23. text-decoration: none;
  24. }
  25. .header,
  26. .container {
  27. margin: auto;
  28. max-width: 800px;
  29. padding: 1em;
  30. }
  31. .form__field {
  32. margin: 1em 0;
  33. }
  34. .form__label {
  35. display: block;
  36. margin-bottom: 0.5em;
  37. }
  38. .form__textarea,
  39. .form__text-field {
  40. font-family: Verdana, Geneva, Tahoma, sans-serif;
  41. font-size: 12px;
  42. padding: 0.25em;
  43. width: 100%;
  44. }
  45. .form__textarea {
  46. height: 200px;
  47. resize: vertical;
  48. }
  49. .form__button {
  50. padding: 0.25em 1em;
  51. }
  52. .post {
  53. margin: 3em 0;
  54. }
  55. .post__heading {
  56. background: white;
  57. border: 1px solid #383e37;
  58. display: flex;
  59. font-size: 12px;
  60. font-style: italic;
  61. justify-content: space-between;
  62. margin-bottom: 1em;
  63. padding: 0.5em;
  64. }
  65. .post__link {
  66. font-style: normal;
  67. font-weight: normal;
  68. }
  69. .post__body {
  70. border-top: none;
  71. padding: 0.5em;
  72. }
  73. .error {
  74. color: #942626;
  75. text-align: center;
  76. }
  77. .error__heading {
  78. margin: 2em 0 1em;
  79. }
  80. .error__message {
  81. font-size: 18px;
  82. }
  83. @media (max-width: 500px) {
  84. .form__button {
  85. width: 100%;
  86. }
  87. }
  88. </style>
  89. </head>
  90. <body>
  91. <header class="header">
  92. {% if logged_in %}
  93. <a href="/logout">logout</a>
  94. {% endif %}
  95. </header>
  96. <div class="container">
  97. {% block content %} {% endblock %}
  98. </div>
  99. </body>
  100. </html>