Business/NewsPen
2
0
Fork 0
Code Issues 4 Pull Requests Releases Wiki Activity

Fix tile padding and margins to be nice and consistent

Browse Source
This commit is contained in:
Skylar Ittner 2017-12-01 22:39:24 -07:00
parent 53aebdc79a
commit 735fbd3abe
2 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
lib/gencontent.php
View File

@ -32,7 +32,7 @@ if (defined("EDIT_MODE") && EDIT_MODE == true) {
<?php echo $pubcss; ?> <?php echo $pubcss; ?>
} }
<?php $pagesize = $database->get("page_sizes", ["sizewidth (width)", "sizeheight (height)"], ["sizeid" => $pubdata["page_size"]]); ?> <?php $pagesize = $database->get("page_sizes", ["sizewidth (width)", "sizeheight (height)"], ["sizeid" => $pubdata["page_size"]]); ?>
.pub-content { .pub-content {
max-width: <?php echo ($pubdata["landscape"] == 0 ? $pagesize["width"] : $pagesize["height"]); ?>; max-width: <?php echo ($pubdata["landscape"] == 0 ? $pagesize["width"] : $pagesize["height"]); ?>;
min-height: <?php echo ($pubdata["landscape"] == 0 ? $pagesize["height"] : $pagesize["width"]); ?>; min-height: <?php echo ($pubdata["landscape"] == 0 ? $pagesize["height"] : $pagesize["width"]); ?>;
@ -57,6 +57,7 @@ foreach ($tiles as $tile) {
order: <?php echo $tile["order"]; ?>; order: <?php echo $tile["order"]; ?>;
width: <?php echo round((($tile["width"] * 1.0) / ($pubdata["columns"] * 1.0) * 100)); ?>%; width: <?php echo round((($tile["width"] * 1.0) / ($pubdata["columns"] * 1.0) * 100)); ?>%;
flex-basis: <?php echo round((($tile["width"] * 1.0) / ($pubdata["columns"] * 1.0) * 100)); ?>%; flex-basis: <?php echo round((($tile["width"] * 1.0) / ($pubdata["columns"] * 1.0) * 100)); ?>%;
flex: 0 0 calc(<?php echo round((($tile["width"] * 1.0) / ($pubdata["columns"] * 1.0) * 100)); ?>% - 10px);
} }
<?php <?php
} }

8
static/css/content.css
View File

@ -2,6 +2,8 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between;
padding: 5px;
} }
.pub-content { .pub-content {
@ -11,7 +13,7 @@
} }
.tile { .tile {
padding: 10px; margin: 5px;
} }
.tile-html { .tile-html {
@ -19,6 +21,10 @@
min-height: 10px; min-height: 10px;
} }
.tile-html img {
max-width: 100%;
}
@media print { @media print {
.pub-content { .pub-content {
height: 100%; height: 100%;