style.css 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222
  1. :root {
  2. --w-70: 70%;
  3. --primary-color: #1c4587;
  4. --bg-grey: #EDEEF1;
  5. }
  6. /* login css */
  7. .login-container {
  8. background-color: var(--bg-grey);
  9. }
  10. .login-header {
  11. font-size: 30px;
  12. font-weight: 100;
  13. }
  14. .login-form {
  15. padding: 50px;
  16. }
  17. .login-form label {
  18. font-size: 14px;
  19. color: #454859;
  20. }
  21. .login-form .form-control {
  22. height: calc(1.5em + 0.75rem + 0.3px);;
  23. }
  24. .bg-holder {
  25. background-color: #bbb;
  26. }
  27. .login-container .logo {
  28. font-size: 35px;
  29. font-weight: 800;
  30. color: #F7941E;
  31. }
  32. .login-container small {
  33. font-size: 12px;
  34. color: #999;
  35. }
  36. /* end of login */
  37. .w-70 {
  38. width: var(--w-70);
  39. }
  40. .stag-primary-bg {
  41. background-color: var(--primary-color) !important;
  42. color: #fff;
  43. }
  44. .stag-primary-border {
  45. border-color: var(--primary-color) !important;
  46. }
  47. .navbar-brand {
  48. font-size: 25px;
  49. font-weight: 900;
  50. }
  51. .nav-item {
  52. margin-right: 10px;
  53. }
  54. .navbar-dark .nav-item .nav-link {
  55. color: #fff;
  56. }
  57. .dropdown-menu {
  58. margin-top: 7px;
  59. border-radius: 0;
  60. }
  61. .dropdown-item:not(:last-child) {
  62. border-bottom:1px solid #ddd;
  63. }
  64. main {
  65. padding:0 1rem;
  66. }
  67. /* ability to toggle the video pane (rhs) */
  68. .stag_rhs_toggle, .stag_rhs_toggle:hover {
  69. position: fixed;
  70. bottom: 0;
  71. right: 0;
  72. padding: 0.25rem 0.75rem;
  73. border-top-left-radius: 6px;
  74. background-color: var(--primary-color);
  75. color: #fff;
  76. z-index: 2;
  77. }
  78. body.stag_rhs_collapsed .v-split,
  79. body.stag_rhs_collapsed .app-right-panel {
  80. display: none !important;
  81. }
  82. .delete-column {
  83. width: 60px;
  84. }
  85. .m-negator {
  86. margin-left: -1.25rem !important;
  87. margin-right: -1.25rem !important;
  88. }
  89. .pl-3-5 {
  90. padding-left: 1.25rem !important;
  91. }
  92. .lh-24px {
  93. height: 24px;
  94. line-height: 24px;
  95. }
  96. .mcp-theme-1 *:not(i) {
  97. font-family: Verdana, sans-serif;
  98. font-size: 13px;
  99. }
  100. .mcp-theme-1 .font-size-11 {
  101. font-size: 11px;
  102. }
  103. .mcp-theme-1 .font-size-13 {
  104. font-size: 13px;
  105. }
  106. .mcp-theme-1 .font-underline {
  107. text-decoration: underline;
  108. }
  109. .mcp-theme-1 .on-hover-opaque {
  110. opacity: 0.6;
  111. }
  112. .mcp-theme-1 .on-hover-opaque:hover {
  113. opacity: 1;
  114. }
  115. .mcp-theme-1 a, .mcp-theme-1 a:link {
  116. color: rgb(13, 89, 175);
  117. }
  118. .mcp-theme-1 .btn.btn-primary {
  119. background: rgb(13, 89, 175);
  120. border-color: rgb(13, 89, 175);
  121. box-shadow: none;
  122. }
  123. .mcp-theme-1 .nav-item {
  124. margin: 0;
  125. }
  126. .mcp-theme-1 .nav-link:hover {
  127. background: #e3e3e394;
  128. }
  129. .mcp-theme-1 .text-sm {
  130. font-size: 85%;
  131. }
  132. .mcp-theme-1 .text-sm-incl-children,
  133. .mcp-theme-1 .text-sm-incl-children *:not(i) {
  134. font-size: 0.8rem;
  135. }
  136. .mcp-theme-1 .minutes-label {
  137. width: 40px;
  138. }
  139. .mcp-theme-1 .memo-textarea {
  140. min-width: 200px;
  141. height: 60px;
  142. }
  143. .main-row {
  144. display: flex;
  145. flex-wrap: nowrap;
  146. margin-right: -15px;
  147. margin-left: -15px;
  148. }
  149. .main-row > .sidebar {
  150. width: 180px;
  151. min-width: 180px;
  152. }
  153. .main-row > main {
  154. flex-grow: 1;
  155. }
  156. html, body {
  157. height: 100%;
  158. }
  159. body>nav.navbar {
  160. height: 55px;
  161. }
  162. .stag-content {
  163. height: calc(100% - 55px);
  164. }
  165. .moe-disabled[moe] {
  166. cursor: not-allowed;
  167. }
  168. .moe-disabled[moe] [start][show] {
  169. opacity: 0.5;
  170. pointer-events: none;
  171. }
  172. .mcp-theme-1 .stag-no-wrap-td {
  173. max-width: 260px;
  174. }
  175. .mcp-theme-1 .stag-no-wrap {
  176. max-width: 250px;
  177. overflow: hidden;
  178. text-overflow: ellipsis;
  179. white-space: nowrap;
  180. display: block;
  181. }
  182. .mcp-theme-1 .form-control.form-control-sm {
  183. min-width: 200px;
  184. }
  185. .mcp-theme-1 .min-width-200px {
  186. min-width: 200px;
  187. }
  188. .mcp-theme-1 .max-width-300px {
  189. max-width: 300px;
  190. }
  191. .cancelled-item {
  192. opacity: 0.5;
  193. }
  194. .cancelled-item:not(.always-clickable) * {
  195. pointer-events: none;
  196. }
  197. .note-content {
  198. max-height: 300px;
  199. overflow-y: auto;
  200. }
  201. .note-content:not([auto-edit]) {
  202. padding: 1rem;
  203. padding-bottom: 0;
  204. cursor: pointer;
  205. position: relative;
  206. }
  207. .note-content:not(.cancelled):not([auto-edit]):not(.readonly):before {
  208. content: '(click to change)';
  209. display: block;
  210. color: #535353;
  211. padding-bottom: 0.3rem;
  212. }
  213. .mcp-theme-1 .ql-container, .mcp-theme-1 .ql-toolbar {
  214. border-left: 0;
  215. border-right: 0;
  216. }
  217. .mcp-theme-1 .ql-editor[contenteditable] {
  218. min-height: 120px;
  219. }