enhance the homepage

enhance the homepage
This commit is contained in:
coderfengyun 2014-10-09 08:30:24 +08:00
parent 7bcc38339d
commit 9f596fc2a2
7 changed files with 106 additions and 46 deletions

View File

@ -1,6 +1,8 @@
login=login login=login
sign=sign sign=sign
loginwith=Please login with your Username and Password. loginwith=Please login with your Username and Password.
introduce-header=Write code that scales
introduce=When you write the test script in bench4q's language, we'll grant you the power to scale it up to 50 thousand vUsers.And we can generate load for web-app, website and other protocal's app.
welcometo=Welcome to Bench4Q welcometo=Welcome to Bench4Q
creattestplan=Creat TestPlan creattestplan=Creat TestPlan
scriptmanagement=Script Management scriptmanagement=Script Management

View File

@ -1,6 +1,8 @@
login=\u767B\u5F55 login=\u767B\u5F55
sign=\u6CE8\u518C sign=\u6CE8\u518C
loginwith=\u8BF7\u8F93\u5165\u7528\u6237\u540D\u548C\u5BC6\u7801\u767B\u5F55\u7CFB\u7EDF loginwith=\u8BF7\u8F93\u5165\u7528\u6237\u540D\u548C\u5BC6\u7801\u767B\u5F55\u7CFB\u7EDF
introduce-header=\u8BA9\u4F60\u7684\u4EE3\u7801\u5F62\u6210\u538B\u529B
introduce=When you write the test script in bench4q's language, we'll grant you the power to scale it up to 50 thousand vUsers.And we can generate load for web-app, website and other protocal's app.
welcometo=\u6B22\u8FCE\u4F7F\u7528Bench4Q welcometo=\u6B22\u8FCE\u4F7F\u7528Bench4Q
creattestplan=\u65B0\u5EFA\u6D4B\u8BD5\u8BA1\u5212 creattestplan=\u65B0\u5EFA\u6D4B\u8BD5\u8BA1\u5212
scriptmanagement=\u811A\u672C\u7BA1\u7406 scriptmanagement=\u811A\u672C\u7BA1\u7406

View File

@ -1,3 +1,20 @@
body {
font-family: "Whitney B", "Whitney A", arial, verdana,
"lucida sans unicode", tahoma, sans-serif;
font-size: 24px;
line-height: 1.42857143;
color: #333;
background-color: #fff;
}
.container {
margin-right: auto;
margin-left: auto;
padding-left: 15px;
padding-right: 15px;
width: 970px;
}
#header { #header {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
-ms-filter: -ms-filter:
@ -7,8 +24,8 @@
border-bottom: 1px solid #cacaca; border-bottom: 1px solid #cacaca;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 0 10px box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 0 10px
rgba(0, 0, 0, 0.1); rgba(0, 0, 0, 0.1);
padding-top: 22px; padding-top: 15px;
padding-bottom: 22px; padding-bottom: 15px;
} }
.clearfix { .clearfix {
@ -73,6 +90,29 @@
left: 50%; left: 50%;
} }
.promo-text {
position: absolute;
width: 100%;
top: 200px;
z-index: 3;
color: #fff;
font-size: 22px;
font-weight: 500;
line-height: 26px;
text-align: center;
}
.promo-text .block {
max-width: 775px;
padding: 0 28px;
}
.promo-text h1 {
font-size: 70px;
font-weight: 600;
line-height: 70px;
}
.promo .bg { .promo .bg {
display: block; display: block;
margin: 0 auto; margin: 0 auto;
@ -97,12 +137,35 @@ h1 {
font-weight: bold; font-weight: bold;
} }
.content { .section .block {
margin-top: 20px; margin: 0 0 62px;
overflow: hidden;
} }
.picture { .section .block .image.alignleft {
margin: 0 5% 0 0;
}
.section .block .image {
width: 43%;
display: inline-block;
vertical-align: middle;
}
.section .block .box {
width: 51%;
display: inline-block;
vertical-align: middle;
}
.section:after {
content: '';
display: block;
clear: both;
}
.content {
margin-top: 20px;
} }
.partner { .partner {
@ -204,8 +267,4 @@ h1 {
height: 200px; height: 200px;
padding-top: 20px; padding-top: 20px;
float: left float: left
}
body {
font-size: 13px;
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@ -24,8 +24,8 @@ body {
<body class="logged_out wider windows env-production "> <body class="logged_out wider windows env-production ">
<div id="header" class="true clearfix"> <div id="header" class="true clearfix">
<div class="container clearfix"> <div class="container clearfix">
<a class="site-whei" href="index.jsp"><img id="bench4q" <a class="site-logo" href="index.jsp"><img id="bench4q"
src="images/headerLogo.png" height="30" /></a> src="images/logo_white.png" height="40" /></a>
<ul class="top-nav logged_out"> <ul class="top-nav logged_out">
<li class="login"><a href="register.jsp"><fmt:message <li class="login"><a href="register.jsp"><fmt:message
key="index_jsp_register" /></a></li> key="index_jsp_register" /></a></li>
@ -40,43 +40,40 @@ body {
<img class="background" src="images/index/bg.jpg"> <img class="background" src="images/index/bg.jpg">
</div> </div>
</div> </div>
<div class="promo-text">
<div class="container">
<div class="block">
<h1>
<fmt:message key="introduce-header" />
</h1>
<p>
<fmt:message key="introduce" />
</p>
</div>
</div>
</div>
</section> </section>
<div class="content introduce"> <div class="container">
<div class="text"> <div class="content introduce">
<div class="right-text"> <section class="section">
<div> <h1>Four features Bench4Q has</h1>
<p class="text-title">Bench4Q</p> <div class="item-block">
<article class="block">
<div class="image alignleft">
<img src="images/index/automated-test.png"
alt="Automated testing" width="200" height="227">
</div>
<div class="box">
<h2>Automated Testing</h2>
<p>We not only provide the traditional test mode, but also
provide the target mode. When we want to load test the SUT to
some target, we can use it. It'll generate test plan for us
automatically.</p>
</div>
</article>
</div> </div>
<div> </section>
<p class="text-content">
<fmt:message key="index_jsp_Bench4Q" />
</p>
</div>
</div>
<div class="left-text">
<div>
<p class="text-title">Bench4Q_as_a_Service</p>
</div>
<div>
<p class="text-content">
<fmt:message key="index_jsp_Bench4Q_as_a_Service" />
</p>
</div>
</div>
<div class="clear"></div>
</div> </div>
<div class="button">
<div align="center">
<a href="register.jsp"><img id="register" class="register"
src="images/go.jpg"></img></a>
</div>
<div>
<p style="text-align: center">
<fmt:message key="index_jsp_FreeRegister" />
</p>
</div>
</div>
</div>
</div> </div>
<!--/.fluid-container--> <!--/.fluid-container-->
<div class="bottom"> <div class="bottom">