diff --git a/static/mo.css b/static/mo.css index 8978f2cd51d677e19ab53875e9175b7793006476..34c5a998fd9f0b2048d4d3fa2b56ae29159e6aab 100644 --- a/static/mo.css +++ b/static/mo.css @@ -330,3 +330,41 @@ div.alert + div.alert { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } + +/* Collapsible */ + +.collapsible { + position: relative; +} +.collapsible input[type="checkbox"].toggle { + position: absolute; + top: 0; + left: 0; + opacity: 0; +} +.collapsible label.toggle { + cursor: pointer; + margin-left: 15px; +} +.collapsible label.toggle::before { + position: absolute; + content: ""; + width: 0; + height: 0; + left: 0px; + border-left: 8px solid black; + border-top: 8px solid transparent; + border-bottom: 8px solid transparent; + transition: 0.5s ease; +} +.collapsible input[type="checkbox"].toggle:checked ~ label.toggle::before { + transform: rotate(90deg); +} +.collapsible .collapsible-inner { + max-height: 0; + overflow-y: hidden; + transition: 0.5s ease; +} +.collapsible input[type="checkbox"].toggle:checked ~ .collapsible-inner { + max-height: 100vh; +}