Merge pull request #83 from matthieusalvat/feature/low-res

add stylesheets for low res screen (800px*600px)

photobooth/gui/Qt5Gui/__init__.py

@@ -19,7 +19,9 @@
 
 # Available style sheets as tuples of (style name, style file)
 styles = (('default', 'stylesheets/default.qss'),
-          ('dark', 'stylesheets/dark.qss'),
+          ('dark (1024 x 600 px)', 'stylesheets/dark-1024x600.qss'),
-          ('pastel', 'stylesheets/pastel.qss'))
+          ('dark (800 x 600 px)', 'stylesheets/dark-800x600.qss'),
+          ('pastel (1024 x 600 px)', 'stylesheets/pastel-1024x600.qss'),
+          ('pastel (800 x 600 px)', 'stylesheets/pastel-800x600.qss'))
 
 from .PyQt5Gui import PyQt5Gui  # noqa

photobooth/gui/Qt5Gui/stylesheets/dark-1024x600.qss

@@ -30,7 +30,7 @@ QPushButton:pressed {
 /* Idle Screen */
 
 QFrame#IdleMessage {
-    background-image: url(photobooth/gui/Qt5Gui/images/arrow.png);
+    background-image: url(photobooth/gui/Qt5Gui/images/arrow-1024x600.png);
     background-repeat: no-repeat;
     padding: 80px 400px 120px 80px;
 }
@@ -96,7 +96,7 @@ QFrame#CountdownMessage {
 /* Pose Screen */
 
 QFrame#PoseMessage {
-    background-image: url(photobooth/gui/Qt5Gui/images/camera.png);
+    background-image: url(photobooth/gui/Qt5Gui/images/camera-1024x600.png);
     background-repeat: no-repeat;
     padding: 380px 80px 80px 80px;
 }

photobooth/gui/Qt5Gui/stylesheets/dark-800x600.qss

@@ -0,0 +1,237 @@
+/* Outer items */
+
+QWidget {
+    background-color: transparent;
+    color: #eeeeee;
+    font-family: AmaticSC, sans-serif;
+    font-size: 30px;
+}
+
+QMainWindow {
+    background: #000000;
+    color: #eeeeee;
+}
+
+/* General controls */
+
+QPushButton {
+    background-color: transparent;
+    border-style: outset;
+    border-width: 1px;
+    border-radius: 8px;
+    border-color: #eeeeee;
+    padding: 8px;
+}
+
+QPushButton:pressed {
+    background-color: #66eeeeee;
+}
+
+/* Idle Screen */
+
+QFrame#IdleMessage {
+    background-image: url(photobooth/gui/Qt5Gui/images/arrow-800x600.png);
+    background-repeat: no-repeat;
+    padding: 80px 40px 60px 40px;
+}
+
+QFrame#IdleMessage QLabel {
+    font-size: 80px;
+    qproperty-alignment: AlignCenter;
+}
+
+QFrame#IdleMessage QPushButton {
+    color: rgba(255, 27, 0, 200);
+    font-size: 120px;
+    text-align: center;
+}
+
+QFrame#IdleMessage QPushButton:pressed {
+    background-color: rgba(255, 27, 0, 200);
+    color: #eeeeee;
+}
+
+/* Greeter Screen */
+
+QFrame#GreeterMessage {
+    padding: 30px;
+}
+
+QFrame#GreeterMessage QLabel#title {
+    font-size: 100px;
+    margin: 0;
+    padding: 0;
+    qproperty-alignment: AlignCenter;
+}
+
+QFrame#GreeterMessage QPushButton#button {
+    border: none;
+    font-size: 80px;
+    margin: 0;
+    min-height: 100px;
+    padding: 0;
+    text-align: center;
+}
+
+QFrame#GreeterMessage QLabel#message {
+    font-size: 80px;
+    margin: 0;
+    padding: 0;
+    qproperty-alignment: AlignCenter;
+}
+
+/* Countdown Screen */
+
+QFrame#CountdownMessage {
+    background-color: #eeeeee;
+    border-style: outset;
+    border-width: 2px;
+    border-radius: 30px;
+    border-color: #eeeeee;
+    margin: 20px;
+    padding: 30px;
+}
+
+/* Pose Screen */
+
+QFrame#PoseMessage {
+    background-image: url(photobooth/gui/Qt5Gui/images/camera-800x600.png);
+    background-repeat: no-repeat;
+    padding: 280px 80px 80px 80px;
+}
+
+QFrame#PoseMessage QLabel {
+    font-size: 120px;
+    qproperty-alignment: AlignCenter;
+}
+
+/* Wait Screen */
+
+QFrame#WaitMessage {
+    padding: 350px 80px 80px 80px;
+}
+
+QFrame#WaitMessage QLabel {
+    font-size: 70px;
+    qproperty-alignment: AlignCenter;
+}
+
+/* Picture Screen */
+
+QFrame#PictureMessage {
+    margin: 30px;
+}
+
+/* Overlay message */
+
+QWidget#TransparentOverlay {
+    background-color: #aaeeeeee;
+    border-style: outset;
+    border-width: 2px;
+    border-radius: 30px;
+    border-color: #eeeeee;
+    color: #333333;
+    padding: 40px;
+}
+
+/* Postprocess message */
+
+QWidget#PostprocessMessage QLabel {
+    color: #333333;
+    font-size: 110px;
+    qproperty-alignment: AlignCenter;
+}
+
+QWidget#PostprocessMessage QPushButton {
+    color: #333333;
+    border-color: #333333;
+    margin: 20px;
+}
+
+QWidget#PostprocessMessage QPushButton:pressed {
+    background-color: #66eeeeee;
+}
+
+QWidget#PostprocessMessage QPushButton:disabled {
+    background-color: #66eeeeee;
+    color: #33eeeeee;
+    border-color: #33eeeeee;
+}
+
+/* Customizing settings */
+
+QTabWidget::pane {
+    background-color: #eeeeee;
+    border-style: outset;
+    border-width: 1px;
+    border-radius: 15px;
+    border-color: #eeeeee;
+    color: #eeeeee;
+    padding: 10px;
+}
+
+QTabWidget::tab-bar {
+    alignment: center;
+}
+
+QTabBar::tab {
+    background-color: transparent;
+    border-style: outset;
+    border-width: 2px;
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+    border-color: #eeeeee;
+    color: #eeeeee;
+    padding: 8px;
+}
+
+QTabBar::tab:selected {
+    background-color: #33ffffff;
+}
+
+QGroupBox {
+    background-color: transparent;
+    border-style: outset;
+    border-width: 1px;
+    border-radius: 15px;
+    border-color: #eeeeee;
+    margin: 0px;
+    padding: 4px;
+}
+
+QTabWidget QWidget {
+    color: #333333;
+    font-size: 30px;
+}
+
+QCheckBox::indicator {
+    width: 30px;
+    height: 30px;
+    background-color: transparent;
+    border-style: outset;
+    border-width: 2px;
+    border-radius: 5px;
+    border-color: #333333;
+}
+
+QCheckBox::indicator::checked {
+    background-image: url(photobooth/gui/Qt5Gui/images/checkmark.png);
+    background-repeat: no-repeat;
+}
+
+QComboBox, QDateEdit, QLineEdit, QSpinBox, QTimeEdit {
+    background-color: #eeeeee;
+    color: #333333;
+}
+
+QComboBox QAbstractItemView {
+    background-color: #cccccc;
+    color: #333333;
+    selection-background-color: #eeeeee;
+    selection-color: #333333;
+}
+
+QComboBox QAbstractItemView::item {
+    margin: 5px;
+    min-height: 50px;
+}

