Skip to content

Netsuite UI Improvements by Vgirard

Write a review Install Get Stylus

Details

AuthorVgirard

LicenseNo License

Categoryapp.netsuite

Created

Updated

Size2.6 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Tries to improve a few gripes I have with Netsuite's UI.

I did this for just myself originally but figured it might help someone else...

Notes

Features

  • Tabs

    • Now flex-wraps instead of going off-screen
    • Now sticks to the top of the screen when scrolling past
    • "Display all tabs" button is now hidden

  • Records

    • Categories now have a background and border for better readability
    • Top bar now sticks to the top of the screen
    • Top and bottom bars now flex-wraps when there are too many buttons.
    • Upper-right buttons won't overflow outside of viewports with shorter width

  • Multi-selects & Dropdowns

    • Were made wider to show all text instead of cutting it off
    • Uses smaller font to fit more lines in the view

  • Timeout Popup has a red border to be more visible if you are using an extension that removes the blur effect.

  • Tooltips

    • Made info tooltips readable when using the Dark Reader browser extension

v9:

  • Added red border on timeout popup

v8:

  • Fixed issue with grey box / padding above tabs

v7:

  • Wrap the buttons on records top and bottom bar when there are too many.

v6:
Reverted: Made text input fields use the full length of their container

caused too many issues with other fields

v5:

  • Made info tooltips readable when using Dark Reader
  • Made text input fields use the full length of their container

v4:

  • Added a minimum width to dropdowns and selects, so that "fit-content" does not shrink them to 0px when empty.

v3:

  • Made the top bar of records sticky
  • Fixed v2 issue of invisible background on certain tab headers
  • Containers of multi-selects now scale accordingly to fit the box so it doesn't hide other elements

v2:

  • Made the grey box transparent instead, for the few cases where it would hide informations
  • Changed list selects to fit their content to show all text instead of cutting it off
  • Made list selects font-size smaller to fit more text and lines in the view

Known Issues:

  • Tabs headers might float near the top of the screen under certain contexts

v1:

  • Tabs now wrap instead of going off-screen
  • Tabs will stick to the top of the screen when scrolling past
  • Hides the "Display all tabs" button
  • Put a background and border on record categories for better readability

Known issues:

  • Adds a grey box above sub-tabs so they don't end-up hidden behind tabs

Source code

/* ==UserStyle==
@name         Netsuite UI Improvements
@version      20240712.15.53
@namespace    https://userstyles.world/user/Vgirard
@description  Tries to improve a few gripes I have with Netsuite's UI.I did this for just myself originally but figured it might help someone else...
@author       Vgirard
@license      No License
==/UserStyle== */

/* ==UserStyle==
@name         app.netsuite.com
@version      20231124.16.02
@namespace    ?
==/UserStyle== */

@-moz-document url-prefix("https://docs.oracle.com/") {
body > .noscript, body > .noscript ~ * {
    opacity: 1 !important;
}
}

@-moz-document regexp(".+(.)app(.)netsuite(.)com(\\/).+") {
#timeoutpopup {
    border: solid red 2px;
}

#ReadablePopupWithDarkMode,
    #nlpopupsimple {
        color: black !important;
    }

#WrapRecordsTopAndBottomBarButtons,
    td.uir-header-buttons > table > tbody > tr,
    td.uir-secondary-buttons > table > tbody > tr {
        display: flex !important;
        flex-wrap: wrap;
        gap: 0.5rem 0;
        width: calc(100vw - 3rem) !important;
    }

#FitTitleWidthToViewport,
    .uir-page-title {
        width: calc(100vw - 3rem) !important;
    }

#SnapRecordsTopBar,
    #div__body > form > table > tbody > tr:first-child {
        position: sticky;
        top: -1px;
        z-index: 8;
        background-color: var(--darkreader-neutral-background, white);
    }

#StickyTabs,
    #FirstLevel,
    #div__body > table.uir-table-block.uir_form_tab_container > tbody > tr:nth-child(1) {
        position: sticky;
        top: -1px;
        z-index: 10;
        min-height: 58px
    }

    #SecondLevel,
    #results_tab_div > div > table > tbody > tr:nth-child(1), .nltabcontent > .uir-table-block> tbody > tr:nth-child(1) {
        position: sticky;
        z-index: 10;
        top: 54px
    }

#wrap-tabs,
    .bgtabbar > tbody > tr,
    .bgsubtabbar > tbody > tr {
        display: flex;
        flex-wrap: wrap;
    }

#HideShowAllTabsButton,
    td.uir-unroll-tabs-button {
        display: none;
    }

#CategoriesBoxes,
    .nltabcontent table {
        border-collapse: collapse;
    }

    .uir-fieldgroup-content {
        box-shadow: inset 0 0 5px #8882;
        background-color: #88888808;
    }

#FixDropdownSelect,
    .dropdownDiv {
        width: fit-content !important;
        min-width: 300px;
    }

    .dropdownDiv {
        min-height: 350px;
    }

    .uir-multiselect-option {
        font-size: 75% !important;
        height: 20px;
    }
}

Reviews

No reviews yet.