serv/surwiki
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Start trying out implementing new layout

Browse source
This commit is contained in:
Magnus Hoff 2018-06-16 10:58:00 +02:00
parent 67ac61ee42
commit 4516534b39
6 changed files with 43 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
assets/style.css
View file

@ -1,10 +1,4 @@
@font-face {
font-family: 'Amatic SC';
font-style: normal;
font-weight: 400;
src: local('Amatic SC Regular'), local('AmaticSC-Regular'),
url('amatic-sc-v9-latin-regular.woff') format('woff');
}
@import "themes.css";
.prototype {
display: none;
@ -17,8 +11,6 @@ html {
}
h1 {
font-family: 'Amatic SC', sans-serif;
font-weight: normal;
font-style: normal;
@ -82,6 +74,22 @@ article>hr {
margin: 30px auto;
}
.hero {
background: var(--theme-main);
color: var(--theme-text);
/* Hack to force containing the children instead of collapsing marigins */
border: 1px solid var(--theme-main);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}
.search-container {
background: var(--theme-main);
color: var(--theme-text);
z-index: 1;
}
header, article>*, .search {
box-sizing: border-box;
max-width: 616px;
@ -97,7 +105,7 @@ header {
}
article {
margin: 0 auto 120px auto;
margin: 50px auto 120px auto;
font-size: 18px;
line-height: 32px;
@ -148,7 +156,7 @@ pre {
}
a {
color: #457796;
color: var(--theme-link);
text-decoration: none;
}
@ -182,15 +190,17 @@ body {
footer {
padding: 0 8px;
padding: 16px 8px 16px 8px;
background: #f8f8f8;
color: #444;
background: var(--theme-main);
color: var(--theme-text);
text-align: center;
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans",
"Droid Sans", "Helvetica Neue", sans-serif;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}
ul.dense {
@ -248,6 +258,11 @@ h1>input {
width: 100%;
}
.hero input {
background: var(--theme-input);
color: var(--theme-text);
}
.shadow-control {
visibility: hidden;
position: fixed;
@ -277,7 +292,8 @@ h1>input {
bottom: 0;
left: 0;
background: #91A238;
background: var(--theme-main);
color: var(--theme-text);
padding: 10px 20px;
}
@ -342,7 +358,8 @@ input[type="search"] {
padding: 0 16px;
margin: 0;
border: 1px solid #ccc;
border: none;
background: var(--theme-input);
font: inherit;
font-size: 18px;
@ -350,7 +367,7 @@ input[type="search"] {
line-height: 32px;
height: 34px;
border-radius: 18px;
border-radius: 2px;
text-overflow: ellipsis;
}

2
templates/about.html
View file

@ -1,7 +1,9 @@
<div class="container">
<div class="hero">
<header>
<h1>About Sausagewiki</h1>
</header>
</div>
<article>
<p>This site is running Sausagewiki, a simple, self-contained wiki engine,

2
templates/article.html
View file

@ -8,9 +8,11 @@
<div class="editor">
<form action="" method="POST">
<div class="hero" style="z-index: -1">
<header>
<h1><input autocomplete=off type=text name=title value="{{title}}" placeholder="Title" required></h1>
</header>
</div>
<article>
<p>

2
templates/article_contents.html
View file

@ -1,6 +1,8 @@
<div class="hero">
<header>
<h1>{{title}}</h1>
</header>
</div>
<article>
{{{rendered}}}

2
templates/layout.html
View file

@ -8,7 +8,7 @@
<link href="_assets/style-{{style_css_checksum()}}.css" rel="stylesheet">
<meta name="generator" content="{{project_name()}} {{version()}}" />
</head>
<body>
<body class="theme-purple">
{{>search_input.html}}
{{{body}}}
</body>

2
templates/search_input.html
View file

@ -1,3 +1,4 @@
<div class="search-container">
<form class="search keyboard-focus-control" action=_search method=GET>
<input data-focusindex="0" type=search name=q placeholder=search autocomplete=off>
<ul class="live-results search-results">
@ -5,3 +6,4 @@
</form>
<ul id="search-result-prototype" class="prototype"><li class="search-result"><a tabindex="0" class="link" href=""><span class="title"></span> &ndash; <span class="snippet"></span></a></li></ul>
<script src="_assets/search-{{search_js_checksum()}}.js" defer></script>
</div>