linear-gradient(90deg, transparent 25%, rgba(102,170,255,.5) 25% 50%, transparent 50% 75%, rgba(102,255,255,.5) 75%);
}
-body > form {
+body > main {
background-color: rgba(255,255,255,.75) ;
padding: 1em; margin: 1em auto 1em auto;
border-radius: .5ex;
box-shadow: #000 .125em .125em 1em;
}
-body.home form {
+body.home main {
position: fixed;
left: 50%; top: 50%;
transform: translate(-50%, -50%);
}
-body.poll form {
+body.poll main {
text-align: center;
max-width: 95%;
}
-body.poll .description {
- text-align: left;
+body section {
max-width: 50em;
- padding: 1pt 1em 1em 1em;
- margin: auto;
- margin-bottom: 1em;
+ padding: 1em;
+ margin: 1em auto;
background-color: rgba(255,255,255,.5);
+ word-wrap: break-word;
+}
+body.poll .description {
+ margin-top: 0;
+ text-align: left;
}
body.poll .description .title {
+ margin-top: 0;
text-align: center;
}
body.poll table {
+ display: block;
+ max-width 100%;
+ overflow-x: auto;
+
background-color: rgba(255,255,255,.5);
border-collapse: collapse;
margin: auto;
box-shadow: #000 .25em .25em .5em;
border-radius: 2pt;
}
+
body.poll table thead tr.dates th {
padding: .25em;
}
body.poll table tbody tr th.name button[name=delete] { font-size: .625em; line-height: 1.5em; background-color: #FAA; }
body.poll table tbody tr.new td:first-child { text-align: right; }
-body.poll table tbody tr.new td input[name=name] { min-width: 100%; width: 4em; }
+body.poll table tbody tr.new td input[name=name] { min-width: 100%; width: 8em; }
body.poll table td input[type=radio] { display: none; }
body.poll table td input[type=radio] + label {
margin: 0 -1.75pt;
}
-body.newdate form {
+body.newdate main {
text-align: center;
max-width: 100%;
}
margin: .5em 0 1em 0;
}
-body.newdate form { width: 26em; }
+body.newdate main { width: 26em; }
body.newdate form input[name=title],
body.newdate form textarea[name=description] {
width: 100%;
}
@media(min-width: 50em) {
- body.newdate form { width: 50em; }
+ body.newdate main { width: 50em; }
body.newdate form input[name=title],
body.newdate form textarea[name=description] {
width: 100%;
body.newdate form fieldset.date { padding-right: .75em; }
body.newdate form fieldset.timeofday,
body.newdate form fieldset.splittimes { padding-left: .75em; }
+ body.poll table { display: table;}
}
body.newdate form input[name=title],
body.newdate form .timeofday button[name=splittimes] { margin-top: 1.5em;}
body.newdate form .splittimes p { margin-top: 2em; padding: .5em; background: rgba(255,255,255,.5); }
+
+body.newdate form #delconfirm {
+ margin-left: -6em;
+}
+body.newdate form #delconfirm + label:after {
+ content: '\0A';
+ white-space: pre;
+}
+body.newdate form #delconfirm + label + button {
+ pointer-events: none;
+ color: #AAA;
+ border-color: #AAA;
+}
+body.newdate form #delconfirm:checked + label + button {
+ pointer-events: auto;
+ color: inherit;
+ border-color: inherit;
+ background-color: #FDD;
+}