aboutsummaryrefslogtreecommitdiff
path: root/static/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'static/style.css')
-rw-r--r--static/style.css980
1 files changed, 0 insertions, 980 deletions
diff --git a/static/style.css b/static/style.css
deleted file mode 100644
index 79fd06ab..00000000
--- a/static/style.css
+++ /dev/null
@@ -1,980 +0,0 @@
-html {
- height: 100%;
-}
-
-html, body {
- height: 100%;
- margin: 0;
-}
-
-.root {
- display: grid;
- margin: 0;
- max-width: 100%;
- height: 100%;
-
- grid-template-columns: auto auto 20em;
- grid-template-rows: auto;
-
- grid-template-areas:
- "main main nav"
- "main main cal"
- "main main details"
- "main main events"
- "footer footer events";
-}
-
-@media (max-aspect-ratio: 3/4) {
- .root {
- grid-template-areas:
- "main main"
- "nav events"
- "cal events"
- "details events"
- ". events"
- "footer events";
- grid-template-rows: 70% auto;
- grid-template-columns: 50% auto;
- }
-}
-
-.hidelink {
- color: inherit;
- text-decoration: none;
-}
-
-.root main {
- min-width: 0; /* for wide */
- min-height: 0; /* for tall */
-
- /* apparently required if one wants to have multiple
- items within main, without it overflowing
- */
- display: flex;
- flex-direction: column;
-}
-
-/* Page footer
-----------------------------------------
-*/
-.root footer {
- margin: 0.5em;
- color: ray;
- font-size: 8pt;
-
- display: flex;
- justify-content: space-between;
-
- flex-direction: row;
-}
-
-@media (max-aspect-ratio: 3/4) {
- .root footer {
- flex-direction: column;
- }
-}
-
-.root footer span {
- margin: 0 1em;
- white-space: nowrap;
-}
-
-
-/* Change View
-----------------------------------------
-"Buttons" for changing between weekly and monthly layout
-*/
-
-.calnav {
- display: flex;
- flex-direction: column;
- padding-left: 2em;
- padding-right: 2em;
-}
-
-.change-view {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
-
- padding-top: 1ex;
- padding-bottom: 1ex;
-}
-
-#jump-to > form {
- display: flex;
-}
-
-#jump-to input {
- flex-grow: 2;
- margin-right: 1em;
-}
-
-#jump-to button, #jump-to a {
- /* Same as height, figure out way to force this */
- width: 2.5em;
-}
-
-/* button
---------------------------------------------------
-*/
-
-.btn {
- padding: 0;
-
- /* if a */
- text-decoration: none;
-
- /* if button */
- border: none;
- background-color: inherit;
-}
-
-.btn > div {
- padding: 0.5em;
- background-color: #3399ff;
- color: white;
-
- box-sizing: border-box;
- width: 100%;
- height: 100%;
-
- display: flex;
- justify-content: center;
- align-items: center;
-
- /* shouldn't be needed, but otherwise wont align with a text input
- inside a shared flex-container.
- It however seems to make <a> and <button> tag refuse to be the same height?
- */
- height: 2.5em;
-
- box-shadow: var(--btn-height) var(--btn-height) gray;
-}
-
-.btn:active > div {
- transform: translate(var(--btn-height), var(--btn-height));
- box-shadow: none;
-}
-
-/* Eventlist
-----------------------------------------
-The sidebar with all the events
-*/
-
-.eventlist {
- min-height: 0;
- overflow: auto;
- border-top: 3px solid var(--gray);
- /* mostly for long links */
- word-break: break-word;
-}
-
-.eventlist article {
- border-bottom: 1px solid black;
- margin-top: 1em;
- border-left-style: solid;
- border-left-width: 6px;
- padding-left: 2px;
-}
-
-/* Text day
-----------------------------------------
-Each event within the eventlist
-*/
-
-.text-day {
- border-left: 2px solid black;
- border-top: 2px solid black;
- padding-left: 2px;
- margin-top: 1em;
-}
-
-.text-day header h2 {
- width: 100%;
- text-align: center;
- font-size: 14pt;
-}
-
-/* Small calendar
-----------------------------------------
-*/
-.smallcal {
- display: flex;
- justify-content: center;
-}
-
-.smallcall-head {
- text-align: center;
- font-weight: bold;
-}
-
-.smallcal .nav {
- display: flex;
- flex-direction: column;
- justify-content: center;
- font-size: 150%;
-}
-
-.small-calendar {
- display: grid;
- grid-template-rows: auto;
- grid-template-columns: auto;
-
- grid-auto-flow: dense;
-}
-
-.small-calendar > * {
- text-align: center;
-}
-
-.small-calendar > *:not(.column-head) {
- display: flex;
- align-items: center; /* vertically center */
- text-align: right;
-}
-
-.small-calendar > * > time {
- width: 100%;
- text-align: right;
- /* padding place in <time> instead on parent block element
- to allow a border radius without making the link area
- smaller
- */
- padding: 5px;
-}
-
-.small-calendar a {
- color: initial;
- text-decoration: none;
-}
-
-.small-calendar .row-head {
- grid-column: 1;
- border-right: 1px solid black;
-
- /* Sort of hack to get week numbers looking ok */
- justify-content: right;
- padding-right: 5px;
-}
-
-.small-calendar .column-head {
- grid-row: 1;
- border-bottom: 1px solid black;
-}
-
-.small-calendar .next,
-.small-calendar .prev {
- color: var(--gray);
-}
-
-/* Sliders
-----------------------------------------
- */
-
-.sliders label {
- padding-left: 1em;
-}
-
-.sliders input[type="range"] {
- width: 100%;
- margin: 0;
-}
-
-.sliders .input-group {
- display: flex;
-}
-
-.sliders .input-group input {
- min-width: 0;
-}
-
-/* Calendar List
-----------------------------------------
-The list of all the loaded calendars,
-along with their colors.
-*/
-
-.calendarlist li {
- font-size: 8pt;
- list-style-type: none;
- border-left-width: 1em;
- border-left-style: solid;
- border-color: var(--color);
- padding-left: 1ex;
-
- /* force to single line */
- overflow: hidden;
- white-space: nowrap;
-}
-
-.small-calendar .today {
- border: 1px solid black;
-}
-
-/* Caltable
-----------------------------------------
-*/
-
-.caltable {
- flex-grow: 10;
-
- display: grid;
- grid-template-columns: repeat(7, 1fr);
- /* grid template rows is generated
- inline in the HTML */
-
- max-height: 100%;
- /* Apparently needed to ensure that parent
- can contain all its children */
- min-height: 0;
-}
-
-.caltable .thead {
- font-weight: bold;
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-.caltable .thead,
-.caltable .cal-cell {
- border: 1px solid var(--gray);
-}
-
-.caltable .cal-cell-time {
- border-bottom: none;
-}
-
-.caltable .cal-cell-short {
- border-top: none
-}
-
-.caltable .longevents .event {
- margin: 0;
- /* TODO use other border rules */
- border: 1px solid black;
-}
-
-.caltable .longevents {
- border-bottom: none;
- border-top: none;
- position: relative;
-}
-
-.caltable .longevents .event {
- position: absolute;
- box-sizing: border-box;
- padding: 0;
-}
-
-.caltable .cal-cell {
- overflow-y: auto;
-}
-
-
-.cal-cell .event {
- font-size: 8pt;
- border-radius: 5px;
- padding: 2px;
- margin: 2px;
- font-family: arial;
-}
-
-
-.date-info .day-number {
- padding: 2pt;
-}
-
-.date-info.current .day-number {
- color: black;
-}
-
-.date-info {
- color: var(--gray);
-}
-
-.table-head {
- font-size: 200%;
- text-align: center;
-}
-
-
-/* Weekly calendar
-----------------------------------------
-*/
-
-.calendar {
- width: 100%;
- height: 100%;
- display: flex;
- flex-grow: 2;
-}
-
-.sideclock {
- padding: 0;
- grid-row: 3;
- position: relative;
-}
-.sideclock .day {
- border: 1px transparent;
- min-width: 0;
-}
-
-.days .meta {
- border-bottom: 2px solid var(--gray);
- grid-row: 1;
-}
-
-.days .events {
- grid-row: 3;
-}
-
-.days .longevents {
- grid-row: 2;
- grid-column-start: 2;
- position: relative;
-}
-
-.days {
- display: grid;
- grid-template-rows: 4em 4em auto;
- grid-template-columns: 5ch auto;
- width: 100%;
- height: 100%;
- padding: 0;
- overflow-x: scroll;
-
- /* allow for popup placement */
- position: relative;
-}
-
-.events {
- position: relative;
- border: 1px solid var(--gray);
-}
-
-/*
- * This makes the borders of the object be part of the size.
- * Making placing it on the correct line much simpler.
- */
-.clock, .days .event, .eventlike {
- position: absolute;
- box-sizing: border-box;
- margin: 0;
- display: block;
-}
-
-.clock {
- color: var(--gray);
- border-top: 1px dotted var(--gray);
- width: 100%;
- pointer-events: none;
-}
-
-.sideclock .clock {
- border-top: 1px dotted var(--gray);
- grid-row: 3;
-}
-
-.clocktext {
- z-index: 1;
- text-align: right;
-}
-
-.meta {
- display: flex;
- justify-content: center;
- align-items: center;
- position: relative;
-
- padding-left: 1em;
- padding-right: 1em;
-}
-
-.meta .dayname {
- position: absolute;
- left: 5px;
- top: 2px;
- color: var(--gray);
-}
-
-.meta .daydate {
- white-space: nowrap;
- font-size: 150%;
-}
-
-.event {
- transition: 0.3s;
- font-size: var(--event-font-size);
- overflow: visible;
- background-color: var(--color);
- color: var(--complement);
-}
-
-.popup input {
- white-space: initial;
- border: 1px solid gray;
- max-width: 100%;
-}
-
-.event-body {
- padding: 0;
- margin: 0;
- width: 100%;
- height: 100%;
- overflow: hidden;
-}
-
-.days .event {
- border: 1px solid black;
-}
-
-.events .event {
- width: 100%;
-}
-
-.zero-width-events .event {
- width: initial;
- padding: 0.5em;
- margin: 0.2em;
- border-radius: 1ex;
- position: relative;
- float: left;
-}
-
-.events .event.continuing {
- border-bottom: none;
- background-image: linear-gradient(to top, #0007 0%,#FFF0 2em);
-}
-
-.events .event.continued {
- border-top: none;
- background-image: linear-gradient(to bottom, #FFF7 0%,#FFF0 3em);
-}
-
-.events .event.continued.continuing {
- border-top: none;
- border-bottom: none;
- background-image:
- linear-gradient(to bottom,
- #FFF7 0%, #FFF0 10%,
- #FFF0 90%, #0007 100%);
-}
-
-.event.tentative {
- border: 3px dashed black;
-}
-
-.event .location {
- display: block;
- font-size: 80%;
- font-style: italic;
- white-space: pre;
-}
-
-.repeating {
- color: red;
-}
-
-.event .repeating {
- float: left;
- font-size: 150%;
-}
-
-.eventtext {
- white-space: pre-line;
- font-size: 10pt;
-}
-
-.eventtext h3 {
- font-size: 12pt;
- border-bottom: 1px solid var(--gray);
- margin-bottom: 0;
- font-weight: 300;
- margin-top: 0;
-}
-
-.eventtext .location {
- display: inline-block;
- vertical-align: text-top;
-}
-
-.eventtext .last-modified,
-.eventtext .rrule {
- display: flex;
- justify-content: right;
- text-align: right;
- font-size: 80%;
- color: var(--gray);
- padding-right: 1em;
-}
-
-.eventlist .eventtext {
- border-color: var(--color);
-}
-
-.eventlist .eventtext.tentative {
- border-left-style: dashed;
-}
-
-
-/* */
-
-.longevents .event {
- border-radius: 1em;
- padding-left: 1em;
-}
-
-.longevents .event.continuing {
- border-right: none;
- border-radius: 1em 0 0 1em;
-}
-
-.longevents .event.continued {
- border-left: none;
- border-radius: 0 1em 1em 0;
-}
-
-.longevents .event.continued.continuing {
- border-radius: 0;
-}
-
-
-/*
- * All other CAL_ classes are generated by the backend.
- * NOTE Possibly move this there.
- */
-.CAL_Generated {
- background-color: #55FF55;
-}
-
-.event.generated {
- opacity: 40%;
- transition: none;
-}
-
-.longevents .event.generated {
- bottom: 0;
- height: calc(100% * var(--editmode));
-}
-.events .event.generated {
- width: calc(100% * var(--editmode));
-}
-
-.clock-0 { top: calc(100%/24 * 0); }
-.clock-2 { top: calc(100%/24 * 2); }
-.clock-4 { top: calc(100%/24 * 4); }
-.clock-6 { top: calc(100%/24 * 6); }
-.clock-8 { top: calc(100%/24 * 8); border-width: 2px; }
-.clock-10 { top: calc(100%/24 * 10); }
-.clock-12 { top: calc(100%/24 * 12); }
-.clock-14 { top: calc(100%/24 * 14); }
-.clock-16 { top: calc(100%/24 * 16); border-width: 2px; }
-.clock-18 { top: calc(100%/24 * 18); }
-.clock-20 { top: calc(100%/24 * 20); }
-.clock-22 { top: calc(100%/24 * 22); }
-.clock-24 { top: calc(100%/24 * 24); }
-
-
-/* Search page
-----------------------------------------
- */
-
-.paginator > * {
- padding-left: 1em;
- display: inline-block;
-}
-
-.summary-line {
- display: inline-flex;
-}
-
-.summary-line > * {
- display: inline-block;
-}
-
-.summary-line time {
- font-family: monospace;
- min-width: 18ch;
-}
-
-/* Popups
-----------------------------------------
-*/
-
-.popup-container {
- display: none;
- position: absolute;
- z-index: 10;
-
- left: 10px;
- top: -50px;
-}
-
-.popup-container.visible {
- display: block;
-}
-
-.popup {
- display: flex;
- background-color: #dedede;
- color: black;
- font-size: 80%;
-
- /* overflow-y: auto; */
- max-width: 60ch;
- max-height: 60ch;
- min-width: 40ch;
- min-height: 20ch;
-}
-
-.popup article {
- /* makes the text in the popup scroll, but not the sidebar */
- overflow-y: auto;
- padding: 1em;
- word-break: break-word;
-}
-
-.popup .location {
- font-style: initial;
-}
-
-.popup .popup-control {
- display: flex;
- flex-direction: column;
-
- /* not needed, but the icons aren't text
- and should therefor not be copied */
- user-select: none;
-
- cursor: grab;
- background-color: var(--color);
- /* Transition for background color
- * Matches that of '.event'.
- * TODO break out to common place */
- transition: 0.3s;
-}
-
-.popup-control .btn {
- max-width: 2em;
- max-height: 2em;
- margin: 1em;
-
- display: flex;
- align-items: center;
- justify-content: center;
-
- font-size: 150%;
-}
-
-#bar {
- width: calc(100% + 2em);
- height: 4px;
- background: blue;
- border-color: blue;
- left: -1em;
-}
-
-/* Tabs
-----------------------------------------
-*/
-
-.tabgroup {
- position: relative;
- width: 100%;
- resize: both;
-}
-
-.tab label {
- position: absolute;
-
- left: 100%;
- top: 0;
- display: block;
-
- max-height: 5ex;
- min-height: 5ex;
- min-width: 5ex;
- max-width: 5ex;
-
- border: 1px solid #ccc;
- border-radius: 0 5px 5px 0;
- background-color: #aeaeae;
-
- display: flex;
- justify-content: center;
- align-items: center;
-}
-
-.tab [type=radio] { display: none; }
-
-.tab .content {
- position: absolute;
- top: 0;
- left: 0;
- background-color: #dedede;
- right: 0;
- bottom: 0;
- overflow: auto;
-
- min-width: 100%;
- min-height: 100%;
-}
-
-.tab [type=radio]:checked ~ label {
- z-index: 1;
- /* to align all tab */
- border-left: 3px solid transparent;
- background-color: #dedede;
-}
-
-.tab [type=radio]:checked ~ label ~ .content {
- z-index: 1;
-}
-
-/* Other
-----------------------------------------
-*/
-
-.template {
- display: none;
-}
-
-
-.summary-line .square {
- margin-right: 1em;
-}
-
-.square {
- width: 1em;
- height: 1em;
- background-color: var(--color);
-}
-
-/* Icalendar
-----------------------------------------
-*/
-
-/* Below is for styling embedded xcalendar components in the xhtml
- document. I can't find anything about if this is allowed
- according to any standard, but it seems to work.
- Firefox doesn't want to admit it, and shows nothing in the
- inspector, but the document renders fine.
- Vivaldi works fine in the inspector.
- */
-
-icalendar {
- display: inline-block;
- padding-left: 1ch;
- font-family: monospace;
- font-size: xx-small;
- padding-left: 1ch;
-}
-
-icalendar properties > * {
- display: block;
-}
-
-icalendar properties * {
- padding-right: 1ch;
-}
-
-icalendar parameters {
- color: gray;
-}
-
-/* All icalendar properties */
-icalendar calscale::before { content: "calscale: "; }
-icalendar method::before { content: "method: "; }
-icalendar prodid::before { content: "prodid: "; }
-icalendar version::before { content: "version: "; }
-icalendar attach::before { content: "attach: "; }
-icalendar categories::before { content: "categories: "; }
-icalendar class::before { content: "class: "; }
-icalendar comment::before { content: "comment: "; }
-icalendar description::before { content: "description: "; }
-icalendar geo::before { content: "geo: "; }
-icalendar location::before { content: "location: "; }
-icalendar percent-complete::before { content: "percent-complete: "; }
-icalendar priority::before { content: "priority: "; }
-icalendar resources::before { content: "resources: "; }
-icalendar status::before { content: "status: "; }
-icalendar summary::before { content: "summary: "; }
-icalendar completed::before { content: "completed: "; }
-icalendar dtend::before { content: "dtend: "; }
-icalendar due::before { content: "due: "; }
-icalendar dtstart::before { content: "dtstart: "; }
-icalendar duration::before { content: "duration: "; }
-icalendar freebusy::before { content: "freebusy: "; }
-icalendar transp::before { content: "transp: "; }
-icalendar tzid::before { content: "tzid: "; }
-icalendar tzname::before { content: "tzname: "; }
-icalendar tzoffsetfrom::before { content: "tzoffsetfrom: "; }
-icalendar tzoffsetto::before { content: "tzoffsetto: "; }
-icalendar tzurl::before { content: "tzurl: "; }
-icalendar attendee::before { content: "attendee: "; }
-icalendar contact::before { content: "contact: "; }
-icalendar organizer::before { content: "organizer: "; }
-icalendar recurrence-id::before { content: "recurrence-id: "; }
-icalendar related-to::before { content: "related-to: "; }
-icalendar url::before { content: "url: "; }
-icalendar uid::before { content: "uid: "; }
-icalendar exdate::before { content: "exdate: "; }
-icalendar rdate::before { content: "rdate: "; }
-icalendar rrule::before { content: "rrule: "; }
-icalendar action::before { content: "action: "; }
-icalendar repeat::before { content: "repeat: "; }
-icalendar trigger::before { content: "trigger: "; }
-icalendar created::before { content: "created: "; }
-icalendar dtstamp::before { content: "dtstamp: "; }
-icalendar last-modified::before { content: "last-modified: "; }
-icalendar sequence::before { content: "sequence: "; }
-icalendar request-status::before { content: "request-status: "; }
-
-/* icalendar parameters */
-icalendar parameters altrep::before { content: "altrep:"; }
-icalendar parameters cn::before { content: "cn:"; }
-icalendar parameters cutype::before { content: "cutype:"; }
-icalendar parameters delegated-from::before { content: "delegated-from:"; }
-icalendar parameters delegated-to::before { content: "delegated-to:"; }
-icalendar parameters dir::before { content: "dir:"; }
-icalendar parameters encoding::before { content: "encoding:"; }
-icalendar parameters fmttype::before { content: "fmttype:"; }
-icalendar parameters fbtype::before { content: "fbtype:"; }
-icalendar parameters language::before { content: "language:"; }
-icalendar parameters member::before { content: "member:"; }
-icalendar parameters partstat::before { content: "partstat:"; }
-icalendar parameters range::before { content: "range:"; }
-icalendar parameters related::before { content: "related:"; }
-icalendar parameters reltype::before { content: "reltype:"; }
-icalendar parameters role::before { content: "role:"; }
-icalendar parameters rsvp::before { content: "rsvp:"; }
-icalendar parameters sent-by::before { content: "sent-by:"; }
-icalendar parameters tzid::before { content: "tzid:"; }
-
-/* special fields inside some properties */
-icalendar period start { content: "start:"; }
-icalendar period end { content: "end:"; }
-icalendar period duration { content: "duration:" }
-icalendar recur freq { content: "freq:"; }
-icalendar recur until { content: "until:"; }
-icalendar recur count { content: "count:"; }
-icalendar recur bymonth { content: "bymonth"; }
-icalendar recur byweekno { content: "byweekno"; }
-icalendar recur byyearday { content: "byyearday"; }
-icalendar recur bymonthday { content: "bymonthday"; }
-icalendar recur byday { content: "byday"; }
-icalendar recur byhour { content: "byhour"; }
-icalendar recur byminute { content: "byminute"; }
-icalendar recur bysecond { content: "bysecond"; }
-icalendar recur bysetpos { content: "bysetpos"; }
-
-/* types */
-icalendar date-time, icalendar date, icalendar until {color: purple;}
-icalendar text { color: green; }
-icalendar integer { color: blue; }
-icalendar unknown { color: red; }
-
-/* vim:expandtab:softtabstop=4:shiftwidth=4:
- */
generated by cgit v1.2.3 (git 2.25.1) at 2024-06-26 13:27:21 +0200