<t:style t:include="resource:extra/webapps/blogs/blogs.css" />
<nav>
- <div class="navrow">
-
<t:a t:href="$blogs/">All Posts</t:a>
<t:a t:href="$blogs/by">My Posts</t:a>
<t:a t:href="$blogs/new-post">New Post</t:a>
<t:button t:action="$login-realm/logout" t:aside="begin" class="link-button link">Logout</t:button>
</t:if>
-
- </div>
</nav>
<div class="page">
<t:style t:include="resource:extra/webapps/pastebin/pastebin.css" />
<nav>
- <div class="navrow">
<a href="https://factorcode.org"><img src="https://factorcode.org/favicon.ico" width="24" height="24" /></a>
<t:a t:href="$pastebin">Pastes</t:a>
<t:button t:action="$login-realm/logout" t:aside="begin" class="link-button link">Logout</t:button>
</t:if>
- </div>
</nav>
<div class="page">
<t:style t:include="resource:extra/webapps/planet/planet.css" />
<nav>
- <div class="navrow">
<a href="https://factorcode.org"><img src="https://factorcode.org/favicon.ico" width="24" height="24" /></a>
<t:a t:href="$planet">Front Page</t:a>
<t:button t:action="$login-realm/logout" t:aside="begin" class="link-button link">Logout</t:button>
</t:if>
- </div>
</nav>
<div class="page">
<body>
<nav>
- <div class="navrow">
<t:a t:href="$todo-list/list">List Items</t:a>
<t:a t:href="$todo-list/new">Add Item</t:a>
</t:if>
<t:button t:action="$login-realm/logout" t:aside="begin" class="link-button link">Logout</t:button>
- </div>
</nav>
<div class="page">
<t:call-next-template />
<nav>
- <div class="navrow">
<t:a t:href="$wiki/view" t:rest="title">Latest</t:a>
<t:a t:href="$wiki/revisions" t:rest="title">Revisions</t:a>
<t:a t:href="$wiki/edit" t:rest="title" rel="nofollow">Edit</t:a>
<t:button t:action="$wiki/delete" t:for="title" class="link-button link">Delete</t:button>
- </div>
</nav>
</t:chloe>
<div id="left">
<t:if t:value="contents">
- <t:script t:include="resource:extra/webapps/wiki/wiki-contents.js" />
- <t:style t:include="resource:extra/webapps/wiki/wiki-contents.css" />
+ <t:script t:include="resource:extra/webapps/wiki/wiki.js" />
+
<div class="contents">
<t:bind t:name="contents">
<h2>
<div id="right">
<nav>
- <div class="navrow">
-
<t:if t:value="contents">
<img id="menu" onclick="toggleSidebar()" src="data:image/svg+xml;utf8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 xmlns:xlink=%27http://www.w3.org/1999/xlink%27 width=%2724%27 height=%2724%27 viewBox=%270 0 100 100%27 fill=%27rgb(0,0,0)%27%3E%3Crect x=%2710%27 y=%2720%27 width=%2780%27 height=%2712%27 rx=%276%27 /%3E%3Crect x=%2710%27 y=%2744%27 width=%2780%27 height=%2712%27 rx=%276%27 /%3E%3Crect x=%2710%27 y=%2768%27 width=%2780%27 height=%2712%27 rx=%276%27 /%3E%3C/svg>" />
</t:if>
<t:button t:action="$login-realm/logout" t:aside="begin" class="link-button link">Logout</t:button>
</t:if>
-
- </div>
</nav>
<div class="page">
+++ /dev/null
-#left {
- float: left;
- width: 200px;
- z-index: 99;
- border-right: 1px solid #ccc;
- background: #f3f2ea;
-}
-
-#right {
- margin-left: 200px;
- width: calc(100% - 200px);
-}
-
-nav img {
- margin: -15px;
- margin-top: -19px;
- margin-right: 0px;
- padding: 15px;
- padding-top: 13px;
- padding-bottom: 11px;
- vertical-align: middle;
- display: none;
-}
-
-.navrow {
- left: 0;
-}
-
-.page {
- max-width: 800px;
- left: 0;
-}
-
-.page nav {
- position: relative;
- width: calc(100vw - 200px);
- left: 0;
-}
-
-@media screen and (max-width: 600px) {
- #left {
- position: absolute;
- margin-top: 32px;
- display: none;
- }
-
- #right {
- margin-left: 0;
- width: 100vw;
- }
-
- nav img {
- display: inline;
- }
-
- .page nav {
- width: 100vw;
- }
-}
-
-
-/* Dark mode */
-@media (prefers-color-scheme: dark) {
- nav img {
- filter: invert(80%);
- }
-
- #left {
- background-color: #373e48;
- border-right: 1px solid #666;
- }
-
- .description pre {
- color: black;
- }
-}
+++ /dev/null
-function toggleSidebar() {
- var l = document.getElementById("left");
- var m = document.getElementById("menu");
- if (l.style.display === "") {
- l.style.display = "inline";
- var darkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
- if (!darkMode) {
- m.style.backgroundColor = "#f3f2ea";
- }
- } else {
- l.style.display = "";
- m.style.backgroundColor = "";
- }
-}
padding-left: 15px;
font-size: smaller;
}
+
+#left {
+ float: left;
+ width: 200px;
+ z-index: 99;
+ border-right: 1px solid #ccc;
+ background: #f3f2ea;
+}
+
+#right {
+ margin-left: 200px;
+ width: calc(100% - 200px);
+}
+
+nav img {
+ margin: -15px;
+ margin-top: -19px;
+ margin-right: 0px;
+ padding: 15px;
+ padding-top: 13px;
+ padding-bottom: 11px;
+ vertical-align: middle;
+ display: none;
+}
+
+.page {
+ max-width: 800px;
+ left: 0;
+}
+
+.page nav {
+ position: relative;
+ width: calc(100vw - 200px);
+ left: 0;
+}
+
+@media screen and (max-width: 600px) {
+ #left {
+ position: absolute;
+ margin-top: 32px;
+ display: none;
+ }
+
+ #right {
+ margin-left: 0;
+ width: 100vw;
+ }
+
+ nav img {
+ display: inline;
+ }
+
+ .page nav {
+ width: 100vw;
+ }
+}
+
+
+/* Dark mode */
+@media (prefers-color-scheme: dark) {
+ nav img {
+ filter: invert(80%);
+ }
+
+ #left {
+ background-color: #373e48;
+ border-right: 1px solid #666;
+ }
+
+ .description pre {
+ color: black;
+ }
+}
box-sizing: inherit;
}
-body {
+html, body {
margin: 0;
+ padding: 0;
}
body, button {
nav {
border-bottom: 1px solid #ccc;
background-color: #f5f5f5;
+ padding: 15px;
+ padding-left: calc(max(50% - 500px, 15px));
}
-.navrow {
- max-width: 1000px;
- position: relative;
- left: calc(max(-500px,-50%) + 50%);
- margin: 0;
- padding: 10px 15px 10px 15px;
-}
-
-.navrow a, .navrow .link {
- margin-right: 10px;
+nav a, nav .link {
+ margin-right: 5px;
}
-.navrow img {
+nav img {
vertical-align: middle;
}
projects / factor.git / commitdiff