kivitendo/css/less/scaffolding.less @ 24921dda
| 00462921 | Hans P. Schlaepfer | /* ------------------------------------------------------------- */
|
||
/* SCAFFOLDING (scaffolding.less) */
|
||||
/* ------------------------------------------------------------- */
|
||||
| b6b30e72 | Hans Peter Schlaepfer | // ----------------------------------------------------------------------------
|
||
//
|
||||
// SCAFFOLDING (PAGE & PAGE COMPONENTS)
|
||||
//
|
||||
// ----------------------------------------------------------------------------
|
||||
// DESCRIPTION:
|
||||
// All main components of a Kivitendo page are defined here
|
||||
// but not in all details. See therefore in the mentioned specialized
|
||||
// LESS-files
|
||||
//
|
||||
//
|
||||
// CONTENTS:
|
||||
// - BODY
|
||||
// - FRAME-HEADER
|
||||
// - MENUV3
|
||||
// - LAYOUT-ACTIONBAR
|
||||
// - CONTENT
|
||||
// - COLUMNS
|
||||
// - SINGLE COLUMN
|
||||
// - WRAPPER POSITIONS-TABLE (FULL-WIDTH)
|
||||
// - DIVERS COMPONENTS (General Wrapper)
|
||||
// - MEDIA: Print
|
||||
// ----------------------------------------------------------------------------
|
||||
// --------------------------------------
|
||||
// BODY
|
||||
// --------------------------------------
|
||||
body {
|
||||
margin: 0 ;
|
||||
color: @brand-primary ;
|
||||
font-family: @font-family-sans-serif;
|
||||
| 00462921 | Hans P. Schlaepfer | font-size: @font-size-smaller ;
|
||
| b6b30e72 | Hans Peter Schlaepfer | |||
| 00462921 | Hans P. Schlaepfer | // background-color: @body-bg;
|
||
.bg-body ;
|
||||
| b6b30e72 | Hans Peter Schlaepfer | |||
// --------------------------------------
|
||||
// Frame-Header
|
||||
// --------------------------------------
|
||||
// Quicksearch, User, Client, Logout
|
||||
// see also frame-header.less
|
||||
#frame-header{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: @zindex-dashboard;
|
||||
}
|
||||
// --------------------------------------
|
||||
// MENUV3
|
||||
// --------------------------------------
|
||||
// admin section &
|
||||
& #menuv3:first-child{
|
||||
top: 0 !important;
|
||||
}
|
||||
// see also menu.less
|
||||
#menuv3 {
|
||||
position: fixed;
|
||||
z-index: @zindex-navbar;
|
||||
top: 28px ;
|
||||
width: 100%;
|
||||
height: 32px;
|
||||
}
|
||||
// --------------------------------------
|
||||
// LAYOUT-ACTIONBAR
|
||||
// --------------------------------------
|
||||
// see also menu_actionbar.less
|
||||
.layout-actionbar {
|
||||
display: block;
|
||||
z-index: @zindex-actionbar;
|
||||
position: fixed;
|
||||
| 00462921 | Hans P. Schlaepfer | //float: left !important;
|
||
float: right !important;
|
||||
| b6b30e72 | Hans Peter Schlaepfer | width: auto;
|
||
top: 68px ;
|
||||
| 00462921 | Hans P. Schlaepfer | //left: 656px ;
|
||
| b6b30e72 | Hans Peter Schlaepfer | right: 0.2em ;
|
||
margin: 0 0.4em 0 0;
|
||||
padding: 0;
|
||||
background: none;
|
||||
& ~ div:first {
|
||||
padding-top: 25px;
|
||||
}
|
||||
& > div + div {
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
// --------------------------------------
|
||||
// CONTENT
|
||||
// --------------------------------------
|
||||
| 00462921 | Hans P. Schlaepfer | //& > #content {
|
||
& #content {
|
||||
| b6b30e72 | Hans Peter Schlaepfer | overflow: hidden;
|
||
display: block;
|
||||
padding: @content-padding;
|
||||
margin: @content-margin;
|
||||
| 00462921 | Hans P. Schlaepfer | |||
.bg-content ;
|
||||
| b6b30e72 | Hans Peter Schlaepfer | |||
| 00462921 | Hans P. Schlaepfer | // --------------------------------------
|
||
// UI-TABS-PANEL
|
||||
// --------------------------------------
|
||||
.ui-tabs-panel {
|
||||
//background-color: @tabs-bg;
|
||||
}
|
||||
| b6b30e72 | Hans Peter Schlaepfer | |||
// --------------------------------------
|
||||
// Wrapper & Columns
|
||||
// --------------------------------------
|
||||
// PENDENT: .cols-no-padding???
|
||||
.wrapper{
|
||||
clear: both;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
| 00462921 | Hans P. Schlaepfer | width: 99%;
|
||
| b6b30e72 | Hans Peter Schlaepfer | height: auto;
|
||
| 00462921 | Hans P. Schlaepfer | |||
// -----------------------
|
||||
// Colums (.col)
|
||||
// -----------------------
|
||||
// Single Column (DIV or HORIZONTAL TABLE .tbl-horizontal)
|
||||
| b6b30e72 | Hans Peter Schlaepfer | & > .col {
|
||
display: block;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
margin-right: 1.6em;
|
||||
div label {
|
||||
font-size: 10pt;
|
||||
line-height: 12.6pt;
|
||||
}
|
||||
p { font-size: @font-size-small }
|
||||
| 00462921 | Hans P. Schlaepfer | } // /.col
|
||
| b6b30e72 | Hans Peter Schlaepfer | & > .col,
|
||
& > .tbl-horizontal{
|
||||
float: left;
|
||||
margin-right: 1.6em;
|
||||
| 00462921 | Hans P. Schlaepfer | padding-bottom: 2px ; // required to avoid crops of buttons
|
||
| b6b30e72 | Hans Peter Schlaepfer | }
|
||
| 00462921 | Hans P. Schlaepfer | // & > .tbl-horizontal:last-child{
|
||
// margin-right: 0 !important ;
|
||||
// }
|
||||
| b6b30e72 | Hans Peter Schlaepfer | // Centered Column
|
||
&.center{
|
||||
margin: 0 auto;
|
||||
display: table;
|
||||
width: auto;
|
||||
}
|
||||
// PENDENT: anschauen
|
||||
&.width-moderate{
|
||||
width: auto;
|
||||
}
|
||||
| 00462921 | Hans P. Schlaepfer | |||
& > table.tbl-horizontal:last-child{
|
||||
margin-right: 0 !important ;
|
||||
}
|
||||
} // /.wrapper
|
||||
| b6b30e72 | Hans Peter Schlaepfer | |||
} // /#content
|
||||
// --------------------------------------
|
||||
// WRAPPER POSITIONS-TABLE (FULL-WIDTH)
|
||||
// --------------------------------------
|
||||
// Special Container with Full-Width-Table (Positions) and Show/Hide-Buttons
|
||||
// PENDENT: woanders plazieren
|
||||
.full-width {
|
||||
width: 100% ;
|
||||
padding: 0 0 1.0em 0 ;
|
||||
margin: 0 0 0 0;
|
||||
// Use this Selector on the same Level for Show/Hide Details-Buttons
|
||||
// Edit these Buttons in tables.less
|
||||
// PENDENT: vielleicht anders loesen
|
||||
&.positions{ }
|
||||
}
|
||||
// zentrierte Elemente
|
||||
// PENDENT: braucht es das?
|
||||
div.center{
|
||||
margin: 0 auto;
|
||||
display: table;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
// /body
|