%PDF- %PDF-
| Direktori : /home/bitrix/www/bitrix/components/bitrix/bizproc.workflow.faces/templates/.default/ |
| Current File : /home/bitrix/www/bitrix/components/bitrix/bizproc.workflow.faces/templates/.default/style.css |
/* >>> bizproc.workflow.faces */
.bp-short-process {
white-space: nowrap;
}
.bp-short-process-steps {
position: relative;
display: inline-block;
border: 2px solid #edeef0;
border-radius: 3px;
padding: 0 17px 0;
}
.bp-short-process-steps .bp-short-process-finished {
position: relative;
display: block;
font-size: 12px;
padding: 0 5px 0 26px;
z-index: 1;
color: #000;
height: 14px;
margin-top: -7px;
}
.bp-short-process-steps .bp-short-process-finished span {
margin: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
left: 24px;
right: 0;
position: absolute;
z-index: 999;
line-height: 14px;
}
.bp-short-process-steps .bp-short-process-finished span span {
position: static;
background: #fff;
padding: 0 5px 0 0;
}
.bp-short-process-steps .bp-short-process-finished:before {
content: '';
background: url(images/bp-sprite.png) no-repeat 0 -101px;
position: absolute;
top: 0;
bottom: 0;
width: 26px;
height: 26px;
left: -3px;
margin: auto;
}
.bp-short-process-steps .bp-short-process-finished.process-finished-ready:before {
background-position: 0 -130px;
}
.bp-short-process.alone .bp-short-process-steps
{
border-color: transparent;
padding-right: 0;
}
.bp-short-process-step-wrapper {
display: inline-block;
vertical-align: middle;
position: relative;
width: 14%;
}
a.process-step-more {
position: absolute;
display: block;
border-bottom: 1px dashed;
color: #535c69;
font-weight: bold;
margin-top: -10px;
font-size: 13px;
text-align: center;
}
.bp-short-prosess-steps-arrow .process-step-more:hover {
border-bottom: 1px dashed transparent;
}
.bp-short-process-step {
position: relative;
display: inline-block;
vertical-align: middle;
height: 43px;
width: 43px;
border: 1px solid #fff;
border-radius: 50%;
box-shadow: 0 0 0 3px #9299a3;
margin: 12px 0 16px;
}
.bp-short-process-step-wrapper .bp-short-process-step:hover,
.bp-short-process-steps .bp-short-process-step-firs:hover
{
border-bottom: 1px solid transparent;
}
.bp-short-process-step-inner {
position: relative;
overflow: hidden;
border-radius: 50%;
width: 100%;
height: 100%;
display: block;
line-height: 43px;
background: #525b69 url(images/bp-sprite.png) no-repeat -17px -496px;
}
.bp-short-process-step img {
width: 43px;
height: 43px;
border-radius: 50%;
margin: auto;
vertical-align: middle;
}
.bp-short-process-step:after {
content: '';
position: absolute;
width: 18px;
height: 18px;
background: url(images/bp-sprite.png) no-repeat 0 -79px;
top: 32px;
left: 31px;
border-radius: 50%;
}
.bp-short-process-step.bp-short-process-step-firs:after {
display: none;
}
.bp-short-process-step.bp-short-process-step-ready:after {
background-position: 0 -36px;
}
.bp-short-process-step.bp-short-process-step-cancel:after {
background-position: 0 -57px;
}
.bp-short-process-step.bp-short-process-step-firs {
box-shadow: 0 0 0 3px #1ec6f9;
}
.bp-short-process-step.bp-short-process-step-ready {
box-shadow: 0 0 0 3px #a3d600;
}
.bp-short-process-step.bp-short-process-step-cancel {
box-shadow: 0 0 0 3px #f73200;
}
.bp-short-process-step.bp-short-process-step-more {
box-shadow: 0 0 0 3px #9299a3, 2px 0 0 3px #fff, 5px 0 0 3px #b0b5bc, 7px 0 0 3px #fff, 10px 0 0 3px #c8ccd2;
margin-right: 13px;
}
.bp-short-process-step-ready.bp-short-process-step-more {
box-shadow: 0 0 0 3px #a3d600, 2px 0 0 3px #fff, 5px 0 0 3px #b0b5bc, 7px 0 0 3px #fff, 10px 0 0 3px #c8ccd2;
}
.bp-short-process-step-cancel.bp-short-process-step-more {
box-shadow: 0 0 0 3px #f73200, 2px 0 0 3px #fff, 5px 0 0 3px #b0b5bc, 7px 0 0 3px #fff, 10px 0 0 3px #c8ccd2;
}
.bp-short-prosess-steps-arrow {
position: relative;
display: inline-block;
vertical-align: middle;
text-align: center;
width: 48px;
font-size: 13px;
font-weight: bold;
color: #535c69;
padding-top: 25px;
}
.bp-short-prosess-steps-arrow.bp-short-prosess-steps-arrow-ready {
width: 66px;
}
.bp-short-process-steps .bp-short-prosess-steps-arrow {
width: 66px
}
.bp-short-process-steps .bp-short-prosess-steps-arrow .process-step-more {
color: #7daa00;
}
.bp-short-prosess-steps-arrow .process-step-more {
color: #535c69;
position: relative;
display: inline;
}
.bp-short-prosess-steps-arrow:after,
.bp-short-prosess-steps-arrow.steps-arrow-right-right:before,
.bp-short-prosess-steps-arrow.steps-arrow-left-right:before {
content: '';
position: absolute;
width: 18px;
height: 12px;
background: url(images/bp-sprite.png) no-repeat -27px -36px;
left: 0;
right: 0;
bottom: 0;
top: 0;
margin: auto;
}
.bp-short-prosess-steps-arrow.bp-short-prosess-steps-arrow-ready:after {
background-position: -27px -21px;
}
.bp-short-prosess-steps-arrow.steps-arrow-right-right:before,
.bp-short-prosess-steps-arrow.steps-arrow-left-right:before {
bottom: auto;
}
.bp-short-prosess-steps-arrow.steps-arrow-right-right:after,
.bp-short-prosess-steps-arrow.steps-arrow-left-right:after {
top: auto;
bottom: 0;
}
.bp-short-prosess-steps-arrow.steps-arrow-left-right:before {
background-position: -27px -49px;
}
.bp-short-process.alone .bp-short-prosess-steps-arrow-running
{
width: 66px;
}
.process-step-more-complete,
.process-step-more-running
{
background: #fff;
border: 0;
padding: 0 5px;
border: none !important;
}
.process-step-more-complete
{
color: #7daa00 !important;
}
.process-step-more-complete span
{
border-bottom: 1px dashed;
}
.bp-popup-parallel {
display: inline-block;
border-radius: 1px;
width: 215px;
padding: 5px 0;
background: #fff;
}
.bp-popup-parallel a {
display: block;
margin: 3px 0;
padding: 2px 12px;
height: 27px;
}
.bp-popup-parallel a:hover
{
background-color: #F5F7F8;
}
.bp-popup-parallel-avatar {
position: relative;
display: inline-block;
vertical-align: middle;
height: 25px;
width: 25px;
border: 1px solid #fff;
border-radius: 50%;
box-shadow: 0 0 0 2px #9299a3;
}
.bp-popup-parallel-avatar span {
overflow: hidden;
border-radius: 50%;
width: 100%;
height: 100%;
display: block;
line-height: 25px;
background: #525b69 url(images/bp-sprite.png) no-repeat -25px -500px;
}
.bp-popup-parallel-avatar img {
width: 25px;
height: 25px;
border-radius: 50%;
margin: auto;
vertical-align: middle;
}
.bp-popup-parallel-avatar:after {
content: '';
position: absolute;
width: 15px;
height: 15px;
background: url(images/bp-sprite.png) no-repeat -30px -141px;
top: 14px;
left: 16px;
}
.bp-popup-parallel-avatar.bp-popup-parallel-avatar-ready:after {
background-position: -30px -109px;
}
.bp-popup-parallel-avatar.bp-popup-parallel-avatar-cancel:after {
background-position: -30px -125px;
}
.bp-popup-parallel-name {
font-size: 14px;
color: #80868e;
margin-left: 12px;
display: inline-block;
vertical-align: middle;
width: 145px;
line-height: 27px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.bp-popup-parallel-sub
{
position: relative;
}
.bp-popup-parallel-sub .bp-popup-parallel
{
display: none;
position: absolute;
left: 100%;
top: 0;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .18);
-moz-box-shadow: 0 2px 5px rgba(0, 0, 0, .18);
box-shadow: 0 2px 5px rgba(0, 0, 0, .18);
border: 1px solid;
border-color: #d8d8d8 #bdbdbd #bdbdbd #bdbdbd;
}
.bp-popup-parallel-sub:hover .bp-popup-parallel
{
display: block;
}
.bp-popup-parallel-parent
{
background: url(images/arrow.png) no-repeat 97% center;
cursor: pointer;
}
.bp-short-process-step-wrapper .process-step-more {
clear: both;
display: block;
border: 0;
border-radius: 10px;
}
.bp-short-process-step-wrapper .process-step-more-complete {
background: #fff;
color: #7daa00;
}
.bp-short-process-step-wrapper .process-step-more span {
border-bottom: 1px dashed;
}
.bp-short-process-step-wrapper .process-step-more:hover span {
border-bottom: 1px dashed transparent;
}
.bp-short-process-step-wrapper a.process-step-more:hover
{
border-bottom: none;
}
/* <<< bizproc.workflow.faces */
/* >>> bp-buttons */
.bp-button
{
background: #ecedef;
-webkit-box-shadow: 0 0 0 1px #c6cdd3 inset;
box-shadow: 0 0 0 1px #c6cdd3 inset;
border-radius: 2px;
cursor: pointer;
color: #7a818a;
display: inline-block;
font-family: "OpenSans-Bold", Helvetica, Arial, sans-serif;
font-size: 12px;
outline: none;
vertical-align: middle;
text-decoration: none;
text-transform: uppercase;
text-shadow: none;
white-space: nowrap;
-webkit-font-smoothing: antialiased;
-webkit-transition: background-color 0.25s linear;
transition: background-color 0.25s linear;
margin: 3px;
text-align: center;
height: auto;
line-height: 18px !important;
padding: 8px 10px;
border-bottom: 1px solid transparent;
/*font-weight: bold;*/
}
.bp-button:hover
{
font-size: 12px;
font-family: "OpenSans-Bold", Helvetica, Arial, sans-serif;
line-height: 47px;
text-shadow: none;
background: #cfd4d8;
color: #535c69;
}
.bp-button:before,
.bp-button:after
{
display: none;
}
.bp-button:active
{
background: #868d95;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
}
.bp-button-transparent,
.bp-button-transparent:link {
box-shadow: inset 0 0 0 1px #a1a6ac;
background: none;
color: #535c69;
border-bottom: none;
}
.bp-button-transparent:hover {
background: #cfd4d8;
color: #535c69;
box-shadow: inset 0 0 0 1px #cfd4d8;
}
.bp-button-first
{
margin-left: 0;
}
.bp-button-accept,
.bp-button-accept:link
{
background: #bbed21;
-webkit-box-shadow: none;
box-shadow: none;
color: #535c69;
}
.bp-button-accept:hover {
background: #d2f95f;
color: #535c69;
}
.bp-button-accept:active
{
background: #b2e233 !important;
color: #535c69;
}
.bp-button-accept:active .bp-button-text
{
color: #535c69;
}
.bp-button-decline,
.bp-button-decline:link
{
background: #f1361b;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
}
.bp-button-decline:hover
{
background: #cc1a00;
color: #fff;
}
.bp-button-blue,
.bp-button-blue:link
{
background: #3bc8f5;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
}
.bp-button-blue:hover {
background: #3fddff;
color: #fff;
}
.bp-button.bp-button-blue {
height: 18px;
line-height: 18px !important;
}
.bp-button-wait {
color: transparent !important;
position: relative;
}
.bp-button-wait:before {
background: none !important;
box-shadow: inset 0 0 0 1px #fff;
border-radius: 50%;
color: #fff;
display: block;
content: '_';
font-size: 10px;
font-family: "OpenSans-Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
line-height: 10px;
height: 21px;
top: 0px;
left: 50%;
padding-right: 6px;
position: absolute;
text-align: right;
width: 15px;
box-sizing: content-box;
bottom: 0;
margin: auto;
margin-left: -11px;
}
.bp-button-wait:after {
background: #fff !important;
content: '';
display: block;
height: 7px;
position: absolute;
top: -6px;
left: 50%;
padding: 0;
width:1px;
-webkit-transform-origin: 0px 100%;
transform-origin: 0px 100%;
-webkit-animation: bp-clock 1s infinite linear;
animation: bp-clock 1s infinite linear;
bottom: 0;
margin: auto;
margin-left: -1px;
}
.bp-button-accept.bp-button-wait:before {
color: #535c69;
-webkit-box-shadow: inset 0 0 0 1px #535c69;
box-shadow: inset 0 0 0 1px #535c69;
}
.bp-button-accept.bp-button-wait:after {
background: #535c69 !important;
}
@keyframes bp-clock {
0% {transform: rotate(0deg) }
50% {transform: rotate(180deg) }
100% { transform: rotate(360deg) }
}
@-webkit-keyframes bp-clock {
0% { -webkit-transform: rotate(0deg)}
50% { -webkit-transform: rotate(180deg) }
100% { -webkit-transform: rotate(360deg)}
}
@-moz-keyframes bp-clock {
0% { -moz-transform: rotate(0deg); top: -6px;}
50% { -moz-transform: rotate(180deg) }
100% { -moz-transform: rotate(360deg); top: -6px;}
}
/* @keyframes bp-clock {
0% {transform: rotate(0deg);
margin-left: -1px;
}
50% { transform: rotate(180deg);
margin: 0;
}
100% { transform: rotate(360deg);
margin-left: -1px;
}
} */
.bp-button-icon {
width: 14px;
height: 11px;
background: url(images/bp-sprite.png) no-repeat 1px -499px;
display: inline-block;
vertical-align: middle;
float: left;
margin: 3px 0;
}
.bp-button-decline .bp-button-icon {
background-position: 1px -512px;
}
.bp-button-wait .bp-button-icon
{
opacity: 0;
}
.bp-button-text {
padding-right: 7px;
min-width: 100px;
display: block;
padding-left: 22px;
}
/* <<< bp-buttons */
/* >>> bp-status */
.bp-status {
display: inline-block;
vertical-align: middle;
}
.bp-status .bp-status-inner {
position: relative;
vertical-align: middle;
display: table-cell;
}
.bp-status .bp-status-inner span {
padding: 11px 17px 11px 40px;
color: #cd8600;
line-height: 16px;
text-align: left;
border-radius: 3px;
background: #ffefd0;
font-weight: bold;
display: inline-block;
position: relative;
}
.bp-status .bp-status-inner span:after {
content: '';
position: absolute;
left: 13px;
top: 50%;
margin: auto;
margin-top: -9px;
width: 18px;
height: 18px;
background: url(images/bp-sprite.png) no-repeat -27px 0;
}
.bp-status-cancel, .bp-status-ready {
position: relative;
display: inline-block;
color: #f73200;
font-weight: bold;
padding-left: 22px;
line-height: 17px;
vertical-align: middle;
}
.bp-status-ready {
color: #61aa00;
}
.bp-status-cancel:after, .bp-status-ready:after {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
width: 13px;
height: 13px;
background: url(images/bp-sprite.png) no-repeat -28px -79px;
}
.bp-status-ready:after {
width: 18px;
height: 13px;
background-position: -27px -63px;
}
/* <<< bp-status */