diff --git a/resources/public/content/stylesheet.css b/resources/public/content/stylesheet.css index 41020bb..a99315b 100644 --- a/resources/public/content/stylesheet.css +++ b/resources/public/content/stylesheet.css @@ -82,10 +82,6 @@ header h1 { margin-top: 0; } -header img { - float: right; -} - input { background-color: white; } @@ -115,14 +111,6 @@ label { display: inline-block; } -menu li { - display: inline; -} - -menu li::before { - content: "|| "; -} - table { border: 2px solid black; border-collapse: collapse; @@ -147,58 +135,6 @@ th { ## ids generally in document order */ -/* top-of-page navigation, not editable, provided by Smeagol */ -#nav{ - margin: 0; - padding: 0; - top: 0; - width: 100%; - _position: absolute; - _top: expression(document.documentElement.scrollTop); - z-index: 149; - background:rgba(40,40,40,0.8); -} - -#user { - font-height: 66%; - float: right; - padding: 0.1em 0.75em; - margin: 0; - color: white; -} - -#user a { - color: silver; -} - -/* only needed for fly-out menu effect on tablet and phone stylesheets */ -#nav-icon { - display: none; -} - -#nav-menu { - margin: 0; - padding: 0; -} - -#nav ul li { - padding: 0; - margin: 0; - display: inline; -} - -#nav ul li a { - color: white; - text-decoration: none; - font-weight: bold; - padding: 0.1em 0.75em; - margin: 0; -} - -#nav ul li.active a { background: silver;} -li.nav-item a:hover { background: rgb( 240, 240, 240) } -li.nav-item a:active { background: gray; color: white; } - /* Overall container div, holds all content of page. Yes, I know it shouldn't have fixed width */ #main-container{ } @@ -211,14 +147,6 @@ li.nav-item a:active { background: gray; color: white; } float: left; } -/* content of the current in the Wiki - editable, provided by users. Within main-container */ -#content { - border: thin solid silver; - width: 80%; - float: right; - padding-bottom: 5em; -} - /* cookies information box, fixed, in right margin, just above footer */ #cookies { width: 30%; @@ -312,3 +240,197 @@ li.nav-item a:active { background: gray; color: white; } margin: 0; } +/* desktops and laptops, primarily. Adapted to mouse; targets may be small */ +@media all and (min-device-width: 1025px) { + /* content of the current page in the Wiki - editable, provided by users. Within main-container */ + #content { + border: thin solid silver; + width: 80%; + float: right; + padding-bottom: 5em; + } + + #phone-side-bar, #phone-credits { + display: none; + } + + /* top-of-page navigation, not editable, provided by Smeagol */ + #nav{ + margin: 0; + padding: 0; + top: 0; + width: 100%; + _position: absolute; + _top: expression(document.documentElement.scrollTop); + z-index: 149; + background:rgba(40,40,40,0.8); + } + + /* only needed for fly-out menu effect on tablet and phone stylesheets */ + #nav-icon { + display: none; + } + + #nav-menu { + margin: 0; + padding: 0; + } + + #nav menu li { + padding: 0; + margin: 0; + display: inline; + } + + #nav menu li a { + color: white; + text-decoration: none; + font-weight: bold; + padding: 0.1em 0.75em; + margin: 0; + } + + #nav menu li.active a { background: gray;} + li.nav-item a:hover { background: rgb( 240, 240, 240) } + li.nav-item a:active { background: gray; color: white; } + + #nav menu li#user { + padding: 0 1em; + float: right; + } +} + +/* tablets, primarily. Adapted to touch; targets are larger */ +@media all and (min-device-width: 769px) and (max-device-width: 1024px) { +/* content of the current in the Wiki - editable, provided by users. Within main-container */ + #content { + border: thin solid silver; + width: 80%; + float: right; + padding-bottom: 5em; + } + + #nav{ + margin: 0; + padding: 0; + position: fixed; + z-index: 149; + background:rgba(40,40,40,0.8); + font-size: larger; + } + + #nav:hover #nav-menu { + display: inline; + } + + #nav-icon { + padding: 0.25em; + float: left; + } + + #nav-menu { + display: none; + } + + #nav ul li { + padding: 0; + margin: 0; + display: inline; + } + + #nav ul li a { + color: white; + text-decoration: none; + font-weight: bold; + padding: 0.1em 0.75em; + margin: 0; + } + #nav ul li.active a { background: silver;} + li.nav-item a:hover { background: rgb( 240, 240, 240) } + li.nav-item a:active { background: gray; color: white; } +} + +/* phones, and, indeed, smaller phones. Adapted to touch; display radically + * decluttered */ +@media all and (max-device-width: 768px) { + footer { + display: none; + } + + h1 { + /* I wouldn't normally use a px value, but the menu icon is 49px wide */ + padding: 0.25em 5%; + text-align: right; + } + + /* content of the current in the Wiki - editable, provided by users. Within main-container */ + #content { + border: thin solid silver; + width: 100%; + padding-bottom: 2em; + } + + #main-container { + width: 100%; + margin: 0; + padding: 0; + } + + + #cookies { + display: none; + } + + #nav{ + margin: 0; + padding: 0; + position: fixed; + z-index: 149; + color: silver; + background:rgba(40,40,40,0.9); + font-size: 200%; + } + + #nav a { + color: white; + text-decoration: none; + font-weight: bold; + } + + #nav:hover #nav-menu, #nav:hover #phone-side-bar { + display: block; + list-style-type: none; + width: 100%; + } + + #nav-icon { + padding: 0; + } + + #nav-menu, #phone-side-bar { + display: none; + } + + #nav menu li { + padding: 0.5em; + margin: 0.5 em; + font-size: 150%; + } + + #nav menu li a { + } + + #nav ul li.active a { background: silver;} + li.nav-item a:hover { background: rgb( 240, 240, 240) } + li.nav-item a:active { background: gray; color: white; } + + #nav menu #user { + text-decoration: none; + font-weight: bold; + margin: 0; + } + + #side-bar { + display: none; + } +} diff --git a/resources/public/css/tablet.css b/resources/public/css/tablet.css index 714c179..78d736a 100644 --- a/resources/public/css/tablet.css +++ b/resources/public/css/tablet.css @@ -42,13 +42,13 @@ body { display: none; } -#nav ul li { +#nav menu li { padding: 0; margin: 0; display: inline; } -#nav ul li a { +#nav menu li a { color: white; text-decoration: none; font-weight: bold; diff --git a/resources/public/img/three-lines.png b/resources/public/img/three-lines.png new file mode 100644 index 0000000..a46f20e Binary files /dev/null and b/resources/public/img/three-lines.png differ diff --git a/resources/public/img/three-lines.svg b/resources/public/img/three-lines.svg new file mode 100644 index 0000000..c97c8c9 --- /dev/null +++ b/resources/public/img/three-lines.svg @@ -0,0 +1,88 @@ + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/resources/public/img/three-lines.xcf b/resources/public/img/three-lines.xcf new file mode 100644 index 0000000..23b8a42 Binary files /dev/null and b/resources/public/img/three-lines.xcf differ diff --git a/resources/public/img/threelines.png b/resources/public/img/threelines.png deleted file mode 100644 index f26babb..0000000 Binary files a/resources/public/img/threelines.png and /dev/null differ diff --git a/resources/templates/base.html b/resources/templates/base.html index bc71820..eacb5a1 100644 --- a/resources/templates/base.html +++ b/resources/templates/base.html @@ -3,7 +3,7 @@ {{config.site-title}}: {{title}} - + {% block extra-headers %} {% endblock %} @@ -12,22 +12,36 @@

{{config.site-title}}: {{title}}

{{header|safe}} diff --git a/resources/templates/history.html b/resources/templates/history.html index 72a7749..20f6137 100644 --- a/resources/templates/history.html +++ b/resources/templates/history.html @@ -1,7 +1,7 @@ {% extends "templates/base.html" %} {% block content %}
- +
diff --git a/src/smeagol/routes/wiki.clj b/src/smeagol/routes/wiki.clj index 2e7f1a5..52f7aba 100644 --- a/src/smeagol/routes/wiki.clj +++ b/src/smeagol/routes/wiki.clj @@ -225,6 +225,7 @@ :header (util/local-links (util/md->html "/content/_header.md")) :message (if changed? (:chpass-success layout/config)) :error (cond + (nil? oldpass) nil changed? nil (< (count pass1) 8) (:chpass-too-short layout/config) (not (= pass1 pass2)) (:chpass-bad-match layout/config)
{{config.when-col-hdr}} {{config.what-col-hdr}}