more styles..

This commit is contained in:
Dooho Yi 2021-01-07 02:51:00 +09:00
parent 16ca89a0a2
commit ff122bede4
6 changed files with 466 additions and 356 deletions

View file

@ -1,347 +0,0 @@
body {
display: flex;
flex-direction: column;
margin: 0;
padding-left: 1em;
padding-right: 1em;
padding-top: 1em;
}
body {
font: 1em/1.5 AppleGothic, NanumGothic, Sans-serif;
letter-spacing: +0.02em;
word-spacing: +0.2em;
color: rgba(100, 255, 200, 1.0);
background-color: rgba(0, 20, 40, 1.0);
}
#header {
padding-bottom: 3em;
}
#header::after {
content: "lost|traIn";
font-size: 3.6em;
font-weight: 700;
opacity: 0.3;
color: rgba(100, 255, 200, 0.5);
}
figure {
margin: 0;
padding: 0;
}
div {
margin-top: 0;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding: 0;
max-width: unset;
}
.plain div {
white-space: pre-line;
}
a,
a:link,
a:visited {
text-decoration: none;
color: rgba(100, 255, 200, 1.0);
border: 1px solid rgba(100, 255, 200, .25);
}
a:hover {
color: hotpink;
}
.unfolded {
display: flex;
flex-direction: column;
}
.audio {
display: block;
}
.unfolded>a:nth-child(1) {
font-size: 1.1em;
color: rgba(100, 255, 200, 0.5);
font-weight: 700;
border: unset;
margin-bottom: 1em;
padding-left: 0;
}
.unfolded>div {
padding-left: 0.5em;
}
body>.unfolded {
margin-top: 2em;
}
.dir::before {
content: "";
font-size: unset;
}
.unkown-file::before {
content: "";
font-size: unset;
}
audio::-webkit-media-controls-panel {
background-color: rgba(50, 135, 120, 1.0);
}
.image {
max-width: 700px;
}
a[href^="../"] {
visibility: hidden;
}
a[href^="../"]::before {
visibility: visible;
content: "«";
padding-top: 1em;
padding-bottom: 2em;
}
/* audio {
}
*/
/* * {
box-sizing: border-box;
}
body {
top:0;
left: 0;
width: calc(100% - 10em);
min-width: 1024px;
padding: 2em 3em;
background-color: #e9d8fd;
font-size: 17px;
line-height: 1.3;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
}
a {
color:magenta;
}
a:visited {
color:magenta;
}
a[href^="../"] {
visibility: hidden;
}
a[href^="../"]::before {
visibility: visible;
content: "← BACK";
font-size: 12pt;
color: white;
font-family: monospace;
position: fixed;
background-color: magenta;
width: 100%;
top: 0;
left: 0;
padding: 0.35em;
}
.dir > a {
color:#ff1a75;
}
.dir > a:visited {
color:#ff1a75;
}
.footnotes {
font-size:14px;
color:#222;
}
.filename,
figcaption{
display: block;
font-size: 13px;
margin-top:1em;
}
div.html {
width:50%;
margin-bottom: 5em;
margin-right:5%;
}
pre{
white-space: pre-wrap;
}
div.pdf{
width:40%;
margin-right:5%;
height: 800px;
}
div.pdf object.pdf{
width:100%;
height: 90%;
}
img{
width:90%;
}
.plain::before {
display: block;
width: 150px;
content:"Other files: ";
padding-bottom:1em;
}
.plain > a {
color:magenta;
display:block;
word-wrap:break-word;
}
.plain{
position: absolute;
top:10em;
right:2em;
width:255px;
padding-left:7%;
font-size:13px;
color:#333;
}
div.dir::before{
content:"";
}
div.dir{
background-color: white;
border-top: 3px solid black;
border-bottom: 3px solid #ff1a75;
border-radius: 14px;
float: left;
display: block;
margin: calc(1em - 3px) 0;
padding:1em;
color:#ff1a75;
font-size:16px;
}
#menuBar {
margin-bottom:5%;
width:95%;
min-width: 900px;
}
img.logo{
width: 100px;
height: auto;
}
em.moddate{
font-size: 8pt;
margin-top:3em;
}
h2#colophon{
page-break-before: always;
}
#WELCOME.html{
color:magenta;
}
.bibliotecha {
background-color: lemonchiffon !important;
}
.homebrewserver {
background-color: peachpuff !important;
}
.homebrewserver .toc, .homebrewserver #forkongithub, header#banner {display:none;}
.homebrewserver .entry-title{
font-size:27px;
font-weight: bold;
}
.homebrewserver h2{
font-size:20px;
}
.relearn {
background-color: powderblue !important;
}
.relearn .printimg{
display: none;
}
.pad {
position: relative;
display: block;
margin-top: 5em;
}
.pad + hr{
display: none;
}
#nooo\.relearn\.call\.for\.tracks a:after{
content: "";
}
#nooo\.relearn\.call\.for\.tracks a.footnote{
display: none;
}
.relearn iframe{
display: block;
width: 100%;
height: 500px;
margin:1em 0;
background-color: white;
border:0;
}
@media (max-width: 767px) {
body {
min-width: 100%;
padding: 1em;
margin: 0;
}
#menuBar {
width: 100%;
min-width: auto;
float: none;
}
#folder {
width: 100%;
margin: 0.2em 0;
}
.plain {
display: none;
}
div.html {
width: 100%;
margin-right: 0;
margin-bottom: 2em;
}
div.pdf {
display: none;
}
img {
width: 100%;
}
} */

