FC-softwares/baseball-scoreboard

@import prevents parallel downloads, use  instead.
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap');
 
/* Global variables */
Rule is empty.
:root {
    /* Scoreboard widths */
Expected RBRACE at line 6, col 5.
    --w-role: 100px;
Expected RBRACE at line 7, col 5.
    --w-name: 500px;
Expected RBRACE at line 8, col 5.
    --w-column: calc(var(--w-role) + var(--w-name));
    /* Scoreboard row height */
Expected RBRACE at line 10, col 5.
    --h-row: 50px;
    /* Umpires row height */
Expected RBRACE at line 12, col 5.
    --h-row-HB: var(--h-row);
Expected RBRACE at line 13, col 5.
    --h-row-1B: var(--h-row);
Expected RBRACE at line 14, col 5.
    --h-row-2B: var(--h-row);
Expected RBRACE at line 15, col 5.
    --h-row-3B: var(--h-row);
    /* Scorers row height */
Expected RBRACE at line 17, col 5.
    --h-row-head: var(--h-row);
Expected RBRACE at line 18, col 5.
    --h-row-second: var(--h-row);
Expected RBRACE at line 19, col 5.
    --h-row-third: var(--h-row);
    /* Gradients (please don't edit them) */
Expected RBRACE at line 21, col 5.
    --g-def-w: linear-gradient(0deg, rgba(213,213,213,1) 0%, rgba(255,255,255,1) 100%);
Expected RBRACE at line 22, col 5.
    --g-def-b: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(255,255,255,0.4) 100%), rgb(0, 0, 0);
    /* Delays */
Expected RBRACE at line 24, col 5.
    --d-standard: 0.75s;
    /* Deactivasion delays Umpires */
Expected RBRACE at line 26, col 5.
    --d-d-3B: 0s;
Expected RBRACE at line 27, col 5.
    --d-d-2B: var(--d-standard);
Expected RBRACE at line 28, col 5.
    --d-d-2B-calc: calc(var(--d-d-2B) + var(--d-d-3B));
Expected RBRACE at line 29, col 5.
    --d-d-1B: var(--d-standard);
Expected RBRACE at line 30, col 5.
    --d-d-1B-calc: calc(var(--d-d-1B) + var(--d-d-2B-calc));
Expected RBRACE at line 31, col 5.
    --d-d-HB: var(--d-standard);
Expected RBRACE at line 32, col 5.
    --d-d-HB-calc: calc(var(--d-d-HB) + var(--d-d-1B-calc));
Expected RBRACE at line 33, col 5.
    --d-d-header: var(--d-standard);
Expected RBRACE at line 34, col 5.
    --d-d-header-calc: calc(var(--d-d-header) + var(--d-d-HB-calc));
 
    /* Activation delays Umpires */
Expected RBRACE at line 37, col 5.
    --d-header: 0s;
Expected RBRACE at line 38, col 5.
    --d-HB: var(--d-standard);
Expected RBRACE at line 39, col 5.
    --d-HB-calc: calc(var(--d-HB) + var(--d-header));
Expected RBRACE at line 40, col 5.
    --d-1B: var(--d-standard);
Expected RBRACE at line 41, col 5.
    --d-1B-calc: calc(var(--d-1B) + var(--d-HB));
Expected RBRACE at line 42, col 5.
    --d-2B: var(--d-standard);
Expected RBRACE at line 43, col 5.
    --d-2B-calc: calc(var(--d-2B) + var(--d-1B-calc));
Expected RBRACE at line 44, col 5.
    --d-3B: var(--d-standard);
Expected RBRACE at line 45, col 5.
    --d-3B-calc: calc(var(--d-3B) + var(--d-2B-calc));
 
    /* Deactivasion delays Scorers */
Expected RBRACE at line 48, col 5.
    --d-d-third: 0s;
Expected RBRACE at line 49, col 5.
    --d-d-second: var(--d-standard);
