Printing: fix two dives per page borders and text font

As we use a responsive layout, every UI element must be relative
to its parent and its size must be a ratio of the view port to
prevent them from displaying outside their containing parents.

Signed-off-by: Gehad elrobey <gehadelrobey@gmail.com>
Signed-off-by: Lubomir I. Ivanov <neolit123@gmail.com>
This commit is contained in:
Gehad elrobey 2015-06-24 03:55:09 +02:00 committed by Lubomir I. Ivanov
parent fcde03e849
commit 3d5caabe4a

View file

@ -5,10 +5,11 @@
background-color: white; background-color: white;
padding: 0px; padding: 0px;
margin: 0px; margin: 0px;
font-size: 1.2vw;
} }
h1 { h1 {
font-size: 0.9cm; font-size: 1.2vw;
float: left; float: left;
} }
@ -20,49 +21,56 @@
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
overflow: hidden; overflow: hidden;
border-width: 0px;
page-break-inside: avoid; page-break-inside: avoid;
} }
.innerContainer { .innerContainer {
height: 85%; height: 85%;
border-style: solid;
padding: 0.5%; padding: 0.5%;
margin-top: 1%; margin-top: 1%;
margin-bottom: 1%; margin-bottom: 1%;
overflow: hidden; overflow: hidden;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border:max(0.1vw, 1px);
border-style:solid;
} }
.table_class { .table_class {
overflow: hidden; overflow: hidden;
max-width: 25%; max-width: 25%;
min-width: 25%; min-width: 25%;
box-shadow: 5px 5px 5px #888888;
margin: 1.5%; margin: 1.5%;
float: left; float: left;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border:max(0.1vw, 1px);
border-style:solid;
} }
.notes_table_class { .notes_table_class {
overflow: hidden; overflow: hidden;
max-width: 100%; max-width: 100%;
min-width: 100%; min-width: 100%;
box-shadow: 5px 5px 5px #888888;
margin: 1.5%; margin: 1.5%;
float: left; float: left;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border:max(0.1vw, 1px);
border-style:solid;
} }
.fieldTitle { .fieldTitle {
background-color: #CfC7C5; background-color: #CfC7C5;
overflow: hidden; overflow: hidden;
padding:0;
} }
.diveProfile { .diveProfile {
width: 37%; width: 37%;
height: 70%; height: 95%;
margin: 1.5%; margin: 1.5%;
float: right; float: right;
border-style: solid;
padding: 3mm;
} }
.diveDetails { .diveDetails {
@ -80,9 +88,9 @@
} }
.textArea { .textArea {
max-height: 43ex;
overflow: hidden !important; overflow: hidden !important;
text-overflow: ellipsis; text-overflow: ellipsis;
max-height: 10.3vw;
} }
#footer { #footer {
@ -98,7 +106,7 @@
<div class="innerContainer"> <div class="innerContainer">
<div class="diveDetails"> <div class="diveDetails">
<div class="dataPart"> <div class="dataPart">
<table class="table_class" border="1"> <table class="table_class">
<tbody><tr> <tbody><tr>
<td class="fieldTitle"> <td class="fieldTitle">
<h1> Dive No. </h1> <h1> Dive No. </h1>
@ -139,7 +147,7 @@
</td> </td>
</tr> </tr>
</tbody></table> </tbody></table>
<table class="table_class" border="1"> <table class="table_class">
<tbody><tr> <tbody><tr>
<td class="fieldTitle"> <td class="fieldTitle">
<h1> Time. </h1> <h1> Time. </h1>
@ -184,7 +192,7 @@
</div> </div>
</div> </div>
<div class="notesPart"> <div class="notesPart">
<table class="notes_table_class" border="1"> <table class="notes_table_class">
<tbody><tr> <tbody><tr>
<td class="fieldTitle"> <td class="fieldTitle">
<h1> Notes </h1> <h1> Notes </h1>