header.css 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. /*
  2. Header
  3. */
  4. header {
  5. display: block;
  6. position: absolute;
  7. z-index: 1000;
  8. top: 0;
  9. left: 0;
  10. right: 0;
  11. height: 40px;
  12. line-height: 40px;
  13. background-color: rgb(48,48,48);
  14. padding: 0 40px;
  15. -webkit-app-region: drag;
  16. }
  17. header.small { height: 24px; line-height: 24px; padding: 0 24px; }
  18. header a, header input[type=input], header input[type=text], header button, header select { -webkit-app-region: no-drag; }
  19. header div.group {
  20. display: inline-block;
  21. }
  22. header div.group a { margin-left: 8px; }
  23. header a.minimize-button, header a.close-button {
  24. position: absolute;
  25. top: 0;
  26. display: block;
  27. width: 40px;
  28. height: 40px;
  29. text-align: center;
  30. text-decoration: none;
  31. color: rgba(255,255,255,0.8);
  32. font-size: 16px;
  33. cursor: pointer;
  34. }
  35. header a.close-button { right: 0; }
  36. header a.minimize-button { right: 40px; }
  37. header.small a.minimize-button { right: 24px; }
  38. header.small a.minimize-button, header.two-lines a.minimize-button,
  39. header.small a.close-button, header.two-lines a.close-button {
  40. width: 24px;
  41. height: 24px;
  42. line-height: 24px;
  43. }
  44. header.small a.minimize-button, header.two-lines a.minimize-button { right: 24px; }
  45. header a.minimize-button:hover, header a.close-button:hover { background-color: rgba(255,255,255,0.1); }
  46. header h1 {
  47. line-height: 40px;
  48. font-size: 12pt;
  49. font-weight: 400;
  50. position: absolute;
  51. left: 16px;
  52. right: 48px;
  53. top: 0;
  54. }
  55. header.small h1 { line-height: 24px; left: 24px; right: 24px; font-size: 10pt; }
  56. header.two-lines {
  57. height: 64px;
  58. }
  59. header.two-lines h1 { line-height: 24px; }
  60. header.two-lines div.buttons-row {
  61. position: absolute;
  62. top: 24px;
  63. left: 16px;
  64. display: block;
  65. height: 40px;
  66. line-height: 40px;
  67. }
  68. header.two-lines .search-row {
  69. position: absolute;
  70. top: 33px;
  71. left: 107px;
  72. right: 0px;
  73. padding: 0 4px;
  74. width: 50%;
  75. }
  76. header.two-lines div.buttons-row span {
  77. display: inline-block;
  78. font-size: 9.5pt;
  79. font-weight: 600;
  80. padding-right: 8px;
  81. }
  82. header.two-lines .select {
  83. vertical-align: middle;
  84. background-color: rgb(32,32,32);
  85. }
  86. header.two-lines .search input[type=text] {
  87. width: 280px;
  88. }
  89. /*
  90. Header Search
  91. */
  92. .search {
  93. display: inline-block;
  94. height: 24px;
  95. border-radius: 12px;
  96. background-color: rgb(64,64,64);
  97. vertical-align: middle;
  98. -webkit-app-region: no-drag;
  99. }
  100. .search i.icon {
  101. vertical-align: top;
  102. font-size: 12px;
  103. display: inline-block;
  104. padding: 0 0 0 8px;
  105. height: 24px;
  106. line-height: 24px;
  107. }
  108. .search .select select {
  109. color: rgb(128,128,128);
  110. border: none;
  111. }
  112. .search .select select option {
  113. border: none;
  114. }
  115. .search input[type=text] {
  116. display: inline-block;
  117. border: none;
  118. width: 320px;
  119. height: 24px;
  120. line-height: 24px;
  121. padding: 0 4px;
  122. margin: 0;
  123. color: rgb(192,192,192);
  124. background-color: transparent;
  125. vertical-align: top;
  126. outline: none;
  127. }
  128. .search button {
  129. border: none;
  130. background-color: transparent;
  131. color: rgb(160,160,160);
  132. display: inline-block;
  133. width: 24px;
  134. height: 24px;
  135. line-height: 24px;
  136. padding: 0;
  137. margin-right: 4px;
  138. cursor: pointer;
  139. vertical-align: top;
  140. }