style.css 4.2 KB

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