/* ################################## */ /* Config starts here. You can enable or disable parts by commenting (Use /* to comment and delete it to remove it */ /* ################################## */ /* Disables the scrollbar in the server/client list. Looks a lot cleaner. Scrolling is still possible with the scrollwheel */ /* QTreeView QScrollBar:vertical { width: 0px; } /* Disables the server banner above the info frame. Teamspeak needs a restart to enable or disable properly */ MainWindow Banner { background: none; max-height: 0px; max-width: 0px; } /* ################################## */ /* Config ends here */ /* ################################## */ /* /* Arma III skin built from my revised Steam skin (Check my webpage or the Teamspeak addons/forums for that skin */ /* /* /* First edit: 4 March 2013 /* Last edit: 22 June 2013 /* Check out my webpage at: http://www.adanteh.nl /* /* /* beta - GUI USER COLOR: #c18f3a; /* rc - #c18f3a */ /* You can find the full stylesheet reference here. Teamspeak changed some things though http://qt-project.org/doc/qt-4.8/stylesheet-reference.html */ QMainWindow { /* main teamspeak window. Place backgrounds for the entire teamspeak screen here. You can also use 'image' to place an extra image */ background-image:url('Styles/Arma3/MainWindow/background.jpg'); background-position: left top; backgrund-repeat: no-repeat; background-color: #000000; color: #e6ece0; } QWidget#MainWindowServerTabsWidget { /* Widget around and behind the treeview and infoframe. */ border: 0px solid transparent; background: transparent; show-decoration-selected: 0; margin-top: 0px; margin-left: 5px; margin-right: 5px; padding: 0px; } MainWindow QWidget::pane { /* Resizable pane inside the QWidget section. (Includes TreeView and InfoFrame in the mainwindow) but also the Permissions overview. I'd recommend being more defined so it only changes the mainwindow if you want to use a background and dont have to worry abou the rest */ top: 3px; background: transparent; color: transparent; margin-left: 5px; margin-right: 5px; background: transparent; } QFrame#bookmarksTopFrame { /* Top bar in the bookmarks manager */ background-color: #2e3132; border-image: url('Styles/Arma3/Dialog/listview.png'); border-top: 4px transparent; border-bottom: 4px transparent; border-right: 4px transparent; border-left: 4px transparent; color: #cbbf57; } /* ---------------------------------------------------------------- */ /* Chat Area || ChatWidget, ChatArea and ChatLine */ /* ---------------------------------------------------------------- */ QWidget#MainWindowChatWidget { /* Widget behind and around the chat area. Use this if you want to have a border or image around the chat area */ margin-left: 10px; margin-right: 10px; background-color: rgba(10, 10, 10, 180); show-decoration-selected: 0; } ChatTab { /* The actual chat area on the MainWindow. Everything you put here actually goes INSIDE the chat box. Use the widget if you want to put thigns behind it. */ /* THERE IS CURRENTLY NO WAY TO CHANGE THE COLOR OF USERS (Red text) AND CHANNELS (Blue text). KEEP THIS IN MIND! YOU WANT TO MAKE SURE TEXT IS ACTUALLY READABLE. ALSO PLEASE POST IN ONE OF THE MANY THREADS ON THE TEAMSPEAK FORUMS ABOUT THIS. HOPEFULLY ENOUGH REQUESTS WILL GET THEM TO FIX THIS. IT IS POSSIBLE IN MUMBLE, SO SHOULD BE POSSIBLE IN TEAMSPEAK AS WELL */ background-color: transparent; border: 0px solid transparent; color: #818181; padding-top: 5px; padding-right: 5px; padding-left: 5px; show-decoration-selected: 0; } ChatLineEdit { /* Chat line uder chat widget */ border: 1px solid rgba(150, 150, 150, 150); border-radius: 1px; background-color: rgba(150, 150, 150, 100); color: #ffffff; font-family: 'Purista', sans-serif; font-size: 14px; margin-bottom: 5px; padding: -4px 0px; } QLineEdit { /* Editable text in dialogs*/ border: 1px solid rgba(200, 200, 200, 150); border-radius: 1px; background-color: rgba(20, 20, 20, 80); color: #f2f2f2; font-size: 13px; padding-left: 3px; font-family: 'Purista', sans-serif; } QTextEdit#pluginDescTextEdit, /* Larger inactive textboxes such as plugin description window */ QTextEdit#descriptionTextEdit, QTextEdit#vserverWelcomeTextEdit, QLineEdit:read-only /* QLineEdit that can't be used because option is turned off or so */ { border: 1px solid #4d4b48; border-radius: 5px; background-color: transparent; color: #a5a3a0; } /* ---------------------------------------------------------------- */ /* QTabBar */ /* ---------------------------------------------------------------- */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-894896ee-44bc-4282-871a-31ca3a19f683 */ /* #### */ MainWindow QTabWidget::tab-bar:top { left: 5px; } /* skins only the top tabs in the mainwindow. Used TabWidget because QTabBar positioning didn't work */ MainWindow QTabWidget::tab-bar:bottom { left: 5px; } /* skins only the bottom tabs in the mainwindow. Used TabWidget because QTabBar positioning didn't work*/ QTabBar::close-button { } /* Doesn't work. Supposed to be used to close tabs. Use ImprovedTabBarCloseButton instead. It's all the way at the bottom of the file */ QTabBar { background-color: transparent; margin-bottom: 2px;} /* Background behind the tabs. QTabBar is only the size of the area of the tabs that are open */ MainWindow QTabBar::tab:only-one { padding-bottom: 3px; } /* The only only-one state skins the tab when there is ONLY ONE tab. You can also use :first and :last for the first and the last tab. I used this in my WoW skin */ QTabBar::tab { /* skins the actual tab. Be sure to check the results with different numbers of tabs */ padding-left: 6px; padding-right: 10px; padding-top: 2px; padding-bottom: 1px; background-color: #000000; color: #c7c4c2; text-transform: uppercase; min-width: 8px; font-family: 'Purista', sans-serif; } ImprovedWidget QTabBar::tab { /* Fix a margin problem in the permission window with margin on the tab */ margin-bottom: 3px; padding-bottom: 3px; } QTabBar::tab:selected, QTabBar::tab:hover, QTabBar::tab:selected:hover /* Skins both the normally selected (Currently active) tab and the hover state of the active tab (The same in this case) */ { background-color: #727272; color: #ffffff; } QTextEdit#ChatTab { background-color: #000000; } /* ---------------------------------------------------------------- */ /* QMenuBar | Top menu (Connections, Bookmarks) */ /* ---------------------------------------------------------------- */ QMenuBar { /* The top menu bar in the main window */ background-color: #c18f3a; text-transform: uppercase; font-size: 12px; font-family: 'Purista', sans-serif; } QMenuBar::item { /* An item on the top menu bar in the main window */ background-color: transparent; margin: 1px 10px; color: #ffffff; } QMenuBar::item:selected, /* An active item on the top menu bar. Hover state and selected state works a bit weird, so you probably want to keep these the same */ QMenuBar::item:hover { bacground-color: rgba(255, 255, 255, 100); color: #ffffff; } /* ---------------------------------------------------------------- */ /* QMenu | Right Click */ /* ---------------------------------------------------------------- */ QMenu { /* The context menu (Right Click menu) and the menu that drops down from the Menu Bar (The top menu in the main window). Both are the same and can't be skinned differently as far as I know */ background-color: #000000; /* TRANSPARENT BACKGROUNDS DO NOT WORK WITH THIS MENU */ color: #ffffff; border: 1px solid #ffffff; border-radius: 2px; padding: 2px 2px; font-family: 'Purista', sans-serif; } QMenu::item { /* An item in the context menu */ background: transparent; padding: 9px 0 0 23px; margin: 0 10px 8px; } QMenu::item:selected { background-color: rgba(255, 255, 255, 100); } /* The selected state of a menu item (Hover and selected state is the same */ QMenu::item:disabled { color: #393939; } QMenu::separator { /* The horizontal line dividing some menu items */ height:1px; margin-left:7px; margin-right:7px; background: #393939; } QMenu::icon { } /* Unforunately doesn't actually do anything right now */ QMenu::right-arrow { } /* The arrow pointing ot the right in some menu items (Check Self menubar item) . Use Image to change this*/ QMenu::indicator { /* Sets the checkbox of non-excluse items. (Right Click the Toolbar. Server tabs, Status Bar and so should have a checkbox */ width: 15px; height: 15px; border: 1px solid #393939; border-radius: 2px; } QMenu::indicator:non-exclusive:unchecked, /** Sets the checkbox of non-excluse items. (Right Click the Toolbar. Server tabs, Status Bar and so should have a checkbox */ QMenu::indicator:non-exclusive:unchecked:selected { background: none; } QMenu::indicator:non-exclusive:checked, /* Sets the checkbox of non-excluse items. (Right Click the Toolbar. Server tabs, Status Bar and so should have a checkbox */ QMenu::indicator:non-exclusive:checked:selected { background-image:url('Styles/Arma3/Dialog/checkbox.png'); background-location: center; background-repeat: none; background-color: transparent; } /* ######################################################### */ /* ######################################################### */ /* ######################################################### */ /* ---------------------------------------------------------------- */ /* TreeView */ /* ---------------------------------------------------------------- */ QMainWindow QTreeView, /* The QTreeView (Channel and server list) that you can open and close in multiple levels */ QMainWindow QTreeWidget { background-color: rgba(10, 10, 10, 180); background-attachment:fixed; show-decoration-selected: 0; padding: 2px 8px; color: #ffffff; border: 0px solid transparent; qproperty-alternatingRowColors: 0; font-family:'Purista', 'Enigmatic', sans-serif; font-size: 13px; } QTreeView::item { border: 1px solid transparent; } QTreeView::item:selected { background-color: rgba(255, 255, 255, 255); color: #000000; } QTreeView, /* The QTreeView (Channel and server list) that you can open and close in multiple levels */ QTreeWidget { border: 1px solid #4d4b48; border-right-width: 0px; border-bottom-right-radius: 0px; border-top-right-radius: 0px; background-attachment:fixed; show-decoration-selected: 0; padding: 2px 8px; background-color: transparent; border: 0px solid transparent; color: #a5a3a0; qproperty-alternatingRowColors: 0; } /* ---------------------------------------------------------------- */ /* Tree Branch */ /* ---------------------------------------------------------------- */ QTreeView::branch:selected { background-color: transparent; } QTreeView::branch:has-siblings:adjoins-item, QTreeView::branch:!has-children:!has-siblings:adjoins-item { border-image: none; } QTreeView::branch:has-children:!has-siblings:closed, QTreeView::branch:closed:has-children:has-siblings { border-image: none; background-color: transparent; image: url(styles/Arma3/Misc/TreeView/tree-collapse-normal.png); } QTreeView::branch:has-children:!has-siblings:closed:hover, QTreeView::branch:closed:has-children:has-siblings:hover { border-image: none; background-color: transparent; image: url(styles/Arma3/Misc/TreeView/tree-collapse-hover.png); } QTreeView::branch:open:has-children:!has-siblings, QTreeView::branch:open:has-children:has-siblings { border-image: none; background-color: transparent; image: url(styles/Arma3/Misc/TreeView/tree-expand-normal.png); } QTreeView::branch:open:has-children:!has-siblings:hover, QTreeView::branch:open:has-children:has-siblings:hover { border-image: none; background-color: transparent; image: url(styles/Arma3/Misc/TreeView/tree-expand-hover.png); } /* ---------------------------------------------------------------- */ /* InfoFrame | InfoView */ /* ---------------------------------------------------------------- */ InfoFrame { /* Right half of the mainwindow, with connection details, server groups and so. You can skin the actual text using the .Tpl files */ background-color: rgba(10, 10, 10, 180); border: 0px solid transparent; color: #8b959b; font-size: 10px; font-family: Arial, Helvetica, Verdana; padding: 2px 2px 2px 10px; } /* ---------------------------------------------------------------- */ /* QDialog | Options Screen */ /* ---------------------------------------------------------------- */ QDialog { /* Pop up dialogs, such as the connection dialog, but even Options screen. */ background: #3a3a3a; background-image:url('Styles/Arma3/MainWindow/background.jpg'); background-position: center; backgrund-repeat: no-repeat; } OptionsDialog { /* Can also be skinned using QDialog, but seeing this screen is far larger than most QDialogs you can do more specific skinning by using this class instead */ } ImprovedWidget { /* The base window of some dialogs (Like Permission, bookmarks, etc). Very much recommended if you want to use a background in those windows. */ background-color: #3a3a3a; } QWidget::pane { /* The QWidget pain outside of Mainwindow (The MainWindow one was already defined more specific before */ background: #3a3a3a; color: #f2f2f2; } QTabWidget#permTabWidget::pane { border: 1px solid #4d4b48; border-radius: 2px; } /* Grey border around the pane widget in the permission screen */ PermissionsTreeView { background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #2f2e2d, stop:1 #171614); border: 1px solid #c9c9c9; border-radius: 2px; padding: 0px; margin: 0px; } /* ---------------------------------------------------------------- */ /* QGroupBox | Options Container */ /* ---------------------------------------------------------------- */ QGroupBox { background-color: rgba(20, 20, 20, 150); border: none; padding-top: 20px; margin-top: 0px; font-size: 13px; font-family:'Purista', 'Enigmatic', sans-serif; } QGroupBox::title { color: #ffffff; background-color: rgba(20, 20, 20, 255); padding: 3px; min-height: 20px; } /* ---------------------------------------------------------------- */ /* QLabel | Header text for options window */ /* ----------------------------------------------------------------- */ OptionsDialog QWidget#HeadlineLabel { /* In the Options Dialog there's a bar at the top of the screen. You can use that using the given class */ background-color: #c18f3a; } /* A lot of Labels have their own specific name. You could basically give every menu item their own look, but it would be very illogical to do so. However, some labels stand out quite a bit from the rest and would be nice to skin */ OptionsDialog QLabel#OptionsHeadlineTitleLabel { /* Top line of options category */ color: #f2f2f2; text-transform: uppercase; font-size: 14px; font-family:'Purista', 'Enigmatic', sans-serif; padding: 0px 0px -2px; background-color: transparent; } OptionsDialog QLabel#OptionsHeadlineDescriptionLabel{ /* Bottom line of options category */ color: #f2f2f2; font-size: 10px; font-variant: small-caps; font-weight: normal; background-color: transparent; padding: 0px; } /* ---------------------------------------------------------------- */ /* Splitter */ /* ---------------------------------------------------------------- */ /* The handles used to resize certain portions of Teamspeak. In the main window there is a splitter between the treeview/infoframe and the chattab. There is also a spittler between the Treeview and Infoframe. You can also collapse widgets completely using a splitter. */ QSplitter::handle { background-color: transparent; } QSplitter::handle:vertical { /* You can also use the :horizontal state for horizontal sliders, however no need for that now */ margin: 0px 0px; } /* ---------------------------------------------------------------- */ /* QStatusBar */ /* ---------------------------------------------------------------- */ QstatusBar { /* Bottom in the far bottom (Is enabled by right clicking the tool bar) */ padding-left:4px; padding-right:4px; } QStatusBar::item { /* Leave like this. Fixes a small bug in the bottom */ padding: 0px 2px; background-color: transparent; } QSizeGrip { /* With this item you can resize windows. Feel free to add an image or so */ background-color: transparent; image: url("styles/Arma3/resize-dots.png"); width: 14px; height: 14px; } /* ---------------------------------------------------------------- */ /* QToolBar */ /* ---------------------------------------------------------------- */ QToolBar { /* Dragable toolbar with shortcut icons in the mainwindow */ margin-left: 10px; margin-right: 10px; margin-top: 5px; background-color: transparent; border: 0px solid transparent; spacing: 10px; /* Spacing between each button */ padding: 0px; } QToolBar::handle { /* Handle at the left of the horizontal toolbar which you can drag to place somehwere else */ background-image: none; background-color: transparent; width: 10px; height: 10px; margin-left: 3px; } QToolBarSeparator { } /* Seperator between some menu items. Don't know how to skin this */ /* ################################## */ /* The buttons on the toolbar start here. */ /* ################################## */ QToolBar QToolButton { /* Button on Toolbar */ border: 1px solid transparent; border-radius: none; background-color: none; } QToolBar QToolButton[popupMode="1"] { /* Default state of toolbutton with dropdown menu (Such as the Away button or Mute Speakers */ border: 1px solid transparent; border-radius: none; background-color: transparent; padding-right: 18px; color: #ffffff; /* Use color to change the color of the arrow for the popup menu */ } QToolBar QToolButton:hover { /* hover state of the toolbuttons */ background-color: rgba(10, 10, 10, 70); border: 1px solid rgba(200, 200, 200, 30); } QToolBar QToolButton[popupMode="1"]:hover { /* hover state of the toolbutton with dropdown menu (Such as Away or Mute Output */ background-color: rgba(10, 10, 10, 70); border: 1px solid rgba(200, 200, 200, 30); } QToolBar QToolButton:checked, /* state of the toolbutton when an option is selected (Such as having your microphone muted) */ QToolButton#serverQueryAdvancedButton:checked, QToolBar QToolButton:pressed, QToolBar QToolButton[popupMode="1"]:checked { /* Toolbutton state when it's clicked */ background-color: rgba(10, 10, 10, 100); border: 1px solid rgba(200, 200, 200, 150); } QToolBar QToolButton:disabled { background-image:url('Styles/Arma3/MainWindow/static.png'); border: 1px solid rgba(255, 255, 255, 30); } QToolBar QToolButton::menu-button { border: 1px solid transparent; width: 12px; } QToolBar QToolButton::menu-button:hover { } QToolBar QToolButton::menu-arrow { right: 4px; } /* Change the dropdown menu button on a toolbutton using image */ QToolBar QToolButton::menu-arrow:open { right: 3px; } /* Sets the open state of the menu arrow */ /* ################################## */ /* ToolButtons outside of the main window start here */ /* ################################## */ QToolButton#newBookmarkButton, QToolButton#newBookmarkFolderButton, QToolButton#removeBookmarkButton { border-image: url('Styles/Arma3/altbutton-normal.png'); border-top: 0px; border-right: 2px; border-bottom: 0px; border-left: 2px; background-color: transparent; padding: 0px; max-height: 18px; margin: 0px 3px; color: #a5a3a0; } QToolButton#newBookmarkButton:hover, QToolButton#newBookmarkFolderButton:hover, QToolButton#removeBookmarkButton:hover { color: #f2f2f2; } QToolButton { /* Changes all tool buttons inside the settings menu to the following */ border-image: none; background-color: rgba(20, 20, 20, 200); border: none; text-align: left; padding-left: 5px; padding-right: 10px; color: #f2f2f2; } QToolButton:hover { border-image: none; background-image: none; background-color: rgba(230, 230, 230, 150); border: 1px solid #99938d; color: #e5e2df; } QToolButton:disabled { color: #656564; background-color: rgba(20, 20, 20, 130); } QToolButton#serverQueryStopButton:disabled, QToolButton#serverQueryRestartButton:disabled { background-color: transparent; border-color: #4d4b48; color: #656564; } QToolButton#searchClearButton, QToolButton#appScanImportButton, QToolButton#appScanReloadButton, QToolButton#fbDirUpButton, QToolButton#fbRootButton, QToolButton#fbRefreshButton, QToolButton#fbUploadButton, QToolButton#fbDownloadButton, QToolButton#fbCreateDirectoryButton, QToolButton#fbDeleteButton, QToolButton#fbFilterButton, QToolButton#descEditButton, QToolButton#fbViewIconsButton, QToolButton#fbViewListButton, QToolButton#filterGoButton, QToolButton#clientUpdateButton, QToolButton#filterClearButton, QToolButton#banAddButton, QToolButton#banRemoveButton, QToolButton#banEditButton, QToolButton#complainRemoveButton, QToolButton#foregroundColorSelectButton, QToolButton#backgroundColorSelectButton, QToolButton#EmoticonButton, QToolButton#iconToolButton { border-image: none; background-color: transparent; border: 1px solid transparent; border-radius: none; } QToolButton#searchClearButton:hover, QToolButton#appScanImportButton:hover, QToolButton#appScanReloadButton:hover, QToolButton#fbDirUpButton:hover, QToolButton#fbRootButton:hover, QToolButton#fbRefreshButton:hover, QToolButton#fbUploadButton:hover, QToolButton#fbDownloadButton:hover, QToolButton#fbCreateDirectoryButton:hover, QToolButton#fbDeleteButton:hover, QToolButton#fbFilterButton:hover, QToolButton#descEditButton:hover, QToolButton#fbViewIconsButton:hover, QToolButton#fbViewListButton:hover, QToolButton#filterGoButton:hover, QToolButton#clientUpdateButton:hover, QToolButton#filterClearButton:hover, QToolButton#banAddButton:hover, QToolButton#banRemoveButton:hover, QToolButton#banEditButton:hover, QToolButton#complainRemoveButton:hover, QToolButton#foregroundColorSelectButton:hover, QToolButton#backgroundColorSelectButton:hover, QToolButton#EmoticonButton:hover, QToolButton#iconToolButton:hover { border-image: none; background-color: transparent; border-color: #4d4b48; color: #4d4b48; } QToolButton#TextFormatButton, QToolButton#toolButtonBold, QToolButton#toolButtonItalic, QToolButton#toolButtonUnderLine, QToolButton#toolButtonFColor, QToolButton#TextFormatButton:hover, QToolButton#toolButtonBold:hover, QToolButton#toolButtonItalic:hover, QToolButton#toolButtonUnderLine:hover, QToolButton#toolButtonFColor:hover { border-image: none; background-color: transparent; border: 1px solid transparent; border-radius: 1px; } QToolButton#toolButtonBold:checked, QToolButton#toolButtonItalic:checked, QToolButton#toolButtonUnderLine:checked, QToolButton#toolButtonFColor:checked, QToolButton#TextFormatButton:checked { border-image: none; background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop:0 #557dab, stop:1 #314159); border: 1px solid transparent; border-radius: 1px; } QToolButton#fbViewIconsButton:checked, QToolButton#fbViewListButton:checked { border-image: none; background-color: transparent; border-color: #4d4b48; color: #4d4b48; } /* ---------------------------------------------------------------- */ /* Pushbutton | Ok, Cancel, etc */ /* ---------------------------------------------------------------- */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-52fd5883-f9f9-4af2-ab8c-de26193fcbb3 */ /* #### */ QPushButton, /* normal button */ QPushButton:default /* The default selected pushbutton */ { background-color: rgba(20, 20, 20, 180); color: #f2f2f2; min-width: 92px; height: 22px; border-radius: 0px; border: 0px solid transparent; text-align: left; text-transform: uppercase; font-family: 'Purista', sans-serif; padding-left: 5px; padding-right: 10px; } QPushButton:hover { background-color: rgba(230, 230, 230, 150); } QPushButton:disabled { color: #646464; } /* ---------------------------------------------------------------- */ /* ListView | Options list, Profiles list */ /* ---------------------------------------------------------------- */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-3e981b14-7ec7-4726-ab2b-9ce3c3c097b0 */ /* #### */ QListView { /* List for multiple things. Indenties list, option categories in sections screen, but also part of the dropdown menu of comboboxes */ font-family: 'Purista', sans-serif; background-color: rgba(20, 20, 20, 180); border: 0px solid transparent; color: #f2f2f2; selection-color: #000000; selection-background-color: rgba(230, 230, 230, 180); } QListView::item:hover, QListView::item:selected:active, QListView::item:selected:!active { background-color: rgba(230, 230, 230, 180); } QListWidget#identitiesListWidget, QListView#fileListView::item:hover, QListView#fileListView::item:selected { background-color: #2e3132; } /* ---------------------------------------------------------------- */ /* ComboBox | Dropdown Menu */ /* ---------------------------------------------------------------- */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-bcbaea83-e720-403d-b175-7dc186b83ff1 */ /* #### */ QComboBox { background-color: #000000; color: #f2f2f2; border: 0px solid transparent; min-width: 50px; height: 22px; text-align: left; padding: 0px 10px 0px 5px; border-top: 1px solid #5d5d5d; border-left: 1px solid #5d5d5d; font-family: 'Purista', sans-serif; } QComboBox:disabled { /* State of combobox that is currently disabled */ background-color: transparent; border-color: #4d4b48; color: #4d4b48; } QComboBox:!editable:on { } /* State of combobox that is open and not editable */ QComboBox:editable:on { } /* State of comboxo that is open and editable */ QComboBox:on { /* State of open combobox. Use QComboBox::drop-down:on to skin the arrow part when it's open */ background-color: #000000; } QComboBox QAbstractItemView /* Use this to skin the dropdown menu of a combobox. Transparency is not supported */ { background: #000000; border-image: none; color: #f2f2f2; outline: none; border: 1px solid #ffffff; border-radius: 1px; padding: 2px 2px; font-family: 'Purista', sans-serif; } QComboBox QListView { /* Use this for the selection in the dropdown menu */ selection-color: #000000; selection-background-color: rgba(230, 230, 230, 150); } QComboBox::drop-down { /* Part of the combobox that has the drop down arrow in it. Use this if you want to have a clickable image for the dropdown menu */ color: #f2f2f2; subcontrol-origin: padding; subcontrol-position: right; /* Use subcontrol position to set the side of the arrow. In this case the arrow at the right side of the box */ width: 16px; border: 0px solid transparent; background-color: #232523; } QComboBox::drop-down:on { background-color: #f2f2f2; } QComboBox::down-arrow { image: url('Styles/Arma3/Misc/Scrollbar/Down-arrow.png'); } QComboBox::down-arrow:on { image: url('Styles/Arma3/Misc/Scrollbar/Down-arrow-hover.png'); } /* ################################## */ /* Spinbox || Scrolling numbers option */ /* ################################## */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-62939df0-87e4-44fe-9753-cf54fedd0bb5 */ /* #### */ QSpinBox, QDoubleSpinBox#delayPTTSpinBox { background-color: rgba(20, 20, 20, 180); min-height: 16px; border: 3px solid transparent; padding: 0px 5px 0px; color: #e5e2df; min-width: 60px; selection-background-color: transparent; } QSpinBox::up-button, QDoubleSpinBox::up-button { /* skin the up button */ width: 20px; height: 22px; border: 0px solid transparent; background-color: rgba(20, 20, 20, 180); subcontrol-origin: border; subcontrol-position: right; /* use this to select side of the button and arrow */ } QSpinBox::up-arrow, QDoubleSpinBox::up-arrow { /* skin the up arrow */ image: url('Styles/Arma3/Misc/Scrollbar/right-arrow.png'); } QSpinBox::down-button, QDoubleSpinBox::down-button { /* skin the down button */ width: 20px; height: 22px; border: 0px solid transparent; background-color: rgba(20, 20, 20, 180); subcontrol-origin: margin; subcontrol-position: left; /* use this to select side of the button and arrow */ } QSpinBox::down-arrow, QDoubleSpinBox::down-arrow { /* skin the down arrow */ image: url('Styles/Arma3/Misc/Scrollbar/left-arrow.png'); } QSpinBox::up-arrow:disabled, /* skin the selected up and down arrows in both disabled and off state */ QSpinBox::up-arrow:off, QSpinBox::down-arrow:disabled, QSpinBox::down-arrow:off { image: none; background: none; } /* ################################## */ /* Vertical Scrollbar. You can en-/disable the scrollbar in the config part */ /* ################################## */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-8e7e0fb0-d01e-4860-8324-19a820a7177c */ /* #### */ QScrollBar:vertical { /* The area behind the scrollbar covering entire height. */ background-color: rgba(10, 10, 10, 50); border: 1px solid rgba(50, 50, 50, 50); width: 10px; /* set width to zero to hide scrollbar entirely. Can look quite clean and scrolling still works with mousewheel. */ margin: 12px 0px; /* Takes the height of the buttons + 3 extra pixels to leave some free space between handle and buttons */ } QScrollBar::handle:vertical { /* The handle you scroll with */ background-color: #ffffff; border: 0px solid transparent; min-height: 20px; } QScrollBar::sub-line:vertical { /* button to scroll up */ border: 0px solid transparent; background-color: transparent; height: 10px; subcontrol-position: top; subcontrol-origin: margin; } QScrollBar::sub-line:vertical:hover { /* hover state of button to scroll up */ background-color: #ffffff; } QScrollBar::up-arrow:vertical { /* arrow to scroll up with */ image: url("styles/Arma3/Misc/Scrollbar/up-arrow.png"); } QScrollBar::up-arrow:vertical:hover { /* arrow to scroll up with */ image: url("styles/Arma3/Misc/Scrollbar/up-arrow-hover.png"); } QScrollBar::add-line:vertical { /* Button to scroll down */ border: 0px solid transparent; background-color: transparent; height: 10px; subcontrol-position: bottom; subcontrol-origin: margin; } QScrollBar::add-line:vertical:hover { /* hover state of button to scroll down */ background-color: #ffffff; } QScrollBar::down-arrow:vertical { /* arrow to scroll down with */ image: url("styles/Arma3/Misc/Scrollbar/down-arrow.png"); } QScrollBar::down-arrow:vertical:hover { /* arrow to scroll down with */ image: url("styles/Arma3/Misc/Scrollbar/down-arrow-hover.png"); } QScrollBar::add-page:vertical, /* area between the scroll down button and the handle */ QScrollBar::sub-page:vertical { /* area betwen the scroll up button and the handle */ background: none; } /* ################################## */ /* Horizontal Scrollbar || Is disabled. Set height to enable */ /* ################################## */ QScrollBar:horizontal { /* background of horizontal scrollbar. */ background-color: #ffffff; /*############################### */ height: 0px; /* set height to zero to hide scrollbar entirely */ /*###########################################################*/ /* ############################## */ margin: 0px 22px; /* Takes the width of the buttons + 3 extra pixels to leave some free space between handle and buttons */ border-radius: 3px; border: 0px solid transparent; } QScrollBar::handle:horizontal { /* Same story but for horizontal */ image: url("styles/Arma3/Scrollbar/scroll-gripper.png"); image-position: center; background-repeat: no-repeat; background-color: #575552; border: 0px solid transparent; border-radius: 3px; min-width: 20px; } QScrollBar::handle:horizontal:hover { background-color: #64615e; } QScrollBar::add-line:horizontal { border: 0px solid #575552; border-radius: 3px; background-color: #575552; width: 20px; subcontrol-position: right; subcontrol-origin: margin; } QScrollBar::sub-line:horizontal { border: 0px solid #575552; border-radius: 3px; background-color: #575552; width: 20px; subcontrol-position: left; subcontrol-origin: margin; } QScrollBar::add-line:horizontal:hover { border: 0px solid #64615e; border-radius: 3px; background-color: #64615e; width: 20px; subcontrol-position: right; subcontrol-origin: margin; } QScrollBar::sub-line:horizontal:hover { border: 0px solid #64615e; border-radius: 3px; background-color: #64615e; width: 20px; subcontrol-position: left; subcontrol-origin: margin; } QScrollBar::left-arrow:horizontal { background: url("styles/Arma3/Scrollbar/left-arrow.png"); background-repeat: none; } QScrollBar::right-arrow:horizontal { background: url("styles/Arma3/Scrollbar/right-arrow.png"); background-repeat: none; } QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal { background: none; } /* ################################## */ /* TABLEVIEW AND HEADER */ /* ################################## */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-46f6e7a6-6222-4c23-80e4-36da072fbd8d */ /* #### */ QHeaderView::section { /* Top line of a table */ background-color: #c18f3a; color: #f2f2f2; height: 22px; padding-left: 2px; border: 0px solid; border-radius: 0px; } QHeaderView::down-arrow { /* sets the arrow that shows when you sort on a section */ image: url('Styles/Arma3/Misc/Scrollbar/down-arrow-hover.png'); } QHeaderView::up-arrow { /* sets the arrow that shows when you sort on a section */ image: url('Styles/Arma3/Misc/Scrollbar/up-arrow-hover.png'); } /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-326026c6-9228-4507-97af-c1e08013d3a5 */ /* #### */ QTableView { /* Table view like in the hotkeys settings or server list */ background-color: rgba(20, 20, 20, 150); border: none; color: #f2f2f2; selection-color: #000000; selection-background-color: rgba(230, 230, 230, 150); /* Sets the background color on the currently selected item */ alternate-background-color: transparent; /* you can use a different background color for alternating items */ gridline-color: #3f3d3b; /* Color of the lines dividing different table items */ } QTableView::item { border: 1px solid transparent; } QTableView::item:hover { background-color: rgba(230, 230, 230, 150); } /* ################################## */ /* QSLIDER || volume control */ /* ################################## */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-8add32f5-a438-4cc5-8e6d-ac3784888b07 */ /* #### */ MainWindow ImprovedToolBar QLabel { /* Set this to control the background of the master volume icon */ background: transparent; } QMainWindow QSlider:horizontal { margin-right: 10px; } QMainWindow QSlider:vertical { margin-right: 0px; } QMainWindow QSlider::groove:horizontal { border: 1px solid rgba(200, 200, 200, 30); height: 4px; /* height: 1px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */ background-color: transparent; margin: 0px; } QMainWindow QSlider::add-page:horizontal { background-color: rgba(0, 0, 0, 150); } /* This can be used to skin the parts left of the slider */ QMainWindow QSlider::sub-page:horizontal { background-color: #c18f3a; } /* This can be used to skin the parts right of the slider */ QMainWindow QSlider::handle:horizontal { background-color: #ffffff; border: 0px solid; width: 4px; height: 6px; margin: -2px 0; /* Negative margin is used to make sure it's larger than the 1px of the groove */ border-radius: 0px; } QMainWindow QSlider::groove:vertical { border: 1px solid rgba(200, 200, 200, 30); width: 6px; /* height: 1px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */ background-color: transparent; } QMainWindow QSlider::handle:vertical { background-color: #ffffff; border: 0px solid; width: 6px; height: 4px; border-radius: 0px; } QSlider:horizontal { margin-right: 10px; } QSlider:vertical { margin-right: 0px; } QSlider::groove:horizontal { border: 0px solid transparent; height: 1px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */ background-color: #9e9995; margin: 2px 0; } QSlider::add-page:horizontal { background-color: transparent; } /* This can be used to skin the parts left of the slider */ QSlider::sub-page:horizontal { background-color: transparent; } /* This can be used to skin the parts right of the slider */ QSlider::handle:horizontal { background-color: #9e9995; border: 0px solid; width: 8px; height: 14px; margin: -4px 0; /* Negative margin is used to make sure it's larger than the 1px of the groove */ border-radius: 0px; } QSlider::groove:vertical { border: 0px solid; width: 1px; background-color: #9e9995; margin: 0 2px; } QSlider::handle:vertical { background-color: #9e9995; border: 0px solid; height: 14px; width: 8px; margin: 0px -4px; border-radius: 0px; } /* ################################## */ /* RADIOBUTTON */ /* ################################## */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-706f97ed-ede6-4429-a0bf-8112bdb51c84 */ /* #### */ QCheckBox { /* Option you can check. Seperate options you can turn on/off. This is the entire option (Including text)*/ spacing: 8px; /* space between the checkbox and the text belonging to it */ margin-top: 7px; color: #f2f2f2; background-color: rgba(20, 20, 20, 180); padding: 3px 10px 3px 3px; } QCheckBox::indicator { /* The actual box that you check. */ width: 13px; height: 13px; border: 1px solid #5d5d5d; border-radius: 1px; } QCheckBox:hover, QCheckBox:checked { background-color: rgba(230, 230, 230, 180); color: #000000; } QCheckBox:pressed, QCheckBox:hover { color: #f2f2f2; } QCheckBox:disabled { background-color: transparent; color: #656564; } QCheckBox::indicator:unchecked, /* state of the box when it's unchecked */ QCheckBox::indicator:unchecked:hover, /* state when on mouse when unchecked */ QCheckBox::indicator:unchecked:pressed { /* state of the box when it's unchecked but pressed (mouse click) */ background-color: transparent; } QCheckBox::indicator:checked, /* State of the box when it's checked */ QCheckBox::indicator:checked:hover, /* State of the box on mouse over */ QCheckBox::indicator:checked:pressed { /* State of the box when it's checked and pressed (Mouse click) */ background-image:url('Styles/Arma3/Dialog/checkbox.png'); background-position: center; background-repeat:no-repeat; } QCheckBox::indicator:indeterminate:hover, QCheckBox::indicator:indeterminate:pressed { background: qlineargradient(x1: 0, y1: 0, x2: 0.5, y2: 0.5, stop: 0 #FB8E00, stop: 1 #FB8E00); border: 1px solid #333333; border-radius: 5px; } /* ################################## */ /* RADIOBUTTON */ /* ################################## */ /* #### */ /* http://qt-project.org/doc/qt-4.7/stylesheet-examples.html#id-95ac8fc0-aa44-4a96-94d4-99664ffabd58 */ /* #### */ QRadioButton { /* Text belonging to a radiobutton option */ margin-top: 7px; color: #f2f2f2; background-color: rgba(20, 20, 20, 180); padding: 1px 0px 3px 3px; spacing: 10px; } QRadioButton:hover, QRadioButton:checked { background-color: rgba(230, 230, 230, 180); color: #000000; } QRadioButton:pressed, QRadioButton:hover { color: #f2f2f2; } QRadioButton:disabled { background-color: transparent; color: #656564; } QRadioButton::indicator { /* the actual radiobutton you click to select an option */ width: 15px; height: 15px; margin-top: 2px; Background-image:url('Styles/Arma3/Misc/radiobutton.png'); } QRadioButton::indicator:unchecked:pressed { background-image:url('Styles/Arma3/Misc/radiobutton-checked.png'); } QRadioButton::indicator::checked { background-image:url('Styles/Arma3/Misc/radiobutton-checked.png'); } QRadioButton::indicator:checked:hover { background-image:url('Styles/Arma3/Misc/radiobutton-checked.png'); } QRadioButton::indicator:checked:pressed { background-image:url('Styles/Arma3/Misc/radiobutton.png'); } /* ################################## */ /* QLABEL */ /* ################################## */ QLabel { /* Text label near most input and option fields. Most seperate labels can be defined on their own, but there's not really a reason to do this. Checkboxes and Radiobuttons fall under their own class! */ color: #f2f2f2; } QDialog QLabel { /* Text label near most input and option fields. Most seperate labels can be defined on their own, but there's not really a reason to do this. Checkboxes and Radiobuttons fall under their own class! */ color: #f2f2f2; background-color: rgba(20, 20, 20, 80); padding: 1px 4px 3px 3px; font-family: 'Purista', sans-serif; } /* ################################## */ /* EXCLUDE BACKGROUND */ /* ################################## */ QStackedWidget, QWidget#advancedWidget, QWidget#connectToWidget, QWidget#switchToWidget, QWidget#activateWidget, QWidget#recordingWidget, QWidget#ToolbarStretcher, QWidget#avatarWidget, QWidget#statusChangeWidget, QWidget#disableWidget { background: none; color: #d1c7ba; } /* ################################## */ /* INCLUDE BACKGROUND */ /* ################################## */ FriendFoeManager, /* AREA Background for friends list */ ServerLogView, LogDisplay, ClientLogView, FileBrowser, QWidget#TextOptionDisplay, /* Background of text options popup */ BookmarksManager, /* AREA Background for Bookmark Manager */ UserVolumeWidget, /* Right click user -> Change volume popoup */ EmoticonsDisplay, /* Emoticon Popup */ QDialog#BanDialog, /* Dialog when you ban a user */ QWidget#ConnectionInfoDialog, /*Background for Self -> Connection Info */ QWidget#UrlCatcherViewer, /* Background for Tools -> Collected Urls */ QWidget#ServerConnectionInfoDialog, /* Connection Info Panel */ QWidget#ServerQueryView, /* AREA Background for Server Query Panel */ QWidget#addPropertiesWidget, QWidget#OfflineMessagesDialog, QWidget#sound3Dwidget, /* 3D Sound Panel */ QWidget#sound3DTestWidget, /* 3D Sound Test Panel*/ QWidget#CustomizeToolbar, QWidget#Permissions { background: #3a3a3a; } WebServerList QLabel, OfflineMessagesDialog QLabel { background-color: rgba(20, 20, 20, 80); padding: 2px; } /* ################################## */ /* SETUP WIZARD */ /* ################################## */ QWizard QWidget, QWizard QLabel { background: #383635; selection-background-color: #383635; selection-color: #000; } /* ---------------------------------------------------------------- */ /* Uncategorized */ /* ---------------------------------------------------------------- */ QFrame#line { /* Horizontal Line in the Connect dialog. Normally shows as a little sunken frame just a few pixels high */ background: rgba(230, 230, 230, 100); border: 0px solid transparent; max-height: 3px; } QAbstractButton { } /* Don't use this */ /* ################################## */ /* SERVER LIST AND CONTACTS SPECIFIC/ /* ################################## */ QFrame#toolBox { }/* Server List dialog. Not really usable as far as I know */ QWidget#locationGroupBox, /* first box of server list */ QWidget#usersGroupBox, QWidget#maxSlotsGroupBox, QWidget#passwordGroupBox, QWidget#createChannelsGroupBox { background-color: transparent; margin: 1px 1px; padding: 15px 2px; } QToolBox::tab { /* Different tabs in the Server list screen. Only works properly with Plastique setting */ background-color: #c18f3a; color: #f2f2f2; border: 0px solid transparent; border-radius: 0px; height: 22px; padding-left: 5px; padding-right: 10px; } QToolBox::tab:selected { /* Selected state of the toolbox tabs */ color: #ffffff; border-color: #ffffff; } QWidget#page1, /* The area with options when you press Advanced or Standard Filter in the Server lists dialog */ QWidget#page2, QWidget#pageGeneral, /* first box of contacts */ QWidget#pageDisplay, QWidget#pageIgnore, QWidget#pageWhisper { background-color: rgba(35, 35, 35, 255); border-radius: 0px; } QToolBoxButton { /* Button opening and closing (Advanced Filter/Standard Filter in Server Lists). These buttons don't have different states that I am aware of. */ background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #5c5956, stop:1 #4a4846); border: none; color: #d1cfcd; } /* ################################## */ /* CONNECTION INFO DIALOG STARTS HERE */ /* ################################## */ ConnectionInfoDialog QTabWidget::tab-bar { /* Sets the tabs in the center */ alignment: center; } ConnectionInfoDialog QTabWidget::pane { /* Changes the background of the tabwidget pane to the same as listview */ background-color: rgba(35, 35, 35, 255); border: none; } ConnectionInfoDialog QTabWidget QLabel { /* Changes the text of the labels INSIDE the tabwidget to the same color as the listview */ color: #f2f2f2; } ConnectionInfoDialog QTabBar::tab { /* Changes the size of the tabs so they're the same width as the window and changes the text size so it fits inside the tabs */ min-width: 52; font-size: 9px; } /* ################################## */ /* MULTIPLE THINGS FALLING UNDER HELP MENU */ /* ################################## */ QTextEdit#changeLogTextEdit { background-color: rgba(35, 35, 35, 255); color: #f2f2f2; border: none; padding: 3px; } /* ################################## */ /* CLOSE BUTTON OF THE TABS */ /* ################################## */ MainWindow ImprovedTabBarCloseButton, MainWindow ImprovedTabBarCloseButton:hover { background: none; border: none; border-image: none; subcontrol-position: left; image: none; } /* ################################## */ /* TO-DO */ /* ################################## */ OfflineMessagesDialog { } /* Offline messages screen */ WhisperDialog { } /* whisper lists screen */ FileTransferView { } /* file transfer dialog */ ClientLogView { } AboutDialog { } /* aobut teamspeak help menu */ /* ************************************************* */ /* Extra button names. Not needed right now */ /* QToolButton#serverQueryRunButton, QToolButton#serverQuerySingleStepsButton, QToolButton#serverQueryStopButton, QToolButton#serverQueryRestartButton, QToolButton#serverQueryAdvancedButton, QToolButton#serverQueryClearHighlightButton, QToolButton#newSQScriptButton, QToolButton#updateSQScriptButton, QToolButton#removeSQScriptButton, QToolButton#idAddButton, QToolButton#idRemoveButton, QToolButton#idSelectDefaultButton, QToolButton#idImportButton, QToolButton#idExportButton, QToolButton#addGroupButton, QToolButton#removeGroupButton, QToolButton#renameGroupButton, QToolButton#copyGroupButton, QToolButton#displayClientsButton, QToolButton#addClientButton, QToolButton#removeClientButton, QToolButton#makeCurrentChannelDefaultToolButton, QToolButton#improvedIdentityQualityButton, QToolButton#toolButtonIcon, QToolButton#copyServerIPButton, QToolButton#copyClientIPButton /* ************************************************* */