Skip to content
This repository was archived by the owner on May 5, 2021. It is now read-only.

Commit e32f31f

Browse files
Issue SORMAS-Foundation#3020 Adds printable CSS
1 parent 5fe8cef commit e32f31f

5 files changed

Lines changed: 145 additions & 1 deletion

File tree

sormas-ui/src/main/java/de/symeda/sormas/ui/MainScreen.java

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@
6464
import de.symeda.sormas.ui.statistics.StatisticsView;
6565
import de.symeda.sormas.ui.task.TasksView;
6666
import de.symeda.sormas.ui.user.UsersView;
67+
import de.symeda.sormas.ui.utils.CssStyles;
6768

6869
/**
6970
* Content of the UI when the user is logged in.
@@ -228,6 +229,12 @@ public View getView(String viewName) {
228229

229230
addComponent(menu);
230231
addComponent(viewContainer);
232+
233+
// Add some css for printable version
234+
menu.addStyleName(CssStyles.PRINT_MENU);
235+
viewContainer.addStyleName(CssStyles.PRINT_VIEW_CONTAINER);
236+
addStyleName(CssStyles.PRINT_CONTAINER);
237+
231238
setExpandRatio(viewContainer, 1);
232239
setSpacing(false);
233240
setMargin(false);

sormas-ui/src/main/java/de/symeda/sormas/ui/utils/AbstractFilterForm.java

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,8 @@ protected AbstractFilterForm(Class<T> type, String propertyI18nPrefix) {
7171
onChange();
7272
});
7373

74+
addStyleName(CssStyles.FILTER_FORM);
75+
7476
}
7577

7678
private void addApplyButton() {

sormas-ui/src/main/java/de/symeda/sormas/ui/utils/CssStyles.java

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -273,6 +273,12 @@ private CssStyles() {
273273
public static final String INACCESSIBLE_COLUMN = "inaccessible-column";
274274
public static final String INACCESSIBLE_LABEL = "inaccessible-label";
275275

276+
// Print
277+
public static final String PRINT_CONTAINER = "print-container";
278+
public static final String PRINT_MENU = "print-menu";
279+
public static final String PRINT_VIEW_CONTAINER = "print-view-container";
280+
public static final String FILTER_FORM = "filter-form";
281+
276282
@Deprecated
277283
public static final String CALLOUT = "callout";
278284

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
@mixin print {
2+
@media print {
3+
// Adapt global layout : change scroll, …
4+
body, html {
5+
overflow: unset !important;
6+
height: auto !important;
7+
}
8+
.v-app {
9+
position: relative !important;
10+
display: block !important;
11+
height: auto !important;
12+
}
13+
.print-container {
14+
padding: 0 !important;
15+
width: 100% !important;
16+
height: auto !important;
17+
position: relative !important;
18+
}
19+
.print-container > .v-expand {
20+
padding: 0 !important;
21+
}
22+
.v-app > .v-scrollable {
23+
overflow: unset !important;
24+
}
25+
// Hide some components
26+
.v-button {
27+
display: none !important;
28+
}
29+
.v-slot-print-menu {
30+
display: none !important;
31+
}
32+
.v-slot-print-view-container {
33+
maring: 10px !important;
34+
}
35+
// Ensure block display for multipage print on Firefox
36+
.v-widget, .v-slot {
37+
display: block;
38+
}
39+
// but set some exceptions
40+
.v-customcomponent .v-horizontal > .v-expand > .v-slot,
41+
.side-component .v-horizontal > .v-expand > .v-slot {
42+
display: inline-block;
43+
}
44+
// Navigation
45+
.v-slot-view-header + .v-slot > .v-tabsheet {
46+
display: none !important;
47+
}
48+
// Callout
49+
.callout {
50+
display: none !important;
51+
}
52+
// Side
53+
.side-component {
54+
width: auto !important;
55+
min-width: unset !important;
56+
height: auto !important;
57+
}
58+
.side-component .v-horizontal .v-slot {
59+
display: inline-block;
60+
}
61+
// list
62+
.v-slot-s-list-entry .s-list-entry {
63+
height: auto !important;
64+
}
65+
// Filter form
66+
.v-slot-filter-form {
67+
width: unset !important;
68+
}
69+
.filter-form {
70+
.v-button {
71+
display: inline-block !important;
72+
}
73+
.v-widget, .v-slot {
74+
display: inline-block !important;
75+
}
76+
}
77+
.v-slot-filter {
78+
display: inline-block !important;
79+
}
80+
.v-slot-filter .v-button {
81+
display: inline-block !important;
82+
}
83+
.v-menubar {
84+
display: none !important;
85+
}
86+
// Grid
87+
.v-grid-scroller {
88+
display: none !important;
89+
}
90+
.v-grid-tablewrapper {
91+
height: unset !important;
92+
display: contents !important;
93+
}
94+
.v-grid-tablewrapper {
95+
width: 100% !important;
96+
}
97+
.v-grid-tablewrapper > table {
98+
table-layout: auto !important;
99+
display: table !important;
100+
thead, tbody, tfoot {
101+
display: table-row-group !important;
102+
position: relative !important;
103+
margin-top: 0 !important;
104+
float: none !important;
105+
transform: unset !important;
106+
}
107+
tr {
108+
position: relative !important;
109+
display: table-row !important;
110+
float: none !important;
111+
transform: unset !important;
112+
td, th {
113+
position: relative !important;
114+
display: table-cell !important;
115+
float: none !important;
116+
width: unset !important;
117+
height: unset !important;
118+
}
119+
}
120+
}
121+
.v-grid-select-all-checkbox,
122+
.v-grid-selection-checkbox {
123+
display: none !important;
124+
}
125+
// TODO: a lot of things…
126+
}
127+
}

sormas-ui/src/main/webapp/VAADIN/themes/sormas/styles.scss

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
21
@import "bootstrap-grid.min.css";
32

43
@import "sormas.scss";
54
@import "addons.scss";
5+
@import "print.scss";
66

77
// This should be in the Valo theme as a shorthand
88
$v-layout-margin: $v-layout-margin-top $v-layout-margin-right $v-layout-margin-bottom $v-layout-margin-left !default;
@@ -14,3 +14,5 @@ $v-layout-margin: $v-layout-margin-top $v-layout-margin-right $v-layout-margin-b
1414
@include addons;
1515
@include sormas;
1616
}
17+
18+
@include print;

0 commit comments

Comments
 (0)