/** DASHBOARD **/ .module-index body{ background-color: #f5f5f5; } /* Conteneur principal du plugin dashboard */ .dashboard { } .dashboard-widget-log,.dashboard-widget-log li{ list-style-type: none; margin: 0; padding: 5px; border-bottom: 1px solid #f1f1f1; } .dashboard-widget-log{ padding:0 15px 15px 15px; } .dashboard-widget-log li { font-size: 11px; } .dashboard-widget-log li >h2{ font-size: 14px; margin-top: 15px; padding: 3px 0 3px 0; border-bottom: 2px solid #cecece; } /** DASHBOARD **/ .widget[data-mandatory] { border-left: 0px; } .widget .readonly-veil{ width:100%; height:100%; position:absolute; top:0; left:0; opacity: 0.5; background-color: #ffffff; border-radius: 10px; z-index: 100; } .widget[data-mandatory="1"] .widget_resize,.widget[data-mandatory="1"] .widget_header{ cursor: default; } .widget[data-mandatory="1"] .widget_options{ display: none; } .dashboard-container.readonly .dashboard-widget-menu, .dashboard-container.readonly .widget_options,.dashboard-container.readonly .widget_resize{ display: none; } .dashboard-container.readonly .widget_header{ cursor:default; } #dashboardForm #icon{ font-family:"Font Awesome 5 Free"; } #widget-list{ width: 100%; display: block; overflow-y: auto; padding: 5px; } #dashboard{ list-style-type:none; margin:0; padding:0; } #dashboard > li{ float:left; } #dashboard-view{ width: 50px; background-color: #343a40; list-style-type: none; color: #505050; margin: 0; padding: 0; min-height: 100%; position: fixed; left: 0; top: 50px; border-top: 4px solid #454a4e; } #dashboard-view li{ cursor:pointer; text-align: center; font-size: 1.3em; transition:background 0.2s ease-in-out; } #dashboard-view li.dashboard-view-title{ color: #cecece; font-size: 11px; cursor: default; background-color: #475058; font-weight: bold; } #dashboard-view li.dashboard-item{ width: 50px; position: relative; padding: 10px; transition: padding-bottom 0.2s ease-in-out; } #dashboard-view li.dashboard-item > div{ padding-top: 0.15rem; display: flex; width: 30px; height: 30px; z-index: 10; background-color: #fafafa; border-radius: 100%; text-align: center; border: 2px solid #fafafa; transition: all 0.2s ease-in-out; } #dashboard-view li.dashboard-item i { margin: auto; font-size: 0.7em; transition: all 0.2s ease-in-out; } #dashboard-view li.dashboard-item:hover{ padding-bottom: 20px; } #dashboard-view li.dashboard-item span { transform: translateY(-25px); font-size: 9px; position: absolute; left: 0; bottom: 5px; color: #808a94; text-transform: uppercase; display: block; width: 100%; text-align: center; font-weight: bold; overflow: hidden; text-overflow: ellipsis; opacity: 0; z-index: 1; transition: all 0.2s ease-in-out; } #dashboard-view li.dashboard-item:hover span { transform: translateX(0px); opacity: 1; } #dashboard-view li:hover{ background-color: #475058; transition: background-color 0.2s ease-in-out, padding-bottom 0.2s ease-in-out; } #dashboard-view li[data-selected] > div{ background-color: #1d1d1d; border-color: #1d1d1d; border-top: 2px solid #dc3545; color: #fafafa; } .widget_placeholder{ display: block; width: auto; background: rgba(0,0,0,0.1); height: 335px; margin-top: 20px; border-radius: 10px; border: 2px dashed #cecece; transition: all 0.2s linear 0s; } .widget{ transition: width 0.2s linear,height 0.2s linear,opacity 0.2s linear; /*display: table;*/ padding:20px; transition: transform 0.2s ease-in-out,max-width 0.2s ease-in-out; } .widget.ui-sortable-helper{ transform: scale(1.05); } .widget_window{ border-radius: 10px; box-shadow: 0 0 20px 0 #cecece!important; padding: 0; text-align: left; transition: opacity 0.2s linear 0s; z-index: 100; position: relative; } .widget_resize{ position: absolute; height: 100%; cursor: ew-resize; width:5px; top:0px; right:0px; z-index: 100; } .widget_header{ background-color: #50597b; padding: 5px; border-radius: 10px 10px 0 0; box-sizing: border-box; color: #ffffff; cursor: move; transition:background 0.2s linear; } .widget_header > i { display: inline-block; } .widget_options{ float: right; margin: -5px 0 0 10px; padding: 0; } .widget_options li{ cursor: pointer; display: inline-block; opacity: 0.5; padding: 5px; transition: opacity 0.2s linear 0s; vertical-align: top; } .widget_options li:hover{ opacity: 1; } .widget_content{ background-color: #ffffff; border-top:0; overflow:auto; border-radius: 0 0 10px 10px; width:100%; height:300px; padding: 0px; } .widget_content::-webkit-scrollbar { width: 6px; height: 6px; } .widget_content::-webkit-scrollbar-button { width: 0px; height: 0px; } .widget_content::-webkit-scrollbar-thumb { background: #cecece; border: 0px none #ffffff; border-radius: 50px; } .widget_content::-webkit-scrollbar-thumb:hover { background: #707070; } .widget_content::-webkit-scrollbar-thumb:active { background: #949494; } .widget_content::-webkit-scrollbar-track { background: transparent; border: 0px none #ffffff; border-radius: 50px; } .widget_content::-webkit-scrollbar-track:hover { background: #d4d4d4; } .widget_content::-webkit-scrollbar-track:active { background: #d3d3d3; } .widget_content::-webkit-scrollbar-corner { background: transparent; } .dashboard-container{ padding: 10px 0 0 0; } .dashboard-widget-menu{ margin: 0 0 0 15px; padding: 0; } .dashboard-widget-menu li{ list-style-type: none; color:#cecece; display: inline-block; cursor: pointer; padding:5px; } .dashboard-widget-menu li { opacity:0.5; display: inline-block; transition : all 0.2s ease-in-out; } .dashboard-widget-menu li:hover { opacity:1; } .widgetDescription{ } .widgetColor{ display: inline-block; vertical-align: top; padding-right: 5px; color:#333333; } .widgetColor small{ width:15px; height:15px; border-radius: 100%; display: inline-block; margin-right: 5px; margin-top: 4px; vertical-align: top; } @media only screen and (max-width: 500px) { .widget_dropper{ display: none; } .widget,.widget_window{ display: block; width:100%; } }