Asana Simplification - Basic User 2021 by sastairs

/* ==UserStyle==
@name           Asana Simplification - Basic User 2021
@namespace      asana.com
@version        1.0.0
@description    A style to hide features we do not require in Asana. Specific to our Workflow.
@author         SA Stairs
==/UserStyle== */

@-moz-document domain("asana.com") {
    /**

/* All code that has been sourced from other people was found here https://community.asana.com/t/unhelpful-ui-change-project-tabs-buttons-in-tasks-pushed-down/20394/100 */



/*
 *
 *
 * TOP NAVIGATION, SEARCH BAR CUSTOMISATION
 *
 *
 */


/*
 * TAB NAVIGATION BAR CUSTOMISATION
 */

/* Show only Dashboard Tab option in Basic User */

.TabNavigationBar li:nth-child(4) {
  display: none;
}

.TabNavigationBar li:nth-child(5) {
  display: none;
}

.TabNavigationBar li:nth-child(6) {
  display: none;
}


.TabNavigationBar li:nth-child(7) {
  display: none;
}


.TabNavigationBar li:nth-child(8) {
  display: none;
}


.TabNavigationBar li:nth-child(9) {
  display: none;
}


/*
 * MORE BUTTONS CUSTOMISATION
 */

.TopbarPageHeaderStructure-titleRightElement {
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
    margin-left: 10px;
    display:none;
}


/*
 * REMOVE + ICON
 */

.Omnibutton-plusIcon {
    fill: #fff;
    display:none;
}


.Omnibutton, .TopbarPlaceholder-omnibutton, .TopbarPageHeaderGlobalActionsPlaceholder-omnibutton {
    display:none;
}


/*
 * SEARCH BAR CUSTOMISATION
 */

/* Keep the Search Bar away from the help button */

.TopbarSearchTypeahead--withClarifiedNavigation .TopbarSearchTypeahead-input:not(:focus) {
    background-color: #edf1f2;
    border-color: #edf1f2;
    width: 250px;
    margin-right:20px;
}

.TopbarSearchTypeahead--withClarifiedNavigation .TopbarSearchTypeahead-input:focus {
    width: 511px;
    margin-right:20px;
}



/*
 *
 *
 * END TOP NAVIGATION, SEARCH BAR CUSTOMISATION -------------------------------
 *
 *
 */



/*
 *
 *
 * INBOX CUSTOMISATION
 *
 *
 */


.notifications#center_pane_container {
    max-width: 5000px;
}

/*
 *
 *
 * END INBOX CUSTOMISATION -------------------------------
 *
 *
 */


/* SET MY TASKS DETAILS PANE WIDTH */

.PotListPageContent-detailsPane{
    min-Width:650px;
    
}

/* END MY TASKS DETAILS PANE WIDTH */



/* Hide the Complete Task button at the top of the Task Pane */
/* Code courtesy of Mikal Krall on the Asana Community boards */

.TaskRowCompletionStatus-checkbox{display:none;}

.TaskPaneToolbarCompletionButton.StatusButton--isUnset.StatusButton--secondaryColorOnHoverOnly:not(.Button--disabled).Button--secondaryColorOnHoverOnly{
    display:none;
}

.SingleTaskPaneToolbar-leftItems {
    float: left;
    display: none;
}

.SingleTaskPaneToolbarEasyCompletion-leftItems {
	float: left;
}

.HeartButton.SingleTaskPaneToolbar-button {
	display: inline-block;
}

.HeartButton.SingleTaskPaneToolbarEasyCompletion-button {
	display: inline-block;
}

.SingleTaskPaneBanners.SingleTaskPane-banners {
	order: 2;
	display: block;
}

.TaskAncestry {
	order: 3;
	display: block;
}

.SingleTaskTitleInput.SingleTaskPane-titleRow {
	order: 5;
	display: block;
}

.TaskPaneAssigneeDueDateRowStructure {
	order: 6;
	display: block;
}

.TaskPaneAssigneeDueDateRowStructure-assignee {
	display: inline-block;
	margin-right: 40px;
}

.TaskPaneAssigneeDueDateRowStructure-dueDate {
	display: inline-block;
}

.TaskPremiumFeaturesSection {
	order: 7;
	display: block;
}

.SingleTaskPane-descriptionRow {
	order: 8;
	display: block;
}

.SingleTaskPane-descriptionLabel {
	display: inline-block;
	vertical-align: top;
}

.TaskDescription {
	display: inline-block;
	vertical-align: top;
	width: 94%;
}

.TaskProjects {
	order: 4;
	display: block;
}

.TaskProjects-label {
	display: inline-block;
	vertical-align: top;
	margin-top: 7px;
}

.TaskProjects-projects {
	display: inline-block;
	vertical-align: top;
}

.TaskTags {
	order: 9;
	display: block;
}

.TaskTags-tagIcon {
	vertical-align: middle;
	margin-bottom: 10px;
}

.TaskTags-tokenizer {
	display: inline-block;
	vertical-align: middle;
}

.SubtaskGrid {
	order: 10;
	display: block;
}

.TaskAttachments {
	order: 11;
	display: block;
}

.TaskAttachments-attachIcon {
	vertical-align: top;
}

.TaskAttachments-attachmentList {
	display: inline-block;
	vertical-align: top;
}

.SingleTaskPane-feed {
	order: 12;
	display: block;
}

.SingleTaskPane-subtaskGrid--commentOnly {
    order: 10;
    margin: 20px 0;
    margin-left: 40px;
}









