size and align icons for url-widgets

This commit is contained in:
ralf 2022-03-10 18:13:43 +02:00
parent 1be92b5b61
commit 6ebd09b275
5 changed files with 67 additions and 0 deletions

View File

@ -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 {

View File

@ -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();

View File

@ -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();

View File

@ -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();

View File

@ -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();