html-report.app.min.css Maven / Gradle / Ivy
The newest version!
/* MediaQueries*/
/*$tiny-screen*/
/*$small-screen*/
/* Transition speed*/
/* Color swatch*/
/* Mixins*/
/* Fonts*/
/* Variables*/
/* NEW*/.text-title,.title-common,.title-common-simple{font-size:16px;line-height:1.3;font-weight:500;text-transform:uppercase}.emphasized,.text-sub-title{font-size:16px;line-height:1.12;font-weight:500}.card-info__title,.text-block__title,.text-sub-title-light{font-size:16px;line-height:1.12;font-weight:500;color:#879bab}.text-regular,.text-regular-grey,.tooltip__content{font-size:14px;line-height:1.3}.text-regular-grey{color:#879bab}.notification,.small,.text-note{font-size:12px;line-height:1.3;color:#879bab}.text-important{color:#ec5555}.text-grey{color:#879bab}.form-item__error-text,.text-error-text{font-size:12px;line-height:1.12;font-weight:700;color:#ec5555}@media screen and (min-width:1680px){.card-info__title,.emphasized,.text-block__title,.text-sub-title,.text-sub-title-light,.text-title,.title-common,.title-common-simple{font-size:18px}.text-regular,.tooltip__content{font-size:16px}.form-item__error-text,.notification,.small,.text-error-text,.text-note{font-size:13px}}
/* Reset */a,abbr,acronym,address,applet,big,blockquote,body,caption,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,hr,html,iframe,img,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,small,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,ul,var{padding:0;margin:0;border:none;outline:none;font-family:inherit}h1,h2,h3,h4,h5,h6{font-weight:400}ul{list-style-type:none;list-style:none}table{border-collapse:collapse;border-spacing:0}
/* Global styles */html{font:14px/1.3 Helvetica Neue,Helvetica,Arial,sans-serif}body,html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;box-sizing:border-box}.page-content,body,html{height:100%}body{background:#f7f8fc;color:#0f375a;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{text-decoration:none;line-height:inherit;cursor:pointer;transition:color .15s}a,a:active,a:hover{color:#6e8aff}
/**
Main wrapper
Grid
Flex container
Columns
Margin for columns
Margins for blocks
Limited in width block
Centered block
Vertically aligned content in a row
Container to be 100% (or max possible) width of a parent
Right aligned block
Separated sections
**/
/* Main wrapper */.page-content{min-width:1200px}
/* Wrapper for content of the page */.content{max-width:1860px;margin:0 auto;padding:0 20px}
/**
Grid
**/
/* Flex container, row wrapper, gives horizontal direction */.row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-20px}.row.full{margin-right:0}.row.rtl{-ms-flex-pack:end;justify-content:flex-end}.row.no-wrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}
/* Columns in different sizes, the number represents the actual size */[class^=col-]{box-sizing:border-box;padding-right:20px}.col-100{-ms-flex:0 0 100%;flex:0 0 100%}.col-15{-ms-flex:0 0 15%;flex:0 0 15%}.col-20{-ms-flex:0 0 20%;flex:0 0 20%}.col-25{-ms-flex:0 0 25%;flex:0 0 25%}.col-30{-ms-flex:0 0 30%;flex:0 0 30%}.col-40{-ms-flex:0 0 40%;flex:0 0 40%}.col-50{-ms-flex:0 0 50%;flex:0 0 50%}.col-60{-ms-flex:0 0 60%;flex:0 0 60%}.col-70{-ms-flex:0 0 70%;flex:0 0 70%}.col-75{-ms-flex:0 0 75%;flex:0 0 75%}.col-80{-ms-flex:0 0 80%;flex:0 0 80%}
/* Margin for columns
In react components used only direction + width (f.ex. 'left-20')
*/.offset-all-0{padding:0}.offset-all-20,.offset-right-20{padding-right:20px}.offset-left-20{padding-left:20px}.offset-bottom-20{padding-bottom:20px}.offset-top-20{padding-top:20px}
/* Margins for blocks */.margin-all-20{margin:20px}.margin-left-20{margin-left:20px}.margin-right-10{margin-right:10px}.margin-right-20{margin-right:20px}.margin-right-30{margin-right:30px}.margin-bottom-0.margin-bottom-0{margin-bottom:0}.margin-bottom-10{margin-bottom:10px}.margin-bottom-20{margin-bottom:20px}.margin-bottom-30{margin-bottom:30px}.margin-top-10{margin-top:10px}.margin-top-20{margin-top:20px}.margin-top-40{margin-top:40px}.margin-left-right-20{margin:0 20px}.margin-top-bottom-20{margin:20px 0}
/* Limited in width block */.bounded{max-width:1100px}
/* Centered block */.centered{margin:0 auto}
/* Vertically aligned content in a row */.vertical-aligned-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}
/* Container to be 100% (or max possible) width of a parent */.full-width-content{-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1}
/* Right aligned block */.right-aligned-block{margin-left:auto}
/* Justified content between */.justify-between{-ms-flex-pack:justify;justify-content:space-between}
/* Adaptive padding */.side-paddings{padding-left:20px;padding-right:20px}@media screen and (min-width:1680px){.side-paddings{padding-left:40px;padding-right:40px}}
/* Separated sections */.separated-section{position:relative;margin:0 -20px 20px;padding:40px;background:#f7f8fc}.separated-section .form-container{position:static}@media screen and (min-width:1680px){.separated-section{margin:0 -40px 40px}}
/**
Main page header
Section menu
**/
/* Main page header */.main-header__i{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:70px;background:#0f375a;box-shadow:0 1px 2px 0 rgba(0,0,0,.2);color:#fff}.main-header__item{line-height:70px;color:#e2e6f4}.main-header__logo{width:180px;padding-left:20px;color:#c5d0ff;font-size:15px;line-height:73px}.main-header__logo-img{width:50px;height:13px;margin-right:10px;fill:#fff}.main-header__logo-title{position:relative;top:-1px;color:#e2e6f4}.main-header__section-link{display:inline-block;padding:24px 25px 22px;line-height:24px;color:#e2e6f4}.main-header__section-link .label{margin-left:5px}.main-header__section-link.active{background:#6e8aff;color:#fff;cursor:default}.main-header__section-link.active:active,.main-header__section-link.active:hover{color:#fff}.main-header__section-link:active,.main-header__section-link:hover{color:#6e8aff}.main-header__notification{padding:12px 20px;background:#3ec07f;color:#fff}.main-header__notification-link{color:#fff;border-bottom:1px solid hsla(0,0%,100%,.7);transition:border .15s}.main-header__notification-link:hover{color:#fff;border-color:transparent}.main-header__user{max-width:230px;margin-left:auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.main-header__logoff .button{display:block;height:70px;margin:0 0 0 20px;padding:0 20px;color:#e2e6f4}
/* Section menu */.section-menu{margin-right:20px;background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,.2)}.section-menu__item{overflow:hidden}.section-menu__item:last-child .section-menu__link{border-bottom:none}.section-menu__link{display:block;position:relative;padding:5px 0 5px 20px;border-left:4px solid transparent;line-height:30px;color:#879bab;cursor:pointer;transition-property:color,background;transition-duration:.15s}.section-menu__link .icon.expand{position:absolute;top:14px;right:20px;border-left:1px solid #879bab;border-top:1px solid #879bab;transition:transform .15s}.section-menu__link:hover{color:#6e8aff}.section-menu__link.active{font-weight:500;color:#6e8aff;cursor:default}.section-menu__link.active .icon.expand{top:18px;border-color:#6e8aff;transform:rotate(45deg)}.section-menu__link.active:not(.with-inner-menu){border-color:#6e8aff;background:rgba(110,138,255,.1)}.section-menu__link.active.with-inner-menu{margin-bottom:8px}.inner-menu{max-height:0;overflow:hidden}.active+.inner-menu{max-height:1000px}.inner-menu__link{display:block;padding-left:20px;border-left:4px solid transparent;font-size:12px;line-height:30px}.inner-menu__link.active{border-color:#6e8aff;font-weight:500;color:#6e8aff;background:rgba(110,138,255,.1);cursor:default}
/**
Card block
Card with info
Buttons
Buttons group
Dropdown
Titles
Text elements
Dropdown
Notifications
Tooltip
Title + text block
Labels
Icons
**/
/* Card */.card{margin-bottom:20px;padding:20px;border-radius:4px;background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,.2)}@media screen and (min-width:1680px){.card{padding:40px}}
/* Card with info */.card-info{margin-right:20px;-ms-flex-positive:1;flex-grow:1}.card-info__content{margin-top:15px;font-size:40px;line-height:1;color:#6e8aff;font-weight:300}
/* Buttons */.button{display:inline-block;box-sizing:border-box;height:34px;padding:0 12px;border-radius:4px;border:none;font-size:14px;font-weight:500;line-height:34px;text-align:center;background-color:#44547f;color:#fff;outline:none;cursor:pointer;transition:background .15s}.button:active:not(.disabled),.button:active:not([disabled]),.button:hover:not(.disabled),.button:hover:not([disabled]){background-color:#3d4b71}.button:hover{color:#fff}.button.small{min-width:80px;height:24px;font-size:12px;padding:2px 12px 0}.button.full{width:100%}.button.fixed{min-width:90px}.button.disabled,.button[disabled]{opacity:.5;cursor:default}.button.flat{border-radius:0}.button.success{background-color:#3ec07f;border-color:#3ec07f;color:#fff}.button.success:active:not(.disabled),.button.success:active:not([disabled]),.button.success:hover:not(.disabled),.button.success:hover:not([disabled]){background-color:#39b075}.button.alert{background-color:#ec5555;color:#fff}.button.alert:active:not(.disabled),.button.alert:active:not([disabled]),.button.alert:hover:not(.disabled),.button.alert:hover:not([disabled]){background-color:#e93a3a}.button.warning{background-color:#f6bb42;color:#fff}.button.warning:active:not(.disabled),.button.warning:active:not([disabled]),.button.warning:hover:not(.disabled),.button.warning:hover:not([disabled]){background-color:#f5af24}.button.secondary{background-color:#e2e6f4;color:#0f375a}.button.secondary:active:not(.disabled),.button.secondary:active:not([disabled]),.button.secondary:hover:not(.disabled),.button.secondary:hover:not([disabled]){background-color:#d7dbe8}
/* Buttons group */.button-group .button{margin-right:20px}
/* Titles */.title-common{margin-bottom:32px}.title-common-simple{text-transform:uppercase}
/* Text elements */.italic{font-style:italic}.success,.successful{color:#3ec07f}.warning{color:#f6bb42}.danger,.failure{color:#ec5555}.fair{color:#879bab}.bold{font-weight:700}.align-center{text-align:center}.valign{vertical-align:middle}.nowrap{white-space:nowrap}.break-word{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word}.grey,.small{color:#879bab}
/* Dropdown */.dropdown.button{position:relative;padding-right:36px}.dropdown.button:after{content:"";position:absolute;display:block;top:13px;right:16px;width:0;height:0;border-top:4px solid #fff;border-left:4px solid transparent;border-right:4px solid transparent}.dropdown-list{display:inline-block;position:relative}.dropdown-list__items{position:absolute;top:100%;left:0;width:200px;max-height:0;margin-top:8px;overflow:hidden;border-radius:4px;opacity:0;background:#4f6092;box-shadow:0 3px 0 0 rgba(0,0,0,.15);transform:translateY(-15px);transition-property:opacity,transform;transition-duration:.3s}.dropdown-list__items.open{max-height:1000px;opacity:1;transform:translateY(0);z-index:1}.dropdown-list__items.left-side{left:auto;right:0}.dropdown-list__item:first-child{padding-top:7px}.dropdown-list__item:last-child{padding-bottom:7px}.dropdown-list__item__i{display:block;padding:9px 20px;color:#fff}.dropdown-list__item__i:active,.dropdown-list__item__i:hover{color:#fff;background:#44547f}
/* Notifications */.notification__close{position:absolute;top:2px;right:7px;opacity:.2;font-size:20px;line-height:1;font-weight:700;color:#000;text-shadow:0 1px 0 #fff;cursor:pointer}.notification__close:hover{opacity:.5}.notification{position:relative;padding:20px 35px 17px 15px;margin-bottom:20px;border-radius:4px;color:#fff;background-color:#6e8aff}.notification.success{background-color:#3ec07f}.notification.warning{background-color:#f6bb42}.notification.danger{color:#ec5555;background-color:#ffe0e0}.notification.inline{margin:0;display:inline-block}
/* Tooltip */.tooltip{position:relative}.tooltip__handler{cursor:default}.tooltip__handler:hover .tooltip__content{opacity:1;pointer-events:auto;transform:translateY(0);z-index:4}.tooltip__content{position:absolute;z-index:1;margin-top:5px;padding:12px 16px 10px;opacity:0;border-radius:4px;color:#0f375a;background:#e2e6f4;box-shadow:0 2px 0 0 rgba(0,0,0,.15);pointer-events:none;transform:translateY(10px);transition:all .25s ease-out}.tooltip__content.revert{right:100%;margin-right:-18px}.tooltip__content.revert:after{left:auto;right:25px}.tooltip__content:after{content:"";position:absolute;top:-7px;left:25px;height:0;width:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:7px solid #e2e6f4}.tooltip__content>div{display:table;white-space:nowrap}
/* Title + Text block */.text-block{margin:0 20px 24px 0}.text-block__title{margin-bottom:10px}.text-block__title.emphasized{color:#0f375a}.text-block__content{min-height:30px}.text-block__content [type=email],.text-block__content [type=password],.text-block__content [type=tel],.text-block__content [type=text],.text-block__content select,.text-block__content textarea{position:relative;top:-6px}
/* Labels */.label{display:inline-block;box-sizing:border-box;height:20px;padding:4px 10px 0;border-radius:20px;font-size:12px;line-height:1;font-weight:700;white-space:nowrap;vertical-align:middle;text-transform:capitalize;text-align:center;color:#fff;background-color:#879bab}.label.info{background-color:#6e8aff}.label.success{background-color:#3ec07f}.label.alert,.label.danger{background-color:#ec5555}.label.warning{background-color:#f6bb42}.label.error{color:#ec5555;background-color:#ffe0e0}.label.wide{min-width:70px}.label.offset{position:relative;top:-2px;margin:0 8px;text-transform:capitalize}.label.inlined{margin-right:5px}
/* Icons */.icon{display:inline-block}.icon.expand{width:7px;height:7px;border-left:1px solid #0f375a;border-top:1px solid #0f375a;transform:rotate(-135deg)}
/* Form elements */[type=email],[type=password],[type=tel],[type=text],select,textarea{box-sizing:border-box;width:100%;height:30px;padding:8px 12px 8px 0;border:none;border-bottom:1px dashed rgba(135,155,171,.6);border-radius:0;font-family:inherit;font-size:14px;color:#0f375a;background:transparent;-webkit-appearance:none;-moz-appearance:none}[type=email]:focus,[type=password]:focus,[type=tel]:focus,[type=text]:focus,select:focus,textarea:focus{border-bottom:1px solid #6e8aff;box-shadow:0 1px 0 0 #6e8aff;outline:none;position:relative;z-index:1}[type=email]:disabled,[type=password]:disabled,[type=tel]:disabled,[type=text]:disabled,select:disabled,textarea:disabled{color:#879bab}::-webkit-input-placeholder{color:#879bab}.form-item{position:relative}.input-group .form-item{-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;margin-right:20px}.form-item__error-text{display:none;top:100%;margin-top:4px}.form-item__error-text.visible{display:block}
/* Input */.is-invalid-input,.is-invalid-input:focus{position:relative;z-index:2;border-color:#ec5555;border-bottom-style:solid}.is-invalid-input:active,.is-invalid-input:focus{box-shadow:0 1px 0 0 #ec5555}
/* Select */select{border-radius:0;padding:0 22px 0 0}select.empty{color:#879bab}.select{position:relative}.select:before{content:"";display:block;position:absolute;top:8px;right:13px;z-index:3;width:0;height:0;border-top:4px solid #0f375a;border-left:4px solid transparent;border-right:4px solid transparent}
/* Switch button */.toggler{position:relative;height:32px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.toggler__checkbox{position:absolute;left:0;top:0;opacity:0}
/* Inactive state*/.toggler__label{display:block;position:relative;width:74px;height:32px;border:1px solid #ec5555;border-radius:32px}.toggler__label:before{content:"No";display:block;position:absolute;left:0;right:0;top:8px;text-transform:uppercase;text-align:center;font-size:12px;font-weight:700;color:#ec5555}.toggler__label.checked{border:1px solid #3ec07f}.toggler__label.checked:before{content:"Yes";color:#3ec07f}
/* Active state*/.toggler__label.active{cursor:pointer;background:#ec5555}.toggler__label.active:after{content:"";position:absolute;top:1px;left:1px;display:block;width:30px;height:30px;background-color:#fff;border-radius:30px;box-shadow:2px 0 0 0 rgba(0,0,0,.1);transition:all .15s ease-in-out}.toggler__label.active:before{left:auto;right:14px;color:#fff}.toggler__label.active.checked{background:#3ec07f}.toggler__label.active.checked:before{right:auto;left:10px}.toggler__label.active.checked:after{left:43px}
/* Radio Group */.radio-group{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.radio-group.is-invalid-input{box-shadow:none}.radio-group.is-invalid-input .radio-button__label{color:#ec5555}.radio-button{margin:0 15px 0 0}.radio-button__label{display:inline-block;position:relative;padding-left:30px;text-transform:capitalize;cursor:pointer}.radio-button__input{-webkit-appearance:none;position:absolute;left:0;top:3px;margin:0}.radio-button__icon{content:"";display:block;box-sizing:border-box;position:absolute;left:0;top:0;width:20px;height:20px;border-radius:20px;border:1px solid #879bab;background:#fff}.radio-button__icon.checked{background:#6e8aff}.radio-button__icon.checked:before{content:"";display:block;position:absolute;left:6px;top:6px;width:6px;height:6px;border-radius:6px;background:#fff}
/* Layout */.container-expanded{margin:0 -20px}@media screen and (min-width:1680px){.container-expanded{margin:0 -40px}}.margin-bottom-5{margin-bottom:5px}.bounded{max-width:700px}.shortened{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.title-l{color:#6e8aff}.test-page.failed{border-top:5px solid #ec5555}.test-page.ignored{border-top:5px solid #879bab}.test-page.passed{border-top:5px solid #3ec07f}.test-page__title{font-size:20px;line-height:22px;font-weight:500}
/* Statuses */.status-passed{color:#3ec07f}.status-ignored{color:#879bab}.status-failed{color:#ec5555}.with-arrow{display:inline-block;position:relative;padding-right:12px}.with-arrow:before{content:"";display:block;position:absolute;right:0;top:6px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid #0f375a}.with-arrow:hover:before{border-left:4px solid #6e8aff}
/* List */.list__item{position:relative;padding:14px 20px;color:#0f375a}.list__item:before{content:"";display:block;position:absolute;left:0;top:0;bottom:0;width:0}.list__item.passed{border-left:5px solid #3ec07f}.list__item.ignored{border-left:5px solid rgba(135,155,171,.6)}.list__item.failed{border-left:5px solid #ec5555}.list__item:not(.no-hover):hover{cursor:pointer;z-index:1;box-shadow:0 0 3px 0 rgba(135,155,171,.4);color:#0f375a}.list__item:nth-child(odd){background:#f7f8fc}.images__item{box-sizing:border-box;-ms-flex:0 0 25%;flex:0 0 25%;padding:0 20px 20px 0}.images__item img{width:100%;vertical-align:middle}.images__item__title{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}@media screen and (min-width:1680px){.images__item{-ms-flex:0 0 20%;flex:0 0 20%}.list__item{padding:20px -40px}}
/* Labels list */.labels-list{text-align:right}
/* Filter card */.filter-card{cursor:pointer;transition:transform .15s;transform:translateY(0)}.filter-card:hover{transform:translateY(-5px)}
/* Log */.log-wrapper{min-width:1160px;max-width:1860px;margin:0 auto;padding:0 20px}.log{background:#202020;color:hsla(0,0%,100%,.8)}.log__line{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none}.log__default{color:hsla(0,0%,100%,.8)}.log__verbose{color:hsla(0,0%,100%,.7)}.log__debug{color:#1d91bb}.log__info{color:#53c8a1}.log__warning{color:#dbbe10}.log__error{color:#ff6b68}.log__assert{color:#c200ff}.copy{color:#879bab;font-size:12px;padding-bottom:10px;text-align:right}.label.big{height:25px;font-size:16px}© 2015 - 2025 Weber Informatics LLC | Privacy Policy