diff --git a/.github/workflows/nodejs.yml b/.github/workflows/nodejs.yml index 2a854d925..f04e0bce3 100644 --- a/.github/workflows/nodejs.yml +++ b/.github/workflows/nodejs.yml @@ -27,6 +27,6 @@ jobs: run: | npm ci npm run build --if-present - npm test + npm run lint env: CI: true diff --git a/src/assets/less/common-globalping.less b/src/assets/less/common-globalping.less index e049d75d0..01dff5e14 100644 --- a/src/assets/less/common-globalping.less +++ b/src/assets/less/common-globalping.less @@ -526,6 +526,10 @@ } } } + + &_tt-limit { + white-space: normal; + } } // hide GoogleMaps InfoWindow close btn diff --git a/src/assets/less/common.less b/src/assets/less/common.less index 75a3b878f..cfbdf672c 100644 --- a/src/assets/less/common.less +++ b/src/assets/less/common.less @@ -419,12 +419,16 @@ body.noscroll { transform: translate(-50%, 100%); } - &-right:before { - left: 0; - top: 50%; - border-left: 0; - border-right: 5px solid rgba(17, 26, 44, .9); - transform: translate(-100%, -50%); + &-right { + margin-right: 20px; + + &:before { + left: 0; + top: 50%; + border-left: 0; + border-right: 5px solid rgba(17, 26, 44, .9); + transform: translate(-100%, -50%); + } } &-bottom:before { @@ -435,12 +439,17 @@ body.noscroll { transform: translate(-50%, -100%); } - &-left:before { - right: 0; - top: 50%; - border-right: 0; - border-left: 5px solid rgba(17, 26, 44, .9); - transform: translate(100%, -50%); + &-left { + margin-left: 20px; + + &:before { + right: 0; + top: 50%; + border-right: 0; + border-left: 5px solid rgba(17, 26, 44, .9); + transform: translate(100%, -50%); + margin-left: 24px; + } } pre { diff --git a/src/views/pages/globalping/_index.html b/src/views/pages/globalping/_index.html index 815b2f377..662f04833 100644 --- a/src/views/pages/globalping/_index.html +++ b/src/views/pages/globalping/_index.html @@ -132,9 +132,10 @@ gpNotAppliedOpts="{{notAppliedOpts}}" gpUrlHandlerCb="{{@this.applyOptions}}" showIPSwitch="{{mainOptions.type !== 'DNS'}}" - ipVersion="{{mainOptions.ipVersion}}"> + ipVersion="{{mainOptions.ipVersion}}" + ttPos="{{ttPositions.targetTtPos}}"> {{#partial labelIcon}} - @@ -150,9 +151,10 @@ placeholder="Enter location" labelText="Location" classList="gp_map-block_settings-wrapper_settings_location gp_input" - disabled="{{testInProgress}}"> + disabled="{{testInProgress}}" + ttPos="{{ttPositions.locationTtPos}}"> {{#partial labelIcon}} - @@ -168,9 +170,10 @@ labelText="Limit" classList="gp_map-block_settings-wrapper_settings_limit gp_input" hideLabelIcon="{{infiniteSwitchEnabled === false}}" - disabled="{{testInProgress}}"> + disabled="{{testInProgress}}" + ttPos="{{ttPositions.limitTtPos}}"> {{#partial labelIcon}} - @@ -1786,6 +1789,27 @@ } }); + // handle tooltips positions depending on the screen size + this.observe('screenWidth', (screenWidth) => { + let ttPositions = {}; + + if (screenWidth >= 1272) { + ttPositions.targetTtPos = 'top'; + ttPositions.locationTtPos = 'top'; + ttPositions.limitTtPos = 'top'; + } else if (screenWidth >= 768) { + ttPositions.targetTtPos = 'top'; + ttPositions.locationTtPos = 'right'; + ttPositions.limitTtPos = 'top'; + } else { + ttPositions.targetTtPos = 'right'; + ttPositions.locationTtPos = 'right'; + ttPositions.limitTtPos = 'right'; + } + + this.set('ttPositions', ttPositions); + }); + // disable Infinite switch if there is more than one target this.observe('mainOptions.target', (target) => { if (target.split(',').length > 1) {