/* Full-page forms */ .form { /* anti-bots field */ } .form form > div:not(:last-child):not(.editor-toolbar) { margin-bottom: 16px; } .form form label { display: inline-block; margin: 0 5px 4px 0; } .form form label + .desc { margin: 0 0 4px 0; font-size: 80%; opacity: 0.75; } .form form .avatar { width: 128px; height: 128px; } .form form .avatar + input[type="file"] { margin: 16px 0 0 0; vertical-align: middle; } .form input[type='text'], .form input[type='email'], .form input[type='date'], .form input[type='password'], .form input[type='search'], .form textarea, .form select { display: block; width: 100%; padding: 6px 8px; background: var(--background); color: var(--text); border: var(--border); /* Transitions when resizing with the mouse produces apparent lag */ transition: all 0.15s ease, width 0s, height 0s; } .form input[type='text']:focus, .form input[type='email']:focus, .form input[type='date']:focus, .form input[type='password']:focus, .form input[type='search']:focus, .form textarea:focus, .form select:focus { border-color: var(--border-focused); box-shadow: 0 0 0 3px var(--shadow-focused); } .form input[type='text']:focus-within, .form input[type='email']:focus-within, .form input[type='date']:focus-within, .form input[type='password']:focus-within, .form input[type='search']:focus-within, .form textarea:focus-within, .form select:focus-within { /* Override an annoying Firefox default */ outline: none; } .form input[type='checkbox'], .form input[type='radio'] { display: inline; vertical-align: middle; margin: 0 4px 0 0; } .form textarea { max-width: 100%; resize: vertical; } .form select { width: auto; } .form progress.entropy { display: none; /* Display with Js enabled */ width: 100%; margin-top: 5px; background: var(--background); border: var(--border); } .form progress.entropy.low::-moz-progress-bar, .form progress.entropy.low::-webkit-progress-bar { background: var(--error); } .form progress.entropy.medium::-moz-progress-bar, .form progress.entropy.medium::-webkit-progress-bar { background: var(--warn); } .form progress.entropy.high::-moz-progress-bar, .form progress.entropy.high::-webkit-progress-bar { background: var(--ok); } .form hr { height: 3px; border: var(--hr-border); border-width: 1px 0; margin: 24px 0; } .form .msgerror { color: var(--error); font-weight: 400; margin-top: 5px; } .form .abfield { display: none; } /* Interactive filter forms */ .form.filter { margin-bottom: 16px; } .form.filter > p:first-child { font-size: 80%; color: gray; margin-bottom: 2px; } .form.filter input { font-family: monospace; } .form.filter .syntax-explanation { font-size: 80%; color: gray; margin-top: 8px; } .form.filter .syntax-explanation ul { font-size: inherit; color: inherit; padding-left: 16px; line-height: 20px; margin-top: 2px; } .form.filter .syntax-explanation code { background: rgba(0, 0, 0, 0.05); padding: 1px 2px; border-radius: 2px; }