style.qss

/*
Copyright (c) 2017 Shotgun Software Inc
 
CONFIDENTIAL AND PROPRIETARY
 
This work is provided "AS IS" and subject to the Shotgun Pipeline Toolkit 
Source Code License included in this distribution package. See LICENSE.
By accessing, using, copying or modifying this work you indicate your 
agreement to the Shotgun Pipeline Toolkit Source Code License. All rights 
not expressly granted therein are reserved by Shotgun Software Inc.
*/

/* --------------------------------------------------------------------- */
/* Global styling */
/* --------------------------------------------------------------------- */



/* Get rid of borders for main Listing Views */
QListView, QTableView, QScrollArea, QFrame {
    border: none;
}

/* Use open sans font across the app if core supports it */
QWidget {
    font-family: Open Sans;
    font-style: Regular;
}

/* need this to kick QT into 'style mode' for labels otherwise things are not formatted correctly */
QLabel {
    margin-top: 1px;
}

/* general styling of QTreeView */
QTreeView::branch {
    background: none;
}


/* consistent default look for all tool buttons */

QToolButton {
    border: none;
}

QToolButton:hover {
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 18%);
}

QToolButton:pressed {
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 35%);
}

QToolButton::menu-indicator#browse {
    image: none;
}

/* --------------------------------------------------------------------- */
/* Full screen drop area */
/* --------------------------------------------------------------------- */

#large_drop_area_label {
    font-size: 16px;
    font-weight: 100;
}



/* --------------------------------------------------------------------- */
/* Right hand side details area */
/* --------------------------------------------------------------------- */


/* fonts for various headers */
#plugin_name, #task_name, #item_name, #summary_header {
    font-size: 22px;
    font-weight: 100;
}


#item_settings_label, #item_summary_label, #task_settings_label{
    font-size: 16px;
    font-weight: 100;
    padding-top: 18px;
}

/* subheading under the item name in the details */
#item_type, #please_select_an_item {
    font-size: 12px;
    font-weight: 75;
}

/* the item name is somehow offset right. not sure why. account for that here.*/
#item_type {
    padding-left: 4px;
}

/* divider lines in the details UI */
#item_divider_1, #item_divider_2, #item_divider_3, #task_divider {
    border-top: 1px solid rgba(255, 255, 255, 20%);
}

/* thumbnail background */
#item_thumbnail {
    background-color: #292929;
}

/* --------------------------------------------------------------------- */
/* Settings widgets, used in details section */
/* --------------------------------------------------------------------- */


FieldNameLabel {

    padding: 8px;
    /* there seems to be an odd bug where border-bottom isn't evaluated
       unless there is a border top, so add a transparent line... */
    border-top: 1px dotted rgba(0,0,0,0%);
    color: rgba(200, 200, 200, 40%);
    border-bottom: 1px dotted rgba(200, 200, 200, 18%);
}

FieldValueLabel {
    padding: 8px;
    /* there seems to be an odd bug where border-bottom isn't evaluated
       unless there is a border top, so add a transparent line... */
    border-top: 1px dotted rgba(0,0,0,0%);
    border-bottom: 1px dotted rgba(200, 200, 200, 18%);
}


/* --------------------------------------------------------------------- */
/* Left hand side tree view */
/* --------------------------------------------------------------------- */

DropAreaFrame#large_drop_area {
    border: 2px dashed rgba(200, 200, 200, 75%);
}
DropAreaFrame#large_drop_area[dragging="true"] {
    border: 2px solid {{SG_HIGHLIGHT_COLOR}};
}

#drag_progress_message {
    border: none;
}

#drag_progress_message:hover {
    text-decoration: underline;
}

/* left hand side frame when someone drag something in */
DropAreaFrame[dragging="true"] {
    border: 2px solid {{SG_HIGHLIGHT_COLOR}};
}

/* properties for the main tree widget */
#items_tree {
    padding: 2px;
    background-color: #292929;
    alternate-background-color: #292929;
    border: none;
    margin: 0px;
    /* push the whole tree 20px to the side */
    margin-left: -28px;

}

/* disable all the 'tree handles' */
#items_tree::branch {
    border-image: none;
    image: none;
    background: palette(base); /* don't highlight the branch area on selection */
}

/* selection of tree items */
#items_tree::item:selected {
    background-color: {{SG_HIGHLIGHT_COLOR}};
}

#items_tree::item {
    background-color: none;
}

