Use Muli
as the headings font
This commit is contained in:
parent
e41eebcce9
commit
11655e2e32
@ -11,6 +11,12 @@
|
|||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
src: local("Baumans Regular"), local("Baumans-Regular"), url(webfonts/baumans.ttf) format("truetype"); }
|
src: local("Baumans Regular"), local("Baumans-Regular"), url(webfonts/baumans.ttf) format("truetype"); }
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Muli';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
src: local("Muli Regular"), local("Muli-Regular"), url(webfonts/muli.ttf) format("truetype"); }
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'ConverseFontAwesomeBrands';
|
font-family: 'ConverseFontAwesomeBrands';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -9357,7 +9363,8 @@ readers do not read off random characters that represent icons */
|
|||||||
--mobile-chat-width: 100%;
|
--mobile-chat-width: 100%;
|
||||||
--mobile-chat-height: 400px;
|
--mobile-chat-height: 400px;
|
||||||
--normal-font: "Helvetica", "Arial", sans-serif;
|
--normal-font: "Helvetica", "Arial", sans-serif;
|
||||||
--heading-font: 'Baumans', cursive;
|
--heading-font: 'Muli', normal;
|
||||||
|
--branding-font: 'Baumans', cursive;
|
||||||
--heading-display: block;
|
--heading-display: block;
|
||||||
--heading-color: white;
|
--heading-color: white;
|
||||||
--chatroom-head-color: #E77051;
|
--chatroom-head-color: #E77051;
|
||||||
@ -9553,7 +9560,7 @@ body.reset {
|
|||||||
max-width: 83.33333%; } }
|
max-width: 83.33333%; } }
|
||||||
|
|
||||||
.converse-brand__text {
|
.converse-brand__text {
|
||||||
font-family: var(--heading-font);
|
font-family: var(--branding-font);
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
@ -9599,7 +9606,7 @@ body.reset {
|
|||||||
font-size: 200%;
|
font-size: 200%;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
font-family: var(--heading-font); }
|
font-family: var(--branding-font); }
|
||||||
#conversejs .brand-heading:hover .brand-name {
|
#conversejs .brand-heading:hover .brand-name {
|
||||||
color: var(--link-color); }
|
color: var(--link-color); }
|
||||||
#conversejs .brand-heading .converse-svg-logo {
|
#conversejs .brand-heading .converse-svg-logo {
|
||||||
@ -11943,7 +11950,8 @@ body.reset {
|
|||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-family: var(--heading-font);
|
font-family: var(--heading-font);
|
||||||
font-size: 115%; }
|
font-size: 115%;
|
||||||
|
font-weight: bold; }
|
||||||
#conversejs .message.chat-msg .chat-msg__heading .chat-msg__author .badge {
|
#conversejs .message.chat-msg .chat-msg__heading .chat-msg__author .badge {
|
||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
font-family: var(--normal_font); }
|
font-family: var(--normal_font); }
|
||||||
|
BIN
css/webfonts/muli.ttf
Normal file
BIN
css/webfonts/muli.ttf
Normal file
Binary file not shown.
@ -5091,7 +5091,7 @@ img::-moz-selection {
|
|||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1, h2, h3, h4, h5, h6 {
|
||||||
margin: 0 0 35px;
|
margin: 0 0 35px;
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
letter-spacing: 1px; }
|
letter-spacing: 1px; }
|
||||||
|
|
||||||
@ -5127,10 +5127,10 @@ a {
|
|||||||
word-spacing: 50px; }
|
word-spacing: 50px; }
|
||||||
|
|
||||||
.byline {
|
.byline {
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
opacity: 0.6;
|
opacity: 0.5;
|
||||||
margin-bottom: 3em; }
|
margin-bottom: 2em; }
|
||||||
|
|
||||||
#about p {
|
#about p {
|
||||||
opacity: 0.9; }
|
opacity: 0.9; }
|
||||||
@ -5139,7 +5139,7 @@ a {
|
|||||||
font-weight: 400; }
|
font-weight: 400; }
|
||||||
|
|
||||||
.navbar {
|
.navbar {
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
font-size: 95%;
|
font-size: 95%;
|
||||||
@ -5337,7 +5337,7 @@ section h4 {
|
|||||||
padding: 100px 0; } }
|
padding: 100px 0; } }
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
-webkit-transition: all 0.3s ease-in-out;
|
-webkit-transition: all 0.3s ease-in-out;
|
||||||
-moz-transition: all 0.3s ease-in-out;
|
-moz-transition: all 0.3s ease-in-out;
|
||||||
|
25
index.html
25
index.html
@ -71,28 +71,6 @@
|
|||||||
<section id="intro" class="intro" class="container">
|
<section id="intro" class="intro" class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-12 col-md-offset-2">
|
<div class="col-md-12 col-md-offset-2">
|
||||||
<h1 class="brand-heading converse-brand-heading hidden">
|
|
||||||
<svg class="converse-svg-logo"
|
|
||||||
xmlns:svg="http://www.w3.org/2000/svg"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
viewBox="0 0 364 364">
|
|
||||||
<title>Converse</title>
|
|
||||||
<g class="cls-1" id="g904">
|
|
||||||
<g data-name="Layer 2">
|
|
||||||
<g data-name="Layer 7">
|
|
||||||
<path
|
|
||||||
class="cls-3"
|
|
||||||
d="M221.46,103.71c0,18.83-29.36,18.83-29.12,0C192.1,84.88,221.46,84.88,221.46,103.71Z" />
|
|
||||||
<path
|
|
||||||
class="cls-4"
|
|
||||||
d="M179.9,4.15A175.48,175.48,0,1,0,355.38,179.63,175.48,175.48,0,0,0,179.9,4.15Zm-40.79,264.5c-.23-17.82,27.58-17.82,27.58,0S138.88,286.48,139.11,268.65ZM218.6,168.24A79.65,79.65,0,0,1,205.15,174a12.76,12.76,0,0,0-6.29,4.65L167.54,222a1.36,1.36,0,0,1-2.46-.8v-35.8a2.58,2.58,0,0,0-3.06-2.53c-15.43,3-30.23,7.7-42.73,19.94-38.8,38-29.42,105.69,16.09,133.16a162.25,162.25,0,0,1-91.47-67.27C-3.86,182.26,34.5,47.25,138.37,25.66c46.89-9.75,118.25,5.16,123.73,62.83C265.15,120.64,246.56,152.89,218.6,168.24Z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
<span>converse</span></h1>
|
|
||||||
|
|
||||||
<h1 class="brand-heading indiechat">
|
<h1 class="brand-heading indiechat">
|
||||||
<svg class="converse-svg-logo"
|
<svg class="converse-svg-logo"
|
||||||
xmlns:svg="http://www.w3.org/2000/svg"
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
@ -114,8 +92,9 @@
|
|||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
converse<span class="subdued">.js</span></h1>
|
converse<span class="subdued">.js</span></h1>
|
||||||
|
|
||||||
<p class="byline">messaging freedom</p>
|
<p class="byline">messaging freedom</p>
|
||||||
|
<p class="intro-text">A free and open-source XMPP chat client in your browser</p>
|
||||||
|
<p>Try out the <a href="/fullscreen.html">fullpage</a> version</p>
|
||||||
<p>
|
<p>
|
||||||
<a href="https://inverse.chat/#converse/room?jid=discuss@conference.conversejs.org"
|
<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>
|
target="_blank" rel="noopener"><img src="https://inverse.chat/badge.svg?room=discuss@conference.conversejs.org"/></a>
|
||||||
|
@ -71,7 +71,7 @@ body.reset {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.converse-brand__text {
|
.converse-brand__text {
|
||||||
font-family: var(--heading-font);
|
font-family: var(--branding-font);
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
@ -138,7 +138,7 @@ body.reset {
|
|||||||
font-size: 200%;
|
font-size: 200%;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
font-family: var(--heading-font);
|
font-family: var(--branding-font);
|
||||||
&:hover {
|
&:hover {
|
||||||
.brand-name {
|
.brand-name {
|
||||||
color: var(--link-color);
|
color: var(--link-color);
|
||||||
|
@ -218,6 +218,7 @@
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-family: var(--heading-font);
|
font-family: var(--heading-font);
|
||||||
font-size: 115%;
|
font-size: 115%;
|
||||||
|
font-weight: bold;
|
||||||
.badge {
|
.badge {
|
||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
font-family: var(--normal_font);
|
font-family: var(--normal_font);
|
||||||
|
@ -92,7 +92,8 @@ $mobile_portrait_length: 480px !default;
|
|||||||
// --font-path: "webfonts/icomoon/fonts/";
|
// --font-path: "webfonts/icomoon/fonts/";
|
||||||
|
|
||||||
--normal-font: "Helvetica", "Arial", sans-serif;
|
--normal-font: "Helvetica", "Arial", sans-serif;
|
||||||
--heading-font: 'Baumans', cursive;
|
--heading-font: 'Muli', normal;
|
||||||
|
--branding-font: 'Baumans', cursive;
|
||||||
--heading-display: block;
|
--heading-display: block;
|
||||||
--heading-color: white;
|
--heading-color: white;
|
||||||
|
|
||||||
|
7
sass/font-awesome.scss
vendored
7
sass/font-awesome.scss
vendored
@ -5,6 +5,13 @@
|
|||||||
src: local('Baumans Regular'), local('Baumans-Regular'), url(webfonts/baumans.ttf) format('truetype');
|
src: local('Baumans Regular'), local('Baumans-Regular'), url(webfonts/baumans.ttf) format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Muli';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
src: local('Muli Regular'), local('Muli-Regular'), url(webfonts/muli.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'ConverseFontAwesomeBrands';
|
font-family: 'ConverseFontAwesomeBrands';
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
|
@ -49,7 +49,7 @@ img::-moz-selection {
|
|||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1, h2, h3, h4, h5, h6 {
|
||||||
margin: 0 0 35px;
|
margin: 0 0 35px;
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
}
|
}
|
||||||
@ -94,11 +94,10 @@ a {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.byline {
|
.byline {
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
opacity: 0.6;
|
opacity: 0.5;
|
||||||
// color: #E7A151;
|
margin-bottom: 2em;
|
||||||
margin-bottom: 3em;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#about {
|
#about {
|
||||||
@ -112,7 +111,7 @@ a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.navbar {
|
.navbar {
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
font-size: 95%;
|
font-size: 95%;
|
||||||
@ -353,7 +352,7 @@ section {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.btn {
|
.btn {
|
||||||
font-family: Futura,Helvetica,Trebuchet MS,Arial,sans-serif;
|
font-family: 'Muli', sans-serif;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
-webkit-transition: all 0.3s ease-in-out;
|
-webkit-transition: all 0.3s ease-in-out;
|
||||||
-moz-transition: all 0.3s ease-in-out;
|
-moz-transition: all 0.3s ease-in-out;
|
||||||
|
Loading…
Reference in New Issue
Block a user