Helpful CSS adjustments

Modified on: Wed, 3 Apr, 2024 at 10:20 AM

Hide Price in lightbox (modal mode)

body .fpd-modal-product-designer fpd-actions-bar .fpd-total-price {
    display: none !important;
}

Set navigation to top

Use this CSS if you want to set the navigation to the top when using the sidebar layout.

fpd-main-bar {
    flex-direction: column;
}

fpd-main-bar
.fpd-navigation {
    display: flex;
    background: var(--fpd-module-secondary-color);
}

.fpd-container.fpd-sidebar>fpd-main-bar .fpd-navigation>.fpd-nav-item {
    flex-direction: column;
    flex: 1 0 81px;
    margin: 5px;
}

.fpd-container.fpd-sidebar>fpd-main-bar>.fpd-module-content {
    height: 100%;
    min-height: 0;
}

Example

Hide QR-Code tab in images module

.fpd-module-tabs [data-context="qr-code"] {
    display: none !important;
}