summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--public/mobile-styles.css79
-rw-r--r--views/layout.erb3
2 files changed, 81 insertions, 1 deletions
diff --git a/public/mobile-styles.css b/public/mobile-styles.css
new file mode 100644
index 0000000..11cb3da
--- /dev/null
+++ b/public/mobile-styles.css
@@ -0,0 +1,79 @@
+body {
+ color: #afafaf;
+ background-color: #131a1a;
+}
+
+h1, h2, h3 {
+ color: #ccc;
+}
+
+a {
+ color: #7fb0c7;
+ text-decoration: none;
+}
+
+a:hover {
+ color: #99b0d7;
+ text-decoration: underline;
+}
+
+label {
+ display: block;
+}
+
+.required label:after,
+.required:empty:after {
+ content: "* ";
+ color: #ff4f4f;
+ vertical-align: top;
+}
+
+input[type=text],
+input[type=time] {
+ border: 0;
+}
+
+textarea {
+ border: 1px dashed slategray;
+ margin-top: 5px;
+ margin-bottom: 5px;
+}
+
+input[type=text], input[type=time], textarea {
+ border-bottom: 1px solid darkslateblue;
+ background-color: #afafaf;
+ color: #11163f;
+ font-size: large;
+ padding: 1mm;
+}
+
+input[type=text], textarea {
+ width: 100%;
+}
+
+.postcode input[type=text] {
+ width: 50%;
+}
+
+.song-details {
+ margin-top: 2mm;
+}
+
+.field {
+ padding: 1mm;
+}
+
+.help {
+ font-size: small;
+}
+
+.error {
+ background-color: #A81B1B;
+ color: #D1D1D1;
+ padding: 2mm;
+}
+
+.error .error-heading {
+ font-size: 110%;
+ color: whitesmoke;
+}
diff --git a/views/layout.erb b/views/layout.erb
index 4584662..84d3437 100644
--- a/views/layout.erb
+++ b/views/layout.erb
@@ -1,7 +1,8 @@
<!DOCTYPE html>
<html>
<head>
- <link rel="stylesheet" type="text/css" href="<%= url('/styles.css') %>">
+ <link rel="stylesheet" type="text/css" href="<%= url('/styles.css') %>" media="screen and (min-width: 800px)">
+ <link rel="stylesheet" type="text/css" href="<%= url('/mobile-styles.css') %>" media="screen and (max-width: 800px)">
<script src="<%= url('/regform.js') %>"></script>
<meta charset="UTF-8">
<title>Påmeldingsskjema - Norsk Urskog Metal Sampler</title>