Add HTML boilerplate
This commit is contained in:
parent
54eb74a97e
commit
c7e1df3f81
|
|
@ -0,0 +1,39 @@
|
||||||
|
package cmd
|
||||||
|
|
||||||
|
import (
|
||||||
|
"embed"
|
||||||
|
"github.com/gin-gonic/gin"
|
||||||
|
"html/template"
|
||||||
|
"io/fs"
|
||||||
|
"regexp"
|
||||||
|
"strings"
|
||||||
|
)
|
||||||
|
|
||||||
|
func LoadHTMLFromEmbedFS(engine *gin.Engine, embedFS embed.FS, pattern string) {
|
||||||
|
root := template.New("")
|
||||||
|
tmpl := template.Must(root, LoadAndAddToRoot(engine.FuncMap, root, embedFS, pattern))
|
||||||
|
engine.SetHTMLTemplate(tmpl)
|
||||||
|
}
|
||||||
|
func LoadAndAddToRoot(funcMap template.FuncMap, rootTemplate *template.Template, embedFS embed.FS, pattern string) error {
|
||||||
|
pattern = strings.ReplaceAll(pattern, ".", "\\.")
|
||||||
|
pattern = strings.ReplaceAll(pattern, "*", ".*")
|
||||||
|
|
||||||
|
err := fs.WalkDir(embedFS, ".", func(path string, d fs.DirEntry, walkErr error) error {
|
||||||
|
if walkErr != nil {
|
||||||
|
return walkErr
|
||||||
|
}
|
||||||
|
|
||||||
|
if matched, _ := regexp.MatchString(pattern, path); !d.IsDir() && matched {
|
||||||
|
data, readErr := embedFS.ReadFile(path)
|
||||||
|
if readErr != nil {
|
||||||
|
return readErr
|
||||||
|
}
|
||||||
|
t := rootTemplate.New(path).Funcs(funcMap)
|
||||||
|
if _, parseErr := t.Parse(string(data)); parseErr != nil {
|
||||||
|
return parseErr
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return nil
|
||||||
|
})
|
||||||
|
return err
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<title>AEMET Client</title>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link href="style.css" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="container">
|
||||||
|
<div id="main">
|
||||||
|
<p>Hello {{ .UserAgent }}</p>
|
||||||
|
<hr>
|
||||||
|
<h2>Current clients</h2>
|
||||||
|
{{ range .Clients }}
|
||||||
|
<p>{{ .OS_username }}</p>
|
||||||
|
<p>{{ .OperatingSystem }}</p>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,164 @@
|
||||||
|
* {
|
||||||
|
font-family: arial;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border: 1px solid black;
|
||||||
|
border-collapse: collapse;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.optionCap {
|
||||||
|
text-transform: capitalize;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
text-align: center;
|
||||||
|
list-style: none;
|
||||||
|
top: 0;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
li.hor {
|
||||||
|
display: inline-flex;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.left {
|
||||||
|
text-align: left;
|
||||||
|
padding-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.date {
|
||||||
|
text-align: center;
|
||||||
|
padding-left: 5px;
|
||||||
|
padding-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
cold {
|
||||||
|
color: darkcyan;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
hot {
|
||||||
|
color: darkorange;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
table * {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#but {
|
||||||
|
background-color: #eee;
|
||||||
|
border: 2px black solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.centered {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
text-align: center;
|
||||||
|
border: 2px solid #ff6e00;
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 1%;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
background-color: #eee;
|
||||||
|
border: 2px black solid;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#but:hover {
|
||||||
|
background-color: #ff6e00;
|
||||||
|
border: 2px black solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: #aaa;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
bottom: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
form {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #ff6e00;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
progress::-moz-progress-bar {
|
||||||
|
background-color: #ff6e00;
|
||||||
|
}
|
||||||
|
|
||||||
|
progress::-webkit-progress-value {
|
||||||
|
background-color: #ff6e00;
|
||||||
|
}
|
||||||
|
|
||||||
|
progress {
|
||||||
|
color: #ff6e00;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
top: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#main {
|
||||||
|
background-color: #eee;
|
||||||
|
width: 80vw;
|
||||||
|
height: 80vh;
|
||||||
|
padding: 10px;
|
||||||
|
outline: solid 2px #ff6e00;
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
#main {
|
||||||
|
width: 60vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
position: fixed;
|
||||||
|
margin: 1px;
|
||||||
|
padding: 1px;
|
||||||
|
top: 1px;
|
||||||
|
left: 1px;
|
||||||
|
|
||||||
|
outline: solid 1px black;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 99vh;
|
||||||
|
width: 99vw;
|
||||||
|
background-color: #aaa;
|
||||||
|
|
||||||
|
/* width: 100%; */
|
||||||
|
/* height: 100%; */
|
||||||
|
/* margin: 50px; */
|
||||||
|
/* outline: solid 1px black; */
|
||||||
|
/* display: flex; */
|
||||||
|
/* justify-content: center; */
|
||||||
|
/* align-items: center; */
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue