QuickBooks Online Clean Userstyle

QBO-clean.css

@-moz-document domain("app.qbo.intuit.com") {
/* ==UserStyle==
@name           4/17/2023, 6:33:24 PM
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    QuickBooks Online - Compact and Legible
@author         phrz
==/UserStyle== */

/* hide unused sidebar items */
/* taxes, mileage, projects, capital, commerce */
/* (Cannot fix due to CSS change, omitted) */

/* FONTS */
@font-face {
    font-family: "Avenir Next forINTUIT Var";
    src: local("Helvetica Neue");
    font-style: normal; font-weight: 275 900; 
}
@font-face {
    font-family: "Avenir Next forINTUIT";
    src: local("Helvetica Neue Ultralight");
    font-weight: 100;
}
@font-face {
    font-family: "Avenir Next forINTUIT";
    src: local("Helvetica Neue Thin");
    font-weight: 200;
}
@font-face {
    font-family: "Avenir Next forINTUIT";
    src: local("Helvetica Neue Light");
    font-weight: 300;
}
@font-face {
    font-family: "Avenir Next forINTUIT";
    src: local("Helvetica Neue");
    font-weight: 400;
}
@font-face {
    font-family: "Avenir Next forINTUIT";
    src: local("Helvetica Neue Medium");
    font-weight: 500 600;
}
@font-face {
    font-family: "Avenir Next forINTUIT";
    src: local("Helvetica Neue Bold");
    font-weight: 700 900;
}
body {
    color: #000;
}

/*==================================*/
/* Navbar */

/* + New button in sidebar */
div[class^="GlobalCreateButtonComponent__StyledGlobalCreateContainer"] {
    padding: 0.5em;
}
[data-id="global_create_button"] {
    border-radius: 0.25em;
    min-width: auto;
    padding: 0;
    height: 2em;
}
/* no qbo icon */
div[class^="QBOLogoComponent__LogoNode"], a[data-id="appLogoNode"] {
    display: none;
}

/* Hide <hr> */
#Navigation > hr {
    display: none;
}

/* Hide NEW Get to know your menu! popup in navbar */
#Navigation > div[data-id="nav_phase2_card"] {
    display: none;
}

/* Hide bookmarks header of navbar */
div[data-id="leftnav-section-header-bookmarks"] {
    display: none;
}

/* Hide bookmarks section of navbar */
/*#Navigation > div[data-id="navigation-container"] > div > a[data-id^="bookmark-"] {
    display: none;
}*/

/* Hide "Menu v" heading but not edit button */
div[data-id="leftnav-section-header-menu"] > button {
    display: none;
}

/* Hide spacer */
div[class^="SharedNavSection__SectionSpacerFlex"] {
    display: none;
}

/* Hide "menu settings" at end of navbar */
#L1-nav-items-holder {
    display: none;
}

/* move sidebar to top */
div.main.flex-columns {
    flex-direction: column;
}

[data-id="global_create_button"] {
    width: auto;
    padding: 0 0.5em 0 1em;
    height: 1.8em;
    font-size: 1em;
}

/* hide chevrons */
#Navigation > div[data-id="navigation-container"] > div > a > svg {
    display: none;
}

/* sidebar on top */
.main > div[data-morpheus-pluginid="qbo-navigation-widgets-ui"] {
    position: absolute;
    top: 0;
    width: 100%;
}

#Navigation {
    width: 100%;
    height: 2em !important;
}

/* remove spacing around [+ New] button in nav */
.left-nav-default, div[class^="GlobalCreateButtonComponent__StyledGlobalCreateContainer"] {
    margin: 0;
    padding: 0.05em 0;
}

/* make room for sidebar on top */
.body-container {
    padding-top: 2em;
}

/* Horizontal nav items */
#Navigation {
    flex-direction: row;
}

#Navigation > div[data-id="navigation-container"] {
    display: flex;
    overflow-x: scroll;
    overflow-y: hidden;
    scrollbar-width: none;
    margin: 0;
}

#Navigation > div[data-id="navigation-container"] > div > a {
    height: 2em;
    padding: 0;
}

#Navigation > div[data-id="navigation-container"] > div > a > span {
    height: 2em;
    line-height: 2;
    padding: 0 0.4em 0;
    /* hide green "current page" highlight */
    border-style: none !important;
    border-color: transparent;
}

/* make > More button padding fit nav bar */
#Navigation button[class^="SharedNavMoreComponent__MoreButton-"] {
    height: 2em;
    padding: 0;
}

/* remove > More button right chevron */
#Navigation button[class^="SharedNavMoreComponent__MoreButton-"] > svg {
    display: none;
}

