X-Git-Url: https://git.sesse.net/?a=blobdiff_plain;f=score.css;h=f35086a616e018e38dd7d5bdc662ac73d341360e;hb=a64de5e1112be71ac6bcca755912c669f6d531f8;hp=01dcbd1b6faf167ba398f1f5a4a687ec0406468b;hpb=fa0675bc762138c265795b881f6b43a52e07d8ab;p=ultimatescore diff --git a/score.css b/score.css index 01dcbd1..f35086a 100644 --- a/score.css +++ b/score.css @@ -1,21 +1,30 @@ * { - -webkit-box-sizing: border-box; - Box-Sizing: border-box; - -webkit-backface-visibility: hidden; - -webkit-transition: translate3d(0,0,0); + box-sizing: border-box; } -html, body { +body { width: 1280px; height: 720px; margin: 0; padding: 0; background: transparent; overflow: hidden; - -webkit-font-smoothing: antialiased !important; + + /* 720p -> 1080p */ + /* transform: scale(1.5); + transform-origin: top left; */ } body { font-family: 'Lato', sans-serif; color: white; + + /* Needs to be adjusted per-font! 2px/4px is a good choice for Exo. */ + --main-padding-top-adjust: 0px; + --main-padding-top-large-adjust: 0px; +} + +#entire-bug { + transform: scale(0.8); + transform-origin: top left; } /* Score */ @@ -32,6 +41,18 @@ body { .scorebug td { border: 1px solid #000; } +.scorebug2 { + /*top: 52px; */ + /* left: 22px; */ + left: 1275px; + top: 13px; + font-size: 20px; +} +#clockbug2 { + left: 1360px; + top: 13px; + font-size: 20px; +} .team1color, .team2color { width: 12px; margin: 5px; @@ -50,16 +71,27 @@ body { text-align: center; height: 35px; background: linear-gradient(to bottom, #00a, #008); + padding-top: var(--main-padding-top-adjust); +} +#score2_team1, #score2_team2 { + background: linear-gradient(to bottom, #00a8, #0088); +} +#score2_team1, #score2_team2, #score2_score { + height: 30px; } .score { text-align: center; background: linear-gradient(to bottom, #00c, #00a); width: 110px; height: 35px; + padding-top: var(--main-padding-top-adjust); +} +#score2_score { + background: linear-gradient(to bottom, #00c8, #00a8); } /* Clock, to the right of score */ -.clockbug { +.clockbug, .clockbug2 { position: fixed; font-size: 25px; left: 352px; @@ -73,8 +105,13 @@ body { background: linear-gradient(to bottom, #00a, #008); text-align: center; height: 35px; + padding-top: var(--main-padding-top-adjust); width: 90px; } +#clock2 { + background: linear-gradient(to bottom, #00a8, #0088); + height: 30px; +} .clockbug-hidden { -webkit-transform:translateX(-200%); } @@ -131,6 +168,9 @@ body { background-image: url(lowerthird-bg.png); color: black; /* padding-top: 20px; */ + display: flex; + align-items: center; + vertical-align: middle; } .lowerthird-headline-hidden { width: 0px; @@ -146,6 +186,7 @@ body { .lowerthird-headline-content { padding-left: 20px; position: absolute; + padding-top: var(--main-padding-top-large-adjust); } .lowerthird-headline-content-hidden { clip: rect(0px,0px,200px,0px); @@ -156,14 +197,15 @@ body { .lowerthird-headline-content-animate-out { -webkit-animation: wipe-in 2.0s ease; clip: rect(0px,0px,200px,0px); + -webkit-animation-fill-mode: both; } .lowerthird-subheading { position: fixed; font-size: 24px; left: 40px; - top: 637px; + top: 638px; height: 40px; - width: 500px; + width: 600px; border-collapse: collapse; white-space: nowrap; border: 1px solid black; @@ -171,6 +213,8 @@ body { align-items: center; */ /*background: linear-gradient(to right, #44c, #33a 15px); */ background-image: url(lowerthird-bg2.png); + display: flex; + align-items: center; } .lowerthird-subheading-hidden { clip: rect(0px,0px,200px,0px); @@ -187,6 +231,7 @@ body { .lowerthird-subheading-content { position: absolute; padding-left: 20px; + padding-top: var(--main-padding-top-adjust); } .lowerthird-subheading-content-hidden { width: 0px; @@ -209,6 +254,10 @@ body { width: 170px; color: black; } +.lowerthird-picture img { + height: 170px; + width: 170px; +} .lowerthird-picture-hidden { width: 0px; border-left: 0px; @@ -237,7 +286,7 @@ body { clip: rect(0px,0px,200px,0px); } -/* these are hidden when actually run in casparcg */ +/* these are hidden when actually run in Nageru */ #area { position: fixed; left: 0px; @@ -285,7 +334,7 @@ body { } #carousel tr { /* background: rgba(0, 0, 170, 0.8); */ - background: linear-gradient(to bottom, rgba(0, 0, 170, 0.8), rgba(0, 0, 130, 0.8)); + background: linear-gradient(to bottom, rgba(0, 0, 170, 0.9), rgba(0, 0, 130, 0.9)); /* -webkit-animation: fade-in calc(counter(rowNumber) * 1.0)s ease; */ -webkit-animation: fade-in calc(counter-value(rowNumber) * 1.0s) ease; } @@ -323,6 +372,25 @@ body { text-transform: none; } +/* roster */ +#carousel .playerpadding { + font-size: 25px; + background: rgba(0,0,0,0); +} +#carousel th.playernum, #carousel .playername { + font-size: 35px; +} +#carousel th.playernum { + text-align: center; + padding-right: 8px; + padding-left: 0px; margin-left: 0px; + width: 80px; +} +#carousel .playername { + text-transform: none; + width: auto; +} + .nplayed, .gd, .pts { text-align: center; } @@ -406,12 +474,12 @@ body { border: 1px solid black; } 100% { - width: 500px; + width: 600px; } } @-webkit-keyframes scale-in-small { 0% { - width: 500px; + width: 600px; border: 1px solid black; } 80% {