torproject/webwml
1
0
Fork 0
mirror of https://github.com/torproject/webwml.git synced 2024-11-23 18:00:01 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix css and layout for banner

Browse Source
This commit is contained in:
hiro 2018-10-22 19:47:16 +02:00
parent 10e6c8add6
commit 5f24209bb4
3 changed files with 151 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
css/layout.css
View File

@ -1396,25 +1396,39 @@ p.blogDate {
} }
.eoy-background { .eoy-background {
background-color: #FFFFFF; background-color: #F8F9FA;
width: 100%; width: 100%;
height: 200px; height: 300px;
padding-left: 10%; margin-bottom: 35px;
padding-right: 10%; }
padding-top: 5%;
.eoy-wrap {
width: 960px;
margin: auto;
padding-top: 20px;
} }
.eoy-artwork { .eoy-artwork {
width: 40%; width: 40%;
background: url(../images/artwork@2x.png) left top no-repeat; background: url(../images/artwork@2x.png) left bottom no-repeat;
background-size: contain; background-size: contain;
float: left; float: left;
height: 100%; height: 280px;
} }
.eoy-message { .eoy-message {
width: 60%; width: 55%;
float: right; float: right;
padding-left: 35px;
}
.advance-universal-hu {
color: #420C5D;
font-family: Source Sans Pro;
font-size: 24px;
font-weight: 600;
line-height: 29px;
text-align: left;
} }
.tor-strength-in-num { .tor-strength-in-num {
@ -1426,7 +1440,16 @@ p.blogDate {
text-align: left; text-align: left;
} }
.tor-strength-in-num > p { .give-today-and-mozi {
color: #420C5D;
font-family: Source Sans Pro;
font-size: 13px;
font-weight: 400;
line-height: 16px;
text-align: left;
}
.tor-strength-in-num > p.title {
text-transform: uppercase; text-transform: uppercase;
} }
@ -1436,7 +1459,6 @@ p.blogDate {
font-size: 24px; font-size: 24px;
font-weight: 600; font-weight: 600;
line-height: 29px; line-height: 29px;
width: 454px;
text-align: left; text-align: left;
} }
@ -1455,6 +1477,8 @@ p.blogDate {
width: 120px; width: 120px;
height: 35px; height: 35px;
padding: 10px; padding: 10px;
padding-left: 20px;
padding-right: 20px;
} }
.count-me-in { .count-me-in {
@ -1465,3 +1489,7 @@ p.blogDate {
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
} }
mark {
background: cyan;
}

101
css/layout.min.css vendored
View File

File diff suppressed because one or more lines are too long

24
en/banner.wmi
View File

@ -1,16 +1,18 @@
<div class="eoy-background"> <div class="eoy-background">
<div class="eoy-artwork"> <div class="eoy-wrap">
</div> <div class="eoy-artwork">
<div class="eoy-message">
<div class="tor-strength-in-num">
<p>Tor: strength in numbers</p>
</div> </div>
<div class="keep-tor-strong-giv"> <div class="eoy-message">
<p>Keep Tor strong.</p> <div class="tor-strength-in-num">
<span>Give today, and Mozilla will match your donation.</span> <p>Tor: strength in numbers</p>
</div> </div>
<div class="eoy-btn-container"> <div class="keep-tor-strong-giv">
<a class="eoy-btn count-me-in">Count me in</a> <p class="advance-universal-hu">Advance universal <mark>human rights.</mark> Protect the <mark>privacy of millions.</mark> Your financial support will allow people around the world to be more <mark>safe online.</mark></p>
<span class="give-today-and-mozi">Give today, and Mozilla will match your donation.</span>
</div>
<div class="eoy-btn-container">
<a class="eoy-btn count-me-in">Count me in</a>
</div>
</div> </div>
</div> </div>
</div> </div>