diff --git a/api/js/etemplate/Et2Url/Et2InvokerMixin.ts b/api/js/etemplate/Et2Url/Et2InvokerMixin.ts index 01c6eceb77..b9c3683f31 100644 --- a/api/js/etemplate/Et2Url/Et2InvokerMixin.ts +++ b/api/js/etemplate/Et2Url/Et2InvokerMixin.ts @@ -39,6 +39,7 @@ export const Et2InvokerMixin = dedupeMixin((superclass) => } }; } + static get styles() { return [ @@ -58,6 +59,7 @@ export const Et2InvokerMixin = dedupeMixin((superclass) => align-items: center } ::slotted([slot="suffix"]) { + width: 12px; border: none !important; background-color: transparent !important; } @@ -68,6 +70,7 @@ export const Et2InvokerMixin = dedupeMixin((superclass) => `, ]; } + get slots() { return { diff --git a/api/js/etemplate/Et2Url/Et2Url.ts b/api/js/etemplate/Et2Url/Et2Url.ts index 51f343ddee..feb4a71293 100644 --- a/api/js/etemplate/Et2Url/Et2Url.ts +++ b/api/js/etemplate/Et2Url/Et2Url.ts @@ -11,6 +11,8 @@ import {Et2InvokerMixin} from "./Et2InvokerMixin"; import {IsEmail} from "../Validators/IsEmail"; import {Et2Textbox} from "../Et2Textbox/Et2Textbox"; +import {colorsDefStyles} from "../Styles/colorsDefStyles"; +import {css} from "@lion/core"; /** * @customElement et2-url @@ -39,6 +41,21 @@ export class Et2Url extends Et2InvokerMixin(Et2Textbox) }; } + static get styles() + { + return [ + ...super.styles, + colorsDefStyles, + css` + ::slotted([slot="suffix"]) { + font-size: 133% !important; + position: relative; + left: -2px; + } + `, + ]; + } + constructor() { super(); diff --git a/api/js/etemplate/Et2Url/Et2UrlEmail.ts b/api/js/etemplate/Et2Url/Et2UrlEmail.ts index a163a751a0..c95e538327 100644 --- a/api/js/etemplate/Et2Url/Et2UrlEmail.ts +++ b/api/js/etemplate/Et2Url/Et2UrlEmail.ts @@ -11,12 +11,27 @@ import {Et2InvokerMixin} from "./Et2InvokerMixin"; import {IsEmail} from "../Validators/IsEmail"; import {Et2Textbox} from "../Et2Textbox/Et2Textbox"; +import {colorsDefStyles} from "../Styles/colorsDefStyles"; +import {css} from "@lion/core"; /** * @customElement et2-url-email */ export class Et2UrlEmail extends Et2InvokerMixin(Et2Textbox) { + static get styles() + { + return [ + ...super.styles, + colorsDefStyles, + css` + ::slotted([slot="suffix"]) { + font-size: 90% !important; + } + `, + ]; + } + constructor() { super(); diff --git a/api/js/etemplate/Et2Url/Et2UrlFax.ts b/api/js/etemplate/Et2Url/Et2UrlFax.ts index f6fb675938..c46cfb073f 100644 --- a/api/js/etemplate/Et2Url/Et2UrlFax.ts +++ b/api/js/etemplate/Et2Url/Et2UrlFax.ts @@ -10,12 +10,29 @@ /* eslint-disable import/no-extraneous-dependencies */ import {Et2UrlPhone} from "./Et2UrlPhone"; import {Et2UrlEmail} from "./Et2UrlEmail"; +import {colorsDefStyles} from "../Styles/colorsDefStyles"; +import {css} from "@lion/core"; /** * @customElement et2-url-phone */ export class Et2UrlFax extends Et2UrlPhone { + static get styles() + { + return [ + ...super.styles, + colorsDefStyles, + css` + ::slotted([slot="suffix"]) { + font-size: 90% !important; + position: relative; + left: -2px; + } + `, + ]; + } + constructor() { super(); diff --git a/api/js/etemplate/Et2Url/Et2UrlPhone.ts b/api/js/etemplate/Et2Url/Et2UrlPhone.ts index 7e3809f1d8..fe34bf0056 100644 --- a/api/js/etemplate/Et2Url/Et2UrlPhone.ts +++ b/api/js/etemplate/Et2Url/Et2UrlPhone.ts @@ -10,12 +10,27 @@ /* eslint-disable import/no-extraneous-dependencies */ import {Et2InvokerMixin} from "./Et2InvokerMixin"; import {Et2Textbox} from "../Et2Textbox/Et2Textbox"; +import {colorsDefStyles} from "../Styles/colorsDefStyles"; +import {css} from "@lion/core"; /** * @customElement et2-url-phone */ export class Et2UrlPhone extends Et2InvokerMixin(Et2Textbox) { + static get styles() + { + return [ + ...super.styles, + colorsDefStyles, + css` + ::slotted([slot="suffix"]) { + font-size: 133% !important; + } + `, + ]; + } + constructor() { super();