Merge pull request #2746 from emanuelschuetze/fonts

Use Roboto font in all templates.
This commit is contained in:
Emanuel Schütze 2016-12-09 22:26:38 +01:00 committed by GitHub
commit 8289306569
9 changed files with 122 additions and 71 deletions

View File

@ -35,8 +35,7 @@
"ngstorage": "~0.3.11", "ngstorage": "~0.3.11",
"ngBootbox": "~0.1.3", "ngBootbox": "~0.1.3",
"pdfmake-dist": "~0.1.27", "pdfmake-dist": "~0.1.27",
"open-sans-fontface": "https://github.com/OpenSlides/open-sans.git#1.4.2.post1", "roboto-fontface": "~0.6.0",
"roboto-condensed": "~0.3.0",
"tinymce": "~4.4.3", "tinymce": "~4.4.3",
"tinymce-i18n": "OpenSlides/tinymce-i18n#a186ad61e0aa30fdf657e88f405f966d790f0805" "tinymce-i18n": "OpenSlides/tinymce-i18n#a186ad61e0aa30fdf657e88f405f966d790f0805"
}, },
@ -50,6 +49,14 @@
"pdfjs-dist": { "pdfjs-dist": {
"main": "build/pdf.combined.js" "main": "build/pdf.combined.js"
}, },
"roboto-fontface": {
"main": [
"fonts/Roboto/Roboto-Regular.woff",
"fonts/Roboto/Roboto-Medium.woff",
"fonts/Roboto-Condensed/Roboto-Condensed-Regular.woff",
"fonts/Roboto-Condensed/Roboto-Condensed-Light.woff"
]
},
"tinymce": { "tinymce": {
"main": [ "main": [
"tinymce.js", "tinymce.js",

View File

@ -97,7 +97,7 @@ gulp.task('css-libs', function () {
// Catches all font files from all bower components. // Catches all font files from all bower components.
gulp.task('fonts-libs', function() { gulp.task('fonts-libs', function() {
return gulp.src(mainBowerFiles({ return gulp.src(mainBowerFiles({
filter: /\.(eot)|(svg)|(ttf)|(woff)|(woff2)$/ filter: /\.woff$/
})) }))
.pipe(gulp.dest(path.join(output_directory, 'fonts'))); .pipe(gulp.dest(path.join(output_directory, 'fonts')));
}); });

View File

@ -260,22 +260,18 @@
<!-- main content column --> <!-- main content column -->
<div class="col-xs-6 content" style="padding-left: calc({{ item.parentCount }}*15px)"> <div class="col-xs-6 content" style="padding-left: calc({{ item.parentCount }}*15px)">
<div class="spacer-right"> <div class="spacer-right">
<strong> <i class="fa fa-ban" ng-style="{'visibility': item.is_hidden ? 'visible' : 'hidden'}"
<i class="fa fa-ban fa-lg" ng-style="{'visibility': item.is_hidden ? 'visible' : 'hidden'}"
title="{{ 'Internal item' | translate }}"></i> title="{{ 'Internal item' | translate }}"></i>
</strong>
</div> </div>
<div> <div>
<!-- ID and title --> <!-- ID and title -->
<div> <div>
<strong>
<a class="title" ui-sref="{{ getUpdateStatePrefix(item) }}.detail({id: item.content_object.id})" ng-show="isAllowedToSeeOpenLink(item)"> <a class="title" ui-sref="{{ getUpdateStatePrefix(item) }}.detail({id: item.content_object.id})" ng-show="isAllowedToSeeOpenLink(item)">
{{ item.getListViewTitle() }} {{ item.getListViewTitle() }}
</a> </a>
<span class="title" ng-hide="isAllowedToSeeOpenLink(item)"> <span class="title" ng-hide="isAllowedToSeeOpenLink(item)">
{{ item.getListViewTitle() }} {{ item.getListViewTitle() }}
</span> </span>
</strong>
</div> </div>
<!-- hover menu --> <!-- hover menu -->
<div os-perms="agenda.can_see" ng-class="{'hiddenDiv': !item.hover}"> <div os-perms="agenda.can_see" ng-class="{'hiddenDiv': !item.hover}">

View File

@ -224,11 +224,9 @@
<div class="title-col"> <div class="title-col">
<!-- title and phase --> <!-- title and phase -->
<div> <div>
<strong> <a class="title" ui-sref="assignments.assignment.detail({id: assignment.id})">
<a ui-sref="assignments.assignment.detail({id: assignment.id})">
{{ assignment.title }} {{ assignment.title }}
</a> </a>
</strong>
<span style="padding: 5px;" ng-mouseover="assignment.phaseHover=true" ng-mouseleave="assignment.phaseHover=false"> <span style="padding: 5px;" ng-mouseover="assignment.phaseHover=true" ng-mouseleave="assignment.phaseHover=false">
<span class="label" ng-class="{'label-primary': assignment.phase == 0, <span class="label" ng-class="{'label-primary': assignment.phase == 0,
'label-warning': assignment.phase == 1, 'label-warning': assignment.phase == 1,

View File

@ -1,7 +1,55 @@
/* /*
* OpenSlides template styles of web interface * Font definitions for OpenSlides site
*/ */
@font-face {
font-family: 'Roboto Condensed';
src: url('../fonts/Roboto-Condensed-Regular.woff') format('woff');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'Roboto Condensed Light';
src: url('../fonts/Roboto-Condensed-Light.woff') format('woff');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Roboto Medium';
src: url('../fonts/Roboto-Medium.woff') format('woff');
font-weight: 400;
font-style: normal;
}
body {
font-family: "Roboto", sans-serif;
}
strong, b, .os-table .title {
font-family: "Roboto Medium";
font-family: "Roboto Medium", sans-serif;
font-weight: normal;
}
h1, h2, h3, h4, h5, h6, #header .title {
font-family: "Roboto Condensed", sans-serif;
font-weight: 400;
}
#content .col2 h4 {
font-family: 'Roboto Condensed Light';
font-weight: 300;
}
#content .col1 .meta .heading .drop-down-name, #content .col1 .meta h3 {
font-family: 'Roboto Condensed Light';
}
/*
* Template styles for OpenSlides site
*/
* { /* set margin/padding for all (block) elements to null */ * { /* set margin/padding for all (block) elements to null */
margin: 0; margin: 0;
@ -9,8 +57,6 @@
} }
body { body {
font-family: "Open Sans",Helvetica,Arial,sans-serif;
font-weight: 400;
font-size: 14px; font-size: 14px;
line-height: 1.5; line-height: 1.5;
color: #222; color: #222;
@ -18,7 +64,6 @@ body {
background: #e8eaed; background: #e8eaed;
} }
div { div {
text-align: left; text-align: left;
} }
@ -28,8 +73,6 @@ blockquote {
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-family: "Roboto Condensed",Helvetica,Arial,sans-serif;
font-weight: 400;
line-height: 1.1; line-height: 1.1;
} }
@ -114,8 +157,6 @@ img {
#header .title { #header .title {
float: left; float: left;
margin: 2px 0 0 -5px; margin: 2px 0 0 -5px;
font-family: "Roboto Condensed",Helvetica,Arial,sans-serif;
font-weight: 400;
color: #fff; color: #fff;
} }
@ -426,11 +467,10 @@ img {
content: attr(data-line-number); content: attr(data-line-number);
position: absolute; position: absolute;
left: 20px; left: 20px;
top: 12px; top: 10px;
vertical-align: top; vertical-align: top;
color: gray; color: gray;
font-family: Courier, serif; font-size: 12px;
font-size: 13px;
font-weight: normal; font-weight: normal;
} }
@ -444,10 +484,9 @@ img {
display: inline-block; display: inline-block;
content: attr(data-line-number); content: attr(data-line-number);
vertical-align: top; vertical-align: top;
font-size: 11px; font-size: 10px;
font-weight: normal; font-weight: normal;
color: gray; color: gray;
font-family: Courier, serif;
margin-top: -3px; margin-top: -3px;
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
@ -679,8 +718,6 @@ img {
#content .col2 h4 { #content .col2 h4 {
font-size: 22px; font-size: 22px;
line-height: 24px; line-height: 24px;
font-family: 'Roboto Condensed Light';
font-weight: 300;
color: #444; color: #444;
} }
#content .col1 .meta .heading, #content .col1 .meta h3 { #content .col1 .meta .heading, #content .col1 .meta h3 {
@ -692,9 +729,6 @@ img {
margin-top: 20px; margin-top: 20px;
margin-bottom: 5px; margin-bottom: 5px;
} }
#content .col1 .meta .heading .drop-down-name, #content .col1 .meta h3 {
font-family: 'Roboto Condensed Light';
}
#content .col2 a:hover h4 { #content .col2 a:hover h4 {
text-decoration: none; text-decoration: none;
@ -1409,7 +1443,7 @@ img {
/* override booststrap's label class to fix linebreak and add spacing */ /* override booststrap's label class to fix linebreak and add spacing */
.label { .label {
display: inline-block; display: inline-block;
padding: .3em .6em; padding: .4em .6em;
margin-right: .2em; margin-right: .2em;
} }
@ -1528,6 +1562,11 @@ tr.selected td {
float: left; float: left;
width: 50%; width: 50%;
} }
.motion-text.line-numbers-outside .os-line-number:after {
font-size: 10px;
top: 9px;
}
} }

