@haxtheweb/haxcms-nodejs
Version:
HAXcms single and multisite nodejs server, api, and administration
98 lines (82 loc) • 3.07 kB
JavaScript
import"../../../vaadin-lumo-styles/color.js";import"../../../vaadin-lumo-styles/mixins/required-field.js";import{html as e}from"../../../../@polymer/polymer/lib/utils/html-tag.js";const o=e`<dom-module id="lumo-checkbox-group" theme-for="vaadin-checkbox-group">
<template>
<style include="lumo-required-field">
:host {
color: var(--lumo-body-text-color);
font-size: var(--lumo-font-size-m);
font-family: var(--lumo-font-family);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: transparent;
padding: var(--lumo-space-xs) 0;
}
:host::before {
height: var(--lumo-size-m);
box-sizing: border-box;
display: inline-flex;
align-items: center;
}
:host([theme~="vertical"]) [part="group-field"] {
display: flex;
flex-direction: column;
}
[part="label"] {
padding-bottom: 0.7em;
}
:host([disabled]) [part="label"] {
color: var(--lumo-disabled-text-color);
-webkit-text-fill-color: var(--lumo-disabled-text-color);
}
:host([focused]:not([disabled])) [part="label"] {
color: var(--lumo-primary-text-color);
}
:host(:hover:not([disabled]):not([focused])) [part="label"],
:host(:hover:not([disabled]):not([focused])) [part="helper-text"],
:host(:hover:not([disabled]):not([focused])) [part="helper-text"] ::slotted(*) {
color: var(--lumo-body-text-color);
}
:host([has-helper]) [part="helper-text"]::before {
content: "";
display: block;
height: 0.4em;
}
[part="helper-text"],
[part="helper-text"] ::slotted(*) {
display: block;
color: var(--lumo-secondary-text-color);
font-size: var(--lumo-font-size-xs);
line-height: var(--lumo-line-height-xs);
margin-left: calc(var(--lumo-border-radius-m) / 4);
transition: color 0.2s;
}
/* helper-text position */
:host([has-helper][theme~="helper-above-field"]) [part="helper-text"]::before {
display: none;
}
:host([has-helper][theme~="helper-above-field"]) [part="helper-text"]::after {
content: "";
display: block;
height: 0.4em;
}
:host([has-helper][theme~="helper-above-field"]) [part="label"] {
order: 0;
padding-bottom: 0.4em;
}
:host([has-helper][theme~="helper-above-field"]) [part="helper-text"] {
order: 1;
}
:host([has-helper][theme~="helper-above-field"]) [part="group-field"] {
order: 2;
}
:host([has-helper][theme~="helper-above-field"]) [part="error-message"] {
order: 3;
}
/* Touch device adjustment */
@media (pointer: coarse) {
:host(:hover:not([disabled]):not([focused])) [part="label"] {
color: var(--lumo-secondary-text-color);
}
}
</style>
</template>
</dom-module>`;document.head.appendChild(o.content);