View file

@ -5,19 +5,13 @@ html_head = """
<head>
<!-- Generated with distribusi https://git.vvvvvvaria.org/varia/distribusi -->
<meta name="generator" content="distribusi" />
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
.image{max-width: 100%%;}
.pdf object{width:640px;height: 640px;}
.dir::before{content:"📁 ";font-size:18px;}
.filename{display:block;font-family:mono;}
.unkown-file::before{content:"📄 ";font-size:18px;}
div{max-width: 640px;display:inline-block;vertical-align:top;margin:1em;padding:1em;}
video {width:640px;max-height:640px;}
%s
</style>
</head>
<body>
<div id="header"></div>
"""
html_footer = """

2
run.sh
View file

@ -1,4 +1,4 @@
#!/bin/bash
pip install -r py3/requirements.txt
python run.py -d ./data/ -nf -s custom.css --no-hidden --unfolding
python run.py -d ./data/ -nf -s styles/dark.css --no-hidden --unfolding

152
styles/aurora.css Normal file
View file

@ -0,0 +1,152 @@
/************************************
originally from distribusi START >>>
************************************/
/* .image {
max-width: 100%%;
} */
.pdf object {
width: 640px;
height: 640px;
}
/* .dir::before {
content: "📁 ";
font-size: 18px;
} */
.filename {
display: block;
font-family: mono;
}
/* .unkown-file::before {
content: "📄 ";
font-size: 18px;
} */
div {
/* max-width: 640px; */
display: inline-block;
vertical-align: top;
/* margin: 1em;
padding: 1em; */
}
video {
width: 640px;
max-height: 640px;
}
/*************************************
<<< END of originally from distribusi
*************************************/
/* layout */
div {
margin-bottom: 1em;
}
.plain div {
white-space: pre-line;
}
figure {
margin: 0;
padding: 0;
}
.audio {
display: block;
}
.image {
max-width: 700px;
}
body {
display: flex;
flex-direction: column;
margin: 0;
padding-left: 1em;
padding-right: 1em;
padding-top: 1em;
scrollbar-width: none;
}
body::-webkit-scrollbar {
width: 0;
height: 0;
}
#header {
padding-bottom: 3em;
}
.unfolded {
display: flex;
flex-direction: column;
}
.unfolded>div {
padding-left: 0.5em;
}
body>.unfolded {
margin-top: 2em;
}
/* theme */
body {
font: 1em/1.5 AppleGothic, NanumGothic, Sans-serif;
letter-spacing: +0.02em;
word-spacing: +0.2em;
color: rgba(100, 255, 200, 1.0);
background-color: rgba(0, 20, 40, 1.0);
}
#header::after {
content: "lost|traIn";
font-size: 3.6em;
font-weight: 700;
opacity: 0.3;
color: rgba(100, 255, 200, 0.5);
}
a,
a:link,
a:visited {
text-decoration: none;
color: rgba(100, 255, 200, 1.0);
border: 1px solid rgba(100, 255, 200, .25);
}
a:hover {
color: hotpink;
}
.unfolded>a:nth-child(1) {
font-size: 1.1em;
color: rgba(100, 255, 200, 0.5);
font-weight: 700;
border: unset;
margin-bottom: 1em;
padding-left: 0;
}
audio::-webkit-media-controls-enclosure {
background-color: rgba(50, 135, 120, 1.0);
}
a[href^="../"] {
visibility: hidden;
}
a[href^="../"]::before {
visibility: visible;
content: "«";
padding-top: 1em;
padding-bottom: 2em;
}

162
styles/dark.css Normal file
View file

@ -0,0 +1,162 @@
/************************************
originally from distribusi START >>>
************************************/
/* .image {
max-width: 100%%;
} */
.pdf object {
width: 640px;
height: 640px;
}
/* .dir::before {
content: "📁 ";
font-size: 18px;
} */
.filename {
display: block;
font-family: mono;
}
/* .unkown-file::before {
content: "📄 ";
font-size: 18px;
} */
div {
/* max-width: 640px; */
display: inline-block;
vertical-align: top;
/* margin: 1em;
padding: 1em; */
}
video {
width: 640px;
max-height: 640px;
}
/*************************************
<<< END of originally from distribusi
*************************************/
/* layout */
div {
margin-bottom: 1em;
}
.plain div {
white-space: pre-line;
}
figure {
margin: 0;
padding: 0;
}
.audio {
display: block;
}
.image {
max-width: 700px;
}
body {
display: flex;
flex-direction: column;
margin: 0;
padding-left: 1em;
padding-right: 1em;
padding-top: 1em;
scrollbar-width: none;
}
body::-webkit-scrollbar {
width: 0;
height: 0;
}
#header {
padding-bottom: 3em;
}
.unfolded {
display: flex;
flex-direction: column;
}
.unfolded>div {
padding-left: 0.5em;
}
body>.unfolded {
margin-top: 2em;
}
/* theme */
body {
font: 1em/1.5 AppleGothic, NanumGothic, Sans-serif;
letter-spacing: +0.02em;
word-spacing: +0.2em;
color: rgba(127, 127, 127, 1.0);
background-color: rgba(20, 20, 20, 1.0);
}
#header::after {
content: "lost|traIn";
font-size: 3.6em;
font-weight: 700;
opacity: 0.3;
color: rgba(127, 127, 127, 0.5);
}
a,
a:link,
a:visited {
text-decoration: none;
color: rgba(127, 127, 127, 1.0);
border: 1px solid rgba(127, 127, 127, .25);
/* color: rgba(0, 0, 0, 0.5); */
/* border: 1px solid rgba(0, 0, 0, .25); */
}
a:hover {
color: hotpink;
}
.unfolded>a:nth-child(1) {
font-size: 1.1em;
color: rgba(127, 127, 127, 0.5);
font-weight: 700;
border: unset;
margin-bottom: 1em;
padding-left: 0;
}
audio::-webkit-media-controls-enclosure {
background-color: rgba(50, 50, 50, 1.0);
}
audio::-webkit-media-controls-current-time-display {
text-shadow: none;
}
audio::-webkit-media-controls-time-remaining-display {
text-shadow: none;
}
a[href^="../"] {
visibility: hidden;
}
a[href^="../"]::before {
visibility: visible;
content: "«";
padding-top: 1em;
padding-bottom: 2em;
}

149
styles/white.css Normal file
View file

@ -0,0 +1,149 @@
/************************************
originally from distribusi START >>>
************************************/
/* .image {
max-width: 100%%;
} */
.pdf object {
width: 640px;
height: 640px;
}
/* .dir::before {
content: "📁 ";
font-size: 18px;
} */
.filename {
display: block;
font-family: mono;
}
/* .unkown-file::before {
content: "📄 ";
font-size: 18px;
} */
div {
/* max-width: 640px; */
display: inline-block;
vertical-align: top;
/* margin: 1em;
padding: 1em; */
}
video {
width: 640px;
max-height: 640px;
}
/*************************************
<<< END of originally from distribusi
*************************************/
/* layout */
div {
margin-bottom: 1em;
}
.plain div {
white-space: pre-line;
}
figure {
margin: 0;
padding: 0;
}
.audio {
display: block;
}
.image {
max-width: 700px;
}
body {
display: flex;
flex-direction: column;
margin: 0;
padding-left: 1em;
padding-right: 1em;
padding-top: 1em;
}
#header {
padding-bottom: 3em;
}
.unfolded {
display: flex;
flex-direction: column;
}
.unfolded>div {
padding-left: 0.5em;
}
body>.unfolded {
margin-top: 2em;
}
/* theme */
body {
font: 1em/1.5 AppleGothic, NanumGothic, Sans-serif;
letter-spacing: +0.02em;
word-spacing: +0.2em;
/* color: rgba(100, 255, 200, 1.0); */
/* background-color: rgba(0, 20, 40, 1.0); */
}
#header::after {
content: "lost|traIn";
font-size: 3.6em;
font-weight: 700;
opacity: 0.3;
/* color: rgba(100, 255, 200, 0.5); */
color: rgba(0, 0, 0, 0.2);
}
a,
a:link,
a:visited {
text-decoration: none;
/* color: rgba(100, 255, 200, 1.0); */
/* border: 1px solid rgba(100, 255, 200, .25); */
color: rgba(0, 0, 0, 0.5);
border: 1px solid rgba(0, 0, 0, .25);
}
a:hover {
color: hotpink;
}
.unfolded>a:nth-child(1) {
font-size: 1.1em;
/* color: rgba(100, 255, 200, 0.5); */
font-weight: 700;
border: unset;
margin-bottom: 1em;
padding-left: 0;
}
audio::-webkit-media-controls-panel {
/* background-color: rgba(50, 135, 120, 1.0); */
}
a[href^="../"] {
visibility: hidden;
}
a[href^="../"]::before {
visibility: visible;
content: "«";
padding-top: 1em;
padding-bottom: 2em;
}