photobooth/gui/Qt5Gui/stylesheets/pastel-1024x600.qss

@@ -30,7 +30,7 @@ QPushButton:pressed {
 /* Idle Screen */
 
 QFrame#IdleMessage {
-    background-image: url(photobooth/gui/Qt5Gui/images/arrow.png);
+    background-image: url(photobooth/gui/Qt5Gui/images/arrow-1024x600.png);
     background-repeat: no-repeat;
     padding: 80px 400px 120px 80px;
 }
@@ -96,7 +96,7 @@ QFrame#CountdownMessage {
 /* Pose Screen */
 
 QFrame#PoseMessage {
-    background-image: url(photobooth/gui/Qt5Gui/images/camera.png);
+    background-image: url(photobooth/gui/Qt5Gui/images/camera-1024x600.png);
     background-repeat: no-repeat;
     padding: 380px 80px 80px 80px;
 }

photobooth/gui/Qt5Gui/stylesheets/pastel-800x600.qss

@@ -0,0 +1,238 @@
+/* Outer items */
+
+QWidget {
+    background-color: transparent;
+    color: #eeeeee;
+    font-family: AmaticSC, sans-serif;
+    font-size: 30px;
+}
+
+QMainWindow {
+    background: #ffffff qlineargradient(x1:0 y1:1, x2:1, y2:0, stop:0 rgba(255,165,150,255), stop:1 rgba(0,228,255,112));
+    color: #eeeeee;
+}
+
+/* General controls */
+
+QPushButton {
+    background-color: transparent;
+    border-style: outset;
+    border-width: 1px;
+    border-radius: 8px;
+    border-color: #eeeeee;
+    padding: 8px;
+}
+
+QPushButton:pressed {
+    background-color: #66eeeeee;
+}
+
+/* Idle Screen */
+
+QFrame#IdleMessage {
+    background-image: url(photobooth/gui/Qt5Gui/images/arrow-800x600.png);
+    background-repeat: no-repeat;
+    padding: 80px 40px 60px 40px;
+}
+
+QFrame#IdleMessage QLabel {
+    font-size: 80px;
+    qproperty-alignment: AlignCenter;
+}
+
+QFrame#IdleMessage QPushButton {
+    color: rgba(255, 27, 0, 200);
+    font-size: 120px;
+    text-align: center;
+}
+
+QFrame#IdleMessage QPushButton:pressed {
+    background-color: rgba(255, 27, 0, 200);
+    color: #eeeeee;
+}
+
+/* Greeter Screen */
+
+QFrame#GreeterMessage {
+    padding: 30px;
+}
+
+QFrame#GreeterMessage QLabel#title {
+    font-size: 100px;
+    margin: 0;
+    padding: 0;
+    qproperty-alignment: AlignCenter;
+}
+
+QFrame#GreeterMessage QPushButton#button {
+    border: none;
+    font-size: 80px;
+    margin: 0;
+    min-height: 100px;
+    padding: 0;
+    text-align: center;
+}
+
+QFrame#GreeterMessage QLabel#message {
+    font-size: 80px;
+    margin: 0;
+    padding: 0;
+    qproperty-alignment: AlignCenter;
+}
+
+/* Countdown Screen */
+
+QFrame#CountdownMessage {
+    background-color: #eeeeee;
+    border-style: outset;
+    border-width: 2px;
+    border-radius: 30px;
+    border-color: #eeeeee;
+    margin: 20px;
+    padding: 30px;
+}
+
+/* Pose Screen */
+
+QFrame#PoseMessage {
+    background-image: url(photobooth/gui/Qt5Gui/images/camera-800x600.png);
+    background-repeat: no-repeat;
+    padding: 280px 80px 80px 80px;
+}
+
+QFrame#PoseMessage QLabel {
+    font-size: 120px;
+    qproperty-alignment: AlignCenter;
+}
+
+/* Wait Screen */
+
+QFrame#WaitMessage {
+    padding: 350px 80px 80px 80px;
+}
+
+QFrame#WaitMessage QLabel {
+    font-size: 70px;
+    qproperty-alignment: AlignCenter;
+}
+
+/* Picture Screen */
+
+QFrame#PictureMessage {
+    margin: 30px;
+}
+
+/* Overlay message */
+
+QWidget#TransparentOverlay {
+    background-color: #aaeeeeee;
+    border-style: outset;
+    border-width: 2px;
+    border-radius: 30px;
+    border-color: #eeeeee;
+    color: #333333;
+    padding: 40px;
+}
+
+/* Postprocess message */
+
+QWidget#PostprocessMessage QLabel {
+    color: #333333;
+    font-size: 110px;
+    qproperty-alignment: AlignCenter;
+}
+
+QWidget#PostprocessMessage QPushButton {
+    color: #333333;
+    border-color: #333333;
+    margin: 20px;
+}
+
+QWidget#PostprocessMessage QPushButton:pressed {
+    background-color: #66eeeeee;
+}
+
+QWidget#PostprocessMessage QPushButton:disabled {
+    background-color: #66eeeeee;
+    color: #33eeeeee;
+    border-color: #33eeeeee;
+}
+
+/* Customizing settings */
+
+QTabWidget::pane {
+    background-color: #eeeeee;
+    border-style: outset;
+    border-width: 1px;
+    border-radius: 15px;
+    border-color: #eeeeee;
+    color: #333333;
+    padding: 10px;
+    margin: 0; 
+}
+
+QTabWidget::tab-bar {
+    alignment: center;
+}
+
+QTabBar::tab {
+    background-color: transparent;
+    border-style: outset;
+    border-width: 2px;
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+    border-color: #eeeeee;
+    padding: 8px;
+}
+
+QTabBar::tab:selected {
+    background-color: #66ffffff;
+}
+
+QGroupBox {
+    background-color: transparent;
+    border-style: outset;
+    border-width: 1px;
+    border-radius: 15px;
+    border-color: #eeeeee;
+    margin: 0px;
+    padding: 4px;
+}
+
+QTabWidget QWidget {
+    color: #333333;
+    font-size: 30px;
+}
+
+QCheckBox::indicator {
+    width: 30px;
+    height: 30px;
+    background-color: transparent;
+    border-style: outset;
+    border-width: 2px;
+    border-radius: 5px;
+    border-color: #333333;
+}
+
+QCheckBox::indicator::checked {
+    background-image: url(photobooth/gui/Qt5Gui/images/checkmark.png);
+    background-repeat: no-repeat;
+}
+
+QComboBox, QDateEdit, QLineEdit, QSpinBox, QTimeEdit {
+    background-color: #eeeeee;
+    color: #333333;
+    font-size: 30px;
+}
+
+QComboBox QAbstractItemView {
+    background-color: #cccccc;
+    color: #333333;
+    selection-background-color: #eeeeee;
+    selection-color: #333333;
+}
+
+QComboBox QAbstractItemView::item {
+    margin: 5px;
+    min-height: 50px;
+}