shark/hexapod
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update web content (portrait support, metas)

Browse Source
This commit is contained in:
Smallp Tsai 2019-03-23 23:08:39 +08:00
parent b9d90ebe9e
commit be367b7029
3 changed files with 41 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs/images/3dparts-b.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
docs/images/3dparts-s.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 98 KiB

43
docs/index.html
View File

@ -4,8 +4,8 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content=""> <meta name="description" content="Hexapod is an Robotic project for Personal/Hobby Maker, using Raspberry Pi (RPi) or Linkit 7697 as its controller, also iOS/Android remote controllable">
<title>Hexapod</title> <title>Hexapod: Main page</title>
<link rel="shortcut icon" type="image/png" href="images/icon-b.png" /> <link rel="shortcut icon" type="image/png" href="images/icon-b.png" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
@ -18,12 +18,26 @@
user-select: none; user-select: none;
} }
.bd-placeholder-img img {
display: block;
margin-left:auto;
margin-right:auto;
}
.jumbotron { .jumbotron {
padding-top: 3rem; padding-top: 3rem;
padding-bottom: 3rem; padding-bottom: 3rem;
margin-bottom: 0; margin-bottom: 0;
min-height: 300px; min-height: 300px;
} }
@media (orientation: portrait) {
.jumbotron {
padding-top: 1rem;
padding-bottom: 1rem;
margin-bottom: 0;
min-height: 200px;
}
}
.text-outlined { .text-outlined {
color: black; color: black;
@ -46,6 +60,16 @@
font-size: 1.2rem; font-size: 1.2rem;
max-width: 30rem; max-width: 30rem;
} }
@media (orientation: portrait) {
.jumbotron-heading {
font-size: 2rem;
font-weight: 700;
}
.jumbotron-text {
font-size: 1rem;
max-width: 30rem;
}
}
footer { footer {
padding-top: 3rem; padding-top: 3rem;
@ -142,6 +166,21 @@
</div> </div>
</div> </div>
<div class="col-md-6">
<div class="card mb-4 shadow-sm">
<div class="bd-placeholder-img card-img-top bg-dark" width="100%" height="300">
<img src="images/3dparts-s.jpg"/>
</div>
<div class="card-body">
<p class="card-text">3D parts<br>Parts in <font color=blue>Blue</font> rectangle are for "Body"<br/>Parts in <font color=red>Red</font> rectangle are for "one Leg"</p>
<div class="d-flex justify-content-between align-items-center">
<a href="images/3dparts-b.jpg" class="btn btn-sm btn-outline-secondary">Detail Image</a>
<small class="text-muted">2019/3/23</small>
</div>
</div>
</div>
</div>
<div class="col-md-6"> <div class="col-md-6">
<div class="card mb-4 shadow-sm"> <div class="card mb-4 shadow-sm">
<iframe class="bd-placeholder-img card-img-top" width="100%" height="300" src="https://www.youtube.com/embed/EhIvYd5yoXo" frameborder="0" allow="autoplay; encrypted-media"></iframe> <iframe class="bd-placeholder-img card-img-top" width="100%" height="300" src="https://www.youtube.com/embed/EhIvYd5yoXo" frameborder="0" allow="autoplay; encrypted-media"></iframe>