X-Git-Url: https://git.plutz.net/?p=confetti;a=blobdiff_plain;f=style.css;h=8394de8e66f2bb3e2d7a190aabba355b432f7ddd;hp=e0faba6c7957635392d0700320ecfe774c51f393;hb=f1346d6ad684e8e843afd51bfe38e474f7d48508;hpb=d43c7ce1d2c15909db3fd0057cc347d69fa838c7 diff --git a/style.css b/style.css index e0faba6..8394de8 100644 --- a/style.css +++ b/style.css @@ -1,89 +1,6 @@ -* { - position: relative; - box-sizing: border-box; - font-family: sans-serif; - font-weight: normal; - font-size: initial; - font-style: normal; - text-decoration: none; - line-height: 1.5em; - color: inherit; background: transparent; - padding: 0; margin: 0; - border: none; -} - -body { - color: #000; background-color: #FFF; -} - -/* ======= GENERIC HTML STYLES =======*/ - -p { margin-bottom: 1em; } - -a { - text-decoration: underline; - font-style: italic; - color: #068; -} - -i, em { font-style: italic; } -b, strong { font-weight: bolder; } -ul, ol { margin-left: 1.125em; } -table th { font-weight: bold; } - -h1, h2, h3 { - font-weight: bold; - margin-top: 1em; - margin-bottom: .5em; -} - h1:first-child, h2:first-child, h3:first-child, p + h1, p + h2, p + h3 { - margin-top: 0; -} - -h4, h5, h6, form legend { - font-weight: bolder; - margin-bottom: .25em; -} - -h1 { font-size: 1.5em; } -h2 { font-size: 1.125em; } - -select, input, button, textarea, -.control a { - display: inline-block; - background-color: #FFF; - border: 1pt solid; - padding: .25em .75em; - vertical-align: text-bottom; -} -.control a { - color: inherit; - font-style: normal; - text-decoration: none; -} - -select { padding: .375em 0; } - -input[type=radio], input[type=checkbox] { - vertical-align: baseline; -} -input[type=number] { text-align: right; padding-right: 0; } - -button, input[type=button], -.control a { - box-shadow: .125em .125em .25em; - cursor: pointer; -} -input[type=radio], input[type=checkbox], -input[type=radio] + label, input[type=checkbox] + label { - cursor: pointer; -} - -label { margin-right: .75em; } -input + label { - margin-left: .375em; + margin-top: 3pt; } /* ====== COMMON ELEMENTS ======*/ @@ -117,6 +34,7 @@ body.courses > .menu a[href="/courses/"] { /* =========== FILTER AND SEARCH Headers ========= */ +form.categories, form.search, form.sort, form.filter, form.newcard, form.newcourses { margin-top: 1em; padding: 0 1em; z-index: 1; @@ -125,36 +43,13 @@ form.filter > h1 { display: none; } form.filter fieldset { margin-top: .5em; } form.filter fieldset.item + fieldset.item legend { display: none; } -form.filter fieldset.item input[type=radio] { display: none; } -form.filter fieldset.item input[type=radio] + label { - display: table-cell; - padding: .5em 1em; - background-color: #EEE; - border-style: solid; - border-width: .5pt .25pt 0 .25pt; -} -form.filter fieldset.item input[type=radio] + label:first-of-type { - border-left: 1pt solid; -} -form.filter fieldset.item input[type=radio]:checked + label { - position: relative; - background-color: #FFF; - box-shadow: .125em -.125em .125em #888; - z-index: 1; -} -form.filter fieldset.item input[type=text], -form.filter fieldset.item fieldset.categories { - position: relative; - display: block; - width: 100%; - margin-top: -1pt; - padding: .25em .75em; - border: 1pt solid; - box-shadow: .125em .125em .25em #888; -} -form.filter fieldset.item fieldset.categories { display: none; } -form.filter fieldset.item input[value=CATEGORIES]:checked + label + input[type=text] { display: none; } -form.filter fieldset.item input[value=CATEGORIES]:checked + label + input[type=text] + fieldset.categories { display: block; } + +form.filter fieldset.item input[value=course] ~ input[type=text], +form.filter fieldset.item input[value=CATEGORIES] ~ input[type=text] { display: block; } +form.filter fieldset.item input[value=course]:checked ~ input[type=text], +form.filter fieldset.item input[value=CATEGORIES]:checked ~ input[type=text] { display: none; } +form.filter fieldset.item input[value=course]:checked ~ fieldset.courses, +form.filter fieldset.item input[value=CATEGORIES]:checked ~ fieldset.categories { display: block; } form.filter fieldset.order legend { float: left; margin-right: 1em; @@ -166,8 +61,13 @@ form.filter button[type=submit] { margin-top: .5em; margin-bottom: .5em; } +form.filter button[value=export_csv] { margin-left: 1em; } + body.courses form .order { display: inline-block; margin-right: 2em;} +body.cards form.newcard { display: flex; } +body.cards form.newcard input[name=seed] { flex: 1; } + /* ============ LIST ITEMS, Generic ============= */ @@ -257,7 +157,7 @@ form .section.attendance > label { } div .section .item.NOTE { - white-space: pre; + white-space: pre-wrap; } form .section .item { @@ -286,7 +186,8 @@ form .section button[value^=addfield] { -form input.delete + label:hover:before { content: ''; } -form input.delete + label:hover:after { content: ' \274c'; } form input.delete:checked + label, - form input.delete:checked + label + * { + form input.delete:checked + label + *, + form input.delete:checked + label + .teltype + .TEL { display: none; } /**/ @@ -403,3 +304,41 @@ form.course .attendance label { margin-bottom: 0; } form.course .attendance input { margin-top: .375em; } + +/* ======== Categories Page ======== */ + +body.categories form ul { list-style: none; margin: 0; } + +form.categories li { + display: inline-block; + background-color: #EEE; + margin-right: .5em; margin-bottom: .5em; + padding-left: .5em; + box-shadow: .125em .125em .25em; +} +form.categories li button[name=remove] { + font-size: .75em; + width: 2.5em; + background-color: #FBB; + overflow: hidden; + white-space: pre; +} +form.categories li button[name=remove]:before { + content: '\274C '; + margin-right: 3em; +} + +form.categories li:last-child { padding-left: 0 } + +body.categories form.namelist ul.namelist > li:nth-of-type(2n + 1) { background-color: #EEE; } +body.categories form.namelist ul.namelist > li h2, +body.categories form.namelist ul.namelist > li ul { + display: inline-block; +} +body.categories form.namelist ul.namelist > li h2 { + width: 20%; + min-width: 10em; +} +body.categories form.namelist ul.namelist > li ul li { + display: inline-block; +}