add purecss sakura and normalize.css

This commit is contained in:
Ingolf Wagner 2024-09-02 09:41:23 +07:00
parent b7c31cbb59
commit bf29908788
Signed by: palo
GPG key ID: 76BF5F1928B9618B
12 changed files with 74 additions and 59 deletions

View file

@ -157,11 +157,6 @@ if __name__ == "__main__":
SimpleRingsSketch.display() SimpleRingsSketch.display()
``` ```
{{< card >}} ![](screenshot.png)
{{<figure src="./images/screenshot.png" width=100% >}} ![](plot01.jpg)
{{< /card >}} ![](plot02.jpg)
{{< card >}}
{{<figure src="./images/plot01.jpg" width=100% >}}
{{<figure src="./images/plot02.jpg" width=100% >}}
{{< /card >}}

View file

Before

Width:  |  Height:  |  Size: 199 KiB

After

Width:  |  Height:  |  Size: 199 KiB

View file

Before

Width:  |  Height:  |  Size: 210 KiB

After

Width:  |  Height:  |  Size: 210 KiB

View file

Before

Width:  |  Height:  |  Size: 193 KiB

After

Width:  |  Height:  |  Size: 193 KiB

10
node_modules/.package-lock.json generated vendored
View file

@ -30,6 +30,16 @@
"peerDependencies": { "peerDependencies": {
"@popperjs/core": "^2.11.8" "@popperjs/core": "^2.11.8"
} }
},
"node_modules/normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"node_modules/sakura.css": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/sakura.css/-/sakura.css-1.5.0.tgz",
"integrity": "sha512-AcAZa9F4SCs2xaKLWcXQxJxKfeod2PN3sR31+R22MKuyoJxNChH1wBG4mQaY9gVpJ3VpNA1XHPOrOM9hFo9cSw=="
} }
} }
} }

14
package-lock.json generated
View file

@ -5,7 +5,9 @@
"packages": { "packages": {
"": { "": {
"dependencies": { "dependencies": {
"bootstrap": "^5.3.3" "bootstrap": "^5.3.3",
"normalize.css": "^8.0.1",
"sakura.css": "^1.5.0"
} }
}, },
"node_modules/@popperjs/core": { "node_modules/@popperjs/core": {
@ -35,6 +37,16 @@
"peerDependencies": { "peerDependencies": {
"@popperjs/core": "^2.11.8" "@popperjs/core": "^2.11.8"
} }
},
"node_modules/normalize.css": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz",
"integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg=="
},
"node_modules/sakura.css": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/sakura.css/-/sakura.css-1.5.0.tgz",
"integrity": "sha512-AcAZa9F4SCs2xaKLWcXQxJxKfeod2PN3sR31+R22MKuyoJxNChH1wBG4mQaY9gVpJ3VpNA1XHPOrOM9hFo9cSw=="
} }
} }
} }

View file

@ -1,5 +1,7 @@
{ {
"dependencies": { "dependencies": {
"bootstrap": "^5.3.3" "bootstrap": "^5.3.3",
"normalize.css": "^8.0.1",
"sakura.css": "^1.5.0"
} }
} }

View file

@ -1,9 +1,6 @@
@import "../node_modules/bootstrap/scss/bootstrap" //@import "../node_modules/bootstrap/scss/bootstrap"
@import "../node_modules/sakura.css/scss/sakura"
pre body
padding: 1em max-width: 1000px
font-size: 1rem
pre code
font-size: 1rem

View file

@ -4,52 +4,55 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Tech-Blog</title> <title>Tech-Blog</title>
<link href="/main.css" rel="stylesheet"> <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sakura.css/css/sakura.css" type="text/css">-->
<link rel="stylesheet" href="/css/normalize.css" type="text/css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@3.0.0/build/pure-min.css" integrity="sha384-X38yfunGUhNzHpBaEBsWLO+A0HDYOQi8ufWDkZ0k9e0eXz/tH3II7uKZ9msv++Ls" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@3.0.0/build/grids-responsive-min.css">
<link rel="stylesheet" href="/main.css" type="text/css">
</head> </head>
<body> <body>
<!-- navigation--> <!-- navigation-->
<header> <header>
<nav class="navbar navbar-expand-lg bg-body-tertiary"> <nav class="pure-menu pure-menu-horizontal">
<div class="container-xxl"> <ul class="pure-menu-list">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" <li class="pure-menu-item pure-menu-link">
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" <a href="/" class="pure-menu-link">Main</a>
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/">Main</a>
</li> </li>
<li class="nav-item"> <li class="pure-menu-item pure-menu-link">
<a class="nav-link active" aria-current="page" href="#">Articles</a> <a href="/nixos/" class="pure-menu-link">Articles</a>
</li> </li>
<li class="nav-item"> <li class="pure-menu-item pure-menu-link">
<a class="nav-link active" aria-current="page" href="#">Art</a> <a href="/" class="pure-menu-link">Slides</a>
</li> </li>
<li class="nav-item"> <li class="pure-menu-item pure-menu-link">
<a class="nav-link active" aria-current="page" href="#">Slides</a> <a href="/about/" class="pure-menu-link">About</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/about/">About</a>
</li> </li>
</ul> </ul>
</nav>
<!-- <nav>-->
<!-- <ul>-->
<!-- <li> <a href="/">Main</a> </li>-->
<!-- <li> <a href="/">Articles</a> </li>-->
<!-- <li> <a href="/">Slides</a> </li>-->
<!-- <li> <a href="/">About</a> </li>-->
<!-- </ul>-->
<!-- <form class="d-flex" role="search">--> <!-- <form class="d-flex" role="search">-->
<!-- <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">--> <!-- <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">-->
<!-- <button class="btn btn-outline-success" type="submit">Search</button>--> <!-- <button class="btn btn-outline-success" type="submit">Search</button>-->
<!-- </form>--> <!-- </form>-->
</div> <!-- </nav>-->
</div>
</nav>
</header> </header>
<main>
{% block content %} {% endblock %} {% block content %} {% endblock %}
</main>
</body> </body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script>
</html> </html>

View file

@ -1,14 +1,11 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<div class="container-xxl"> <h1> Techblog </h1>
<h1 class="display-6"> Techblog </h1>
<ul> <ul>
<li><a href="/nixos">nixos</a></li> <li><a href="/nixos">nixos</a></li>
<li><a href="/nixos/vsketch-and-nixos/">vsketch</a></li> <li><a href="/nixos/vsketch-and-nixos/">vsketch</a></li>
</ul> </ul>
</div>
{% endblock content %} {% endblock content %}

View file

@ -1,11 +1,9 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<div class="container-xxl">
<h1>{{ page.title | safe }}</h1> <h1>{{ page.title | safe }}</h1>
{{ page.content | safe }} {{ page.content | safe }}
</div>
{% endblock content %} {% endblock content %}

View file

@ -0,0 +1 @@
<img src="{{ src }}">