Expected RBRACE at line 50, col 5.
    --d-d-second-calc: calc(var(--d-d-second) + var(--d-d-third));
Expected RBRACE at line 51, col 5.
    --d-d-head: var(--d-standard);
Expected RBRACE at line 52, col 5.
    --d-d-head-calc: calc(var(--d-d-head) + var(--d-d-second-calc));
Expected RBRACE at line 53, col 5.
    --d-d-header-s: var(--d-standard);
Expected RBRACE at line 54, col 5.
    --d-d-header-s-calc: calc(var(--d-d-header-s) + var(--d-d-head-calc));
 
    /* Activation delays Scorers */
Expected RBRACE at line 57, col 5.
    --d-header-s: 0s;
Expected RBRACE at line 58, col 5.
    --d-head: var(--d-standard);
Expected RBRACE at line 59, col 5.
    --d-head-calc: calc(var(--d-head) + var(--d-header-s));
Expected RBRACE at line 60, col 5.
    --d-second: var(--d-standard);
Expected RBRACE at line 61, col 5.
    --d-second-calc: calc(var(--d-second) + var(--d-head-calc));
Expected RBRACE at line 62, col 5.
    --d-third: var(--d-standard);
Expected RBRACE at line 63, col 5.
    --d-third-calc: calc(var(--d-third) + var(--d-second-calc));
}
 
/* Standards */
Rule doesn't have all its properties in alphabetical order.
html {
    width: min-content;
    background-color: transparent;
}
Rule doesn't have all its properties in alphabetical order.
body {
    margin: 0;
    width: fit-content;
    overflow: hidden;
}
div {
    display: grid;
}
 
.scoreboard {
    font-family: 'Poppins', sans-serif;
    font-size: calc(var(--h-row) * 0.6);
}
 
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard#umpires {
    grid-template-rows: var(--h-row) var(--h-row-HB) var(--h-row-1B) var(--h-row-2B) var(--h-row-3B);
    grid-template-columns: var(--w-role) var(--w-name);
    display: grid;
    grid-template-areas:
        "Header Header"
        "RoleHB NameHB"
        "Role1B Name1B"
        "Role2B Name2B"
        "Role3B Name3B";
Expected ( |  |  | auto) but found 'var(--w-column)'.
    width: var(--w-column);
    height: calc(var(--h-row) + var(--h-row-HB) + var(--h-row-1B) + var(--h-row-2B) + var(--h-row-3B));
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard#scorers {
    grid-template-columns: calc(var(--w-role) + var(--w-name));
    grid-template-rows:  var(--h-row) var(--h-row-head) var(--h-row-second) var(--h-row-third);
    display: grid;
    grid-template-areas:
        "Header"
        "Head"
        "Second"
        "Third";
Expected ( |  |  | auto) but found 'var(--w-column)'.
    width: var(--w-column);
    height: calc(var(--h-row) + var(--h-row-head) + var(--h-row-second) + var(--h-row-third));
}
 
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard#commentator {
    grid-template-columns: var(--w-column);
    grid-template-rows:  var(--h-row);
    display: grid;
    grid-template-areas:
        "Header"
        "Commentator";
Expected ( |  |  | auto) but found 'var(--w-column)'.
    width: var(--w-column);
    height: calc(var(--h-row) + var(--h-row));
}
 
.scoreboard > div {
    align-items: center;
    text-align: center;
}
 
