modify HTML page design

nikolat · nikolat · commit 86aa72cd34dd · 2022-01-11T20:07:47.000+09:00
diff --git a/html/css/main.css b/html/css/main.css
@@ -0,0 +1,37 @@
+.name {
+    font-weight: bold;
+}
+.screen_name, .datetime {
+    color: lightslategray;
+}
+body {
+    background-color: darkgray;
+}
+h1, dl, footer {
+    background-color: white;
+    width: 80%;
+    margin: 0 auto;
+}
+h1 {
+    margin-top: 50px;
+    line-height: 2em;
+    text-indent: 1em;
+}
+dt, footer {
+    padding-top: 5px;
+    border-top: 1px solid darkgray;
+}
+dt img {
+    float: left;
+    clear: left;
+    margin: 10px 10px 0 10px;
+}
+dd {
+    margin-left: 60px;
+    padding-bottom: 5px;
+}
+footer {
+    text-align: center;
+    padding-bottom: 10px;
+    margin-bottom: 50px;
+}
diff --git a/html/template/template.html b/html/template/template.html
@@ -1,30 +1,15 @@
 <!DOCTYPE html>
-<html>
+<html lang="ja">
 <head>
 <meta charset="utf-8" />
 <title>CharameLNetwork</title>
-<style>
-.name {
-    font-weight: bold;
-}
-.screen_name, .datetime {
-    color: lightslategray;
-}
-body {
-    background-color: darkgray;
-}
-dl {
-    background-color: white;
-}
-dd {
-    border-bottom: 1px solid darkgray;
-}
-</style>
+<link rel="stylesheet" href="./css/main.css" />
 </head>
 <body>
-<h1>public timeline</h1>
+<h1><a href="#">public timeline</a></h1>
 <dl>
 [:pagebody:]
 </dl>
+<footer>Generated by <a href="https://github.com/nikolat/CharameLNetwork">CharameLNetwork</a>, Collaborated with <a href="http://umeici.onjn.jp/CharameL.html">CharameL</a></footer>
 </body>
 </html>
