Change quote and fix font

- Created new quotation marks without svg - Greater flexibility

- Fix font Lato in PDF - change font family in pdf_font
This commit is contained in:
Alessandro Cuoghi
2019-01-08 19:40:44 +01:00
committed by taitus
parent 4ec858f1a0
commit 5fd9b2b633
4 changed files with 62 additions and 24 deletions

View File

@@ -498,6 +498,37 @@
text-align: left; text-align: left;
} }
.quote {
font-family: Georgia, serif;
font-size: 14px;
blockquote {
border: 0;
}
.curly-quotes:before,
.curly-quotes:after {
color: #0300ff;
display: inline-block;
vertical-align: top;
height: rem-calc(18);
line-height: rem-calc(70);
font-size: rem-calc(60);
}
.curly-quotes:before {
content: '\201C';
margin-right: 4px;
margin-left: -8px;
}
.curly-quotes:after {
content: '\201D';
margin-left: 4px;
margin-right: -8px;
}
}
h3 { h3 {
color: #0300ff; color: #0300ff;
display: inline; display: inline;
@@ -510,6 +541,8 @@
.poster-footer { .poster-footer {
color: $text-medium; color: $text-medium;
border-left: 2px solid $border; border-left: 2px solid $border;
padding-left: rem-calc(40);
margin: 0 auto;
} }
} }
} }
@@ -593,8 +626,6 @@
.poster-footer { .poster-footer {
font-size: rem-calc(19); font-size: rem-calc(19);
margin: 0 auto;
padding-left: $line-height / 2;
width: 50%; width: 50%;
margin-top: rem-calc(50); margin-top: rem-calc(50);
} }
@@ -609,10 +640,12 @@
.poster-header { .poster-header {
padding: 5cm; padding: 5cm;
height: 60cm; height: 60cm;
font-weight: normal;
h1 { h1 {
font-size: 6cm; font-size: 6cm;
line-height: rem-calc(250); line-height: rem-calc(250);
font-weight: bold;
img { img {
width: 4cm; width: 4cm;
@@ -622,12 +655,13 @@
p { p {
font-size: rem-calc(80); font-size: rem-calc(80);
line-height: rem-calc(80); line-height: rem-calc(100);
color: #fff; color: #fff;
&.intro { &.intro {
margin: rem-calc(160) auto; margin: rem-calc(160) auto;
max-width: 80%; max-width: 70%;
text-align: justify; text-align: justify;
} }
@@ -660,6 +694,15 @@
.poster-content { .poster-content {
.quote {
.curly-quotes:before,
.curly-quotes:after {
font-size: rem-calc(200);
height: rem-calc(18);
line-height: rem-calc(150);
}
}
h2 { h2 {
font-size: 3cm; font-size: 3cm;
margin: $line-height 0; margin: $line-height 0;
@@ -669,6 +712,7 @@
font-size: 4.7cm; font-size: 4.7cm;
margin-top: $line-height; margin-top: $line-height;
max-width: 80%; max-width: 80%;
line-height: 5cm;
} }
img{ img{
@@ -678,10 +722,8 @@
} }
.poster-footer { .poster-footer {
margin: 0 auto; margin-top: 3cm;
margin-top: 2cm;
max-width: 60%; max-width: 60%;
padding-left: rem-calc(40);
width: 100%; width: 100%;
} }
} }

View File

@@ -53,12 +53,13 @@
} }
@font-face { @font-face {
font-family: 'Lato PDF'; font-family: 'Lato PDF';
src: url("<%= ApplicationHelper.asset_data_base64('lato-bold.ttf') %>"); src: url("<%= ApplicationHelper.asset_data_base64('lato-bold.ttf') %>");
font-weight: bold; font-weight: bold;
font-style: normal; font-style: normal;
} }
body, h1, h2, h3 { body, h1, h2, h3 {
font-family: Source Sans Pro PDF !important; font-family: Lato PDF !important;
font-weight: lighter !important;
} }

View File

@@ -17,26 +17,23 @@
<div class="proposal-image"> <div class="proposal-image">
<% if proposal.image.present? %> <% if proposal.image.present? %>
<div class="overflow-image" style="background-image: url(<%= asset_url proposal.image.attachment.url(:large) %>);"></div> <div class="overflow-image" style="background-image: url(<%= asset_url proposal.image.attachment.url(:large) %>);"></div>
<%#= image_tag proposal.image.attachment.url(:large) %>
<% else %> <% else %>
<div class="overflow-image" style="background-image: url(<%= asset_url "default_mailing.jpg"%>);"></div> <div class="overflow-image" style="background-image: url(<%= asset_url "default_mailing.jpg"%>);"></div>
<%#= image_tag "default_mailing.jpg" %>
<% end %> <% end %>
</div> </div>
<div class="poster-content"> <div class="poster-content">
<h2><%= t("dashboard.poster.index.support") %></h2> <h2><%= t("dashboard.poster.index.support") %></h2>
<h3> <div class="quote">
<span class="title-quote icon-quote-before"></span> <blockquote class="curly-quotes">
<%= proposal.title %> <h3><%= proposal.title %></h3>
<span class="title-quote icon-quote-after"></span> </blockquote>
</h3> </div>
<p class="poster-footer"><%= t("dashboard.poster.index.footer").html_safe %></p> <p class="poster-footer"><%= t("dashboard.poster.index.footer").html_safe %></p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -34,15 +34,13 @@
<div class="poster-content"> <div class="poster-content">
<h2 class="text-center"><%= t("dashboard.poster.index.support") %></h2> <h2 class="text-center"><%= t("dashboard.poster.index.support") %></h2>
<h3> <div class="quote">
<%= wicked_pdf_image_tag 'quote-before.svg' %> <blockquote class="curly-quotes">
<%= proposal.title %> <h3><%= proposal.title %></h3>
<%= wicked_pdf_image_tag 'quote-after.svg' %> </blockquote>
</h3> </div>
<p class="poster-footer"><%= t("dashboard.poster.index.footer").html_safe %></p> <p class="poster-footer"><%= t("dashboard.poster.index.footer").html_safe %></p>
</div> </div>
</div> </div>
</body> </body>
</html> </html>