/* Team name */
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .header {
    background: var(--g-def-b);
    color: white;
Expected ( |  |  | auto) but found 'fit-parent'.
    width: fit-parent;
Expected ( |  |  | auto) but found 'var(--w-column)'.
    width: var(--w-column);
Expected ( | ) but found 'var(--h-row)'.
    height: var(--h-row);
    display: flex;
    align-items: center;
    justify-content: center;
    grid-area: Header;
    border-radius: 7px 7px 0 0;
    transition: transform cubic-bezier(0.18, 0.89, 0.33, 1) 1s;
    transform: none;
    position: relative;
    z-index: 5;
}
Adjoining classes: .scoreboard.disabled > .name
Adjoining classes: .scoreboard.disabled > .header
Adjoining classes: .scoreboard.disabled > .scorer
Adjoining classes: .scoreboard.disabled > .role
.scoreboard.disabled > .header, .scoreboard.disabled > .role, .scoreboard.disabled > .name, .scoreboard.disabled > .scorer {
    transform: translateY(-350px);
    transition: transform cubic-bezier(0.67, 0, 0.82, 0.11) 1s;
}
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .role {
    background: var(--g-def-w);
Expected ( |  |  | auto) but found 'fit-parent'.
    width: fit-parent;
Expected ( |  |  | auto) but found 'var(--w-role)'.
    width: var(--w-role);
Expected ( | ) but found 'var(--h-row)'.
    height: var(--h-row);
    display: flex;
Expected (flex-start | flex-end | center | baseline | stretch) but found 'right'.
    align-items: right;
    justify-content: center;
    transform: none;
    transition: transform cubic-bezier(0.18, 0.89, 0.33, 1) 1s;
    position: relative;
}
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .name {
    background: var(--g-def-w);
    width: calc(var(--w-name) - 20px);
Expected ( | ) but found 'var(--h-row)'.
    height: var(--h-row);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 10px;
    padding-right: 10px;
    transform: none;
    transition: transform cubic-bezier(0.18, 0.89, 0.33, 1) 1s;
    position: relative;
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .role#home {
    grid-area: RoleHB;
    z-index: 4;
Expected ( | ) but found 'var(--h-row-HB)'.
    height: var(--h-row-HB);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .role#B1 {
    grid-area: Role1B;
    z-index: 3;
Expected ( | ) but found 'var(--h-row-1B)'.
    height: var(--h-row-1B);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .role#B2 {
    grid-area: Role2B;
    z-index: 2;
Expected ( | ) but found 'var(--h-row-2B)'.
    height: var(--h-row-2B);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .role#B3 {
    grid-area: Role3B;
    z-index: 1;
Expected ( | ) but found 'var(--h-row-3B)'.
    height: var(--h-row-3B);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .name#home {
    grid-area: NameHB;
    z-index: 4;
Expected ( | ) but found 'var(--h-row-HB)'.
    height: var(--h-row-HB);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .name#B1 {
    grid-area: Name1B;
    z-index: 3;
Expected ( | ) but found 'var(--h-row-1B)'.
    height: var(--h-row-1B);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .name#B2 {
    grid-area: Name2B;
    z-index: 2;
Expected ( | ) but found 'var(--h-row-2B)'.
    height: var(--h-row-2B);
}
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .name#B3 {
    grid-area: Name3B;
    z-index: 1;
Expected ( | ) but found 'var(--h-row-3B)'.
    height: var(--h-row-3B);
}
Adjoining classes: .scoreboard.disabled > .header
.scoreboard.disabled > .header{
    transition-delay: var(--d-d-header-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > #home
.scoreboard.disabled > #home{
    transition-delay: var(--d-d-HB-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > #B1
.scoreboard.disabled > #B1{
    transition-delay: var(--d-d-1B-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > #B2
.scoreboard.disabled > #B2{
    transition-delay: var(--d-d-2B-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > #B3
.scoreboard.disabled > #B3{
    transition-delay: var(--d-d-3B);
}
.scoreboard > .header {
    transition-delay: var(--d-header);
}
Don't use IDs in selectors.
.scoreboard > #home {
    transition-delay: var(--d-HB-calc);
}
Don't use IDs in selectors.
.scoreboard > #B1 {
    transition-delay: var(--d-1B-calc);
}
Don't use IDs in selectors.
.scoreboard > #B2 {
    transition-delay: var(--d-2B-calc);
}
Don't use IDs in selectors.
.scoreboard > #B3 {
    transition-delay: var(--d-3B-calc);
}
Adjoining classes: .scoreboard > .name.notActive
Adjoining classes: .scoreboard > .role.notActive
.scoreboard > .name.notActive, .scoreboard > .role.notActive {
    display: none;
}
Adjoining classes: .scoreboard > .role.last
.scoreboard > .role.last {
    border-radius: 0 0 0 7px;
}
Adjoining classes: .scoreboard > .name.last
.scoreboard > .name.last {
    border-radius: 0 0 7px;
}
 
/* Scorers */
Rule doesn't have all its properties in alphabetical order.
.scoreboard > .scorer {
    background: var(--g-def-w);
Expected ( |  |  | auto) but found 'fit-parent'.
    width: fit-parent;
    width: calc(var(--w-column) - 20px);
Expected ( | ) but found 'var(--h-row)'.
    height: var(--h-row);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 10px;
    padding-right: 10px;
    transform: none;
    transition: transform cubic-bezier(0.18, 0.89, 0.33, 1) 1s;
    position: relative;
}
Don't use IDs in selectors.
.scoreboard > .scorer#head {
    grid-area: Head;
    transition-delay: var(--d-head-calc);
    z-index: 3;
}
Don't use IDs in selectors.
.scoreboard > .scorer#second {
    grid-area: Second;
    transition-delay: var(--d-second-calc);
    z-index: 2;
}
Don't use IDs in selectors.
.scoreboard > .scorer#third {
    grid-area: Third;
    transition-delay: var(--d-third-calc);
    z-index: 1;
}
Don't use IDs in selectors.
.scoreboard#scorers > .header {
    transition-delay: var(--d-header-s);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled#scorers > .header
.scoreboard.disabled#scorers > .header {
    transition-delay: var(--d-d-header-s-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > .scorer#head
.scoreboard.disabled > .scorer#head {
    transition-delay: var(--d-d-head-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > .scorer#second
.scoreboard.disabled > .scorer#second {
    transition-delay: var(--d-d-second-calc);
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled > .scorer#third
.scoreboard.disabled > .scorer#third {
    transition-delay: var(--d-d-third);
}
Adjoining classes: .scoreboard > .scorer.notActive
.scoreboard > .scorer.notActive {
    display: none;
}
 
Adjoining classes: .scoreboard > .scorer.last
.scoreboard > .scorer.last{
    border-radius: 0 0 7px 7px;
}
 
/* Commentators */
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard#commentator > .commentator {
    background: var(--g-def-w);
    width: calc(var(--w-column) - 20px);
Expected ( | ) but found 'var(--h-row)'.
    height: var(--h-row);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 10px;
    padding-right: 10px;
    grid-area: Commentator;
    z-index: 0;
    transition: transform cubic-bezier(0.18, 0.89, 0.33, 1) 1s;
Use of !important
    transition-delay: var(--d-standard) !important;
    transform: none;
    position: static;
    border-radius: 0 0 7px 7px;
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled#commentator > .commentator
Rule doesn't have all its properties in alphabetical order.
.scoreboard.disabled#commentator > .commentator{
Use of !important
    transition: transform cubic-bezier(0.67, 0, 0.82, 0.11) 1s !important;
Use of !important
    transition-delay: 0s !important;
Use of !important
    transform: translateY(-500%) !important;
    border-radius: 0 0 7px 7px;
}
 
Don't use IDs in selectors.
.scoreboard#commentator > .header {
    transition-delay: 0s;
}
Don't use IDs in selectors.
Adjoining classes: .scoreboard.disabled#commentator > .header
.scoreboard.disabled#commentator > .header {
    transition-delay: var(--d-standard);
}
 
Don't use IDs in selectors.
Rule doesn't have all its properties in alphabetical order.
.scoreboard > #bg > span {
    background: var(--g-def-w);
    color: black;
Expected (#) but found 'text'.
    background-clip: text;
}