small style fixes + defaults

- remove unused code in collapse atom
- stop text input from creating new line
- clean overflow
- restyle lock button
- restyle action buttons
- 10 second default on paginator
- Pip shows running timer

client/src/features/editors/Editor.module.css

@@ -18,11 +18,12 @@
 /* 2/3 window, hide previews */
 @media (max-width: 1250px) and (min-height: 700px) {
   .mainContainer {
+    height: 100%;
     grid-template-rows: 1fr 1fr;
     grid-template-columns: 48em 1fr 1fr;
-    grid-template-areas:
+    /* grid-template-areas:
       'even play sett'
-      'even mess sett';
+      'even mess sett'; */
   }
 
   .info {
@@ -40,6 +41,11 @@
       'play';
   }
 
+  .messages,
+  .playback {
+    min-width: 31em;
+  }
+
   .editor,
   .info,
   .settings {

client/src/features/editors/list/ActionButtons.jsx

@@ -17,7 +17,7 @@ export default function ActionButtons(props) {
         aria-label='Options'
         size='xs'
         icon={<FiZap />}
-        _expanded={{ bg: 'pink.300', color: 'white' }}
+        _expanded={{ bg: 'orange.300', color: 'white' }}
         _focus={{ boxShadow: 'none' }}
         backgroundColor={'orange.200'}
         color={'orange.500'}

client/src/features/menu/MenuActionButtons.jsx

@@ -23,7 +23,7 @@ export default function MenuActionButtons(props) {
         aria-label='Options'
         size={props.size || 'xs'}
         icon={<FiZap />}
-        _expanded={{ bg: 'pink.300', color: 'white' }}
+        _expanded={{ bg: 'orange.300', color: 'white' }}
         _focus={{ boxShadow: 'none' }}
         backgroundColor={'orange.200'}
         color={'orange.500'}

client/src/features/viewers/backstage/StageManager.jsx

@@ -42,7 +42,7 @@ export default function StageManager(props) {
   // Format messages
   const showPubl = publ.text !== '' && publ.visible;
   let stageTimer = formatDisplay(Math.abs(time.running), true);
-  if (time.running < 0) stageTimer = '-' + stageTimer;
+  if (time.running < 0) stageTimer = `-${stageTimer}`;
 
   // motion
   const titleVariants = {

client/src/features/viewers/production/Pip.jsx

@@ -51,11 +51,8 @@ export default function Pip(props) {
   // Format messages
   const showInfo =
     general.backstageInfo !== '' && general.backstageInfo != null;
-
-  const stageTimer =
-    time.currentSeconds != null && !isNaN(time.currentSeconds)
-      ? formatDisplay(time.currentSeconds, true)
-      : '';
+  let stageTimer = formatDisplay(Math.abs(time.running), true);
+  if (time.running < 0) stageTimer = `-${stageTimer}`;
 
   return (
     <div className={style.container__gray}>