wip: piece icons placement

olzzon · olzzon · commit 53405eeb0ad1 · 2025-03-12T09:19:55.000+01:00
diff --git a/packages/webui/src/client/styles/countdown/director.scss b/packages/webui/src/client/styles/countdown/director.scss
@@ -62,7 +62,6 @@ $hold-status-color: $liveline-timecode-color;
 				6fr / #{'min(13vw, 27vh)'} auto;
 			white-space: nowrap;
 
-
 			.director-screen__body__segment-name {
 				grid-row: 1;
 				grid-column: 1 / -1;
@@ -75,6 +74,8 @@ $hold-status-color: $liveline-timecode-color;
 				vertical-align: middle;
 				color: #fff;
 				position: relative;
+				box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
+				z-index: 1; 
 
 				&.live {
 					background: $general-live-color;
@@ -115,6 +116,7 @@ $hold-status-color: $liveline-timecode-color;
 				grid-row: 2;
 				grid-column: 1;
 				padding: 0em;
+				margin-left: 10px;
 
 				text-align: center;
 				display: flex;
diff --git a/packages/webui/src/client/ui/ClockView/DirectorScreen.tsx b/packages/webui/src/client/ui/ClockView/DirectorScreen.tsx
@@ -439,7 +439,7 @@ function DirectorScreenRender({
 											fontFamily: 'Roboto Flex',
 											fontSize: '2em',
 											minFontSize: 70,
-											maxFontSize: 120,
+											maxFontSize: 100,
 											minLetterSpacing: 2,
 											useVariableFont: true,
 										}}
@@ -517,7 +517,7 @@ function DirectorScreenRender({
 												fontFamily: 'Roboto Flex',
 												fontSize: '2em',
 												minFontSize: 70,
-												maxFontSize: 120,
+												maxFontSize: 100,
 												minLetterSpacing: 2,
 												useVariableFont: true,
 											}}
diff --git a/packages/webui/src/client/ui/PieceIcons/PieceIcons.scss b/packages/webui/src/client/ui/PieceIcons/PieceIcons.scss
@@ -8,45 +8,31 @@ $letter-spacing: 0.02em;
 .piece-icon {
   .camera {
     @include item-type-colors-svg();
-    rx: 4;
-    ry: 4;
   }
 
   .live-speak {
     fill: url(#background-gradient);
-    rx: 4;
-    ry: 4;
   }
 
 
   .graphics {
     @include item-type-colors-svg();
-    rx: 4;
-    ry: 4;
   }
 
   .local {
     @include item-type-colors-svg();
-    rx: 4;
-    ry: 4;
   }
 
   .remote {
     @include item-type-colors-svg();
-    rx: 4;
-    ry: 4;
   }
 
   .vt {
     @include item-type-colors-svg();
-    rx: 4;
-    ry: 4;
   }
 
   .unknown {
     @include item-type-colors-svg();
-    rx: 4;
-    ry: 4;
   }
 
   // Gradient styles for live-speak

Original file line number	Diff line number	Diff line change
`@@ -8,45 +8,31 @@ $letter-spacing: 0.02em;`
`8`	`8`	`.piece-icon {`
`9`	`9`	`.camera {`
`10`	`10`	`@include item-type-colors-svg();`
`11`		`- rx: 4;`
`12`		`- ry: 4;`
`13`	`11`	`}`
`14`	`12`
`15`	`13`	`.live-speak {`
`16`	`14`	`fill: url(#background-gradient);`
`17`		`- rx: 4;`
`18`		`- ry: 4;`
`19`	`15`	`}`
`20`	`16`
`21`	`17`
`22`	`18`	`.graphics {`
`23`	`19`	`@include item-type-colors-svg();`
`24`		`- rx: 4;`
`25`		`- ry: 4;`
`26`	`20`	`}`
`27`	`21`
`28`	`22`	`.local {`
`29`	`23`	`@include item-type-colors-svg();`
`30`		`- rx: 4;`
`31`		`- ry: 4;`
`32`	`24`	`}`
`33`	`25`
`34`	`26`	`.remote {`
`35`	`27`	`@include item-type-colors-svg();`
`36`		`- rx: 4;`
`37`		`- ry: 4;`
`38`	`28`	`}`
`39`	`29`
`40`	`30`	`.vt {`
`41`	`31`	`@include item-type-colors-svg();`
`42`		`- rx: 4;`
`43`		`- ry: 4;`
`44`	`32`	`}`
`45`	`33`
`46`	`34`	`.unknown {`
`47`	`35`	`@include item-type-colors-svg();`
`48`		`- rx: 4;`
`49`		`- ry: 4;`
`50`	`36`	`}`
`51`	`37`
`52`	`38`	`// Gradient styles for live-speak`