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