/* * This file is part of Part-DB (https://github.com/Part-DB/Part-DB-symfony). * * Copyright (C) 2019 - 2022 Jan Böhmer (https://github.com/jbtronics) * * This program is free software: you can redistribute it and/or modify * it under the terms of the GNU Affero General Public License as published * by the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU Affero General Public License for more details. * * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see . */ /**************************************** * Action bar ****************************************/ .sticky-select-bar { position: sticky; top: 120px; z-index: 1000; /* Ensure the bar is above other content */ } /**************************************** * Tables ****************************************/ /* We need to override the z index, or the elements will overlap the fixed header from datatables. */ table .input-group .form-control { z-index: 0; } table .input-group-btn:last-child>.btn, table .input-group-btn:last-child>.btn-group { z-index: 0; } /* Hide datatables fixedHeaders on small devices */ @media only screen and (max-width: 1000px){ .fixedHeader-floating { display: none; } } /* Mobile table improvements */ @media (max-width: 768px) { /* Better table wrapper for horizontal scrolling */ .table-responsive { border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); margin-bottom: 1rem; } /* Improve table appearance on mobile */ .table { font-size: 0.9rem; margin-bottom: 0; } .table th { font-size: 0.85rem; font-weight: 600; padding: 12px 8px; background-color: var(--bs-gray-100); border-bottom: 2px solid var(--bs-gray-300); white-space: nowrap; } .table td { padding: 10px 8px; vertical-align: middle; } /* Improve button groups in tables */ .table .btn-group { display: flex; flex-wrap: wrap; gap: 2px; } .table .btn-group .btn { flex: 0 0 auto; min-width: 36px; min-height: 36px; padding: 6px 8px; font-size: 0.8rem; } /* DataTables mobile improvements */ .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter { margin-bottom: 0.75rem; } .dataTables_wrapper .dataTables_filter input { width: 100%; margin-left: 0; margin-top: 0.5rem; min-height: 44px; font-size: 16px; /* Prevent zoom on iOS */ } .dataTables_wrapper .dataTables_length select { min-height: 44px; padding: 8px 12px; } /* DataTables pagination improvements */ .dataTables_wrapper .dataTables_paginate { text-align: center !important; margin-top: 1rem; } .dataTables_wrapper .dataTables_paginate .pagination { justify-content: center; flex-wrap: wrap; } .dataTables_wrapper .dataTables_paginate .page-link { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; margin: 2px; } /* DataTables info text */ .dataTables_wrapper .dataTables_info { text-align: center; padding: 1rem 0; font-size: 0.9rem; } /* Hide some table columns on very small screens */ @media (max-width: 480px) { .table .mobile-hidden { display: none; } /* Stack table controls vertically on very small screens */ .dataTables_wrapper .row > div { margin-bottom: 0.5rem; } } } /** * Enforce white links on selected rows in datatables */ table.dataTable > tbody > tr.selected > td > a { color: white !important; } /******************************* Parts datatable styling ******************************/ .attach-table-icon { margin-right: 0.7em; color: var(--bs-gray); } .attach-table-icon:hover { color: var(--bs-gray-dark); } .badge-table { margin-right: 0.2em; } /** Do not add margin below description in part table */ .markdown-inline p { margin-block-end: 0; } table.dataTable { margin-top: 0 !important; } div.dataTables_wrapper div.dataTables_info { white-space: normal; } /** Ensure proper rendering/spacing of the select checkbox in tables */ th.select-checkbox { min-width: 10px; } /******************************************************************** * Datatables definitions/overrides ********************************************************************/ .dt-length { display: inline-flex; } /** Fix datatables select-checkbox position */ table.dataTable tr.selected td.select-checkbox:after { margin-top: -20px !important; } /** Show pagination right aligned */ .dt-paging .pagination { justify-content: flex-end; } /** Fix table row coloring */ table.table.dataTable > :not(caption) > * > * { background-color: var(--bs-table-bg); } /****************************************************** Classes for Datatables export *******************************************************/ #export-title, #export-messageTop, .export-helper{ display: none; }