style.css 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. html,body{
  2. width: 100%;
  3. height: 100%;
  4. padding: 0;
  5. margin: 0;
  6. overflow: hidden;
  7. }
  8. .fill{
  9. width: 100%;
  10. height: 100%;
  11. }
  12. .table{
  13. display: table;
  14. }
  15. .table-row{
  16. display: table-row;
  17. }
  18. .table-caption{
  19. display: table-caption;
  20. }
  21. .table-cell{
  22. display: table-cell;
  23. }
  24. .table-column{
  25. display: table-column;
  26. }
  27. .table-column-group{
  28. display: table-column-group;
  29. }
  30. .table-footer-group{
  31. display: table-footer-group;
  32. }
  33. .table-row-group{
  34. display: table-row-group;
  35. }
  36. .table-header-group{
  37. display: table-header-group;
  38. }
  39. #main{
  40. position: fixed;
  41. top: 0;
  42. left: 0;
  43. }
  44. #head{
  45. height: 20px;
  46. border-bottom-style: solid;
  47. transition: height 0.3s;
  48. }
  49. #head:hover{
  50. height: 50px;
  51. }
  52. #content{
  53. width: 100%;
  54. height: 100%;
  55. border-top-style: solid;
  56. border-bottom-style: solid;
  57. }
  58. #users{
  59. position: absolute;
  60. right: 0;
  61. bottom: 0;
  62. background-color: white;
  63. border-left-style: solid;
  64. width: 36px;
  65. height: 18px;
  66. margin-top: -1px;
  67. border-top-style: solid;
  68. transition: width 0.5s, height 0.5s;
  69. }
  70. #users:hover{
  71. width: 150px;
  72. height: 100%;
  73. z-index: 10;
  74. }
  75. #entry{
  76. width: 100%;
  77. border-top-style: solid;
  78. height: 18px;
  79. }
  80. #input{
  81. width: calc(100% - 74px);
  82. height: 16px;
  83. margin: 0;
  84. padding: 1px;
  85. border-style: none;
  86. background-color: grey;
  87. clear: none;
  88. position: absolute;
  89. bottom: 0;
  90. left: 0;
  91. }
  92. #send{
  93. clear: none;
  94. position: absolute;
  95. bottom: 0;
  96. right: 36px;
  97. width: 36px;
  98. border-style: none;
  99. border-left-style: solid;
  100. background-color: white;
  101. transition: background-color 0.2s;
  102. }
  103. #send:hover{
  104. background-color: grey;
  105. }
  106. #content,#head,#users,#entry,#input,#send{
  107. border-color: black;
  108. border-width: 1px;
  109. }