raul
/
aemet
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Styling improvements and selecting locality manually

This commit is contained in:
raul 2024-05-30 09:29:47 +02:00
parent 7ebc68a9a4
commit 8148f756d7
3 changed files with 69 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
cmd/serverFunc.go
View File

@ -61,7 +61,8 @@ func returnProvince(c *gin.Context) {
} }
c.HTML(http.StatusOK, "templates/index.html", gin.H{ c.HTML(http.StatusOK, "templates/index.html", gin.H{
"Base": aemetRequest.Base, "Base": aemetRequest.Base,
"Localidades": localidades,
}) })
} }

24
cmd/templates/index.html
View File

@ -11,6 +11,30 @@
<body> <body>
<div class="container"> <div class="container">
<div id="main"> <div id="main">
<b>
<ul>
<li>
<p><a href="https://git.bulgariu.xyz/raul/aemet" target="_blank">Source code</a></p>
</li>
<li>
<p><a href="https://git.bulgariu.xyz/raul/aemet" target="_blank">API Docs</a></p>
</li>
<li>
<p><a href="https://git.bulgariu.xyz/raul/aemet" target="_blank">But why though?</a></p>
</li>
<li>
<p>
<select
onchange="this.options[this.selectedIndex].value && (window.location = this.options[this.selectedIndex].value);">
<option value="">Select...</option>
{{ range $key, $value := .Localidades }}
<option value="{{ $key }}">{{ $key }}</option>
{{ end }}
</select>
</p>
</li>
</ul>
</b>
<table border=1> <table border=1>
<th colspan="100%">{{ .Base.Nombre }}</th> <th colspan="100%">{{ .Base.Nombre }}</th>

50
cmd/templates/style.css
View File

@ -5,6 +5,21 @@
table { table {
border: 1px solid black; border: 1px solid black;
border-collapse: collapse; border-collapse: collapse;
margin-left: auto;
margin-right: auto;
}
ul {
text-align: center;
list-style: none;
top: 0;
margin: 0;
padding: 0;
}
li {
display: inline-flex;
margin-right: 20px;
} }
table * { table * {
@ -86,18 +101,39 @@ footer {
#main { #main {
background-color: #eee; background-color: #eee;
bottom: 100%; width: 80vw;
height: 100%; height: 80vh;
padding-left: 5%; padding: 10px;
padding-right: 5%;
outline: solid 2px #ff6e00; outline: solid 2px #ff6e00;
overflow: scroll;
}
@media (max-width: 600px) {
#main {
width: 60vw;
}
} }
.container { .container {
display: flex; display: flex;
/* outline: solid 1px black; */ position: fixed;
margin: 1px;
padding: 1px;
top: 1px;
left: 1px;
outline: solid 1px black;
justify-content: center; justify-content: center;
height: 100%; align-items: center;
max-width: 100%; height: 99vh;
width: 99vw;
background-color: #aaa; background-color: #aaa;
/* width: 100%; */
/* height: 100%; */
/* margin: 50px; */
/* outline: solid 1px black; */
/* display: flex; */
/* justify-content: center; */
/* align-items: center; */
} }