asb_cloud_front/src/styles/drilling_program.less

147 lines
3.2 KiB
Plaintext
Raw Normal View History

@border-style: 1px solid #f0f0f0;
@header-bg: #fafafa;
@content-bg: white;
@approve-users-flex-width: 6;
@approve-panel-flex-width: 3;
.ml-15 { margin-left: 15px; }
.mv-5 { margin: 5px 0; }
.drilling_category {
margin-top: 10px;
border: @border-style;
> .category_header {
padding: 5px;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: @border-style;
background-color: @header-bg;
> h3 {
margin: 0;
}
> div > * {
margin-left: 5px;
}
}
> .category_content {
display: flex;
> div {
display: flex;
align-items: stretch;
background-color: @content-bg;
.drilling-category-column();
}
> .file_column {
> .file_info {
flex: 10;
display: flex;
flex-direction: column;
align-items: flex-start;
}
> .file_actions {
flex: 2;
display: flex;
flex-direction: column;
}
}
}
}
.approve_column {
> .user_list {
display: flex;
flex-wrap: wrap;
flex: @approve-users-flex-width;
> span { margin: 5px 10px; }
}
> .approve_list,
> .reject_list {
display: flex;
flex-direction: column;
flex: @approve-panel-flex-width;
margin: 0 5px;
> .panel {
display: flex;
flex-direction: column;
padding: 10px;
flex-grow: 1;
> .panel_title {
margin: 5px;
font-weight: 800;
}
> .panel_content {
display: flex;
justify-content: flex-end;
flex-direction: column-reverse;
align-items: stretch;
flex-grow: 1;
> div {
display: flex;
align-items: center;
justify-content: space-between;
}
}
}
}
> .approve_list > .panel {
background-color: #EFFEEF;
border: 1px solid #1FB448;
}
> .reject_list > .panel {
background-color: #FEF2EF;
border: 1px solid #B4661F;
}
}
.history_approve_column {
.approve_column();
display: flex;
justify-content: space-between;
align-items: stretch;
}
.category_adder {
display: flex;
margin: 5px;
> .adder_select {
flex-grow: 1;
margin-right: 5px;
}
}
.drilling_program {
border: @border-style;
border-top: 0;
.program_header {
.drilling_category > .category_header();
}
}
/** Миксин для столбцов сетки (размер, отступы, границы) */
.drilling-category-column(@first: 4, @last: 8, @padding: 5px 10px) {
padding: @padding;
&:first-child { flex: @first; } // Относительная ширина первого столбца
&:last-child { flex: @last; } // Относительная ширина второго столбца
&:not(:last-child) { border-right: @border-style; }
}