View File

@ -1,5 +1,39 @@
/* /*
* OpenSlides default projector styles * Font definitions for OpenSlides projector
*/
@font-face {
font-family: 'Roboto Condensed';
src: url('../fonts/Roboto-Condensed-Regular.woff') format('woff');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'Roboto Condensed Light';
src: url('../fonts/Roboto-Condensed-Light.woff') format('woff');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}
body {
font-family: "Roboto", sans-serif;
}
h1, h2, h3, h4, h5, h6, .countdown, .message {
font-family: "Roboto Condensed", sans-serif;
font-weight: normal;
}
#header, #currentTime, #footer {
font-family: 'Roboto Condensed Light';
}
/*
* Template styles for OpenSlides projector
* *
*/ */
@ -11,7 +45,6 @@ body {
font-size: 20px !important; font-size: 20px !important;
line-height: 24px !important; line-height: 24px !important;
overflow: hidden; overflow: hidden;
font-family: "Open Sans",Helvetica,Arial,sans-serif;
color: #222; color: #222;
} }
@ -64,7 +97,6 @@ body {
box-shadow: 0 0 7px rgba(0,0,0,0.6); box-shadow: 0 0 7px rgba(0,0,0,0.6);
height: 70px; height: 70px;
margin-bottom: 20px; margin-bottom: 20px;
font-family: 'Roboto Condensed Light';
} }
#logo { #logo {
position: relative; position: relative;
@ -94,7 +126,6 @@ body {
opacity: 0.8; opacity: 0.8;
} }
#currentTime { #currentTime {
font-family: 'Roboto Condensed Light';
border: 0 solid #000000; border: 0 solid #000000;
font-size: 24px; font-size: 24px;
position: absolute; position: absolute;
@ -104,7 +135,6 @@ body {
padding-left: 30px; padding-left: 30px;
} }
#footer { #footer {
font-family: 'Roboto Condensed Light';
position: fixed; position: fixed;
bottom: 0; bottom: 0;
height: 35px; height: 35px;
@ -151,11 +181,6 @@ body {
display: block !important; display: block !important;
} }
h1, h2, h3, h4, h5, h6 {
font-family: "Roboto Condensed",Helvetica,Arial,sans-serif;
font-weight: normal;
}
h1 { h1 {
font-size: 2.25em; font-size: 2.25em;
line-height: 1.1em; line-height: 1.1em;
@ -261,7 +286,6 @@ hr {
text-align: right; text-align: right;
border-radius: 7px 7px 7px 7px; border-radius: 7px 7px 7px 7px;
z-index: 320; z-index: 320;
font-family: "Roboto Condensed",Helvetica,Arial,sans-serif;
} }
.countdown .description { .countdown .description {
font-weight: normal; font-weight: normal;
@ -287,7 +311,6 @@ hr {
z-index: 300; z-index: 300;
} }
.message { .message {
font-family: "Roboto Condensed",Helvetica,Arial,sans-serif;
font-weight: normal; font-weight: normal;
position: fixed; position: fixed;
top: 35%; top: 35%;
@ -426,7 +449,6 @@ tr.elected td {
left: -25px; left: -25px;
vertical-align: top; vertical-align: top;
color: gray; color: gray;
font-family: Courier, serif;
font-size: 13px; font-size: 13px;
font-weight: normal; font-weight: normal;
} }
@ -444,7 +466,6 @@ tr.elected td {
font-size: 0.75em; font-size: 0.75em;
font-weight: normal; font-weight: normal;
color: gray; color: gray;
font-family: Courier, serif;
margin-top: -5px; margin-top: -5px;
margin-left: 0; margin-left: 0;
} }

View File

@ -279,16 +279,12 @@
<!-- main content column --> <!-- main content column -->
<div class="col-xs-6 content"> <div class="col-xs-6 content">
<div class="spacer-right"> <!-- horizontal block --> <div class="spacer-right"> <!-- horizontal block -->
<strong>
<i ng-style="{'visibility': mediafile.private ? 'visible' : 'hidden'}" class="fa fa-lock fa-lg" <i ng-style="{'visibility': mediafile.private ? 'visible' : 'hidden'}" class="fa fa-lock fa-lg"
title="{{ 'Is private' | translate }}"></i> title="{{ 'Is private' | translate }}"></i>
</strong>
</div> </div>
<div> <div>
<div> <!-- vertical block --> <div> <!-- vertical block -->
<strong> <a ng-href="{{ mediafile.mediafileUrl }}" class="title" target="_blank">{{ mediafile.title_or_filename }}</a>
<a ng-href="{{ mediafile.mediafileUrl }}" target="_blank">{{ mediafile.title_or_filename }}</a>
</strong>
</div> </div>
<div><small>{{ mediafile.uploader.get_full_name() }}</small></div> <div><small>{{ mediafile.uploader.get_full_name() }}</small></div>
<div os-perms="mediafiles.can_manage" ng-class="{'hiddenDiv': !mediafile.hover}"> <div os-perms="mediafiles.can_manage" ng-class="{'hiddenDiv': !mediafile.hover}">

View File

@ -382,9 +382,7 @@
<div class="id-col-space"> <div class="id-col-space">
<!-- ID and title --> <!-- ID and title -->
<div> <div>
<strong>
<a class="title" ui-sref="motions.motion.detail({id: motion.id})">{{ motion.getTitle() }}</a> <a class="title" ui-sref="motions.motion.detail({id: motion.id})">{{ motion.getTitle() }}</a>
</strong>
<i class="fa fa-paperclip" ng-if="motion.attachments_id.length > 0"></i> <i class="fa fa-paperclip" ng-if="motion.attachments_id.length > 0"></i>
</div> </div>
<!-- state --> <!-- state -->

View File

@ -277,18 +277,14 @@
<!-- main content column --> <!-- main content column -->
<div class="col-xs-6 content"> <div class="col-xs-6 content">
<div class="spacer-right"> <!-- horizontal block --> <div class="spacer-right"> <!-- horizontal block -->
<strong>
<i ng-style="{'visibility': user.is_active === false ? 'visible' : 'hidden'}" class="fa fa-ban" <i ng-style="{'visibility': user.is_active === false ? 'visible' : 'hidden'}" class="fa fa-ban"
title="{{ 'Is inactive' | translate }}"></i> title="{{ 'Is inactive' | translate }}"></i>
<i ng-style="{'visibility': user.is_committee ? 'visible' : 'hidden'}" class="fa fa-university" <i ng-style="{'visibility': user.is_committee ? 'visible' : 'hidden'}" class="fa fa-university"
title="{{ 'Is a committee' | translate }}"></i> title="{{ 'Is a committee' | translate }}"></i>
</strong>
</div> </div>
<div> <div>
<div> <!-- vertical block --> <div> <!-- vertical block -->
<strong>
<a ui-sref="users.user.detail({id: user.id})" class="title">{{ user.get_short_name() }}</a> <a ui-sref="users.user.detail({id: user.id})" class="title">{{ user.get_short_name() }}</a>
</strong>
</div> </div>
<div os-perms="users.can_manage"> <!-- user number --> <div os-perms="users.can_manage"> <!-- user number -->
<div ng-if="user.number" editable-text="user.number" onaftersave="save(user)"> <div ng-if="user.number" editable-text="user.number" onaftersave="save(user)">