/* Tree view items */
CustomTreeWidgetItem #frame {
    padding: 4px;
    padding-left: 4px;
    padding-right: 4px;
    background-color: #343434;
}

/* Tree view items */
CustomTreeWidgetSummary #frame {
    padding: 4px;
    padding-left: 4px;
    padding-right: 4px;
    background-color: #343434;

    /* make sure we push it all the way in to compensate for the -20px margin of the widget */
    margin-left: 28px;
}

/* Tree view items */
CustomTreeWidgetTask #frame {
    padding: 4px;
    padding-left: 4px;
    padding-right: 4px;
    background-color: #303030;
}

/* the widget that displays the contexts */
CustomTreeWidgetContext {
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 4px;
    padding-top: 10px;
    border-bottom: 1px solid #494C4F;

    /* make sure we push it all the way in to compensate for the -20px margin of the widget */
    margin-left: 28px;
}

CustomTreeWidgetContext QLabel {
    font-size: 12px;
    font-weight: 100;
    text-transform: uppercase;
}

#text_below_item_tree {
    font-size: 10px;
    font-weight: 100;
    font-style: italic;
    border: none;
    background-color: #292929;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    padding: 4px;
    margin: 0px;
}

/* --------------------------------------------------------------------- */
/* Progress widget */
/* --------------------------------------------------------------------- */



/* Logging popup widget */

ProgressDetailsWidget #progress_frame {
    background-color: #292929;
    border-radius: 4px;
}

ProgressDetailsWidget #progress_label {
    font-size: 18px;
    font-weight: 100;
}

ProgressDetailsWidget #log_tree {
    font-size: 12px;
    font-weight: 100;
    background-color: #292929;
    alternate-background-color: #292929;
}

ProgressDetailsWidget #log_tree::item {
    margin: 4px;
}

#log_action_button {
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 18%);
}

#log_action_button:hover {
    color: {{SG_HIGHLIGHT_COLOR}};
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 18%);
}

#log_action_button:pressed {
    color: {{SG_HIGHLIGHT_COLOR}};
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 35%);
}

#copy_log_button {
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 18%);
}

#copy_log_button:hover {
    color: {{SG_HIGHLIGHT_COLOR}};
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 18%);
}

#copy_log_button:pressed {
    color: {{SG_HIGHLIGHT_COLOR}};
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 35%);
}

/* Small progress widget */

#progress_message:hover {

}

#progress_bar {
    border: none;
    background-color: none;
    margin: 3px;
}

#progress_bar::chunk {
    background-color: {{SG_HIGHLIGHT_COLOR}};

}

#bottom_frame #stop_processing {
    border: none;
    background-color: none;
}

#bottom_frame #stop_processing:hover {
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 18%);
}

#bottom_frame #stop_processing:pressed {
    border: none;
    border-radius: 2px;
    background-color: rgba(200, 200, 200, 35%);
}


/* --------------------------------------------------------------------- */
/* Bottom toolbar */
/* --------------------------------------------------------------------- */

#bottom_frame {
    padding-bottom: 4px;
}

#bottom_frame QToolButton {
    border: none;
    padding: 4px;
    border-radius: 2px;
    background-color: rgba(20, 20, 20, 18%);
}

#bottom_frame QToolButton:hover {
    border: none;
    border-radius: 2px;
    background-color: rgba(20, 20, 20, 30%);
}

#bottom_frame QToolButton:pressed {
    border: none;
    border-radius: 2px;
    background-color: rgba(20, 20, 20, 50%);
}

#drop_area_browse_file, #drop_area_browse_seq {
    border: none;
    border-radius: 2px;
    background-color: {{SG_HIGHLIGHT_COLOR}};
    color: #FFFFFF;
    padding: 8px;
}


/* --------------------------------------------------------------------- */
/* Summary Overlay */
/* --------------------------------------------------------------------- */


#summary_frame #label {
    font-size: 26px;
    font-weight: 100;
}

#summary_frame #details {
    font-size: 12px;
    font-weight: 100;
    font-style: italic;
}

#summary_frame {
    background-color: rgba(20, 20, 20, 95%);
}

/* --------------------------------------------------------------------- */
/* Group Boxes                                                           */
/* --------------------------------------------------------------------- */

QGroupBox {
    border: 1px solid #333333;
    border-radius: 4px;
    background-color: #3A3A3A;
    margin-top: 18px;
}

QGroupBox::title {
    top: -18px;
    font-weight: bold;
    font-size: 18px;
}