Updated: css styling and got it working with screen, initial 'new page' that is just cheating

This commit is contained in:
Michal Skorczak 2024-11-12 00:27:25 +00:00
parent 05fabb1cf2
commit 98de4be854
4 changed files with 59 additions and 24 deletions

27
src/public/blog.html Normal file
View file

@ -0,0 +1,27 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, inital-scale=1">
<meta http-equiv="X-UR-Compatible" content='ie=edge'>
<title>mskor.xyz</title>
<meta name="keywords" content="">
<link rel="stylesheet" id="css" href="style.css">
<script src="https://unpkg.com/htmx.org@2.0.3" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
</head>
<body>
<div id="header">
<a href="/" hx-target="#content" hx-swap="innerHTML" hx-get="/home">
<h1>mskor.xyz</h1>
</a>
<nav>
<!--<a href="" hx-target="#content" hx-swap="innerHTML" hx-get="/home" hx-trigger="load">--!>
<!--<a href="/" hx-target="#content" hx-swap="innerHTML" hx-get="/about">about</a>-->
<a href="/git/explore/repos">git</a>
<a href="/home.html">home</a>
</nav>
</div>
<div id="content">
i really hope this works
</div>
</body>
</html>

View file

@ -1,24 +1,27 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, inital-scale=1">
<meta http-equiv="X-UR-Compatible" content='ie=edge'>
<title>mskor.xyz</title>
<meta name="keywords" content="">
<link rel="stylesheet" id="css" href="style.css">
<script src="https://unpkg.com/htmx.org@2.0.3" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, inital-scale=1">
<meta http-equiv="X-UR-Compatible" content='ie=edge'>
<title>mskor.xyz</title>
<meta name="keywords" content="">
<link rel="stylesheet" id="css" href="style.css">
<script src="https://unpkg.com/htmx.org@2.0.3" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
</head>
<body>
<div id="header">
<a href="" hx-target="#content" hx-swap="innerHTML" hx-get="/home" hx-trigger="load">
<h1>mskor.xyz</h1>
</a>
<nav>
<a href="" hx-target="#content" hx-swap="innerHTML" hx-get="/about">about</a>
<a href="/git">git</a>
<a href="" hx-target="#content" hx-swap="innerHTML" hx-get="/blog">blog</a>
</nav>
</div>
<div id="content">
</div>
<div id="header">
<a href="/" hx-target="#content" hx-swap="innerHTML" hx-get="/home">
<h1>mskor.xyz</h1>
</a>
<nav>
<!--<a href="" hx-target="#content" hx-swap="innerHTML" hx-get="/home" hx-trigger="load">--!>
<!--<a href="/" hx-target="#content" hx-swap="innerHTML" hx-get="/about">about</a>-->
<a href="/git/explore/repos">git</a>
<a href="/blog.html">blog</a>
</nav>
</div>
<div id="content">
Under construction!
</div>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 454 KiB

View file

@ -1,15 +1,16 @@
body {
max-width:70%;
margin:40px auto;
margin:0px auto;
max-width:700px;
font-size:18px;
line-height:1.4;
padding:0 10px;
padding:10px;
font-family: monospace;
}
a {
text-decoration:none;
color:Black;
color:MediumSeaGreen;
}
td {
@ -22,12 +23,16 @@ h1 {
margin:0px auto;
}
#header, #content {
padding:0 0px;
margin:5px auto;
}
img {
width:100%;
height:100%;
}
@media (prefers-color-scheme:dark) {
body {
background-color:#222;