%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 */