/*
 * RIGHT TASK PANE WINDOW CUSTOMISATION
 */

/* Move the Projects to the top of the Task pane and stick the Task Pane Easy Completion Toolbar to always stay at the top of the Task pane*/
/* Code courtesy of Mikal Krall and Gabriel Ramirez both from the Asana Community boards */


.AssigneeToken-tokenButton>.TokenButton-icon {
    position: relative;
    z-index: 0;
}

.TaskCommentOnlyMultihomeBanner {
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-left: auto;
    min-width: 15px;
    display: none;
 
}

.SingleTaskPaneToolbarEasyCompletion-commentOnlyBadge {
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-left: auto;
    min-width: 15px;
    display: none;
 
}


.SingleTaskPaneToolbar-commentOnlyBadge {
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-left: auto;
    min-width: 15px;
    display: none;
}



/* Hide the Complete Button on the Task Details Pane */
.CompletionButton.CompletionButton--isIncomplete.CompletionButton--isSpreadsheetTaskPane:not(.Button--disabled){
    display:none;
}

.TaskCompletionToggleButton--isNotPressed.AbstractThemeableRectangularButton{
    display:none;
}



/* .CompoundIcon.CompoundIcon--small{*/
/*  display:none */
/* } */

.TaskPaneToolbarCompletionButton.StatusButton--isUnset.StatusButton--isSpreadsheetTaskPane:not(.Button--disabled).Button--secondaryColorOnHoverOnly{
    display:none;
}

.TaskCompletionToggleButton{display:none;} 

/* Hide send feedback */

.FeatureStageIndicator-feedbackLink--withoutType{
    display:none;
}

/* Hide Dependencies Option */

.TaskDependencies-labeledRowStructure{
 display:none;   
}

/* See more link customisation */
/* Adapted from code written by Chris Landman and posted on the Asana Community board */

.truncatedRichText-expand { 
    display: block;
    width: 40%;
    padding: 8px 0;
    text-align: center;
    color: #fff;
    background: #c0ced8;
    margin-top: 10px;
    border-radius: 3px;
}

.TruncatedRichText-expand { 
    display: block;
    width: 40%;
    padding: 8px 0;
    text-align: center;
    color: #fff;
    background: #c0ced8;
    margin-top: 10px;
    border-radius: 3px;
}

.TaskStoryFeed-expandLink {
    display: block;
    width: 90%;
    margin-bottom: 20px;
    margin-left: 40px;
    margin-top: 15px;
    padding: 8px 0;
    text-align: center;
    color: #fff;
    background: #1aafd0;
    border-radius: 3px;
}


/*
 *
 *
 * PROJECT TASK LIST CUSTOMISATION
 *
 *
 */



/*
 *
 * LEFT TASK LIST GRID CUSTOMISATION
 *
 */


/* Hide the Fields Button */
.PotFieldsButton-fullWidthGridTourCoachmark{
    display:none;
}

div.Button.Button--small.Button--secondary.CompletionButton,
.CompletionButton.CompletionButton--isCompleted:not(.Button--disabled) {
    width: 50px;
    font-size: 0px;
    padding: 0;
    display: none;
}

/* Hide the Rules Button */
.MenuAnchor--default.AutomationMenu.MenuAnchor{
    display:none;
}

/* Hide the Column Options Drop Down */
.SpreadsheetFieldHeading-menu{
    display: none;
}

.SpreadsheetAddFieldHeading-fieldHeading--addField{
    display:none;
}


/* Increase the size of the Task List grid header */
.GridHeader--isCompactMode.GridHeader, .GridHeader--isCompactMode.PotGridPlaceholder-gridHeader {
    height: 50px;
}

/* Make sure the grid headers on the left grid list display*/
.GridHeader .GridHeader-right, .PotGridPlaceholder-gridHeader .GridHeader-right {
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: flex;
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    max-width: 70%;
    min-width: 1px;
    overflow: visible;
}

.GridHeaderStructure .GridHeaderStructure-right {
    align-items: center;
    display: flex;
    flex: 0 1 auto;
    justify-content: flex-end;
    max-width: 70%;
    min-width: 1px;
    overflow: visible;
    padding-right: 30px;
}

/* Expand the maximum width of the Task List grid */
.lunaui-grid-center-pane-container#center_pane_container {
    max-width: 5000px;
}

.PotListPageContent-gridPane
 {
    flex: 0 1 5000px;
    min-width: 405px;
}

.PotListPage-gridPane {
    flex: 0 1 5000px;
    min-width: 405px;
}

.PotListPage-detailsPane {
    flex: 0 1 675px;
    margin-left: 15px;
    min-width: 675px;
}

  
.TaskRow-detailsCaret {
    display: none;
}

.TaskRow-completionStatus {
    display: none;
}

.TaskRowCompletionStatus-checkbox--withSpreadsheetGridEnabled.TaskRowCompletionStatus-checkbox--incomplete {
    display:none;
}

.DueDateContainer-dueDate {
    text-transform: uppercase;
}

.CustomPropertyHeader-fieldName {
    white-space: normal;
}


.Pill.Pill--colorNone {
    background-color: #edf1f2;
    color: #848f99;
}

.PotPillsContainer-potPillLink:first-child {
    margin-left: 0;
    margin-right: 0;
}

.TaskRowCompletionStatus-checkbox.TaskRowCompletionStatus-checkbox--incomplete{
    display:none;
}

.SpreadsheetGridTaskNameCell-completionStatus{
    display:none;
}

/*
 *
 *
 * END PROJECT TASK LIST CUSTOMISATION ------------------------...