vassili/seitime-frappe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Styling for homepage splash

Browse source
This commit is contained in:
Ashish Acharya 2015-11-26 21:32:22 +05:30
parent 59e80b70a0
commit 3713ef5baa
4 changed files with 85 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
frappe/docs/index.html
View file

@ -1,17 +1,20 @@
<!-- title: Frappe Framework: Documentation -->
<!-- no-breadcrumbs -->
<div class="splash">
<div class="jumbotron">
<h1>Superhero Web Framework</h1>
<p>Build extensions to ERPNext or make your own database driven app</p>
</div>
<div class="section" style="padding-top: 0px; margin-top: -30px;">
<div class="fake-browser-frame">
<img class="img-responsive browser-image feature-image"
src="assets/img/home.png">
</div>
</div>
<div class="container">
<div class="col-sm-10 col-sm-offset-1">
<div class="jumbotron">
<h1>Superhero Web Framework</h1>
<p>Build extensions to ERPNext or make your own database driven app</p>
</div>
<div class="section" style="padding-top: 0px; margin-top: -30px;">
<div class="fake-browser-frame">
<img class="img-responsive browser-image feature-image"
src="assets/img/home.png">
</div>
</div>
</div>
</div>
</div>

40
frappe/public/css/docs.css
View file

@ -246,6 +246,30 @@ body {
.splash {
background: #383851;
color: #ffffff;
padding-top: 128px;
}
.splash .jumbotron {
background-color: transparent;
padding: 14px 0 60px 0;
text-align: center;
text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.7);
}
.splash .jumbotron h1 {
font-size: 36px;
font-weight: 700;
opacity: 0.9;
}
.splash .jumbotron p {
font-size: 24px;
font-color: #8D99A6 !important;
letter-spacing: 0px;
opacity: 0.7;
margin-top: 20px;
font-weight: 300;
line-height: 1.4em;
}
.splash .section {
padding: 30px 0 0 0;
}
.navbar {
position: absolute;
@ -318,26 +342,13 @@ h2 {
display: inline-block;
margin: 0 15px;
}
.jumbotron {
background-color: transparent;
padding: 80px 30px;
text-align: center;
}
.jumbotron h1 {
font-size: 32px;
font-weight: 700;
}
.jumbotron p {
font-color: #8D99A6 !important;
}
.browser-image {
min-height: 300px;
border: 1px solid #d1d8dd;
}
.fake-browser-frame {
position: relative;
margin: 40px auto;
max-width: 600px;
margin: 24px auto 0px;
}
.fake-browser-frame::before {
content: "";
@ -347,6 +358,7 @@ h2 {
left: 0px;
right: 0px;
border: 1px solid #d1d8dd;
background: #ffffff;
border-bottom: none;
border-top-left-radius: 4px;
border-top-right-radius: 4px;

49
frappe/public/less/docs.less
View file

@ -16,6 +16,34 @@ body {
.splash{
background: #383851;
color: #ffffff;
padding-top: 128px;
.jumbotron{
background-color: transparent;
padding: 14px 0 60px 0;
text-align: center;
text-shadow: 0px 1px 2px rgba(0,0,0,0.7);
h1 {
font-size: 36px;
font-weight: 700;
opacity: 0.9;
}
p {
font-size: 24px;
font-color: @text-muted !important;
letter-spacing: 0px;
opacity: 0.7;
margin-top: 20px;
font-weight: 300;
line-height: 1.4em;
}
}
.section{
padding: 30px 0 0 0;
}
}
.navbar {
@ -99,21 +127,6 @@ h2 {
}
}
.jumbotron {
background-color: transparent;
padding: 80px 30px;
text-align: center;
h1 {
font-size: 32px;
font-weight: 700;
}
p {
font-color: @text-muted !important;
}
}
// fake frames
.browser-image {
min-height: 300px;
@ -122,8 +135,7 @@ h2 {
.fake-browser-frame {
position: relative;
margin: 40px auto;
max-width: 600px;
margin: 24px auto 0px;
}
.fake-browser-frame::before {
@ -134,6 +146,7 @@ h2 {
left: 0px;
right: 0px;
border: 1px solid #d1d8dd;
background: #ffffff;
border-bottom: none;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
@ -149,7 +162,7 @@ h2 {
/* octicon */
font: normal normal;
font-size: 8px;
font-size: 8px;
font-family: 'FontAwesome';
line-height: 1;
display: inline-block;

25
frappe/templates/autodoc/docs_home.html
View file

@ -1,17 +1,20 @@
<!-- title: {{ app.title }}: Documentation -->
<!-- no-breadcrumbs -->
<div class="splash">
<div class="jumbotron">
<h1>{{ app.headline }}</h1>
<p>{{ app.sub_heading }}</p>
</div>
<div class="section" style="padding-top: 0px; margin-top: -30px;">
<div class="fake-browser-frame">
<img class="img-responsive browser-image feature-image"
src="assets/img/home.png">
</div>
</div>
<div class="container">
<div class="col-sm-10 col-sm-offset-1">
<div class="jumbotron">
<h1>{{ app.headline }}</h1>
<p>{{ app.sub_heading }}</p>
</div>
<div class="section" style="padding-top: 0px; margin-top: -30px;">
<div class="fake-browser-frame">
<img class="img-responsive browser-image feature-image"
src="assets/img/home.png">
</div>
</div>
</div>
</div>
</div>
{% if app.long_description %}