@import "./css-less-variables/common-import.less"; .svg-container { display: inline-block; position: relative; width: 100%; padding-bottom: 49%; vertical-align: top; overflow: hidden; } .svg-content { display: inline-block; position: absolute; top: 0; left: 0; } .borderless-button { border: 0 solid transparent; outline: none; background: transparent; padding-left: 0; &:focus { box-shadow: 0 0 4px 2px #23799E; outline: 0 solid #f8f8f8 !important; } } .visual-button { height: 28px; border: 1px solid #AAAAAA; background: #F9F9F9; background-image: -webkit-linear-gradient(top, #F9F9F9, #EDEDED); background-image: -moz-linear-gradient(top, #F9F9F9, #EDEDED); background-image: -ms-linear-gradient(top, #F9F9F9, #EDEDED); background-image: -o-linear-gradient(top, #F9F9F9, #EDEDED); background-image: linear-gradient(to bottom, #F9F9F9, #EDEDED); -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0px; color: #0F5475; font-size: 13px; text-decoration: none; line-height: 25px; //font-family: @font-family; font-weight: 700; padding-right: 10px !important; padding-left: 10px !important; } .button-link { color: #005983; cursor: pointer; text-align: left; font-weight: bold; font-size: 13px; &:hover { text-decoration: underline; } } .hrule { border: 1px solid #e4e5ec; margin-bottom: 15px; } .margin-right-5 { margin-right: 5px; } .margin-right-20 { margin-right: 20px; } .ra-margin-right-5 { margin-right: 5px; margin-left: 0; } [dir="rtl"] .ra-margin-right-5 { margin-right: 0px; margin-left: 5px; } .ra-margin-right-20 { margin-right: 20px; margin-left: 0; } .ra-margin-left-15 { margin-left: 15px; margin-right: 0; } [dir="rtl"] .ra-margin-left-15 { margin-right: 15px; margin-left: 0; } [dir="rtl"] .ra-margin-right-20 { margin-left: 20px; margin-right: 0; } .ra-margin-left-20 { margin-left: 20px; margin-right: 0; } [dir="rtl"] .ra-margin-left-20 { margin-right: 20px; margin-left: 0; } .flex-row { display: flex; align-items: center; } .flex-column { display: flex; flex-direction: column; align-items: top; } .flex-justify-start { justify-content: flex-start; } .flex-justify-end { justify-content: flex-end; } .flex-align-start { align-items: flex-start; } .flex-justify-center { justify-content: center; } .flex-justify-space-between { justify-content: space-between; } .card-box { width: auto; height: auto; background-color: #FFFFFF; padding: 20px; vertical-align: top; } .wos-ra-visualization-box { height: auto; width: 100%; } .wos-ra-visualization-box.visualization-shown { #hideVisualization { display: block; } #hideVisualizationButtons { visibility: visible; } #hideVisualizationOptions { visibility: visible; } } .wos-ra-visualization-box.visualization-hidden { display: none; #hideVisualizationButtons { visibility: hidden; } #hideVisualizationOptions { visibility: hidden; } } .card__header { color: #385775; font-size: 19px; font-weight: bold; line-height: 18px; } .bold-text { color: #000000; //font-family: @font-family; font-size: 13px; font-weight: 700; line-height: 16px; } .link-text { color: #005983; font-size: 13px; font-weight: normal; line-height: 16px; cursor: pointer; } .large-number { color: #4B749B; font-size: 37px; font-weight: bold; line-height: 32px; } .box-label { color: #000000; font-size: 13px; line-height: 16px; } .bold-label { font-weight: bold; } .box-div { margin-top: 15px; } .node { border: solid 1px white; font: 11px @font-family; overflow: hidden; position: absolute; padding-left: 2px; background-image: -webkit-linear-gradient(top, hsla(0,0%,100%,.3), hsla(0,0%,100%,0)); background-image: -moz-linear-gradient(top, hsla(0,0%,100%,.3), hsla(0,0%,100%,0)); background-image: -ms-linear-gradient(top, hsla(0,0%,100%,.3), hsla(0,0%,100%,0)); background-image: -o-linear-gradient(top, hsla(0,0%,100%,.3), hsla(0,0%,100%,0)); background-image: linear-gradient(top, hsla(0,0%,100%,.3), hsla(0,0%,100%,0)); } .node-label { line-height: 1; font-size: 13px; font-weight: 600; } .node-value { color: #FFFFFF; font-size: 26px; font-weight: 600; margin-top: 1px; margin-left: 4px; } .bar { fill: #B9D3EB; &:hover { fill: #4B749B !important; } &:focus { fill: #4B749B !important; } } .bar-focus { fill: #4B749B !important; } div.tooltip { position: absolute; text-align: center; width: 150px; height: auto; padding: 10px; font: 13px @font-family; background: #4B749B; border: 0px; border-radius: 8px; pointer-events: none; } .d3-tip { line-height: 1; padding: 11px; background: #FAFAFC; box-shadow: 0 0 4px 0 rgba(0,0,0,0.2); color: #000000; border-radius: 3px; border-color: #D4D4D4; font-size: 12px; border-width: thin; border-style: solid; &:after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #FAFAFC transparent transparent transparent; max-width: 400px; } &:before { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -7px; border-width: 7px; border-style: solid; border-color: #D4D4D4 transparent transparent transparent; max-width: 400px; } } .d3-tip-div { text-align: center; color: #000000; line-height: 16px; max-width: 400px; } .d3-tip-recordSize { font-size: 25px; } .d3-tip-recordName { font-weight: 600; } .d3-tip-recordStr { color: rgba(0,0,0,0.7); } .fa-compress { font-size: 1.6em; color: #005a84; float: right; position: relative; margin: 4px; } .fa-bar-chart { font-size: 1.6em; color: #005a84; float: right; position: relative; margin: 4px; } .fa-close { cursor: pointer; } .limitedTitle { display: none; } .allTitles { display: inline; } .ra-tooltip-box { background-color: #FAFAFC; color: #000; position: absolute; pointer-events: none; border-radius: 3px; font-family: @font-family; font-size: 13px; padding: 22px; max-width: 350px; box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); p { margin-bottom: 15px; &:last-of-type { margin-bottom: 0; } } } .tool_tip_close { float: right; &:lang(ar) { float: left; } }