mirror of
https://github.com/Part-DB/Part-DB-server.git
synced 2025-06-21 01:25:55 +02:00
Cleaned up and reorganized projects CSS.
This commit is contained in:
Jan Böhmer
parent
853fc513f7
commit
81328071f7
13 changed files with 592 additions and 934 deletions
|
|
@ -58,29 +58,5 @@ export default class extends Controller {
|
||||||
}
|
}
|
||||||
|
|
||||||
this._tomSelect = new TomSelect(this.element, settings);
|
this._tomSelect = new TomSelect(this.element, settings);
|
||||||
|
|
||||||
/*if(this.element.dataset.autocomplete) {
|
|
||||||
const engine = new Bloodhound({
|
|
||||||
//@ts-ignore
|
|
||||||
datumTokenizer: Bloodhound.tokenizers.obj.whitespace(''),
|
|
||||||
//@ts-ignore
|
|
||||||
queryTokenizer: Bloodhound.tokenizers.obj.whitespace(''),
|
|
||||||
remote: {
|
|
||||||
url: this.element.dataset.autocomplete,
|
|
||||||
wildcard: 'QUERY'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$(this.element).tagsinput({
|
|
||||||
typeaheadjs: {
|
|
||||||
name: 'tags',
|
|
||||||
source: engine.ttAdapter()
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else { // Init tagsinput without typeahead
|
|
||||||
$(this.element).tagsinput();
|
|
||||||
}*/
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -1,898 +0,0 @@
|
||||||
/*
|
|
||||||
* This file is part of Part-DB (https://github.com/Part-DB/Part-DB-symfony).
|
|
||||||
*
|
|
||||||
* Copyright (C) 2019 - 2020 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 <https://www.gnu.org/licenses/>.
|
|
||||||
*/
|
|
||||||
|
|
||||||
|
|
||||||
/************************************
|
|
||||||
* Basic layout (Navbar, sidebar, etc.)
|
|
||||||
*************************************/
|
|
||||||
|
|
||||||
/* Add padding for fixed header bar */
|
|
||||||
body {
|
|
||||||
overflow-x: hidden;
|
|
||||||
/*position: relative;*/
|
|
||||||
padding-top: 70px;
|
|
||||||
/* Use font size like in BS3 */
|
|
||||||
/*font-size: 14px;
|
|
||||||
line-height: 1.428;*/
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 768px) {
|
|
||||||
.fixed-sidebar {
|
|
||||||
/*
|
|
||||||
position: fixed;
|
|
||||||
left: 15px;
|
|
||||||
z-index: 1000;
|
|
||||||
/* display: flex;
|
|
||||||
width: inherit; '/
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
/*noinspection W3CssValidation*/
|
|
||||||
/* -webkit-overflow-scrolling: touch;
|
|
||||||
max-height: 100%;
|
|
||||||
padding-bottom: 50px; */
|
|
||||||
|
|
||||||
|
|
||||||
position: fixed;
|
|
||||||
top: 60px;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
/* z-index: 1000;*/
|
|
||||||
/* padding: 20px; */
|
|
||||||
padding-left: 15px;
|
|
||||||
/* padding-top: 15px; */
|
|
||||||
padding-right: 0;
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
|
|
||||||
/*noinspection W3CssValidation*/
|
|
||||||
-webkit-overflow-scrolling: touch;
|
|
||||||
|
|
||||||
/** Hide scrollbar in old Firefox and Edge **/
|
|
||||||
-ms-overflow-style: none;
|
|
||||||
/*noinspection CssInvalidPropertyValue*/
|
|
||||||
overflow: -moz-scrollbars-none;
|
|
||||||
/*noinspection CssUnknownProperty*/
|
|
||||||
scrollbar-width: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/*noinspection W3CssValidation*/
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.fixed-sidebar {
|
|
||||||
position: fixed;
|
|
||||||
top: 56px;
|
|
||||||
right: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 1000;
|
|
||||||
width: inherit;
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
/*noinspection W3CssValidation*/
|
|
||||||
-webkit-overflow-scrolling: touch;
|
|
||||||
max-height: 100%;
|
|
||||||
opacity: 0.97;
|
|
||||||
padding: 7px 15px 50px;
|
|
||||||
margin-top: -10px;
|
|
||||||
|
|
||||||
/* Fill window */
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
/** Hide scrollbar in Firefox and Edge **/
|
|
||||||
-ms-overflow-style: none;
|
|
||||||
/*noinspection CssInvalidPropertyValue*/
|
|
||||||
overflow: -moz-scrollbars-none;
|
|
||||||
/* Use standard version for hiding the scrollbar */
|
|
||||||
scrollbar-width: none;
|
|
||||||
|
|
||||||
background-color: var(--light);
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-container {
|
|
||||||
margin-top: 0;
|
|
||||||
padding-top: 5px;
|
|
||||||
background-color: #F8F8F8;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide devices menu */
|
|
||||||
#treeBox-devices {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide scrollbar */
|
|
||||||
.fixed-sidebar::-webkit-scrollbar {display:none;}
|
|
||||||
|
|
||||||
@media (min-width: 768px) {
|
|
||||||
.sidebar-collapse.collapse {
|
|
||||||
display: block !important;
|
|
||||||
height: auto !important;
|
|
||||||
padding-bottom: 0;
|
|
||||||
overflow: visible !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Back to top button */
|
|
||||||
.back-to-top {
|
|
||||||
cursor: pointer;
|
|
||||||
position: fixed;
|
|
||||||
bottom: 20px;
|
|
||||||
right: 20px;
|
|
||||||
display:none;
|
|
||||||
z-index: 1030;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.sidebar-title {
|
|
||||||
margin-top: 0;
|
|
||||||
font-size: 18px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
line-height: 1.1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Blur content during loading*/
|
|
||||||
.loading-content {
|
|
||||||
filter: blur(2px);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
The sidebar toggle button floats on the left side and is hidden when the viewport is to small for
|
|
||||||
showing the sidebar (on devices with md or higher)
|
|
||||||
*/
|
|
||||||
#sidebar-toggle-button {
|
|
||||||
position: fixed;
|
|
||||||
left: 3px;
|
|
||||||
bottom: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 576px) {
|
|
||||||
#sidebar-toggle-button {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/********************************
|
|
||||||
* Toasts
|
|
||||||
********************************/
|
|
||||||
.toast-container {
|
|
||||||
position: fixed;
|
|
||||||
top: auto;
|
|
||||||
z-index: 3000; /* Over darkmode layer for correct colors! */
|
|
||||||
right: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*********************************
|
|
||||||
* Emojis
|
|
||||||
********************************/
|
|
||||||
.emoji {
|
|
||||||
height: 1.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**********************************
|
|
||||||
* Helper classes
|
|
||||||
*********************************/
|
|
||||||
|
|
||||||
.vertical-align {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.vertical-align-table>tbody>tr>td,
|
|
||||||
.vertical-align-table>tbody>tr>th,
|
|
||||||
.vertical-align-table>tfoot>tr>td,
|
|
||||||
.vertical-align-table>tfoot>tr>th,
|
|
||||||
.vertical-align-table>thead>tr>td,
|
|
||||||
.vertical-align-table>thead>tr>th {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-center{
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.font-weight-bold {
|
|
||||||
font-weight:bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-no-margin {
|
|
||||||
margin-top: 0;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
Use this class if you has a <span> or <p> and you want to create automatic textbreaks in the text.
|
|
||||||
*/
|
|
||||||
.text-break {
|
|
||||||
/*noinspection W3CssValidation,CssUnknownProperty*/
|
|
||||||
-ms-word-break: break-all;
|
|
||||||
/*noinspection CssOverwrittenProperties*/
|
|
||||||
word-break: break-all;
|
|
||||||
|
|
||||||
/* Non standard for webkit */
|
|
||||||
/*noinspection W3CssValidation,CssInvalidPropertyValue,CssOverwrittenProperties*/
|
|
||||||
word-break: break-word;
|
|
||||||
|
|
||||||
/*noinspection W3CssValidation*/
|
|
||||||
-webkit-hyphens: auto;
|
|
||||||
/*noinspection W3CssValidation*/
|
|
||||||
-moz-hyphens: auto;
|
|
||||||
hyphens: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.auto-size-select {
|
|
||||||
height: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
/****************************************
|
|
||||||
* Bootstrap extensions
|
|
||||||
*****************************************/
|
|
||||||
a.badge {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.w-fit {
|
|
||||||
width: -moz-fit-content;
|
|
||||||
width: fit-content;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg-primary-striped {
|
|
||||||
background: repeating-linear-gradient(
|
|
||||||
-45deg,
|
|
||||||
var(--bs-primary),
|
|
||||||
var(--bs-primary) 10px,
|
|
||||||
var(--bs-info) 10px,
|
|
||||||
var(--bs-info) 20px
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group-sm {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Use this if you want to use a link inside a form-group */
|
|
||||||
.form-control-link {
|
|
||||||
display: block;
|
|
||||||
padding-top: 7px;
|
|
||||||
padding-bottom: 7px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* A text-only button without border */
|
|
||||||
.btn-text {
|
|
||||||
color: inherit;
|
|
||||||
padding: 0;
|
|
||||||
border: hidden;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Size sensitive pull-* helpers */
|
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
|
||||||
.pull-right-not-xs, .pull-left-not-xs{
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
.pull-right-xs {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.pull-left-xs {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (min-width: 768px) and (max-width: 991px) {
|
|
||||||
.pull-right-not-sm, .pull-left-not-sm{
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
.pull-right-sm {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.pull-left-sm {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (min-width: 992px) and (max-width: 1199px) {
|
|
||||||
.pull-right-not-md, .pull-left-not-md{
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
.pull-right-md {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.pull-left-md {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (min-width: 1200px) {
|
|
||||||
.pull-right-not-lg, .pull-left-not-lg{
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
.pull-right-lg {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.pull-left-lg {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.not-allowed {
|
|
||||||
cursor: not-allowed !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**************************************
|
|
||||||
btn-xs
|
|
||||||
btn-xs
|
|
||||||
*/
|
|
||||||
|
|
||||||
.btn-xs {
|
|
||||||
/*padding: .1rem .3rem; */
|
|
||||||
padding: 1px 5px;
|
|
||||||
font-size: 12px;
|
|
||||||
line-height: 1.5
|
|
||||||
}
|
|
||||||
|
|
||||||
.not-enough-instock {
|
|
||||||
background-color: rgba(220, 53, 69, 0.4);
|
|
||||||
}
|
|
||||||
|
|
||||||
/****************************************
|
|
||||||
* Picture classes
|
|
||||||
*****************************************/
|
|
||||||
|
|
||||||
.companypic {
|
|
||||||
width: 17px;
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.companypic:hover {
|
|
||||||
filter: opacity(60%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.companypic-bg {
|
|
||||||
width: 20px;
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.companypic-bg:hover {
|
|
||||||
filter: opacity(60%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.hoverpic {
|
|
||||||
min-width: 10px;
|
|
||||||
max-width: 30px;
|
|
||||||
display: block;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.darkmode--activated .hoverpic:hover {
|
|
||||||
background: black;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.thumbnail-sm {
|
|
||||||
max-height: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
img.img-attachement {
|
|
||||||
max-width: 25%;
|
|
||||||
margin: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/****************************************
|
|
||||||
* Tables
|
|
||||||
****************************************/
|
|
||||||
.table-compact>tbody>tr>td,
|
|
||||||
.table-compact>tbody>tr>th,
|
|
||||||
.table-compact>tfoot>tr>td,
|
|
||||||
.table-compact>tfoot>tr>th,
|
|
||||||
.table-compact>thead>tr>td,
|
|
||||||
.table-compact>thead>tr>th,
|
|
||||||
table.dataTable>tbody>tr>th,
|
|
||||||
table.dataTable>tbody>tr>td
|
|
||||||
{
|
|
||||||
padding: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Enforce white links on selected rows in datatables
|
|
||||||
*/
|
|
||||||
table.dataTable > tbody > tr.selected > td > a {
|
|
||||||
color: white !important;
|
|
||||||
}
|
|
||||||
/***************************************
|
|
||||||
* Dropdown with radio buttons
|
|
||||||
***************************************/
|
|
||||||
|
|
||||||
.container-progress {
|
|
||||||
padding-top: 25%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-menu-radio {
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drop-radio {
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*************************************
|
|
||||||
* Smaller radio buttons
|
|
||||||
**************************************/
|
|
||||||
|
|
||||||
.radio-small {
|
|
||||||
margin-bottom: 0;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/************************************
|
|
||||||
X3DOM
|
|
||||||
*************************************/
|
|
||||||
|
|
||||||
.x3d-fullscreen {
|
|
||||||
/*height: auto;*/
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*******************************
|
|
||||||
* Collapsable panel definitions.
|
|
||||||
********************************/
|
|
||||||
|
|
||||||
.fancy-collapse-panel .panel-default > .panel-heading {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-header a[data-toggle=collapse] {
|
|
||||||
display: inline-block;
|
|
||||||
width: 100%;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
@font-face {
|
|
||||||
font-family: 'FA5';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 900;
|
|
||||||
src: url("../../webfonts/fa-solid-900.eot");
|
|
||||||
src: url("../../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../../webfonts/fa-solid-900.woff2") format("woff2"), url("../../webfonts/fa-solid-900.woff") format("woff"), url("../../webfonts/fa-solid-900.ttf") format("truetype"), url("../../webfonts/fa-solid-900.svg#fontawesome") format("svg");
|
|
||||||
} */
|
|
||||||
|
|
||||||
.card-header a[data-toggle=collapse]:after {
|
|
||||||
/*noinspection CssNoGenericFontName*/
|
|
||||||
font-family: "Font Awesome 5 Free";
|
|
||||||
content: "\f106";
|
|
||||||
position: absolute;
|
|
||||||
right: 20px;
|
|
||||||
font-size: 20px;
|
|
||||||
font-weight: 900;
|
|
||||||
top: 50%;
|
|
||||||
line-height: 1;
|
|
||||||
margin-top: -10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-header a[data-toggle=collapse].collapsed:after
|
|
||||||
{
|
|
||||||
content: "\f107";
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-header {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.link-collapse {
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
/******************************************************
|
|
||||||
Classes for Datatables export
|
|
||||||
*******************************************************/
|
|
||||||
|
|
||||||
#export-title,
|
|
||||||
#export-messageTop,
|
|
||||||
.export-helper{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**************************************************
|
|
||||||
* Link styles
|
|
||||||
***************************************************/
|
|
||||||
|
|
||||||
/* Show symbol after exteral links */
|
|
||||||
/*noinspection CssNoGenericFontName*/
|
|
||||||
a[target="_blank"].link-external:after {
|
|
||||||
content: "\f35d ";
|
|
||||||
font-family: "Font Awesome 5 Free";
|
|
||||||
font-weight: 900;
|
|
||||||
margin-left: 3px;
|
|
||||||
font-size: smaller;
|
|
||||||
font-style: normal;
|
|
||||||
display: inline-block;
|
|
||||||
text-decoration: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.text-white {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
/****************************************************
|
|
||||||
* Search highlighting
|
|
||||||
*****************************************************/
|
|
||||||
|
|
||||||
span.highlight {
|
|
||||||
background-color: yellow;
|
|
||||||
}
|
|
||||||
|
|
||||||
/******************************
|
|
||||||
* Bootstrap treeview overrides
|
|
||||||
*******************************/
|
|
||||||
/* Set display style to flexbox, so wraped text is aligned to */
|
|
||||||
|
|
||||||
.list-group-item {
|
|
||||||
padding: 5px 10px;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.treeview {
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.treeview span.icon {
|
|
||||||
width: 20px !important;
|
|
||||||
height: 20px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.fa-treeview {
|
|
||||||
line-height: 1.428;
|
|
||||||
}
|
|
||||||
|
|
||||||
.treeview-sm .list-group-item {
|
|
||||||
padding-top: 3px;
|
|
||||||
padding-bottom: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.treeview .badge {
|
|
||||||
margin-left: auto;
|
|
||||||
line-height: 1.42857143;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*****************************
|
|
||||||
* Pagination bar
|
|
||||||
*****************************/
|
|
||||||
|
|
||||||
/** Select in pagination */
|
|
||||||
.pagination>li>select
|
|
||||||
{
|
|
||||||
position: relative;
|
|
||||||
float: left;
|
|
||||||
padding: 7px 5px;
|
|
||||||
margin-left: -1px;
|
|
||||||
line-height: 1.42857143;
|
|
||||||
color: #337ab7;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #fff;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pagination>li>button
|
|
||||||
{
|
|
||||||
position: relative;
|
|
||||||
float: left;
|
|
||||||
padding: 6px 5px;
|
|
||||||
margin-left: -1px;
|
|
||||||
line-height: 1.42857143;
|
|
||||||
color: #337ab7;
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #fff;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
}
|
|
||||||
|
|
||||||
/******************************
|
|
||||||
* Breadcrumb like structural links
|
|
||||||
********************************/
|
|
||||||
|
|
||||||
/* Style the list */
|
|
||||||
ul.structural_link {
|
|
||||||
padding-top: 7px;
|
|
||||||
padding-bottom: 7px;
|
|
||||||
padding-left: 0;
|
|
||||||
list-style: none;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Display list items side by side */
|
|
||||||
ul.structural_link li {
|
|
||||||
display: inline;
|
|
||||||
font-size: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add a slash symbol (/) before/behind each list item */
|
|
||||||
ul.structural_link li+li:before {
|
|
||||||
padding: 2px;
|
|
||||||
color: grey;
|
|
||||||
/*content: "/\00a0";*/
|
|
||||||
font-family: "Font Awesome 5 Free";
|
|
||||||
font-weight: 900;
|
|
||||||
font-style: normal;
|
|
||||||
content: "\f30b"; /* long-arrow-alt-right */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add a color to all links inside the list */
|
|
||||||
ul.structural_link li a {
|
|
||||||
color: #0275d8;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add a color on mouse-over */
|
|
||||||
ul.structural_link li a:hover {
|
|
||||||
color: #01447e;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*****************************
|
|
||||||
* Print styles
|
|
||||||
*****************************/
|
|
||||||
@media print {
|
|
||||||
body {
|
|
||||||
padding-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.hidden-print-href[href]:after {
|
|
||||||
content: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/*****************************
|
|
||||||
BS 4 overrides
|
|
||||||
****************************/
|
|
||||||
@media (min-width: 768px) {
|
|
||||||
.col-form-label {
|
|
||||||
font-weight: bold;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group > label,
|
|
||||||
.form-group > .col-form-label {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
label:not(.form-check-label, custom-control-label) {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-group {
|
|
||||||
margin-bottom: 0.4rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-item,
|
|
||||||
.dropdown-header,
|
|
||||||
.dropdown-divider {
|
|
||||||
padding: .1rem 1.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-group-append {
|
|
||||||
border-top-left-radius: 0;
|
|
||||||
border-bottom-left-radius: 0
|
|
||||||
}
|
|
||||||
|
|
||||||
.tooltip {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Style datatables */
|
|
||||||
.card-footer-table {
|
|
||||||
padding-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.dataTable {
|
|
||||||
margin-top: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.dataTables_wrapper div.dataTables_info {
|
|
||||||
white-space: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
th.select-checkbox {
|
|
||||||
min-width: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*******************************
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
|
|
||||||
.markdown-inline p {
|
|
||||||
margin-block-end: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*********************************
|
|
||||||
Workarounds
|
|
||||||
*********************************/
|
|
||||||
|
|
||||||
/* Hide tab content even, if tab contents are wrapped inside a form. */
|
|
||||||
.tab-content>form>.tab-pane {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-content>form>.active {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dataTables_length {
|
|
||||||
display: inline-flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Fix datatables select-checkbox position */
|
|
||||||
|
|
||||||
table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selected th.select-checkbox:after {
|
|
||||||
margin-top: -28px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/******************************************
|
|
||||||
* Typeahead menu
|
|
||||||
*******************************************/
|
|
||||||
|
|
||||||
.tt-query {
|
|
||||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
|
||||||
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
|
||||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
|
||||||
}
|
|
||||||
|
|
||||||
.tt-hint {
|
|
||||||
color: #999
|
|
||||||
}
|
|
||||||
|
|
||||||
.tt-menu { /* used to be tt-dropdown-menu in older versions */
|
|
||||||
width: 422px;
|
|
||||||
margin-top: 4px;
|
|
||||||
padding: 4px 0;
|
|
||||||
background-color: #fff;
|
|
||||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
||||||
-webkit-border-radius: 4px;
|
|
||||||
-moz-border-radius: 4px;
|
|
||||||
border-radius: 4px;
|
|
||||||
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
|
|
||||||
-moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
|
|
||||||
box-shadow: 0 5px 10px rgba(0,0,0,.2);
|
|
||||||
|
|
||||||
max-height: 200px;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tt-suggestion {
|
|
||||||
padding: 3px 20px;
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tt-suggestion.tt-cursor,.tt-suggestion:hover {
|
|
||||||
color: #fff;
|
|
||||||
background-color: #0097cf;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.tt-suggestion p {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.darkmode-layer {
|
|
||||||
z-index: 2020;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** If darkmode is enabled revert the blening for images and videos, as these should be shown not inverted */
|
|
||||||
.darkmode--activated img,
|
|
||||||
.darkmode--activated video {
|
|
||||||
mix-blend-mode: difference;
|
|
||||||
}
|
|
||||||
|
|
||||||
.scanner-video {
|
|
||||||
max-width: 500px;
|
|
||||||
max-height: 250px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*******************************************
|
|
||||||
* Hovering carousel gallery
|
|
||||||
*******************************************/
|
|
||||||
.carousel-caption-hover {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carousel .mask {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carousel:hover .mask {
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
transition: .5s ease;
|
|
||||||
background-color: #0a0909;
|
|
||||||
opacity: 0.7;
|
|
||||||
border: 1px solid #dee2e6;
|
|
||||||
border-radius: .25rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carousel-control {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carousel:hover .carousel-caption-hover {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carousel:hover .carousel-control {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
/***********************************************
|
|
||||||
* Typeahead image
|
|
||||||
***********************************************/
|
|
||||||
.typeahead-image {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/***********************************************
|
|
||||||
* Permission checkboxes
|
|
||||||
***********************************************/
|
|
||||||
.permission-checkbox:checked {
|
|
||||||
background-color: var(--bs-success);
|
|
||||||
border-color: var(--bs-success);
|
|
||||||
}
|
|
||||||
|
|
||||||
/***********************************************
|
|
||||||
* Form required dots
|
|
||||||
***********************************************/
|
|
||||||
|
|
||||||
form .col-form-label.required:after, form label.required:after {
|
|
||||||
bottom: 4px;
|
|
||||||
color: var(--bs-dark);
|
|
||||||
content: "\2022";
|
|
||||||
filter: opacity(75%);
|
|
||||||
position: relative;
|
|
||||||
right: -2px;
|
|
||||||
z-index: 700;
|
|
||||||
}
|
|
||||||
108
assets/css/app/bs-overrides.css
Normal file
108
assets/css/app/bs-overrides.css
Normal file
|
|
@ -0,0 +1,108 @@
|
||||||
|
/*
|
||||||
|
* 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 <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a.badge {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.col-form-label {
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-group > label,
|
||||||
|
.form-group > .col-form-label {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
label:not(.form-check-label, .custom-control-label) {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-group {
|
||||||
|
margin-bottom: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-item,
|
||||||
|
.dropdown-header,
|
||||||
|
.dropdown-divider {
|
||||||
|
padding: .1rem 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide tab content even, if tab contents are wrapped inside a form. */
|
||||||
|
.tab-content>form>.tab-pane {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-content>form>.active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*******************************************
|
||||||
|
* Hovering carousel gallery
|
||||||
|
*******************************************/
|
||||||
|
.carousel-caption-hover {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel .mask {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel:hover .mask {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
transition: .5s ease;
|
||||||
|
background-color: #0a0909;
|
||||||
|
opacity: 0.7;
|
||||||
|
border: 1px solid #dee2e6;
|
||||||
|
border-radius: .25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-control {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel:hover .carousel-caption-hover {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel:hover .carousel-control {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
/***********************************************
|
||||||
|
* Form required dots
|
||||||
|
***********************************************/
|
||||||
|
|
||||||
|
form .col-form-label.required:after, form label.required:after {
|
||||||
|
bottom: 4px;
|
||||||
|
color: var(--bs-dark);
|
||||||
|
content: "\2022";
|
||||||
|
filter: opacity(75%);
|
||||||
|
position: relative;
|
||||||
|
right: -2px;
|
||||||
|
z-index: 700;
|
||||||
|
}
|
||||||
32
assets/css/app/darkmode.css
Normal file
32
assets/css/app/darkmode.css
Normal file
|
|
@ -0,0 +1,32 @@
|
||||||
|
/*
|
||||||
|
* 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 <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
.darkmode-layer {
|
||||||
|
z-index: 2020;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** If darkmode is enabled revert the blening for images and videos, as these should be shown not inverted */
|
||||||
|
.darkmode--activated img,
|
||||||
|
.darkmode--activated video {
|
||||||
|
mix-blend-mode: difference;
|
||||||
|
}
|
||||||
|
|
||||||
|
.darkmode--activated .hoverpic:hover {
|
||||||
|
background: black;
|
||||||
|
}
|
||||||
127
assets/css/app/helpers.css
Normal file
127
assets/css/app/helpers.css
Normal file
|
|
@ -0,0 +1,127 @@
|
||||||
|
/*
|
||||||
|
* 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 <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
.w-fit {
|
||||||
|
width: -moz-fit-content;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-primary-striped {
|
||||||
|
background: repeating-linear-gradient(
|
||||||
|
-45deg,
|
||||||
|
var(--bs-primary),
|
||||||
|
var(--bs-primary) 10px,
|
||||||
|
var(--bs-info) 10px,
|
||||||
|
var(--bs-info) 20px
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
.emoji {
|
||||||
|
height: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hoverpic {
|
||||||
|
min-width: 10px;
|
||||||
|
max-width: 30px;
|
||||||
|
display: block;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.thumbnail-sm {
|
||||||
|
max-height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Show symbol after exteral links */
|
||||||
|
/*noinspection CssNoGenericFontName*/
|
||||||
|
a[target="_blank"].link-external:after {
|
||||||
|
content: "\f35d ";
|
||||||
|
font-family: "Font Awesome 5 Free";
|
||||||
|
font-weight: 900;
|
||||||
|
margin-left: 3px;
|
||||||
|
font-size: smaller;
|
||||||
|
font-style: normal;
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/****************************************************
|
||||||
|
* Search highlighting
|
||||||
|
*****************************************************/
|
||||||
|
|
||||||
|
span.highlight {
|
||||||
|
background-color: yellow;
|
||||||
|
}
|
||||||
|
|
||||||
|
/******************************
|
||||||
|
* Breadcrumb like structural links
|
||||||
|
********************************/
|
||||||
|
|
||||||
|
/* Style the list */
|
||||||
|
ul.structural_link {
|
||||||
|
padding-top: 7px;
|
||||||
|
padding-bottom: 7px;
|
||||||
|
padding-left: 0;
|
||||||
|
list-style: none;
|
||||||
|
background-color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Display list items side by side */
|
||||||
|
ul.structural_link li {
|
||||||
|
display: inline;
|
||||||
|
font-size: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add a slash symbol (/) before/behind each list item */
|
||||||
|
ul.structural_link li+li:before {
|
||||||
|
padding: 2px;
|
||||||
|
color: grey;
|
||||||
|
/*content: "/\00a0";*/
|
||||||
|
font-family: "Font Awesome 5 Free";
|
||||||
|
font-weight: 900;
|
||||||
|
font-style: normal;
|
||||||
|
content: "\f30b"; /* long-arrow-alt-right */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add a color to all links inside the list */
|
||||||
|
ul.structural_link li a {
|
||||||
|
color: #0275d8;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add a color on mouse-over */
|
||||||
|
ul.structural_link li a:hover {
|
||||||
|
color: #01447e;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/***********************************************
|
||||||
|
* Typeahead image
|
||||||
|
***********************************************/
|
||||||
|
.typeahead-image {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/***********************************************
|
||||||
|
* Permission checkboxes
|
||||||
|
***********************************************/
|
||||||
|
.permission-checkbox:checked {
|
||||||
|
background-color: var(--bs-success);
|
||||||
|
border-color: var(--bs-success);
|
||||||
|
}
|
||||||
156
assets/css/app/layout.css
Normal file
156
assets/css/app/layout.css
Normal file
|
|
@ -0,0 +1,156 @@
|
||||||
|
/*
|
||||||
|
* 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 <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/************************************
|
||||||
|
* Basic layout (Navbar, sidebar, etc.)
|
||||||
|
*************************************/
|
||||||
|
|
||||||
|
/* Add padding for fixed header bar */
|
||||||
|
body {
|
||||||
|
overflow-x: hidden;
|
||||||
|
padding-top: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.fixed-sidebar {
|
||||||
|
|
||||||
|
position: fixed;
|
||||||
|
top: 60px;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
padding-left: 15px;
|
||||||
|
padding-right: 0;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
/*noinspection W3CssValidation*/
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
/** Hide scrollbar in old Firefox and Edge **/
|
||||||
|
-ms-overflow-style: none;
|
||||||
|
/*noinspection CssInvalidPropertyValue*/
|
||||||
|
overflow: -moz-scrollbars-none;
|
||||||
|
/*noinspection CssUnknownProperty*/
|
||||||
|
scrollbar-width: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*noinspection W3CssValidation*/
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.fixed-sidebar {
|
||||||
|
position: fixed;
|
||||||
|
top: 56px;
|
||||||
|
right: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 1000;
|
||||||
|
width: inherit;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
/*noinspection W3CssValidation*/
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
max-height: 100%;
|
||||||
|
opacity: 0.97;
|
||||||
|
padding: 7px 15px 50px;
|
||||||
|
margin-top: -10px;
|
||||||
|
|
||||||
|
/* Fill window */
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
/** Hide scrollbar in Firefox and Edge **/
|
||||||
|
-ms-overflow-style: none;
|
||||||
|
/*noinspection CssInvalidPropertyValue*/
|
||||||
|
overflow: -moz-scrollbars-none;
|
||||||
|
/* Use standard version for hiding the scrollbar */
|
||||||
|
scrollbar-width: none;
|
||||||
|
|
||||||
|
background-color: var(--light);
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-container {
|
||||||
|
margin-top: 0;
|
||||||
|
padding-top: 5px;
|
||||||
|
background-color: #F8F8F8;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide devices menu */
|
||||||
|
#treeBox-devices {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide scrollbar */
|
||||||
|
.fixed-sidebar::-webkit-scrollbar {display:none;}
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.sidebar-collapse.collapse {
|
||||||
|
display: block !important;
|
||||||
|
height: auto !important;
|
||||||
|
padding-bottom: 0;
|
||||||
|
overflow: visible !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Back to top button */
|
||||||
|
.back-to-top {
|
||||||
|
cursor: pointer;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 20px;
|
||||||
|
display:none;
|
||||||
|
z-index: 1030;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.sidebar-title {
|
||||||
|
margin-top: 0;
|
||||||
|
font-size: 18px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
line-height: 1.1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Blur content during loading*/
|
||||||
|
.loading-content {
|
||||||
|
filter: blur(2px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
The sidebar toggle button floats on the left side and is hidden when the viewport is to small for
|
||||||
|
showing the sidebar (on devices with md or higher)
|
||||||
|
*/
|
||||||
|
#sidebar-toggle-button {
|
||||||
|
position: fixed;
|
||||||
|
left: 3px;
|
||||||
|
bottom: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 576px) {
|
||||||
|
#sidebar-toggle-button {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/********************************
|
||||||
|
* Toasts
|
||||||
|
********************************/
|
||||||
|
.toast-container {
|
||||||
|
position: fixed;
|
||||||
|
top: auto;
|
||||||
|
z-index: 3000; /* Over darkmode layer for correct colors! */
|
||||||
|
right: 25px;
|
||||||
|
}
|
||||||
105
assets/css/app/tables.css
Normal file
105
assets/css/app/tables.css
Normal file
|
|
@ -0,0 +1,105 @@
|
||||||
|
/*
|
||||||
|
* 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 <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/****************************************
|
||||||
|
* 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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 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;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-footer-table {
|
||||||
|
padding-top: 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
|
||||||
|
********************************************************************/
|
||||||
|
|
||||||
|
.dataTables_length {
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Fix datatables select-checkbox position */
|
||||||
|
table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selected th.select-checkbox:after {
|
||||||
|
margin-top: -28px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/******************************************************
|
||||||
|
Classes for Datatables export
|
||||||
|
*******************************************************/
|
||||||
|
|
||||||
|
#export-title,
|
||||||
|
#export-messageTop,
|
||||||
|
.export-helper{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
53
assets/css/app/treeview.css
Normal file
53
assets/css/app/treeview.css
Normal file
|
|
@ -0,0 +1,53 @@
|
||||||
|
/*
|
||||||
|
* 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 <https://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/******************************
|
||||||
|
* Bootstrap treeview overrides
|
||||||
|
*******************************/
|
||||||
|
/* Set display style to flexbox, so wraped text is aligned to */
|
||||||
|
|
||||||
|
.list-group-item {
|
||||||
|
padding: 5px 10px;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.treeview {
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.treeview span.icon {
|
||||||
|
width: 20px !important;
|
||||||
|
height: 20px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fa-treeview {
|
||||||
|
line-height: 1.428;
|
||||||
|
}
|
||||||
|
|
||||||
|
.treeview-sm .list-group-item {
|
||||||
|
padding-top: 3px;
|
||||||
|
padding-bottom: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.treeview .badge {
|
||||||
|
margin-left: auto;
|
||||||
|
line-height: 1.42857143;
|
||||||
|
}
|
||||||
|
|
@ -18,7 +18,14 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// Main CSS files
|
// Main CSS files
|
||||||
import '../css/app.css';
|
//import '../css/app.css';
|
||||||
|
|
||||||
|
import '../css/app/layout.css';
|
||||||
|
import '../css/app/helpers.css';
|
||||||
|
import '../css/app/darkmode.css';
|
||||||
|
import '../css/app/tables.css';
|
||||||
|
import '../css/app/bs-overrides.css';
|
||||||
|
import '../css/app/treeview.css';
|
||||||
|
|
||||||
// start the Stimulus application
|
// start the Stimulus application
|
||||||
import '../bootstrap';
|
import '../bootstrap';
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ datatables:
|
||||||
lengthMenu : [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]]
|
lengthMenu : [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]]
|
||||||
pageLength: 50
|
pageLength: 50
|
||||||
#dom: "<'row' <'col-sm-12' tr>><'row' <'col-sm-6'l><'col-sm-6 text-right'pif>>"
|
#dom: "<'row' <'col-sm-12' tr>><'row' <'col-sm-6'l><'col-sm-6 text-right'pif>>"
|
||||||
dom: " <'row'<'col mb-2 input-group' B l> <'col mb-2' <'pull-right' p>>>
|
dom: " <'row'<'col mb-2 input-group' B l> <'col mb-2' <'pull-end' p>>>
|
||||||
<'card'
|
<'card'
|
||||||
rt
|
rt
|
||||||
<'card-footer card-footer-table text-muted' i >
|
<'card-footer card-footer-table text-muted' i >
|
||||||
|
|
|
||||||
|
|
@ -68,7 +68,6 @@
|
||||||
"clipboard": "^2.0.4",
|
"clipboard": "^2.0.4",
|
||||||
"compression-webpack-plugin": "^10.0.0",
|
"compression-webpack-plugin": "^10.0.0",
|
||||||
"copy-webpack-plugin": "^11.0.0",
|
"copy-webpack-plugin": "^11.0.0",
|
||||||
"corejs-typeahead": "^1.2.1",
|
|
||||||
"darkmode-js": "^1.5.0",
|
"darkmode-js": "^1.5.0",
|
||||||
"datatables.net-bs5": "^1.10.20",
|
"datatables.net-bs5": "^1.10.20",
|
||||||
"datatables.net-buttons-bs5": "^2.2.2",
|
"datatables.net-buttons-bs5": "^2.2.2",
|
||||||
|
|
|
||||||
|
|
@ -30,7 +30,7 @@
|
||||||
<label class="col-form-label col-md-4">{% trans %}user.email.label{% endtrans %}</label>
|
<label class="col-form-label col-md-4">{% trans %}user.email.label{% endtrans %}</label>
|
||||||
<div class="col-md-8">
|
<div class="col-md-8">
|
||||||
{# <p class="form-control-plaintext">{{ user.email }}</p>#}
|
{# <p class="form-control-plaintext">{{ user.email }}</p>#}
|
||||||
<a class="form-control-link" href="mailto:{{ user.email }}">{{ user.email }}</a>
|
<a class="form-control-plaintext" href="mailto:{{ user.email }}">{{ user.email }}</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group row">
|
<div class="form-group row">
|
||||||
|
|
|
||||||
|
|
@ -2655,13 +2655,6 @@ core-util-is@~1.0.0:
|
||||||
resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85"
|
resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85"
|
||||||
integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==
|
integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==
|
||||||
|
|
||||||
corejs-typeahead@^1.2.1:
|
|
||||||
version "1.3.1"
|
|
||||||
resolved "https://registry.yarnpkg.com/corejs-typeahead/-/corejs-typeahead-1.3.1.tgz#26b9b158cba7f123556c74068bffce9356505bd3"
|
|
||||||
integrity sha512-fyNlBNWJNL6EQUnJyAunEzBzRcwR2cEHtZXBi2pndHPOJ/wpOf3wbS+/Oh+kYYS5sKowQcs0LFwMSl6Y2Xeqkw==
|
|
||||||
dependencies:
|
|
||||||
jquery ">=1.11"
|
|
||||||
|
|
||||||
cosmiconfig@^7.0.0:
|
cosmiconfig@^7.0.0:
|
||||||
version "7.1.0"
|
version "7.1.0"
|
||||||
resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.1.0.tgz#1443b9afa596b670082ea46cbd8f6a62b84635f6"
|
resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-7.1.0.tgz#1443b9afa596b670082ea46cbd8f6a62b84635f6"
|
||||||
|
|
@ -4188,7 +4181,7 @@ jest-worker@^29.1.2:
|
||||||
merge-stream "^2.0.0"
|
merge-stream "^2.0.0"
|
||||||
supports-color "^8.0.0"
|
supports-color "^8.0.0"
|
||||||
|
|
||||||
jquery@>=1.11, jquery@>=1.7, jquery@^3.5.1:
|
jquery@>=1.7, jquery@^3.5.1:
|
||||||
version "3.6.1"
|
version "3.6.1"
|
||||||
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.6.1.tgz#fab0408f8b45fc19f956205773b62b292c147a16"
|
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.6.1.tgz#fab0408f8b45fc19f956205773b62b292c147a16"
|
||||||
integrity sha512-opJeO4nCucVnsjiXOE+/PcCgYw9Gwpvs/a6B1LL/lQhwWwpbVEVYDZ1FokFr8PRc7ghYlrFPuyHuiiDNTQxmcw==
|
integrity sha512-opJeO4nCucVnsjiXOE+/PcCgYw9Gwpvs/a6B1LL/lQhwWwpbVEVYDZ1FokFr8PRc7ghYlrFPuyHuiiDNTQxmcw==
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue