.path-local-treestudyplan { font: inherit; --border-color: #ccc; --conditions-bgcolor: #e7e7e7; --courseresult-bgcolor: white; --studentinfo-bgcolor: white; table.q-studyplanreport { table-layout: fixed; width: calc((2 * 12rem) + (var(--resultColCount) * 4rem)); colgroup.q-col-studentinfo { col.q-name { width: 14rem; } col.q-lastaccess { width: 10rem; } } colgroup.q-col-resultinfo { col { width: 4rem; } } } .q-header { background-color: var(--courseresult-bgcolor); .q-period-heading, .q-line-heading, .q-item-heading, .q-condition-heading { border-right: 1px solid var(--border-color); border-top: 1px solid var(--border-color); padding: 0.5rem; } .q-period-heading, .q-line-heading, .q-item-heading, .q-condition-heading.overall, .q-result.overall { background-color: var(--courseresult-bgcolor); } .q-period-heading.collapsed { width: 6rem; } .q-result { height: 2rem; padding-top: 0.25rem; } .q-line-heading, .q-condition-heading { overflow: hidden; width: 2rem; writing-mode: vertical-rl; text-orientation: sideways; .q-chevron { text-orientation: initial; writing-mode: horizontal-tb; } } .q-period-heading, .q-line-heading, .q-condition-heading { vertical-align: top; } .q-item-heading { vertical-align: top; width: 2rem; } .q-line-heading > .q-wrap { display: inline-block; height: 7rem; } .q-item-heading > .q-wrap { display: flex; height: 10rem; white-space: nowrap; flex-direction: column; overflow: hidden; gap: 2px; > * { min-height: 0; } > .q-toggle { width: 100%; text-align: center; } > .q-title { flex: 1 0 0; margin-left: auto; margin-right: auto; overflow: hidden; writing-mode: vertical-rl; text-orientation: sideways; hyphens: auto; width: 100%; display: flex; justify-content: center; align-items: center; padding-bottom: 0.5rem; } } .q-condition-heading { > span.q-wrap { display: inline-block; height: 8rem; } text-align: left; background: var(--conditions-bgcolor); } a.q-condition-label { text-decoration-line: underline; text-decoration-style: dotted; cursor: pointer; color: inherit; /* Don't force a color on this link */ } .q-studentinfo { padding: 0.5em; border: 1px solid var(--border-color); width: 12rem; background-color: var(--studentinfo-bgcolor); vertical-align: bottom; font-weight: normal; &.q-name { white-space: nowrap; } } } .q-groupheading { td, th { &:first-child { border-right: none; } &:last-child { border-left: none; } background-color: var(--studentinfo-bgcolor); padding: 0.5em; border: 1px solid var(--border-color); } } .q-inforow { td, th { background-color: var(--studentinfo-bgcolor); padding: 0.5em; border: 1px solid var(--border-color); } } .q-student-results { &.odd td { background-color: var(--light); &.q-result { background-color: var(--light); } } .q-result { text-align: center; vertical-align: middle; border: 1px solid var(--border-color); width: 4rem; padding-left: 0.25rem; padding-right: 0.25rem; background-color: var(--conditions-bgcolor); &.overall, &.collapsed { background-color: var(--courseresult-bgcolor); } &.collapsed { border-top: none; border-bottom: none; } } .q-studentinfo { padding: 0.5em; border: 1px solid var(--border-color); width: 12rem; background-color: var(--studentinfo-bgcolor); } .q-courseresult, .q-conditionresult { i.fa { font-size: 21px; vertical-align: middle; } } .q-conditionresult { font-size: 1.2rem; display: inline-block; width: 100%; } } .q-pageperiodselection { margin-left: 0; margin-bottom: 1em; margin-top: 1em; padding-left: 0; position: relative; .row { margin-top: 0.5rem; } select.custom-select { width: 100%; } .q-label { position: relative; top: 0.5em; } } }