Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Positioning of logo and text

Browse Source
This commit is contained in:
JC Brand 2019-01-01 13:04:12 +01:00
parent fafaf4e15e
commit 72838be77e
3 changed files with 56 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
css/website.css
View File

@ -5134,12 +5134,6 @@ a {
.hidden {
display: none !important; }
.byline {
font-family: 'Muli', sans-serif;
font-size: 28px;
opacity: 0.5;
margin-bottom: 2em; }
#about p {
opacity: 0.9; }
@ -5247,19 +5241,26 @@ section h4 {
.brand-heading {
display: inline-flex;
align-items: flex-end;
align-items: center;
font-family: 'Baumans', cursive;
font-size: 6em;
margin-top: 1em;
margin-bottom: 0;
margin-bottom: 0.5em;
color: white; }
.brand-heading .byline {
font-family: 'Muli', sans-serif;
font-size: 20px;
opacity: 0.5;
margin-bottom: 2em;
margin-left: -75px; }
.brand-heading .subdued {
opacity: 0.15;
font-size: 95%;
word-spacing: 50px; }
.brand-heading .converse-svg-logo {
height: 1.2em;
margin-right: 0.25em; }
margin-right: 0.25em;
margin-bottom: 0.1em; }
.brand-heading .converse-svg-logo .cls-1 {
isolation: isolate; }
.brand-heading .converse-svg-logo .cls-2 {
@ -5270,6 +5271,12 @@ section h4 {
.brand-heading .converse-svg-logo .cls-4 {
fill: white; }
.brand-heading__text {
font-size: 0.9em;
display: inline-flex;
flex-direction: column;
justify-content: center; }
.brand-heading-embedded {
margin-top: 1.5em; }
@ -5277,6 +5284,12 @@ section h4 {
.intro {
padding: 0; } }
.intro-text {
font-size: 1.1em;
opacity: 0.8;
margin-bottom: 0;
padding-bottom: 1em; }
.btn-circle {
width: 70px;
height: 70px;

12
index.html
View File

@ -89,11 +89,15 @@
</g>
</g>
</svg>
converse<span class="subdued">.js</span></h1>
<p class="byline">messaging freedom</p>
<span class="brand-heading__text">
<span>converse<span class="subdued">.js</span></span>
<p class="byline">messaging freedom</p>
</span>
</h1>
<p class="intro-text">A free and open-source XMPP chat client in your browser</p>
<p>Try the <a href="/fullscreen.html">fullpage</a> version</p>
<p>
<p class="intro-text">Try the <a href="/fullscreen.html">fullpage</a> version</p>
<p style="padding-top: 1.5em">
<a href="https://inverse.chat/#converse/room?jid=discuss@conference.conversejs.org"
target="_blank" rel="noopener"><img src="https://inverse.chat/badge.svg?room=discuss@conference.conversejs.org"/></a>
</p>

35
sass/website.scss
View File

@ -97,13 +97,6 @@ a {
display: none !important;
}
.byline {
font-family: 'Muli', sans-serif;
font-size: 28px;
opacity: 0.5;
margin-bottom: 2em;
}
#about {
p {
opacity: 0.9;
@ -236,13 +229,21 @@ section {
.brand-heading {
display: inline-flex;
align-items: flex-end;
align-items: center;
font-family: 'Baumans', cursive;
font-size: 6em;
margin-top: 1em;
margin-bottom: 0;
margin-bottom: 0.5em;
color: white;
.byline {
font-family: 'Muli', sans-serif;
font-size: 20px;
opacity: 0.5;
margin-bottom: 2em;
margin-left: -75px;
}
.subdued {
opacity: 0.15;
font-size: 95%;
@ -252,6 +253,7 @@ section {
.converse-svg-logo {
height: 1.2em;
margin-right: 0.25em;
margin-bottom: 0.1em;
.cls-1 {
isolation: isolate;
}
@ -268,6 +270,13 @@ section {
}
}
.brand-heading__text {
font-size: 0.9em;
display: inline-flex;
flex-direction: column;
justify-content: center;
}
.brand-heading-embedded {
margin-top: 1.5em;
}
@ -276,6 +285,14 @@ section {
padding: 0;
}
}
.intro-text {
font-size: 1.1em;
opacity: 0.8;
margin-bottom: 0;
padding-bottom: 1em;
}
.btn-circle {
width: 70px;
height: 70px;