kivitendo/css/less/requirement_spec.less @ d8f96009
00462921 | Hans P. Schlaepfer | /* ------------------------------------------------------------- */
|
||
/* REQUIREMENT SPEC (requirement_spec.less) */
|
||||
/* ------------------------------------------------------------- */
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // ------------------------------------------------------------
|
||
// General page layout
|
||||
// ------------------------------------------------------------
|
||||
// -----------------------
|
||||
// Requirement Spec Version (Title)
|
||||
// -----------------------
|
||||
#requirement_spec_version{
|
||||
padding: @contentbox-padding;
|
||||
letter-spacing: 0.16em ;
|
||||
font-size: 110% ;
|
||||
}
|
||||
// --------------------------------------
|
||||
// COLUMN-CONTAINER
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | #column-container {
|
||
//width: 100%;
|
||||
00462921 | Hans P. Schlaepfer | padding-left: 0;
|
||
padding-right: 0;
|
||||
margin-left: 0;
|
||||
margin-top: 0.2em ;
|
||||
margin-right: 0;
|
||||
overflow: hidden ;
|
||||
// --------------------------------------
|
||||
// TREE COLUMN (LEFT, JS-TREE)
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
#tree-column {
|
||||
00462921 | Hans P. Schlaepfer | float: left;
|
||
width: 30em;
|
||||
padding: 0.3em 1.2em 2.0em 0.8em;
|
||||
border-right: 1px #000 solid;
|
||||
//background-color: @gray-superlight;
|
||||
background-color: none;
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
.jstree {
|
||||
00462921 | Hans P. Schlaepfer | & > ul {
|
||
width: 342px;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | ul li {
|
||
00462921 | Hans P. Schlaepfer | line-height: 1.8em;
|
||
padding: 0 ;
|
||||
font-size: 10pt;
|
||||
a {
|
||||
border-bottom: none;
|
||||
width: 98% ;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
00462921 | Hans P. Schlaepfer | } // /.jstree
|
||
// Special things that apply to the tree
|
||||
#tree li.flagged > a > ins {
|
||||
background-image: url("../image/flag-red.png") !important;
|
||||
background-position: 0;
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
00462921 | Hans P. Schlaepfer | |||
} // /#tree-column
|
||||
// --------------------------------------
|
||||
// CONTENT COLUMN (RIGHT, EDITING)
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | #content-column {
|
||
00462921 | Hans P. Schlaepfer | float: left;
|
||
width: 58em;
|
||||
padding-left: 3.0em;
|
||||
//background-color: @gray-superlight;
|
||||
background-color: none;
|
||||
// just nice to have this helpful container :-)
|
||||
#column-content {
|
||||
// --------------------------------------
|
||||
// SECTIONS
|
||||
// --------------------------------------
|
||||
.section {
|
||||
border-left: 0;
|
||||
margin-left: 0;
|
||||
.section-header{
|
||||
display: block ;
|
||||
overflow: hidden;
|
||||
width: 90% ;
|
||||
h3 {
|
||||
font-size: 140%;
|
||||
letter-spacing: 0.16em;
|
||||
span.label {
|
||||
font-size: 90% ;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0.1em;
|
||||
color: @brand-dark;
|
||||
}
|
||||
} // /h3
|
||||
.section-description {
|
||||
margin-bottom: 15px;
|
||||
margin-left: 0;
|
||||
div{
|
||||
padding: 0.3em 0 0.4em 0;
|
||||
.section-description-heading {
|
||||
font-weight: normal;
|
||||
font-size: 100% ;
|
||||
/* margin: 0 0 1.2em 0; */
|
||||
padding: 0 0 0.0em 0;
|
||||
display: block;
|
||||
}
|
||||
span.label{
|
||||
font-size: 90%;
|
||||
}
|
||||
p {
|
||||
color: #000;
|
||||
font-size: 106%;
|
||||
line-height: 1.5em;
|
||||
margin: 0 0 0.3em 0;
|
||||
}
|
||||
} // /div
|
||||
} // /.section-description
|
||||
.section-context-menu {
|
||||
h3{
|
||||
background-color: #000;
|
||||
color: #000 !important ;
|
||||
span.label { font-weight: normal;}
|
||||
}
|
||||
div.section-description {
|
||||
div{
|
||||
span.label section-description-heading {}
|
||||
}
|
||||
}
|
||||
span.label { }
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | #section-list-empty{
|
||
border: 1px #0C42FF solid ;
|
||||
background-color: #BBCDFF ;
|
||||
padding: 0.6em ;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | }
|
||
// /.section-header
|
||||
} // /.section
|
||||
// --------------------------------------
|
||||
// FUNCTION BLOCKS
|
||||
// --------------------------------------
|
||||
.function-block {
|
||||
border-top: 1px solid #bbb;
|
||||
margin: 0 ;
|
||||
padding: 0.8em 0 1.8em 0 ;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
clear: both;
|
||||
float: none;
|
||||
width: 48em;
|
||||
.function-block-content{
|
||||
overflow: hidden ;
|
||||
padding: 0 0 0 0.6em;
|
||||
.function-block-header {
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
.function-block-number {
|
||||
font-weight: normal;
|
||||
width: 5.0em ;
|
||||
display: block;
|
||||
float: left;
|
||||
}
|
||||
.function-block-desc {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
width: 80%;
|
||||
padding-bottom: 1.0em ;
|
||||
//font-size: 90% ;
|
||||
font-weight: normal;
|
||||
p {
|
||||
margin: 0 0 0.6em 0;
|
||||
padding: 0 ;
|
||||
}
|
||||
p:first-child {
|
||||
font-weight: bold ;
|
||||
}
|
||||
}
|
||||
} // /.function-block-header
|
||||
.function-block-properties {
|
||||
display: block ;
|
||||
margin: 0 0 0 5.0em;
|
||||
padding: 0 ;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
font-size: 9pt;
|
||||
span.label,
|
||||
span.value {
|
||||
float: left;
|
||||
}
|
||||
//vertical adjustment
|
||||
span.label { width: 110px ;}
|
||||
span.value {
|
||||
width: 200px;
|
||||
padding: 0 30px 0 0;
|
||||
margin: 0;
|
||||
}
|
||||
// horizontal adjustment
|
||||
// &.list > div {
|
||||
// width: 300px ;
|
||||
// float: left;
|
||||
// display: inline-block ;
|
||||
// span.label { }
|
||||
// span.value {
|
||||
// padding: 0 30px 0 0;
|
||||
// margin: 0;
|
||||
// }
|
||||
// }
|
||||
} // /.function-block-properties
|
||||
} // /.function-block-content
|
||||
// --------------------------------------
|
||||
// FUNCTION BLOCKS
|
||||
// --------------------------------------
|
||||
.sub-function-block-container {
|
||||
margin: 1.8em 0 0 5.1em;
|
||||
display: block;
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | .sub-function-block-header{
|
||
border-top: 1px solid #ccc;
|
||||
padding: 0.4em 0 0.4em 0.6em ;
|
||||
font-size: 86% ;
|
||||
letter-spacing: 0.2em;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | .sub-function-block {
|
||
border-top: 1px solid #ccc;
|
||||
margin: 0.2em 0 0.2em 0;
|
||||
padding: 0.2em 0 0.4em 0 ;
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | .sub-function-block-content {
|
||
margin: 0.2em 0 0.2em 0;
|
||||
padding: 0.2em 0.6em 0.4em 0.6em;
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | .sub-function-block-header {
|
||
font-weight: normal;
|
||||
font-size: 120% ;
|
||||
color: @gray-dark;
|
||||
margin-top: 1.0em ;
|
||||
}
|
||||
}
|
||||
}// /.sub-function-block
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | } // /.sub-function-block-container
|
||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | } // /.function-block
|
||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // --------------------------------------
|
||
// FUNCTION BLOCK FORM
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // Form for creating or editing function blocks
|
||
.function-block-form {
|
||||
&> div { padding: 0.4em; }
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | input.rs_input_field,
|
||
select.rs_input_field,
|
||||
table.rs_input_field input[type=text],
|
||||
table.rs_input_field input[type=password],
|
||||
table.rs_input_field select { }
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | } // /.function-block-form
|
||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | |||
// --------------------------------------
|
||||
// FLAGGED SECTIONS & BLOCKS
|
||||
// --------------------------------------
|
||||
// Flagged sections, function blocks, text blocks
|
||||
.section.flagged .section-description,
|
||||
.function-block.flagged,
|
||||
.sub-function-block.flagged {
|
||||
background-color: @color-blue-light;
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
00462921 | Hans P. Schlaepfer | // Flagged headings or numbers
|
||
.section.flagged .section-description > .section-description-heading,
|
||||
.function-block.flagged > .function-block-content > div > .function-block-number,
|
||||
.sub-function-block.flagged > .sub-function-block-content > div > .function-block-number {
|
||||
//background-color: #fe5f14;
|
||||
color: @color-blue-strong;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // --------------------------------------
|
||
// SELECTION
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // Selected sections, function blocks, text blocks
|
||
.section.selected,
|
||||
.function-block.selected,
|
||||
.sub-function-block.selected {
|
||||
margin-left: -3px;
|
||||
border-left: 3px solid #24D115; // PENDENT: GREEN STRONG
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
00462921 | Hans P. Schlaepfer | } // /#column-content
|
||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | } // /#content-column
|
||
} // /#column-container
|
||||
.section-empty-description { color: #bbb; }
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // --------------------------------------
|
||
// CONTEXT MENU
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // Have a look on jquery-ui.less
|
||
//.context-menu-item.icon-flag { background-image: url("../image/flag-red.png"); }
|
||||
//.context-menu-item.icon-close { background-image: url("../image/document-close.png"); }
|
||||
//.context-menu-item.icon-save { background-image: url("../image/document-save.png"); }
|
||||
//.context-menu-item.icon-revert { background-image: url("../image/edit-undo.png"); }
|
||||
//.context-menu-item.icon-pdf { background-image: url("../image/application-pdf.png"); }
|
||||
//.context-menu-item.icon-html { background-image: url("../image/text-html.png"); }
|
||||
//.context-menu-item.icon-add-picture { background-image: url("../image/add-picture.png"); }
|
||||
//.context-menu-item.icon-download { background-image: url("../image/download.png"); }
|
||||
//.context-menu-item.icon-renumber { background-image: url("../image/format-list-ordered.png"); }
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | // --------------------------------------
|
||
// TABWIDGET (Tabs)
|
||||
// --------------------------------------
|
||||
#requirement_spec_tabs{
|
||||
#function-blocks-tab{
|
||||
margin-top: 1.4em ;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
00462921 | Hans P. Schlaepfer | |||
// --------------------------------------
|
||||
// Text blocks
|
||||
// --------------------------------------
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
.requirement-spec-text-block {
|
||||
border-left: 0;
|
||||
margin-left: 3px;
|
||||
margin-top: 10px;
|
||||
00462921 | Hans P. Schlaepfer | & > h2 { margin-top: 0px; }
|
||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | &.flagged {
|
||
//background-color: #feece3;
|
||||
// border: 1px solid #fe5f14;
|
||||
&> h2 {
|
||||
//background-color: #fe5f14;
|
||||
color: #fff;
|
||||
}
|
||||
} // /.flagged
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
00462921 | Hans P. Schlaepfer | &.selected {
|
||
border-left: 3px solid #cbb120;
|
||||
margin-left: 0;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | |||
}
|
||||
.requirement-spec-text-block-picture-thumbnail {
|
||||
border-radius: 5px;
|
||||
00462921 | Hans P. Schlaepfer | border: 2px solid #ebebeb;
|
||
float: left;
|
||||
margin-right: 20px;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
width: 130px;
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
.requirement-spec-text-block-picture-thumbnail-img-container {
|
||||
00462921 | Hans P. Schlaepfer | height: 64px;
|
||
margin: auto;
|
||||
b6b30e72 | Hans Peter Schlaepfer | padding: 0;
|
||
00462921 | Hans P. Schlaepfer | width: 64px;
|
||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
.requirement-spec-text-block-picture-thumbnail.selected {
|
||||
border: 2px solid #cbb120;
|
||||
}
|
||||
00462921 | Hans P. Schlaepfer | // ------------------------------------------------------------
|
||
// TIME/COST ESTIMATION (TABLE)
|
||||
// ------------------------------------------------------------
|
||||
#time_cost_estimate {
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
table tbody tr {
|
||||
td {
|
||||
vertical-align: top ;
|
||||
}
|
||||
td:first-child { width: 66% ; }
|
||||
// special rows
|
||||
&.section th {
|
||||
line-height: 2.2em ;
|
||||
//background-color: @brand-standard;
|
||||
color: @brand-superdark ;
|
||||
b {
|
||||
font-size: 116% ;
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
}
|
||||
00462921 | Hans P. Schlaepfer | &.subtotal {
|
||
td, th {
|
||||
font-weight: bold ;
|
||||
background-color: @gray-standard; // PENDENT: ZEBRA
|
||||
border-top: 1px @brand-superdark solid ;
|
||||
border-bottom: 1px @brand-superdark solid ;
|
||||
text-align: right;
|
||||
}
|
||||
b6b30e72 | Hans Peter Schlaepfer | }
|
||
}
|
||||
00462921 | Hans P. Schlaepfer | }
|
||
b6b30e72 | Hans Peter Schlaepfer | |||
// --------------------------------------
|
||||
// TABLES in Requirement Specs
|
||||
// --------------------------------------
|
||||
div.function-block * table.tbl-horizontal td {
|
||||
font-size: 66% !important ;
|
||||
}
|
||||
00462921 | Hans P. Schlaepfer | |||
// --------------------------------------
|
||||
// OVERRIDES
|
||||
// --------------------------------------
|
||||
.jstree-requirement-spec .jstree-clicked {
|
||||
background: @gray-lighter !important;
|
||||
border: 0 !important;
|
||||
}
|