diff --git a/platform/commonUI/general/res/css/theme-espresso.css b/platform/commonUI/general/res/css/theme-espresso.css index 6089031faf..28e8677887 100644 --- a/platform/commonUI/general/res/css/theme-espresso.css +++ b/platform/commonUI/general/res/css/theme-espresso.css @@ -4432,26 +4432,26 @@ input[type="text"] { .l-infobubble-wrapper .l-infobubble table tr td { padding: 2px 0; vertical-align: top; } - /* line 57, ../sass/helpers/_bubbles.scss */ + /* line 53, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper .l-infobubble table tr td.label { padding-right: 10px; white-space: nowrap; } - /* line 61, ../sass/helpers/_bubbles.scss */ + /* line 57, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper .l-infobubble table tr td.value { - white-space: nowrap; } - /* line 65, ../sass/helpers/_bubbles.scss */ + word-break: break-all; } + /* line 61, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper .l-infobubble table tr td.align-wrap { white-space: normal; } - /* line 71, ../sass/helpers/_bubbles.scss */ + /* line 67, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper .l-infobubble .title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 5px; } - /* line 78, ../sass/helpers/_bubbles.scss */ + /* line 74, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-left { margin-left: 20px; } - /* line 80, ../sass/helpers/_bubbles.scss */ + /* line 76, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-left .l-infobubble::before { right: 100%; width: 0; @@ -4459,10 +4459,10 @@ input[type="text"] { border-top: 6.66667px solid transparent; border-bottom: 6.66667px solid transparent; border-right: 10px solid #ddd; } - /* line 86, ../sass/helpers/_bubbles.scss */ + /* line 82, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-right { margin-right: 20px; } - /* line 88, ../sass/helpers/_bubbles.scss */ + /* line 84, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-right .l-infobubble::before { left: 100%; width: 0; @@ -4470,16 +4470,16 @@ input[type="text"] { border-top: 6.66667px solid transparent; border-bottom: 6.66667px solid transparent; border-left: 10px solid #ddd; } - /* line 95, ../sass/helpers/_bubbles.scss */ + /* line 91, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-top .l-infobubble::before { top: 20px; } - /* line 101, ../sass/helpers/_bubbles.scss */ + /* line 97, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-btm .l-infobubble::before { bottom: 20px; } - /* line 106, ../sass/helpers/_bubbles.scss */ + /* line 102, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-down { margin-bottom: 10px; } - /* line 108, ../sass/helpers/_bubbles.scss */ + /* line 104, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-down .l-infobubble::before { left: 50%; top: 100%; @@ -4487,21 +4487,21 @@ input[type="text"] { border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 7.5px solid #ddd; } - /* line 117, ../sass/helpers/_bubbles.scss */ + /* line 113, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper .arw { z-index: 2; } - /* line 120, ../sass/helpers/_bubbles.scss */ + /* line 116, ../sass/helpers/_bubbles.scss */ .l-infobubble-wrapper.arw-up .arw.arw-down, .l-infobubble-wrapper.arw-down .arw.arw-up { display: none; } -/* line 127, ../sass/helpers/_bubbles.scss */ +/* line 125, ../sass/helpers/_bubbles.scss */ .l-thumbsbubble-wrapper .arw-up { width: 0; height: 0; border-left: 6.66667px solid transparent; border-right: 6.66667px solid transparent; border-bottom: 10px solid #4d4d4d; } -/* line 130, ../sass/helpers/_bubbles.scss */ +/* line 128, ../sass/helpers/_bubbles.scss */ .l-thumbsbubble-wrapper .arw-down { width: 0; height: 0; @@ -4509,7 +4509,7 @@ input[type="text"] { border-right: 6.66667px solid transparent; border-top: 10px solid #4d4d4d; } -/* line 134, ../sass/helpers/_bubbles.scss */ +/* line 133, ../sass/helpers/_bubbles.scss */ .s-infobubble { -moz-border-radius: 2px; -webkit-border-radius: 2px; @@ -4520,22 +4520,29 @@ input[type="text"] { background: #ddd; color: #666; font-size: 0.8rem; } - /* line 141, ../sass/helpers/_bubbles.scss */ + /* line 140, ../sass/helpers/_bubbles.scss */ .s-infobubble .title { color: #333333; font-weight: bold; } /* line 146, ../sass/helpers/_bubbles.scss */ - .s-infobubble tr td { - border-top: 1px solid #c4c4c4; + .s-infobubble table tr td { + border: none; + border-top: 1px solid #c4c4c4 !important; font-size: 0.9em; } - /* line 150, ../sass/helpers/_bubbles.scss */ - .s-infobubble tr:first-child td { + /* line 152, ../sass/helpers/_bubbles.scss */ + .s-infobubble table tr:first-child td { + border-top: none !important; } + /* line 157, ../sass/helpers/_bubbles.scss */ + .s-infobubble:first-child td { border-top: none; } - /* line 154, ../sass/helpers/_bubbles.scss */ + /* line 161, ../sass/helpers/_bubbles.scss */ + .s-infobubble .label { + color: gray; } + /* line 165, ../sass/helpers/_bubbles.scss */ .s-infobubble .value { color: #333333; } -/* line 159, ../sass/helpers/_bubbles.scss */ +/* line 171, ../sass/helpers/_bubbles.scss */ .s-thumbsbubble { background: #4d4d4d; color: #b3b3b3; } diff --git a/platform/commonUI/general/res/sass/helpers/_bubbles.scss b/platform/commonUI/general/res/sass/helpers/_bubbles.scss index 5b174ba6da..10deec9645 100644 --- a/platform/commonUI/general/res/sass/helpers/_bubbles.scss +++ b/platform/commonUI/general/res/sass/helpers/_bubbles.scss @@ -48,19 +48,15 @@ width: 100%; tr { td { - //max-width: 150px; padding: 2px 0; vertical-align: top; - //white-space: nowrap; - //overflow: hidden; - //text-overflow: ellipsis; &.label { padding-right: $interiorMargin * 2; white-space: nowrap; } &.value { - white-space: nowrap; - //width: 90%; + //word-wrap: break-word; // Doesn't work in ? + word-break: break-all; } &.align-wrap { white-space: normal; @@ -118,7 +114,9 @@ z-index: 2; } &.arw-up .arw.arw-down, - &.arw-down .arw.arw-up { display: none; } + &.arw-down .arw.arw-up { + display: none; + } } //************************************************* LOOK AND FEEL @@ -131,6 +129,7 @@ @include triangle('down', $bubbleArwSize, 1.5, $colorThumbsBubbleBg); } } + .s-infobubble { $emFg: darken($colorInfoBubbleFg, 20%); @include border-radius($basicCr); @@ -142,18 +141,31 @@ color: $emFg; font-weight: bold; } - tr { - td { - border-top: 1px solid darken($colorInfoBubbleBg, 10%); - font-size: 0.9em; - } - &:first-child td { - border-top: none; + table { + tr { + td { + border: none; + border-top: 1px solid darken($colorInfoBubbleBg, 10%) !important; + font-size: 0.9em; + } + + &:first-child td { + border-top: none !important; + } } } + &:first-child td { + border-top: none; + } + + .label { + color: lighten($emFg, 30%); + } + .value { color: $emFg; } + } .s-thumbsbubble {