I'm writing my first web server, so don't hate.
I am using Golang and HTML with BootStrap.
This program will eventually run on a Raspberry Pi in a small device. So I assume it would be best to use a downloaded version of BootStrap rather than the CDN version right?
But when I do this, my buttons on my page lose their formatting.
Here is my HTML code using the CDN version:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Cacophonator Setup</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Cacophonator Setup</h2>
<div class="col-sm-12">
<!-- <a href="\CameraPositioning\" class="btn btn-primary" type="button">Camera Positioning</a> -->
<button type="button" class="btn btn-primary" onclick="location.href='camera-positioning.html'">Camera Positioning</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='3G-connectivity.html'">3G Connectivity</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='API-server.html'">API Server</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='network-interfaces.html'">Network Interfaces</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='disk-memory.html'">Disk and Memory Status</button>
</div>
</div>
<h4>{{.Head}}<h4>
</body>
</html>
Here is the new HTML which is not working:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Cacophonator Setup</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href = "css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Cacophonator Setup</h2>
<div class="col-sm-12">
<!-- <a href="\CameraPositioning\" class="btn btn-primary" type="button">Camera Positioning</a> -->
<button type="button" class="btn btn-primary" onclick="location.href='camera-positioning.html'">Camera Positioning</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='3G-connectivity.html'">3G Connectivity</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='API-server.html'">API Server</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='network-interfaces.html'">Network Interfaces</button>
</div>
<div class="col-sm-12">
<button type="button" class="btn btn-primary" onclick="location.href='disk-memory.html'">Disk and Memory Status</button>
</div>
</div>
I have only changed 2 lines, so that I use (or try to) the local BootStrap CSS and JS.
And I call it from Go like this:
http.HandleFunc("/", managementinterface.IndexHandler)
log.Fatal(http.ListenAndServe(":8080", nil))
And IndexHandler is like this:
func IndexHandler(w http.ResponseWriter, r *http.Request) {
t, _ := template.ParseFiles("../html/index.html")
t.Execute(w, "")
}
One final note: The CDN version is 3.3.7, the version I downloaded is 4.1.1
And also if I look at the local BootStrap CSS file, I can see this:
.btn-primary {
color: #fff;
background-color: #007bff;
border-color: #007bff;
}
Which is the styling I want. Any help appreciated, thanks.
