hack.less wip

master
Ingolf Wagner 2021-08-24 21:18:56 +02:00
parent d1f01dd51e
commit 48af6fa551
Signed by: palo
GPG Key ID: 76BF5F1928B9618B
10 changed files with 188 additions and 107 deletions

View File

@ -17,11 +17,11 @@
</ul>
</nav>
<div id="main-block">
<!--<div id="main-block">-->
{{ block "main" . }}
empty
{{ end }}
</div>
<!--</div>-->
</body>

View File

@ -1,11 +1,18 @@
{{ define "main" }}
<!-- {{ .TableOfContents }}-->
{{ .TableOfContents }}
<!--<div class="content">-->
<header>
<h1>{{ .Title }}</h1>
<div class="date">published {{ .Date | time.Format "January 2006" }}</div>
</header>
<div class="content">
<h1>{{ .Title }}</h1>
<div class="date">published {{ .Date | time.Format "January 2006" }}</div>
{{ .Content }}
</div>
{{ .Content }}
</div>
<!-- </div>-->
{{ end }}

View File

@ -1,4 +1,3 @@
<div class="warning">
{{ .Inner }}
</div>

View File

@ -1,6 +1,7 @@
@font-normal: ~"'Roboto', sans-serif";
@font-code: ~"'Inconsolata', monospace";
@font-header: ~"'Zilla Slab', serif";
//@font-header: ~"'Inconsolata', monospace";
@font-height: 1.7em;
@font-code-height: 1.1em;

View File

@ -0,0 +1,80 @@
@import "color.less";
@import "font.less";
// Header
header {
h1 {
position: relative;
display: table-cell;
padding: 20px 0 30px;
margin: 0;
overflow: hidden
}
h1:after {
content: "====================================================================================================";
position: absolute;
bottom: 10px;
left: 0
}
}
h2:before, h3:before, h4:before, h5:before, h6:before {
display: inline
}
h2:before {
content: "## "
}
h3:before {
content: "### "
}
h4:before {
content: "#### "
}
h5:before {
content: "##### "
}
h6:before {
content: "###### "
}
// Lists
.content {
li {
position: relative;
display: block;
padding-left: 20px;
&:after {
position: absolute;
top: 0;
left: 0
}
}
ul > li:after {
content: "-"
}
ol {
counter-reset: a;
li:nth-child(n+10):after {
left: -7px
}
> li:after {
content: counter(a) ".";
counter-increment: a
}
}
}

View File

@ -0,0 +1,37 @@
// listings of articles
ul.pages-list{
list-style-type: none;
margin-left: .0em;
padding-left: .0em;
li {
a {
padding-left: 1.3em;
padding-right: 1.0em;
padding-top: 1.0em;
padding-bottom: 1.0em;
margin-top: 0.5em;
margin-bottom: 0em;
background-color: @color-pages-list;
border-left: 3px solid @color-pages-list-border;
display: block;
text-align: left;
text-decoration: none;
color: @color-pages-list-text;
h1,h2,h3,h4,h5 {
margin-top: 10px;
margin-bottom: 0px;
text-decoration: underline;
}
p {
margin-top: 10px;
}
}
}
}

View File

@ -1,10 +1,13 @@
@import "color.less";
@import "font.less";
body {
#main-navigation {
//background-color: @color-nav-background;
//position: fixed;
width: 100%;
display: grid;
display: grid; // todo: no need for grids
grid-template-columns: 1fr minmax(100px, 800px) 1fr;
grid-template-areas:
". menu .";

View File

@ -0,0 +1,34 @@
//body {
// nav#TableOfContents {
// grid-area: sidebar;
//
// font-family: @font-sidebar;
// color: @color-sidebar-font;
//
// > ul {
// position: fixed;
// }
//
// ul {
//
// list-style-type: none;
// margin-left: .0em;
// padding-left: .6em;
// }
//
//
// a:link,a:visited,a:active {
// text-decoration: none;
// color: @color-sidebar-font;
// }
// a:hover {
// text-decoration: underline;
// color: @color-sidebar-font;
// }
// }
//}
//@media @non-desktop {
// body nav#TableOfContents {
// display: none;
// }
//}

View File

@ -4,6 +4,9 @@
@import "media-types.less";
@import "font.less";
@import "main-navigation.less";
@import "main-hack.less";
@import "main-toc.less";
@import "main-listing.less";
// left and right for notes and warning and and code blocks
@special-info-padding-side: 0.5em;
@ -11,111 +14,29 @@
body {
margin: 0px;
#main-block{
//padding-top: 49px;
font-family: @font-normal;
line-height: @font-height;
display: grid;
grid-template-columns: 1fr minmax(100px,800px) 1fr;
grid-template-areas:
". content sidebar";
header{
width: 800px;
margin-left: auto;
margin-right: auto;
}
.content {
font-family: @font-normal;
line-height: @font-height;
grid-area: content;
.date {
text-align: right;
margin-right: 10px;
h2,h3,h4,h5,h6,p,pre,div,ul,table,figure,ol{
width: 800px;
margin-left: auto;
margin-right: auto;
}
}
}
// listings of articles
ul.pages-list{
list-style-type: none;
margin-left: .0em;
padding-left: .0em;
li {
a {
padding-left: 1.3em;
padding-right: 1.0em;
padding-top: 1.0em;
padding-bottom: 1.0em;
margin-top: 0.5em;
margin-bottom: 0em;
background-color: @color-pages-list;
border-left: 3px solid @color-pages-list-border;
display: block;
text-align: left;
text-decoration: none;
color: @color-pages-list-text;
h1,h2,h3,h4,h5 {
margin-top: 10px;
margin-bottom: 0px;
text-decoration: underline;
}
p {
margin-top: 10px;
}
}
}
}
@media @non-desktop {
body nav#TableOfContents {
display: none;
}
}
body {
nav#TableOfContents {
grid-area: sidebar;
font-family: @font-sidebar;
color: @color-sidebar-font;
> ul {
position: fixed;
}
ul {
list-style-type: none;
margin-left: .0em;
padding-left: .6em;
}
a:link,a:visited,a:active {
text-decoration: none;
color: @color-sidebar-font;
}
a:hover {
text-decoration: underline;
color: @color-sidebar-font;
}
}
}
.block-margin {
margin-top: .65em;
margin-bottom: .65em;
}
h1,h2,h3,h4 {
font-family: @font-header;
font-size: 1.3rem;
}
// ???
.block-margin {
margin-top: .65em;
margin-bottom: .65em;
}

View File

@ -1,4 +1,3 @@
@desktop: ~"(min-width: 1180px)";
@non-desktop: ~"(max-width: 1200px)";