index.css 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. *{margin:0;padding:0;}
  2. body{
  3. font-family: monospace;
  4. background: #152730;
  5. box-sizing: border-box;
  6. padding: 25px;
  7. }
  8. h1{
  9. text-align: center;
  10. margin-bottom: 50px;
  11. font-size: 50px;
  12. }
  13. .article{
  14. background: #C4C6C0;
  15. width: 75vw;
  16. box-sizing: border-box;
  17. padding: 50px;
  18. margin: auto;
  19. margin-bottom: 50px;
  20. }
  21. .paragraph{
  22. text-indent: 50px;
  23. margin-bottom: 22px;
  24. text-align: justify;
  25. font-size: 22px;
  26. line-height: 1.8;
  27. }
  28. #createComment{
  29. display: flex;
  30. flex-direction: column;
  31. align-items: center;
  32. width: 75vw;
  33. background: #C4C6C0;
  34. box-sizing: border-box;
  35. margin: auto;
  36. padding: 25px;
  37. margin-bottom: 50px;
  38. }
  39. #createComment > *{
  40. margin: 10px;
  41. }
  42. #createComment label{
  43. display: flex;
  44. flex-direction: column;
  45. width: 60%;
  46. }
  47. #nameInput{
  48. font-size: 16px;
  49. }
  50. #commentInput{
  51. font-size: 16px;
  52. }
  53. #comments{
  54. display: flex;
  55. flex-direction: column;
  56. align-items: center;
  57. width: 75vw;
  58. background: #C4C6C0;
  59. box-sizing: border-box;
  60. margin: auto;
  61. padding-bottom: 25px;
  62. }
  63. #comments > *{
  64. margin: 10px;
  65. }
  66. .comment{
  67. display: flex;
  68. flex-direction: column;
  69. width: 75%;
  70. background: white;
  71. padding: 25px;
  72. }
  73. .comment h3{
  74. font-size: 16px;
  75. }
  76. .comment > div{
  77. display: flex;
  78. justify-content: space-between;
  79. align-items: center;
  80. margin-bottom: 15px;
  81. }
  82. .comment > p{
  83. font-size: 16px;
  84. }