meeting.css 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. html, body {
  2. background-color: #fff;
  3. color: #636b6f;
  4. font-family: 'Nunito', sans-serif;
  5. font-weight: 200;
  6. height: 100vh;
  7. margin: 0;
  8. }
  9. h1 {
  10. color: #555;
  11. width: 50%;
  12. text-align: center;
  13. }
  14. @media (max-width: 900px) {
  15. h1 {
  16. width: auto;
  17. text-align: center;
  18. font-size: 2rem;
  19. text-shadow: 1px 1px 2px #c0e4e2;
  20. }
  21. }
  22. @media (max-width: 400px) {
  23. h1 {
  24. font-size: 1.75rem;
  25. text-shadow: 1px 1px 2px #c0e4e2;
  26. }
  27. }
  28. .form-container {
  29. width: 50%;
  30. margin-right: auto;
  31. }
  32. @media (max-width: 900px) {
  33. .form-container {
  34. margin: auto;
  35. width: 100%;
  36. }
  37. }
  38. .form-container .form {
  39. background: #ffffffd1;
  40. max-width: 400px;
  41. margin: auto;
  42. border-radius: 4px;
  43. }
  44. .form-container .form h3 {
  45. font-size: 1.3rem;
  46. }
  47. .border-success {
  48. border-color: #44bdad85 !important;
  49. }
  50. .text-dark {
  51. color: #555;
  52. font-weight: 600;
  53. }
  54. .form-container .form input {
  55. border-color: #44bdad85 !important;
  56. }
  57. .form-container .form input:focus {
  58. box-shadow: 0 0 0 0.2rem #44bdad85;
  59. }
  60. .form-container .form input.has-error {
  61. border-color: #bd424285 !important;
  62. }
  63. .form-container .form input.has-error:focus {
  64. box-shadow: 0 0 0 0.2rem #bd444454;
  65. }
  66. .field-error {
  67. font-size: 0.9rem;
  68. font-weight: 600;
  69. padding-left: 0.75rem;
  70. margin-top: 0.25rem;
  71. }
  72. .main-view {
  73. width: 800px;
  74. height: 600px;
  75. margin: 0 1rem;
  76. background: #444;
  77. border-radius: 3px;
  78. }
  79. .tp-bar {
  80. width: 120px;
  81. }
  82. .tp-bar .tp-item {
  83. padding-top: 1rem;
  84. padding-bottom: 0.5rem;
  85. border: 0.3rem solid transparent;
  86. }
  87. .tp-bar .tp-item.active {
  88. border: 0.3rem solid #44bdad85;
  89. }
  90. .avatar {
  91. margin: auto;
  92. width: 80px;
  93. height: 80px;
  94. display: flex;
  95. align-items: center;
  96. justify-content: center;
  97. border-radius: 100%;
  98. font-size: 2rem;
  99. font-weight: 600;
  100. }
  101. .invite-image {
  102. width: 80px;
  103. margin: auto;
  104. display: block;
  105. }
  106. .text-single {
  107. white-space: nowrap;
  108. text-overflow: ellipsis;
  109. overflow: hidden;
  110. }