parent
f00215deda
commit
dcf2c676ce
File diff suppressed because one or more lines are too long
@ -0,0 +1,23 @@ |
||||
h1.page-header { |
||||
margin-top: -5px; |
||||
} |
||||
|
||||
.sidebar { |
||||
padding-left: 15; |
||||
} |
||||
|
||||
.main-container { |
||||
background: #FFF; |
||||
padding-top: 15px; |
||||
margin-top: -20px; |
||||
} |
||||
|
||||
.footer { |
||||
width: 100%; |
||||
} |
||||
|
||||
img { |
||||
|
||||
max-width: 100%; |
||||
height: auto; |
||||
} |
@ -0,0 +1,78 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
|
||||
<head> |
||||
<title>Bootstrap Example</title> |
||||
<!-- Required meta tags --> |
||||
<meta charset="utf-8"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||||
|
||||
<!-- Bootstrap CSS --> |
||||
<link rel="stylesheet" href="css/bootstrap.min.css"> |
||||
<link rel="stylesheet" href="css/main.css"> |
||||
|
||||
<!-- JS --> |
||||
<script src="js/jquery-3.3.1.min.js"></script> |
||||
<script src="js/bootstrap.min.js"></script> |
||||
</head> |
||||
|
||||
<body> |
||||
<nav class="navbar navbar-default navbar-static-top"> |
||||
<div class="container-fluid"> |
||||
<!-- Brand and toggle get grouped for better mobile display --> |
||||
<div class="navbar-header"> |
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> |
||||
<span class="sr-only">Toggle navigation</span> |
||||
<span class="icon-bar"></span> |
||||
<span class="icon-bar"></span> |
||||
<span class="icon-bar"></span> |
||||
</button> |
||||
<a class="navbar-brand" href="#">Умный дом</a> |
||||
</div> |
||||
|
||||
<!-- Collect the nav links, forms, and other content for toggling --> |
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> |
||||
|
||||
<ul class="nav navbar-nav navbar-right"> |
||||
<li><a href="https://gitlab.com/zenls/rpi_remote_cam.git" target="_blank">Gitlab</a></li> |
||||
|
||||
</ul> |
||||
</div> |
||||
</div> |
||||
</nav> |
||||
<div class="container-fluid main-container"> |
||||
<div class="col-md-2 sidebar"> |
||||
<ul class="nav nav-pills nav-stacked"> |
||||
<li class="active"><a href="index.html">Видео стрим</a></li> |
||||
<li><a href="info.html">Информация</a></li> |
||||
</ul> |
||||
</div> |
||||
<div class="col-md-10 content"> |
||||
<div class="panel panel-default"> |
||||
<div class="panel-heading"> |
||||
Видео |
||||
</div> |
||||
<div class="text-center"> |
||||
<br> |
||||
<img style="-webkit-user-select: none;" src="http://10.174.136.143:8081/"> |
||||
<br> |
||||
<br> |
||||
<form class="range-field"> |
||||
<input type="range" value="20" min="0" max="100" oninput="alert('Клик!')" /> |
||||
</form> |
||||
</div> |
||||
|
||||
</div> |
||||
</div> |
||||
<footer class="pull-left footer"> |
||||
<p class="col-md-12"> |
||||
<hr class="divider">Проект создан в образовательных целях, при поддержке <a href="https://t.me/baumanrobotics">Bauman |
||||
Robotics</a>.</a> |
||||
</p> |
||||
</footer> |
||||
</div> |
||||
|
||||
|
||||
</body> |
||||
|
||||
</html> |
@ -0,0 +1,70 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
|
||||
<head> |
||||
<title>Bootstrap Example</title> |
||||
<!-- Required meta tags --> |
||||
<meta charset="utf-8"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||||
|
||||
<!-- Bootstrap CSS --> |
||||
<link rel="stylesheet" href="css/bootstrap.min.css"> |
||||
<link rel="stylesheet" href="css/main.css"> |
||||
|
||||
<!-- JS --> |
||||
<script src="js/jquery-3.3.1.min.js"></script> |
||||
<script src="js/bootstrap.min.js"></script> |
||||
</head> |
||||
|
||||
<body> |
||||
<nav class="navbar navbar-default navbar-static-top"> |
||||
<div class="container-fluid"> |
||||
<!-- Brand and toggle get grouped for better mobile display --> |
||||
<div class="navbar-header"> |
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> |
||||
<span class="sr-only">Toggle navigation</span> |
||||
<span class="icon-bar"></span> |
||||
<span class="icon-bar"></span> |
||||
<span class="icon-bar"></span> |
||||
</button> |
||||
<a class="navbar-brand" href="#">Умный дом</a> |
||||
</div> |
||||
|
||||
<!-- Collect the nav links, forms, and other content for toggling --> |
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> |
||||
|
||||
<ul class="nav navbar-nav navbar-right"> |
||||
<li><a href="https://gitlab.com/zenls/rpi_remote_cam.git" target="_blank">Gitlab</a></li> |
||||
|
||||
</ul> |
||||
</div> |
||||
</div> |
||||
</nav> |
||||
<div class="container-fluid main-container"> |
||||
<div class="col-md-2 sidebar"> |
||||
<ul class="nav nav-pills nav-stacked"> |
||||
<li><a href="index.html">Видео стрим</a></li> |
||||
<li class="active"><a href="info.html">Информация</a></li> |
||||
</ul> |
||||
</div> |
||||
<div class="col-md-10 content"> |
||||
<div class="panel panel-default"> |
||||
<div class="panel-heading"> |
||||
Информация про автора и группу |
||||
</div> |
||||
<div class="panel-body"> |
||||
Что-то написать. Может картинку добавить? |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<footer class="pull-left footer"> |
||||
<p class="col-md-12"> |
||||
<hr class="divider">Проект создан в образовательных целях, при поддержке <a href="https://t.me/baumanrobotics">Bauman Robotics</a>.</a> |
||||
</p> |
||||
</footer> |
||||
</div> |
||||
|
||||
|
||||
</body> |
||||
|
||||
</html> |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,68 +0,0 @@ |
||||
h1 { |
||||
|
||||
color: #006363; |
||||
font-size: 50pt; |
||||
font-family: Georgia, Times, serif; |
||||
font-weight: normal; |
||||
} |
||||
|
||||
body { |
||||
background: #e2e2e2; |
||||
color: #000000; |
||||
font-family: Trebuchet MS, Arial, Times New Roman; |
||||
font-size: 12px; |
||||
} |
||||
|
||||
#container { |
||||
background: #FFFFFF; |
||||
margin: 30px auto; |
||||
width: 900px; |
||||
height: 1000px; |
||||
} |
||||
|
||||
#header { |
||||
text-align: center; |
||||
|
||||
background: #5CCCCC; |
||||
height: 100px; |
||||
width: 900px; |
||||
} |
||||
|
||||
#navigation { |
||||
background: #a2a2a2; |
||||
width: 900px; |
||||
height: 20px; |
||||
} |
||||
|
||||
#menu { |
||||
background: #ffffff; |
||||
float: left; |
||||
width: 150px; |
||||
height: 600px; |
||||
} |
||||
|
||||
#content { |
||||
margin-top:30px; |
||||
background: #ffffff; |
||||
float: right; |
||||
width: 750px; |
||||
height: 600px; |
||||
} |
||||
|
||||
#footer { |
||||
background: #838283; |
||||
height: 180px; |
||||
width: 900px; |
||||
} |
||||
|
||||
#clear { |
||||
clear:both; |
||||
} |
||||
|
||||
#textArea{ |
||||
background: #EEFFFF; |
||||
color: #000000; |
||||
font-family: Trebuchet MS, Arial, Times New Roman; |
||||
font-size: 15px; |
||||
resize: none; |
||||
} |
Loading…
Reference in new issue