From 6839831af54cd9302119bcc3bffafe10475958d4 Mon Sep 17 00:00:00 2001 From: Florian Fischer Date: Mon, 3 Aug 2026 14:31:25 +0200 Subject: refactor project structure * merge sites into single project root * fix name of mass-graduation site * enable typescript support --- mass-graduation.css | 186 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 186 insertions(+) create mode 100644 mass-graduation.css (limited to 'mass-graduation.css') diff --git a/mass-graduation.css b/mass-graduation.css new file mode 100644 index 0000000..5de091b --- /dev/null +++ b/mass-graduation.css @@ -0,0 +1,186 @@ +#group-selection-container { + margin: 0.2rem; +} + +#group-selection-search-container { + position: relative; +} + +#group-selection { + box-sizing: border-box; + width: 100%; + padding: 0.75rem 2.5rem 0.75rem 1rem; + margin-bottom: 1.5rem; + border: 1px solid #ddd; + border-radius: 5pt; + font-size: 1.5rem; +} + +#group-selection-clear { + position: absolute; + right: 0.75rem; + transform: translateY(-175%); + border: none; + background: transparent; + font-size: 1.875rem; + cursor: pointer; + color: #888; +} + +#group-selection-clear:hover { + color: #333; +} + +#group-selection:focus { + border-color: #0077ff; +} + +#group-selection-loader { + --size: 0.5px; + width: calc(48 * var(--size)); + height: calc(48 * var(--size)); + border: calc(5 * var(--size)) solid black; + border-bottom-color: transparent; + border-radius: 50%; + display: inline; + position: absolute; + top: 20px; + right: 0.75rem; + box-sizing: border-box; + animation: rotation 1s linear infinite; +} + +@keyframes rotation { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} + +#group-selection-list { + list-style: none; +} + +#group-selection-list li { + padding: 0.75rem 1rem; + border-bottom: 1px solid #eee; + cursor: pointer; + transition: background 0.2s; +} + +#group-selection-list li:hover { + background: #f0f8ff; +} + +#group-selection-list li.active { + background: #0077ff; + color: white; +} + +#group-selection-list li > u.group-selection-list-highlight { + font-weight: bold; +} + +#group-selection-noresults { + color: red; + text-align: center; + margin-top: 1rem; +} + +#group-content { +} + +#group-members { + padding-left: 0; +} + +.group-member { + display: grid; + grid-template-columns: 30px 200px 30px repeat(3, 40px) auto 20px; +} + +.group-member-icon { + width: 30px; + height: 30px; + align-self: center; +} + +.group-member-name { + align-self: center; +} + +.group-member-observation-icon { + border: none; + background: none; +} + +.group-member-green, .group-member-orange, .group-member-red { + margin: 5px; +} + +.group-member-green { + background: green; + margin: 1px; +} +.group-member-orange { + background: orange; + margin: 1px; +} +.group-member-red { + background: red; + margin: 1px; +} + +#group-member-point-reason { + box-sizing: border-box; + padding: 10px; + width: 50%; + font-size: 0.8rem; + letter-spacing: 1px; + line-height: 1.5; + border-radius: 5px; + border: 1px solid #cccccc; +} + +.group-member-print { + background: none; + border: none; + font-size: larger; +} + +.group-member-observation-container { + background: lightgray; + width: 100%; +} + +.group-member-observation-table { + background: lightgray; + +} +.group-member-observation-table-description { + max-width: 70%; +} + +.group-member-observation-table-yes, +.group-member-observation-table-no, +.group-member-observation-table-maybe { + width: 10%; + text-align: center; +} + +.submit-mass-graduation-inprogress { + --size: 0.5px; + width: calc(48 * var(--size)); + height: calc(48 * var(--size)); + border: calc(5 * var(--size)) solid black; + border-bottom-color: transparent; + border-radius: 50%; + display: inline; + position: absolute; + margin-left: 0.25rem; + margin-top: 0.25rem; + box-sizing: border-box; + animation: rotation 1s linear infinite; +} -- cgit v1.2.3