Merge pull request #1154 from micahflee/1073_tabs_design

New design

9 files changed, 221 insertions, 126 deletions

diff --git a/onionshare_gui/gui_common.py b/onionshare_gui/gui_common.py
index 47ffd787..59316a6e 100644
--- a/onionshare_gui/gui_common.py
+++ b/onionshare_gui/gui_common.py
@@ -74,13 +74,8 @@ class GuiCommon:
                 }""",
             "mode_header_label": """
                 QLabel {
-                    color: #ffffff;
-                    background-color: #4e064f;
-                    border: 0;
-                    font-weight: bold;
-                    font-size: 18px;
-                    border-radius: 0;
-                    padding: 10px 0 10px 0;
+                    color: #333333;
+                    font-size: 30px;
                 }""",
             "settings_button": """
                 QPushButton {
@@ -132,7 +127,7 @@ class GuiCommon:
                 QPushButton {
                     background-color: #5fa416;
                     color: #ffffff;
-                    padding: 10px;
+                    padding: 10px 30px 10px 30px;
                     border: 0;
                     border-radius: 5px;
                 }""",
@@ -140,7 +135,7 @@ class GuiCommon:
                 QPushButton {
                     background-color: #4c8211;
                     color: #ffffff;
-                    padding: 10px;
+                    padding: 10px 30px 10px 30px;
                     border: 0;
                     border-radius: 5px;
                     font-style: italic;
@@ -149,7 +144,7 @@ class GuiCommon:
                 QPushButton {
                     background-color: #d0011b;
                     color: #ffffff;
-                    padding: 10px;
+                    padding: 10px 30px 10px 30px;
                     border: 0;
                     border-radius: 5px;
                 }""",
@@ -214,6 +209,21 @@ class GuiCommon:
                 QLabel {
                     color: #cc0000;
                 }""",
+            # New tab
+            "new_tab_button_image": """
+                QLabel {
+                    padding: 30px;
+                }
+                """,
+            "new_tab_button_text": """
+                QLabel {
+                    border: 1px solid #efeff0;
+                    border-radius: 4px;
+                    background-color: #ffffff;
+                    text-align: center;
+                    color: #4e0d4e;
+                }
+                """,
             # Share mode and child widget styles
             "share_delete_all_files_button": """
                 QPushButton {
@@ -239,9 +249,14 @@ class GuiCommon:
                     color: #333333;
                 }
                 """,
+            "share_file_selection_drop_here_header_label": """
+                QLabel {
+                    color: #333333;
+                    font-size: 30px;
+                }""",
             "share_file_selection_drop_here_label": """
                 QLabel {
-                    color: #999999;
+                    color: #666666;
                 }""",
             "share_file_selection_drop_count_label": """
                 QLabel {
diff --git a/onionshare_gui/tab/mode/__init__.py b/onionshare_gui/tab/mode/__init__.py
index fc79d0ad..a527ef0c 100644
--- a/onionshare_gui/tab/mode/__init__.py
+++ b/onionshare_gui/tab/mode/__init__.py
@@ -93,12 +93,6 @@ class Mode(QtWidgets.QWidget):
         self.starting_server_early.connect(self.start_server_early)
         self.starting_server_error.connect(self.start_server_error)
 
-        # Header
-        # Note: It's up to the downstream Mode to add this to its layout
-        self.header_label = QtWidgets.QLabel()
-        self.header_label.setStyleSheet(self.common.gui.css["mode_header_label"])
-        self.header_label.setAlignment(QtCore.Qt.AlignHCenter)
-
         # Primary action
         # Note: It's up to the downstream Mode to add this to its layout
         self.primary_action_layout = QtWidgets.QVBoxLayout()
diff --git a/onionshare_gui/tab/mode/chat_mode/__init__.py b/onionshare_gui/tab/mode/chat_mode/__init__.py
index 52b61592..d255fcbd 100644
--- a/onionshare_gui/tab/mode/chat_mode/__init__.py
+++ b/onionshare_gui/tab/mode/chat_mode/__init__.py
@@ -47,8 +47,20 @@ class ChatMode(Mode):
         # Create the Web object
         self.web = Web(self.common, True, self.settings, "chat")
 
-        # Header
-        self.header_label.setText(strings._("gui_new_tab_chat_button"))
+        # Chat image
+        self.image_label = QtWidgets.QLabel()
+        self.image_label.setPixmap(
+            QtGui.QPixmap.fromImage(
+                QtGui.QImage(self.common.get_resource_path("images/mode_chat.png"))
+            )
+        )
+        self.image_label.setFixedSize(300, 300)
+        image_layout = QtWidgets.QVBoxLayout()
+        image_layout.addStretch()
+        image_layout.addWidget(self.image_label)
+        image_layout.addStretch()
+        self.image = QtWidgets.QWidget()
+        self.image.setLayout(image_layout)
 
         # Server status
         self.server_status.set_mode("chat")
@@ -59,6 +71,10 @@ class ChatMode(Mode):
         self.server_status.web = self.web
         self.server_status.update()
 
+        # Header
+        header_label = QtWidgets.QLabel(strings._("gui_new_tab_chat_button"))
+        header_label.setStyleSheet(self.common.gui.css["mode_header_label"])
+
         # Top bar
         top_bar_layout = QtWidgets.QHBoxLayout()
         top_bar_layout.addStretch()
@@ -66,17 +82,19 @@ class ChatMode(Mode):
         # Main layout
         self.main_layout = QtWidgets.QVBoxLayout()
         self.main_layout.addLayout(top_bar_layout)
+        self.main_layout.addStretch()
+        self.main_layout.addWidget(header_label)
         self.main_layout.addWidget(self.primary_action)
         self.main_layout.addStretch()
         self.main_layout.addWidget(MinimumWidthWidget(700))
 
         # Column layout
         self.column_layout = QtWidgets.QHBoxLayout()
+        self.column_layout.addWidget(self.image)
         self.column_layout.addLayout(self.main_layout)
 
         # Wrapper layout
         self.wrapper_layout = QtWidgets.QVBoxLayout()
-        self.wrapper_layout.addWidget(self.header_label)
         self.wrapper_layout.addLayout(self.column_layout)
         self.setLayout(self.wrapper_layout)
 
diff --git a/onionshare_gui/tab/mode/file_selection.py b/onionshare_gui/tab/mode/file_selection.py
index 5a9e5d59..bcff07cb 100644
--- a/onionshare_gui/tab/mode/file_selection.py
+++ b/onionshare_gui/tab/mode/file_selection.py
@@ -25,42 +25,55 @@ from onionshare import strings
 from ...widgets import Alert, AddFileDialog
 
 
-class DropHereLabel(QtWidgets.QLabel):
+class DropHereWidget(QtWidgets.QWidget):
     """
     When there are no files or folders in the FileList yet, display the
     'drop files here' message and graphic.
     """
 
-    def __init__(self, common, parent, image=False):
-        self.parent = parent
-        super(DropHereLabel, self).__init__(parent=parent)
-
+    def __init__(self, common, image_filename, header_text, w, h, parent):
+        super(DropHereWidget, self).__init__(parent)
         self.common = common
-
         self.setAcceptDrops(True)
-        self.setAlignment(QtCore.Qt.AlignCenter)
 
-        if image:
-            self.setPixmap(
-                QtGui.QPixmap.fromImage(
-                    QtGui.QImage(
-                        self.common.get_resource_path("images/logo_transparent.png")
-                    )
-                )
-            )
-        else:
-            self.setText(strings._("gui_drag_and_drop"))
-            self.setStyleSheet(
-                self.common.gui.css["share_file_selection_drop_here_label"]
+        self.image_label = QtWidgets.QLabel(parent=self)
+        self.image_label.setPixmap(
+            QtGui.QPixmap.fromImage(
+                QtGui.QImage(self.common.get_resource_path(image_filename))
             )
+        )
+        self.image_label.setAlignment(QtCore.Qt.AlignCenter)
+        self.image_label.show()
+
+        self.header_label = QtWidgets.QLabel(parent=self)
+        self.header_label.setText(header_text)
+        self.header_label.setStyleSheet(
+            self.common.gui.css["share_file_selection_drop_here_header_label"]
+        )
+        self.header_label.setAlignment(QtCore.Qt.AlignCenter)
+        self.header_label.show()
 
+        self.text_label = QtWidgets.QLabel(parent=self)
+        self.text_label.setText(strings._("gui_drag_and_drop"))
+        self.text_label.setStyleSheet(
+            self.common.gui.css["share_file_selection_drop_here_label"]
+        )
+        self.text_label.setAlignment(QtCore.Qt.AlignCenter)
+        self.text_label.show()
+
+        self.resize(w, h)
         self.hide()
 
     def dragEnterEvent(self, event):
-        self.parent.drop_here_image.hide()
-        self.parent.drop_here_text.hide()
+        self.hide()
         event.accept()
 
+    def resize(self, w, h):
+        self.setGeometry(0, 0, w, h)
+        self.image_label.setGeometry(0, 0, w, h - 100)
+        self.header_label.setGeometry(0, 340, w, h - 340)
+        self.text_label.setGeometry(0, 410, w, h - 410)
+
 
 class DropCountLabel(QtWidgets.QLabel):
     """
@@ -93,18 +106,23 @@ class FileList(QtWidgets.QListWidget):
     files_dropped = QtCore.pyqtSignal()
     files_updated = QtCore.pyqtSignal()
 
-    def __init__(self, common, parent=None):
+    def __init__(self, common, background_image_filename, header_text, parent=None):
         super(FileList, self).__init__(parent)
-
         self.common = common
-
         self.setAcceptDrops(True)
+
         self.setIconSize(QtCore.QSize(32, 32))
         self.setSortingEnabled(True)
         self.setMinimumHeight(160)
         self.setSelectionMode(QtWidgets.QAbstractItemView.ExtendedSelection)
-        self.drop_here_image = DropHereLabel(self.common, self, True)
-        self.drop_here_text = DropHereLabel(self.common, self, False)
+        self.drop_here = DropHereWidget(
+            self.common,
+            background_image_filename,
+            header_text,
+            self.width(),
+            self.height(),
+            self,
+        )
         self.drop_count = DropCountLabel(self.common, self)
         self.resizeEvent(None)
         self.setVerticalScrollBarPolicy(QtCore.Qt.ScrollBarAlwaysOn)
@@ -115,11 +133,9 @@ class FileList(QtWidgets.QListWidget):
         """
         # file list should have a background image if empty
         if self.count() == 0:
-            self.drop_here_image.show()
-            self.drop_here_text.show()
+            self.drop_here.show()
         else:
-            self.drop_here_image.hide()
-            self.drop_here_text.hide()
+            self.drop_here.hide()
 
     def server_started(self):
         """
@@ -144,9 +160,7 @@ class FileList(QtWidgets.QListWidget):
         """
         When the widget is resized, resize the drop files image and text.
         """
-        offset = 70
-        self.drop_here_image.setGeometry(0, 0, self.width(), self.height() - offset)
-        self.drop_here_text.setGeometry(0, offset, self.width(), self.height() - offset)
+        self.drop_here.resize(self.width(), self.height())
 
         if self.count() > 0:
             # Add and delete an empty item, to force all items to get redrawn
@@ -177,7 +191,7 @@ class FileList(QtWidgets.QListWidget):
 
             size_hint = self.drop_count.sizeHint()
             self.drop_count.setGeometry(
-                self.width() - size_hint.width() - 10,
+                self.width() - size_hint.width() - 30,
                 self.height() - size_hint.height() - 10,
                 size_hint.width(),
                 size_hint.height(),
@@ -313,7 +327,7 @@ class FileSelection(QtWidgets.QVBoxLayout):
     delete the files and folders.
     """
 
-    def __init__(self, common, parent):
+    def __init__(self, common, background_image_filename, header_text, parent):
         super(FileSelection, self).__init__()
 
         self.common = common
@@ -322,7 +336,7 @@ class FileSelection(QtWidgets.QVBoxLayout):
         self.server_on = False
 
         # File list
-        self.file_list = FileList(self.common)
+        self.file_list = FileList(self.common, background_image_filename, header_text)
         self.file_list.itemSelectionChanged.connect(self.update)
         self.file_list.files_dropped.connect(self.update)
         self.file_list.files_updated.connect(self.update)
diff --git a/onionshare_gui/tab/mode/receive_mode/__init__.py b/onionshare_gui/tab/mode/receive_mode/__init__.py
index 92cd17fa..6f1bc7f5 100644
--- a/onionshare_gui/tab/mode/receive_mode/__init__.py
+++ b/onionshare_gui/tab/mode/receive_mode/__init__.py
@@ -40,8 +40,20 @@ class ReceiveMode(Mode):
         # Create the Web object
         self.web = Web(self.common, True, self.settings, "receive")
 
-        # Header
-        self.header_label.setText(strings._("gui_new_tab_receive_button"))
+        # Receive image
+        self.image_label = QtWidgets.QLabel()
+        self.image_label.setPixmap(
+            QtGui.QPixmap.fromImage(
+                QtGui.QImage(self.common.get_resource_path("images/mode_receive.png"))
+            )
+        )
+        self.image_label.setFixedSize(300, 300)
+        image_layout = QtWidgets.QVBoxLayout()
+        image_layout.addStretch()
+        image_layout.addWidget(self.image_label)
+        image_layout.addStretch()
+        self.image = QtWidgets.QWidget()
+        self.image.setLayout(image_layout)
 
         # Settings
         data_dir_label = QtWidgets.QLabel(
@@ -97,6 +109,10 @@ class ReceiveMode(Mode):
             ),
         )
 
+        # Header
+        header_label = QtWidgets.QLabel(strings._("gui_new_tab_receive_button"))
+        header_label.setStyleSheet(self.common.gui.css["mode_header_label"])
+
         # Receive mode warning
         receive_warning = QtWidgets.QLabel(strings._("gui_receive_mode_warning"))
         receive_warning.setMinimumHeight(80)
@@ -110,6 +126,8 @@ class ReceiveMode(Mode):
         # Main layout
         self.main_layout = QtWidgets.QVBoxLayout()
         self.main_layout.addLayout(top_bar_layout)
+        self.main_layout.addStretch()
+        self.main_layout.addWidget(header_label)
         self.main_layout.addWidget(receive_warning)
         self.main_layout.addWidget(self.primary_action)
         self.main_layout.addStretch()
@@ -117,12 +135,12 @@ class ReceiveMode(Mode):
 
         # Column layout
         self.column_layout = QtWidgets.QHBoxLayout()
+        self.column_layout.addWidget(self.image)
         self.column_layout.addLayout(self.main_layout)
         self.column_layout.addWidget(self.history, stretch=1)
 
         # Wrapper layout
         self.wrapper_layout = QtWidgets.QVBoxLayout()
-        self.wrapper_layout.addWidget(self.header_label)
         self.wrapper_layout.addLayout(self.column_layout)
         self.setLayout(self.wrapper_layout)
 
diff --git a/onionshare_gui/tab/mode/share_mode/__init__.py b/onionshare_gui/tab/mode/share_mode/__init__.py
index a81f83d4..aa386e3d 100644
--- a/onionshare_gui/tab/mode/share_mode/__init__.py
+++ b/onionshare_gui/tab/mode/share_mode/__init__.py
@@ -47,9 +47,6 @@ class ShareMode(Mode):
         # Create the Web object
         self.web = Web(self.common, True, self.settings, "share")
 
-        # Header
-        self.header_label.setText(strings._("gui_new_tab_share_button"))
-
         # Settings
         self.autostop_sharing_checkbox = QtWidgets.QCheckBox()
         self.autostop_sharing_checkbox.clicked.connect(
@@ -68,7 +65,12 @@ class ShareMode(Mode):
         )
 
         # File selection
-        self.file_selection = FileSelection(self.common, self)
+        self.file_selection = FileSelection(
+            self.common,
+            "images/mode_share.png",
+            strings._("gui_new_tab_share_button"),
+            self,
+        )
         if self.filenames:
             for filename in self.filenames:
                 self.file_selection.file_list.add_file(filename)
@@ -162,7 +164,6 @@ class ShareMode(Mode):
 
         # Wrapper layout
         self.wrapper_layout = QtWidgets.QVBoxLayout()
-        self.wrapper_layout.addWidget(self.header_label)
         self.wrapper_layout.addLayout(self.column_layout)
         self.setLayout(self.wrapper_layout)
 
diff --git a/onionshare_gui/tab/mode/website_mode/__init__.py b/onionshare_gui/tab/mode/website_mode/__init__.py
index 6199812c..c520d8f7 100644
--- a/onionshare_gui/tab/mode/website_mode/__init__.py
+++ b/onionshare_gui/tab/mode/website_mode/__init__.py
@@ -49,9 +49,6 @@ class WebsiteMode(Mode):
         # Create the Web object
         self.web = Web(self.common, True, self.settings, "website")
 
-        # Header
-        self.header_label.setText(strings._("gui_new_tab_website_button"))
-
         # Settings
         self.disable_csp_checkbox = QtWidgets.QCheckBox()
         self.disable_csp_checkbox.clicked.connect(self.disable_csp_checkbox_clicked)
@@ -68,7 +65,12 @@ class WebsiteMode(Mode):
         )
 
         # File selection
-        self.file_selection = FileSelection(self.common, self)
+        self.file_selection = FileSelection(
+            self.common,
+            "images/mode_website.png",
+            strings._("gui_new_tab_website_button"),
+            self,
+        )
         if self.filenames:
             for filename in self.filenames:
                 self.file_selection.file_list.add_file(filename)
@@ -162,7 +164,6 @@ class WebsiteMode(Mode):
 
         # Wrapper layout
         self.wrapper_layout = QtWidgets.QVBoxLayout()
-        self.wrapper_layout.addWidget(self.header_label)
         self.wrapper_layout.addLayout(self.column_layout)
         self.setLayout(self.wrapper_layout)
 
diff --git a/onionshare_gui/tab/server_status.py b/onionshare_gui/tab/server_status.py
index 71c6c228..b26a1223 100644
--- a/onionshare_gui/tab/server_status.py
+++ b/onionshare_gui/tab/server_status.py
@@ -129,8 +129,12 @@ class ServerStatus(QtWidgets.QWidget):
         url_layout.addLayout(url_buttons_layout)
 
         # Add the widgets
+        button_layout = QtWidgets.QHBoxLayout()
+        button_layout.addWidget(self.server_button)
+        button_layout.addStretch()
+
         layout = QtWidgets.QVBoxLayout()
-        layout.addWidget(self.server_button)
+        layout.addLayout(button_layout)
         layout.addLayout(url_layout)
         self.setLayout(layout)
 
diff --git a/onionshare_gui/tab/tab.py b/onionshare_gui/tab/tab.py
index 4f006949..604d1acf 100644
--- a/onionshare_gui/tab/tab.py
+++ b/onionshare_gui/tab/tab.py
@@ -18,7 +18,7 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 """
 import queue
-from PyQt5 import QtCore, QtWidgets, QtGui
+from PyQt5 import QtCore, QtWidgets, QtGui, QtSvg
 
 from onionshare import strings
 from onionshare.onionshare import OnionShare
@@ -35,6 +35,35 @@ from .server_status import ServerStatus
 from ..widgets import Alert
 
 
+class NewTabButton(QtWidgets.QPushButton):
+    def __init__(self, common, image_filename, text):
+        super(NewTabButton, self).__init__()
+        self.common = common
+
+        self.setFixedSize(280, 280)
+
+        # Image
+        self.image_label = QtWidgets.QLabel(parent=self)
+        self.image_label.setPixmap(
+            QtGui.QPixmap.fromImage(
+                QtGui.QImage(self.common.get_resource_path(image_filename))
+            )
+        )
+        self.image_label.setFixedSize(280, 280)
+        self.image_label.setStyleSheet(self.common.gui.css["new_tab_button_image"])
+        self.image_label.setGeometry(0, 0, self.width(), self.height())
+        self.image_label.show()
+
+        # Text
+        self.text_label = QtWidgets.QLabel(text, parent=self)
+        self.text_label.setAlignment(QtCore.Qt.AlignCenter)
+        self.text_label.setStyleSheet(self.common.gui.css["new_tab_button_text"])
+        self.text_label.setGeometry(
+            (self.width() - 200) / 2, self.height() - 40, 200, 30
+        )
+        self.text_label.show()
+
+
 class Tab(QtWidgets.QWidget):
     """
     A GUI tab, you know, sort of like in a web browser
@@ -67,69 +96,55 @@ class Tab(QtWidgets.QWidget):
         # Start the OnionShare app
         self.app = OnionShare(common, self.common.gui.onion, self.common.gui.local_only)
 
-        # Widgets to display on a new tab
-        self.share_button = QtWidgets.QPushButton(strings._("gui_new_tab_share_button"))
-        self.share_button.setStyleSheet(self.common.gui.css["mode_new_tab_button"])
-        share_description = QtWidgets.QLabel(strings._("gui_new_tab_share_description"))
-        share_description.setWordWrap(True)
+        # New tab buttons
+        self.share_button = NewTabButton(
+            self.common,
+            "images/mode_new_tab_share.png",
+            strings._("gui_new_tab_share_button"),
+        )
         self.share_button.clicked.connect(self.share_mode_clicked)
 
-        self.receive_button = QtWidgets.QPushButton(
-            strings._("gui_new_tab_receive_button")
+        self.receive_button = NewTabButton(
+            self.common,
+            "images/mode_new_tab_receive.png",
+            strings._("gui_new_tab_receive_button"),
         )
-        self.receive_button.setStyleSheet(self.common.gui.css["mode_new_tab_button"])
         self.receive_button.clicked.connect(self.receive_mode_clicked)
-        receive_description = QtWidgets.QLabel(
-            strings._("gui_new_tab_receive_description")
-        )
-        receive_description.setWordWrap(True)
 
-        self.website_button = QtWidgets.QPushButton(
-            strings._("gui_new_tab_website_button")
+        self.website_button = NewTabButton(
+            self.common,
+            "images/mode_new_tab_website.png",
+            strings._("gui_new_tab_website_button"),
         )
-        self.website_button.setStyleSheet(self.common.gui.css["mode_new_tab_button"])
         self.website_button.clicked.connect(self.website_mode_clicked)
-        website_description = QtWidgets.QLabel(
-            strings._("gui_new_tab_website_description")
-        )
-        website_description.setWordWrap(True)
 
-        self.chat_button = QtWidgets.QPushButton(
-            strings._("gui_new_tab_chat_button")
+        self.chat_button = NewTabButton(
+            self.common,
+            "images/mode_new_tab_chat.png",
+            strings._("gui_new_tab_chat_button"),
         )
-        self.chat_button.setStyleSheet(self.common.gui.css["mode_new_tab_button"])
         self.chat_button.clicked.connect(self.chat_mode_clicked)
-        chat_description = QtWidgets.QLabel(
-            strings._("gui_new_tab_chat_description")
-        )
-        chat_description.setWordWrap(True)
+
+        new_tab_top_layout = QtWidgets.QHBoxLayout()
+        new_tab_top_layout.addStretch()
+        new_tab_top_layout.addWidget(self.share_button)
+        new_tab_top_layout.addWidget(self.receive_button)
+        new_tab_top_layout.addStretch()
+
+        new_tab_bottom_layout = QtWidgets.QHBoxLayout()
+        new_tab_bottom_layout.addStretch()
+        new_tab_bottom_layout.addWidget(self.website_button)
+        new_tab_bottom_layout.addWidget(self.chat_button)
+        new_tab_bottom_layout.addStretch()
 
         new_tab_layout = QtWidgets.QVBoxLayout()
-        new_tab_layout.addStretch(1)
-        new_tab_layout.addWidget(self.share_button)
-        new_tab_layout.addWidget(share_description)
-        new_tab_layout.addSpacing(50)
-        new_tab_layout.addWidget(self.receive_button)
-        new_tab_layout.addWidget(receive_description)
-        new_tab_layout.addSpacing(50)
-        new_tab_layout.addWidget(self.website_button)
-        new_tab_layout.addWidget(website_description)
-        new_tab_layout.addSpacing(50)
-        new_tab_layout.addWidget(self.chat_button)
-        new_tab_layout.addWidget(chat_description)
-        new_tab_layout.addStretch(3)
-
-        new_tab_inner = QtWidgets.QWidget()
-        new_tab_inner.setFixedWidth(500)
-        new_tab_inner.setLayout(new_tab_layout)
-
-        new_tab_outer_layout = QtWidgets.QHBoxLayout()
-        new_tab_outer_layout.addStretch()
-        new_tab_outer_layout.addWidget(new_tab_inner)
-        new_tab_outer_layout.addStretch()
+        new_tab_layout.addStretch()
+        new_tab_layout.addLayout(new_tab_top_layout)
+        new_tab_layout.addLayout(new_tab_bottom_layout)
+        new_tab_layout.addStretch()
 
         self.new_tab = QtWidgets.QWidget()
-        self.new_tab.setLayout(new_tab_outer_layout)
+        self.new_tab.setLayout(new_tab_layout)
         self.new_tab.show()
 
         # Layout
@@ -313,16 +328,12 @@ class Tab(QtWidgets.QWidget):
         self.chat_mode.start_server_finished.connect(
             self.update_server_status_indicator
         )
-        self.chat_mode.stop_server_finished.connect(
-            self.update_server_status_indicator
-        )
+        self.chat_mode.stop_server_finished.connect(self.update_server_status_indicator)
         self.chat_mode.stop_server_finished.connect(self.stop_server_finished)
         self.chat_mode.start_server_finished.connect(self.clear_message)
         self.chat_mode.server_status.button_clicked.connect(self.clear_message)
         self.chat_mode.server_status.url_copied.connect(self.copy_url)
-        self.chat_mode.server_status.hidservauth_copied.connect(
-            self.copy_hidservauth
-        )
+        self.chat_mode.server_status.hidservauth_copied.connect(self.copy_hidservauth)
 
         self.change_title.emit(self.tab_id, strings._("gui_new_tab_chat_button"))
 
@@ -388,6 +399,25 @@ class Tab(QtWidgets.QWidget):
                 self.set_server_status_indicator_started(
                     strings._("gui_status_indicator_receive_started")
                 )
+        elif self.mode == self.common.gui.MODE_CHAT:
+            # Chat mode
+            if self.chat_mode.server_status.status == ServerStatus.STATUS_STOPPED:
+                self.set_server_status_indicator_stopped(
+                    strings._("gui_status_indicator_receive_stopped")
+                )
+            elif self.chat_mode.server_status.status == ServerStatus.STATUS_WORKING:
+                if self.settings.get("general", "autostart_timer"):
+                    self.set_server_status_indicator_working(
+                        strings._("gui_status_indicator_receive_scheduled")
+                    )
+                else:
+                    self.set_server_status_indicator_working(
+                        strings._("gui_status_indicator_receive_working")
+                    )
+            elif self.chat_mode.server_status.status == ServerStatus.STATUS_STARTED:
+                self.set_server_status_indicator_started(
+                    strings._("gui_status_indicator_receive_started")
+                )
 
     def set_server_status_indicator_stopped(self, label_text):
         self.change_icon.emit(self.tab_id, "images/server_stopped.png")