/* fit pencil button to navbar */
div[data-id="leftnav-section-header-menu"] {
    height: 2em;
}

/*==================================*/

/* HEADER BAR (light gray below nave) */
.tsaGlobalHeader.default > nav.headerNav {
    height: 2.5em;
    background: #eee;
}
.headerItem > .qbo-navigation-widgets-ui.companyName.label {
    height: auto;
    width: auto;
    line-height: 2.5em;
}

/* Hide navbar reveal/hide button on mobile widths */
nav.headerNav > ul.container-left > li.headerItem > span.global-header-item > button.global-header-item-button {
    display: none;
}

/* pad the left of the company name */
nav.headerNav > ul.global-header-container.container-left > li.headerItem > span.qbo-navigations-wdigets-ui.companyName.label {
    padding-left: 1em;
}

/* decrease padding for top right header buttons and the notification icon (which is treated differently) */
.tsaGlobalHeader .headerNav ul.global-header-container li.headerItem, .tsaGlobalHeader .flyoutWrapper ul.global-header-container li.headerItem, .overflow .headerNav ul.global-header-container li.headerItem, .overflow .flyoutWrapper ul.global-header-container li.headerItem {
    height: 2.5em;
    padding: 0;
}
nav.headerNav > ul.global-header-container.container-right > li.headerItem > span.global-header-item > button.global-header-item-button, nav.headerNav > ul.global-header-container.container-right > li.headerItem > div[data-morpheus-pluginid="notification-tray-plugin"] {
    padding: 0.35em !important;
}

/* SECONDARY NAV BELOW SECTION TITLE */
.tabbed-nav-container-default {
    padding: 0;
}

/*==================================*/

/* HIDE ADS */
.marketing-ipd-tsa-widgets, div.PageMessage-info-1cf1158 { 
    display: none !important;
}

/* MAIN BODY AREA */
.integrations-datain-ui {
    margin: 0 0.1em;
}

/*==================================*/

/* BANK FEED */
.integrations-datain-ui .banking-main-wrapper {
    width: 100%;
}
.integrations-datain-ui .owner-mode-tabs > div {
    padding: 0;
}
.idsTable--quickbooksTheme .idsTable__contentWrapper {
    padding: 0;
}
.integrations-datain-ui .owner-mode-grid .acct-mode-table .idsTable .idsTable__row td.idsTable__cell {
    padding: 0.1em 0.25em;
}
.idsTable__cell {
    white-space: normal;
}
/* match label in bank feed */
.integrations-datain-ui button.a11y-button {
    line-height: 1em;
    height: auto;
}

/* zebra stripe bank feed */

.integrations-datain-ui .owner-mode-grid .acct-mode-table .idsTable .idsTable__row:hover {
    background-color: rgba(0,0,0,0.03);
    font-weight: bold;
    outline: 3px solid hsl(200deg, 100%, 50%);
}

.integrations-datain-ui .owner-mode-grid .acct-mode-table .idsTable .idsTable__row:hover .a11y-button {
    font-weight: bold;
}

.integrations-datain-ui .owner-mode-grid .acct-mode-table .idsTable .idsTable__row:nth-child(even) {
    background-color: rgba(0,0,0,0.05);
}

.integrations-datain-ui .owner-mode-grid .acct-mode-table .idsTable .idsTable__row:nth-child(even):hover {
    background-color: rgba(0,0,0,0.08);
}

/* remove space around account cards at top of bank feed */
.idsCarousel .idsCarouselContainer .slideAndArrowSection .slideSectionContainer {
   margin: 0;
}

.integrations-datain-ui .accounts {
    margin-bottom: 0;
}

/* remove useless chevron space underneath account cards */
.integrations-datain-ui .icon-container-chevron {
    display: none;
}

/* hide "Video tutorials, Take a tour, Go to bank register" link bar in top right of bank feed */
.integrations-datain-ui .link-section {
    display: none;
}

/* allow filter bar (date picker, search bar) to coexist on same row as page selector, print and export buttons atop bank feed */
.integrations-datain-ui .txn-filter-section {
    display: inline-block;
}

.integrations-datain-ui .print-excel-icons {
    padding: 0;
}

.integrations-datain-ui .print-excel-icons > button {
    margin-top: 0 !important;
}

.integrations-datain-ui .owner-mode-grid .acct-mode-table .table-wrapper .idsTable__layoutHeader svg {
    /* gear button (for some reason lives elsewhere in DOM tree despite being next to print and excel buttons in top right bank feed) */
    margin-top: 3px;
}
}