stefan
/
husk
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added onedark.css

This commit is contained in:
gurkenhabicht 2022-09-24 20:06:27 +02:00
parent 5df566bea9
commit a565c3867f
4 changed files with 133 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
static/js/search.js
View File

@ -83,7 +83,7 @@ $( document ).ready(function() {
divsuggestion.setAttribute("data-title", item.title);
divsuggestion.setAttribute("data-uri", item.uri);
divsuggestion.setAttribute("data-context", item.context);
divsuggestion.innerText = '>> ' + item.title;
divsuggestion.innerText = '\u23A2 ' + item.title;
divsuggestion.appendChild(divcontext);
return divsuggestion.outerHTML;
},

112
static/onedark.css Normal file
View File

@ -0,0 +1,112 @@
html *{ font-family: Dejavu Sans Mono, MesloGS NF, Menlo, Consolas, Monospace !important; }
body { text-decoration: none; color: #979FAD; background-color: #2F333D;}
blockquote { text-align: center; font-size: 16px; font-style: normal; line-height: 30px;}
pre { background-color: #282C34;color: #979FAD;border: 1px solid #282C34; font-size: 14px; padding-left: 2ch;padding-top:2ch; padding-bottom: 2ch; line-height: 18px; overflow: auto; }
code { background-color: #282C34; color: #979FAD; }
hr { height: 0px; }
a {color: inherit; text-decoration: solid underline;}
a:hover {color: #2979FF;}
details > summary{ background-color: #3A3F4B; font-size: 18px;}
details > summary:hover { background-color: #2F333D;}
details summary::-webkit-details-marker,
details summary::marker { content: "\1F4C1\20";}
.menu { line-height: 1em; font-size: 32px; line-height: 1em; text-decoration: none; }
.HolyGrail,
.HolyGrail-body {
display: flex;
flex-direction: column;
}
.HolyGrail-nav {
padding-right: 1em;
padding-top: 1em;
order: -1;
background-color: #3A3F4B;
}
@media (min-width: 48em) {
.HolyGrail-body {
flex-direction: row;
flex: 1;
text-align: left;
}
.HolyGrail-content {
flex: 1;
text-align: left;
margin-left: 1em;
margin-right: 1em;
border-top: 1px solid #979FAD; border-bottom: 1px solid #979FAD;
}
.HolyGrail-nav, .HolyGrail-ads {
/* 12em is the width of the columns */
flex: 0 0 14em;
background-color: #3A3F4B;
}
.HolyGrail-ads ul li {
list-style-type: none!important;
text-align: left;
border: none;
white-space: normal;
}
.HolyGrail-nav ul {
list-style-type: none!important;
padding-left : 0.3em;
margin: 0em;
text-align: left;
}
.HolyGrail-nav li {
list-style-type: none!important;
padding-left : 1em;
margin: 0em;
text-align: left;
}
.HolyGrail-nav a{
overflow-wrap: break-word;
}
.HolyGrail-nav a:hover{
}
.HolyGrail-nav a:before{
content: "";
}
.HolyGrail-ads ul{
padding-left: 0.5em;
padding-right: 0;
}
.HolyGrail-ads ul li:before {
content: "\203B\20";
}
}
.search-container{
position: relative;
}
.search-container input {
display: inline-block;
align: center;
margin-top: 8px;
margin-bottom: 16px;
width: 30%;
height: 42px;
background-color: #3A3F4B;
border: 1px solid #282C34;
font-weight: 20px;
color: #979FAD;
cursor: pointer;
}
.search-container input:focus {
border: 2px solid #282C34;
outline: 0 none;
}

43
static/stylesheet.css
View File

@ -1,26 +1,16 @@
html *{ font-family: Dejavu Sans Mono, MesloGS NF, Menlo, Consolas, Monospace !important; color: #222;}
body { text-decoration: none; color: #263238;}
h1 { font-size: 28px; }
h2 { font-size: 22px; margin-bottom: 2px; }
h3 { font-size: 14px; }
p { font-size: 16px; }
html *{ font-family: Dejavu Sans Mono, MesloGS NF, Menlo, Consolas, Monospace !important; }
body { text-decoration: none; color: #979FAD; background-color: #2F333D;}
blockquote { text-align: center; font-size: 16px; font-style: normal; line-height: 30px;}
pre { background-color: #263238;color: #eeffff;border: 1px solid #ddd; font-size: 14px; padding-left: 2ch;padding-top:2ch; padding-bottom: 2ch; line-height: 18px; overflow: auto; }
code { background-color: #263238; color: #eeffff; }
pre { background-color: #282C34;color: #979FAD;border: 1px solid #282C34; font-size: 14px; padding-left: 2ch;padding-top:2ch; padding-bottom: 2ch; line-height: 18px; overflow: auto; }
code { background-color: #282C34; color: #979FAD; }
hr { height: 0px; }
a {color: inherit; text-decoration: solid underline;}
a:hover {color: red;}
img { max-width: 100%; }
details { }
details > summary{ background-color: #eee; font-size: 18px;}
details > summary:hover { background-color: #263238; color: #eee;}
a:hover {color: #2979FF;}
details > summary{ background-color: #3A3F4B; font-size: 18px;}
details > summary:hover { background-color: #2F333D;}
details summary::-webkit-details-marker,
details summary::marker { content: "\1F4C1\20";}
ul {}
ul:active {}
.menu { line-height: 1em; font-size: 24px; line-height: 1em; text-decoration: none; }
.menu { line-height: 1em; font-size: 32px; line-height: 1em; text-decoration: none; }
.HolyGrail,
.HolyGrail-body {
@ -32,14 +22,13 @@ ul:active {}
padding-right: 1em;
padding-top: 1em;
order: -1;
background-color: #eee;
background-color: #3A3F4B;
}
@media (min-width: 48em) {
.HolyGrail-body {
flex-direction: row;
flex: 1;
border-top: 1px solid #263238; border-bottom: 1px solid #263238;
text-align: left;
}
@ -48,12 +37,13 @@ ul:active {}
text-align: left;
margin-left: 1em;
margin-right: 1em;
border-top: 1px solid #979FAD; border-bottom: 1px solid #979FAD;
}
.HolyGrail-nav, .HolyGrail-ads {
/* 12em is the width of the columns */
flex: 0 0 14em;
background-color: #eee;
background-color: #3A3F4B;
}
@ -82,7 +72,6 @@ ul:active {}
}
.HolyGrail-nav a:hover{
background-color: #263238; color: #eee;
}
.HolyGrail-nav a:before{
@ -96,7 +85,7 @@ ul:active {}
.HolyGrail-ads ul li:before {
content: "\00BB\20";
content: "\203B\20";
}
}
@ -111,13 +100,13 @@ ul:active {}
margin-bottom: 16px;
width: 30%;
height: 42px;
background-color: #eee;
border: 1px solid #263238;
background-color: #3A3F4B;
border: 1px solid #282C34;
font-weight: 20px;
color: #263238;
color: #979FAD;
cursor: pointer;
}
.search-container input:focus {
border: 2px solid #263238;
border: 2px solid #282C34;
outline: 0 none;
}

8
templates/template.html
View File

@ -15,22 +15,22 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
{% endblock %}
</head>
<body class="HolyGrail">
<header>
<div class="menu">
<a href="{{ url_for('content') }}" style="text-decoration:none">Husk</a>
</div>
<div class="search-container">
<label for="search-by"><i class="fas fa-search"></i></label>
<input data-search-input="" id="search-by" type="search" placeholder="Search..." autocomplete="off">
<input data-search-input="" id="search-by" type="search" placeholder=" Search..." autocomplete="off">
<!--button type="submit"><i class="search"></i>&#128269;</button>-->
<span data-search-clear=""><i class="fas fa-times"></i></span>
<p></p>
</div>
</div>
</header>
<div class="HolyGrail-body">
<nav class="HolyGrail-nav">
<ul>