diff --git a/.gitignore b/.gitignore
index c5fa957f3..0269d7b9e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,7 +10,9 @@ package-lock.json
private/
resources/css/
resources/js/
+src/sass/custom_style.scss
stats
+template/custom.template.php
trash
vendor/simple-translator/
.sass-cache
diff --git a/api/admin.php b/api/admin.php
index bc53d680f..55aba2cab 100644
--- a/api/admin.php
+++ b/api/admin.php
@@ -97,6 +97,12 @@
$newConfig['previewCamTakesPic'] = false;
}
+ if ($newConfig['index_style'] === 'custom') {
+ if (!is_readable('../template/custom.template.php') || !is_readable('../resources/css/custom_style.css')) {
+ $newConfig['index_style'] = 'default';
+ }
+ }
+
if ($os === 'windows') {
$newConfig['remotebuzzer_enabled'] = false;
}
diff --git a/config/config.inc.php b/config/config.inc.php
index b8e8082f9..0abd59aa6 100644
--- a/config/config.inc.php
+++ b/config/config.inc.php
@@ -95,6 +95,8 @@
// U S E R I N T E R F A C E
+// possible index_style values: "classic", "modern", "custom"
+$config['index_style'] = 'modern';
$config['font_size'] = '16px';
$config['background_image'] = null;
$config['background_admin'] = null;
diff --git a/index.php b/index.php
index dd556998e..201b6285a 100644
--- a/index.php
+++ b/index.php
@@ -34,7 +34,7 @@
-
+
@@ -47,70 +47,8 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
=$config['event']['textLeft']?>
-
- =$config['event']['textRight']?>
-
- =$config['start_screen_title']?>
-
- =$config['start_screen_subtitle']?>
-
-
-
-
-
-
-
-
-
-
=$config['start_screen_title']?>
- =$config['start_screen_subtitle']?>
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Fork me on GitHub
-
-
-
-
CUPS
-
-
-
-
-
+
diff --git a/lib/configsetup.inc.php b/lib/configsetup.inc.php
index 4207e3c47..5e8374d41 100644
--- a/lib/configsetup.inc.php
+++ b/lib/configsetup.inc.php
@@ -436,6 +436,17 @@
]
],
'user_interface' => [
+ 'index_style' => [
+ 'type' => 'select',
+ 'name' => 'index_style',
+ 'placeholder' => $defaultConfig['index_style'],
+ 'options' => [
+ 'classic' => 'classic',
+ 'modern' => 'modern',
+ 'custom' => 'custom'
+ ],
+ 'value' => $config['index_style']
+ ],
'font_size' => [
'type' => 'input',
'name' => 'font_size',
diff --git a/resources/lang/en.json b/resources/lang/en.json
index 9d9125f2a..5424b7618 100644
--- a/resources/lang/en.json
+++ b/resources/lang/en.json
@@ -282,6 +282,7 @@
"manual_user_interface_background_chroma": "CSS Style for background on chromakeying page.",
"manual_user_interface_background_image": "CSS Style for background on start-, login- and slideshow pages.",
"manual_user_interface_font_size": "Enter the default font size used for the Photobooth interface.",
+ "manual_user_interface_index_style": "Choose a start page styling. To use custom styling please create and use \"/template/custom.template.php\" and \"/resources/css/custom_style.css\", if one of these files is not readable we will fallback to default theme.",
"milliseconds": "milliseconds",
"newCollage": "New Collage",
"newPhoto": "New Picture",
@@ -415,5 +416,6 @@
"user_interface_colors_secondary": "Secondary color",
"user_interface_colors_start_font": "Start screen font color",
"user_interface_font_size": "Default font size",
+ "user_interface_index_style": "Styling",
"using_latest_version": "You are using the latest version of photobooth."
}
diff --git a/src/sass/style.scss b/src/sass/classic_style.scss
similarity index 98%
rename from src/sass/style.scss
rename to src/sass/classic_style.scss
index 3ccbfb188..fda81745e 100644
--- a/src/sass/style.scss
+++ b/src/sass/classic_style.scss
@@ -430,8 +430,15 @@ hr.small {
}
#useBuzzer {
- font-size: 2em;
+ font-size: 1.75em;
margin-top: 1em;
+ margin-bottom: 0.5em;
+}
+
+@media (max-width: 1024px) {
+ #useBuzzer {
+ font-size: 1.25em;
+ }
}
@media (max-width: 767px) {
diff --git a/src/sass/modern_style.scss b/src/sass/modern_style.scss
new file mode 100644
index 000000000..82894b2dc
--- /dev/null
+++ b/src/sass/modern_style.scss
@@ -0,0 +1,110 @@
+@import 'classic_style';
+
+html,
+body {
+ height: 100%;
+ background: #ffffff;
+ margin: 0px;
+}
+
+.round-btn {
+ width: 5em;
+ height: 5em;
+ border-radius: 50%;
+ border: 2px solid $borderColor;
+ background: radial-gradient(grey, $mainColor, $hoverColor);
+ display: inline-block;
+ color: $buttonFontColor;
+ text-decoration: none;
+ margin: auto;
+ text-align: center;
+ font-size: 1em;
+ position: relative;
+ z-index: 10;
+ span {
+ display: none;
+ }
+ &:active,
+ &:focus,
+ &:hover {
+ background: $hoverColor;
+ }
+ .fa {
+ font-size: 1.5em;
+ margin: 0;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ -ms-transform: translate(-50%, -50%);
+ transform: translate(-50%, -50%);
+ }
+}
+
+.btn:active,
+.btn:focus,
+.btn:hover {
+ opacity: 0.6;
+}
+
+#start {
+ .startInner {
+ height: 100%;
+ width: 100%;
+ position: relative;
+ background: none;
+ .btn {
+ margin-top: 3px;
+ width: auto;
+ }
+ }
+
+ .fs-button {
+ position: relative;
+ top: auto;
+ bottom: 0px;
+ left: 0px;
+ }
+
+ .gallery-button {
+ position: relative;
+ top: auto;
+ bottom: 0px;
+ left: auto;
+ }
+}
+
+.divaussen {
+ height: 100%;
+ position: relative;
+}
+
+.divinnen {
+ float: right;
+}
+
+.divinnen2 {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ padding: 10px;
+}
+
+@media (orientation: portrait) {
+ .divinnen2 {
+ margin-left: auto;
+ margin-right: auto;
+ }
+ .round-btn {
+ width: 4em;
+ height: 4em;
+ }
+}
+
+.transparenz {
+ opacity: 0.4;
+}
+
+hr,
+hr.small {
+ display: none;
+}
diff --git a/src/sass/rounded.scss b/src/sass/rounded.scss
index bf8a7afc3..459ee26b6 100644
--- a/src/sass/rounded.scss
+++ b/src/sass/rounded.scss
@@ -9,6 +9,13 @@
position: absolute;
left: 5px;
bottom: 5px;
+ &.round-btn {
+ position: fixed;
+ left: 0px;
+ top: 0px;
+ bottom: auto;
+ margin: 20px;
+ }
}
}
@@ -47,6 +54,10 @@
.fs-button {
margin-top: 5px;
margin-left: 5px;
+ &.round-btn {
+ margin-top: auto;
+ margin-left: auto;
+ }
}
.admin-panel,
diff --git a/template/classic.template.php b/template/classic.template.php
new file mode 100644
index 000000000..ce2cc9030
--- /dev/null
+++ b/template/classic.template.php
@@ -0,0 +1,64 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
=$config['event']['textLeft']?>
+
+ =$config['event']['textRight']?>
+
+ =$config['start_screen_title']?>
+
+ =$config['start_screen_subtitle']?>
+
+
+
+
+
+
+
+
+
+
=$config['start_screen_title']?>
+ =$config['start_screen_subtitle']?>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Fork me on GitHub
+
+
+
+
CUPS
+
+
+
+
+
\ No newline at end of file
diff --git a/template/modern.template.php b/template/modern.template.php
new file mode 100644
index 000000000..d3acfaecf
--- /dev/null
+++ b/template/modern.template.php
@@ -0,0 +1,84 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ =$config['event']['textLeft']?>
+
+ =$config['event']['textRight']?>
+
+ =$config['start_screen_title']?>
+
+ =$config['start_screen_subtitle']?>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
=$config['start_screen_title']?>
+ =$config['start_screen_subtitle']?>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
CUPS
+
+
+
+
+
+
+
+
+
+
CUPS
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Fork me on GitHub
+
+
\ No newline at end of file