From d359fd8a10f70cd583f5f0bb3458250b36a2c594 Mon Sep 17 00:00:00 2001 From: strawmanbobi Date: Sun, 13 Nov 2016 18:12:11 +0800 Subject: [PATCH] implemented index --- src/web_console/web/css/cover.css | 200 +++++++++++------------------- src/web_console/web/index.html | 92 +++++++++----- 2 files changed, 132 insertions(+), 160 deletions(-) diff --git a/src/web_console/web/css/cover.css b/src/web_console/web/css/cover.css index a1fa52e..8da6a2f 100644 --- a/src/web_console/web/css/cover.css +++ b/src/web_console/web/css/cover.css @@ -1,22 +1,20 @@ -/* - * Globals - */ +/* Move down content because we have a fixed navbar that is 50px tall */ /* Links */ a, a:focus, a:hover { - color: #fff; + color: #fff; } /* Custom default button */ .btn-default, .btn-default:hover, .btn-default:focus { - color: #333; - text-shadow: none; /* Prevent inheritence from `body` */ - background-color: #fff; - border: 1px solid #fff; + color: #333; + text-shadow: none; /* Prevent inheritence from `body` */ + background-color: #fff; + border: 1px solid #fff; } @@ -26,138 +24,86 @@ a:hover { html, body { - height: 100%; - background-color: #27A; -} -body { - color: #fff; - text-align: center; - text-shadow: 0 1px 3px rgba(0,0,0,.5); -} - -/* Extra markup and styles for table-esque vertical and horizontal centering */ -.site-wrapper { - display: table; - width: 100%; - height: 100%; /* For at least Firefox */ - min-height: 100%; - -webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5); - box-shadow: inset 0 0 100px rgba(0,0,0,.5); -} -.site-wrapper-inner { - display: table-cell; - vertical-align: top; -} -.cover-container { - margin-right: auto; - margin-left: auto; -} - -/* Padding for spacing */ -.inner { - padding: 30px; + height: 100%; + background-color: #333; + font-family: "Microsoft YaHei UI Light", "Hiragino Sans GB", "Californian FB"; + padding-top: 20px; + padding-bottom: 20px; + color: #fff; + text-shadow: 0 1px 3px rgba(0,0,0,.5); } -/* - * Header - */ -.masthead-brand { - margin-top: 10px; - margin-bottom: 10px; +/* Everything but the jumbotron gets side spacing for mobile first views */ +.header, +.marketing, +.footer { + padding-right: 15px; + padding-left: 15px; } -.masthead-nav > li { - display: inline-block; +/* Custom page header */ +.header { + padding-bottom: 20px; + border-bottom: 1px solid #e5e5e5; } -.masthead-nav > li + li { - margin-left: 20px; -} -.masthead-nav > li > a { - padding-right: 0; - padding-left: 0; - font-size: 16px; - font-weight: bold; - color: #fff; /* IE8 proofing */ - color: rgba(255,255,255,.75); - border-bottom: 2px solid transparent; -} -.masthead-nav > li > a:hover, -.masthead-nav > li > a:focus { - background-color: transparent; - border-bottom-color: #a9a9a9; - border-bottom-color: rgba(255,255,255,.25); -} -.masthead-nav > .active > a, -.masthead-nav > .active > a:hover, -.masthead-nav > .active > a:focus { - color: #fff; - border-bottom-color: #fff; +/* Make the masthead heading the same height as the navigation */ +.header h3 { + margin-top: 0; + margin-bottom: 0; + line-height: 40px; } +/* Custom page footer */ +.footer { + padding-top: 19px; + color: #777; + border-top: 1px solid #e5e5e5; +} + +/* Customize container */ @media (min-width: 768px) { - .masthead-brand { - float: left; - } - .masthead-nav { - float: right; - } + .container { + max-width: 730px; + } +} +.container-narrow > hr { + margin: 30px 0; } - -/* - * Cover - */ - -.cover { - padding: 0 20px; +/* Main marketing message and sign up button */ +.jumbotron { + text-align: center; + border-bottom: 1px solid #e5e5e5; } -.cover .btn-lg { - padding: 10px 20px; - font-weight: bold; +.jumbotron .btn { + padding: 14px 24px; + font-size: 21px; } - -/* - * Footer - */ - -.mastfoot { - color: #999; /* IE8 proofing */ - color: rgba(255,255,255,.5); +/* Supporting marketing content */ +.marketing { + margin: 40px 0; +} +.marketing p + h4 { + margin-top: 28px; } - -/* - * Affix and center - */ - -@media (min-width: 768px) { - /* Pull out the header and footer */ - .masthead { - position: fixed; - top: 0; - } - .mastfoot { - position: fixed; - bottom: 0; - } - /* Start the vertical centering */ - .site-wrapper-inner { - vertical-align: middle; - } - /* Handle the widths */ - .masthead, - .mastfoot, - .cover-container { - width: 100%; /* Must be percentage or pixels for horizontal alignment */ - } -} - -@media (min-width: 992px) { - .masthead, - .mastfoot, - .cover-container { - width: 60%; - } -} +/* Responsive: Portrait tablets and up */ +@media screen and (min-width: 768px) { + /* Remove the padding we set earlier */ + .header, + .marketing, + .footer { + padding-right: 0; + padding-left: 0; + } + /* Space out the masthead */ + .header { + margin-bottom: 30px; + } + /* Remove the bottom border on the jumbotron for visual effect */ + .jumbotron { + border-bottom: 0; + } +} \ No newline at end of file diff --git a/src/web_console/web/index.html b/src/web_console/web/index.html index d941c15..ff9edd2 100644 --- a/src/web_console/web/index.html +++ b/src/web_console/web/index.html @@ -7,58 +7,84 @@ - Cover Template for Bootstrap + IRext - + +
+
+ +

IRext

+
-
-
-
-
-
-

IRext

- -
-
+
+

IRext

+

IRext是一款开源家用电器红外编、解码方法.

+

登录控制台

+
+ +

红外编码

-

基于XML的编码输入语言+压缩算法支持

+

- 基于XML的编码输入语言

+

- 支持远程录入

+

- 支持红外分析仪插件

红外解码

-

支持多种平台，占用资源少，运行效率高

+

- 支持多种平台下的解码

+

- 极小的内存开销

+

- 高性能解码

-

Heading

-

Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum - id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris - condimentum nibh, ut fermentum massa justo sit amet risus.

-

View details »

+

码库索引

+

- 利用Web控制台录入码库

+

- 规范的码库审核和发布流程

+

- 支持协议扩充

-
-
-

irext

+ +
+
+ +
+
+

码库支持

+

- 支持13种电器类型

+

- 支持数百个品牌

+

- 支持上万种型号家电

+
+
+

扩展功能

+

- 支持基于开源硬件的IR学习

+

- 提供远程编码服务

+

- 代码完全开源

+
+
+

易于上手

+

- 仅需几步就能移植到您的项目

+

- Web服务接口文档

+

- 提供开放式控制台和示例代码

-
+ +
+

© Company 2014

+
+ +
+