move emby-webcomponents to components and reflect paths

2025-03-30 19:56:21 +00:00 · 2019-02-23 18:05:42 +00:00 · 2019-02-23 18:05:42 +00:00 · 6ddc62857d
commit 6ddc62857d
parent e91cbf8438
275 changed files with 20 additions and 20 deletions
--- a/src/components/emby-checkbox/emby-checkbox.css
+++ b/src/components/emby-checkbox/emby-checkbox.css
@ -0,0 +1,150 @@
+.emby-checkbox-label {
+    position: relative;
+    z-index: 1;
+    vertical-align: middle;
+    display: inline-flex;
+    box-sizing: border-box;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    padding-left: 2.4em;
+    align-items: center;
+    height: 2.35em;
+    cursor: pointer;
+}
+
+.checkboxFieldDescription {
+    padding-left: 2.4em;
+}
+
+.checkboxContainer {
+    margin-bottom: 1.8em;
+    display: flex;
+}
+
+.checkboxListContainer {
+    margin-bottom: 1.8em;
+}
+
+.checkboxContainer-withDescription {
+    flex-direction: column;
+}
+
+.emby-checkbox {
+    position: absolute;
+    /* This is for focusing purposes, so the focusManager doesn't skip over it */
+    width: 1px;
+    height: 1px;
+    margin: 0;
+    padding: 0;
+    opacity: 0;
+    -ms-appearance: none;
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    appearance: none;
+    border: none;
+}
+
+.checkboxOutline {
+    position: absolute;
+    top: 3px;
+    left: 0;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 1.83em;
+    height: 1.83em;
+    margin: 0;
+    overflow: hidden;
+    border: 2px solid currentcolor;
+    border-radius: .14em;
+    z-index: 2;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+/* Commenting this out - set by theme */
+/*.emby-checkbox:checked + span + span + .checkboxOutline {
+    border-color: #52B54B;
+}*/
+
+.emby-checkbox-focushelper {
+    position: absolute;
+    top: -0.915em;
+    left: -0.915em;
+    width: 3.66em;
+    height: 3.66em;
+    display: inline-block;
+    box-sizing: border-box;
+    margin: 3px 0 0 0;
+    border-radius: 50%;
+    background-color: transparent;
+}
+
+/* Commenting this out - set by theme */
+/*.emby-checkbox:focus + span + .emby-checkbox-focushelper {
+    background-color: rgba(82, 181, 75, 0.26);
+}*/
+
+.checkboxIcon {
+    font-size: 1.6em;
+    color: #fff;
+}
+
+.checkboxIcon-checked {
+    display: none;
+}
+
+.emby-checkbox:checked + span + span + .checkboxOutline > .checkboxIcon-checked {
+    /* background-color set by theme */
+    /*background-color: #52B54B;*/
+    display: flex !important;
+}
+
+.emby-checkbox:checked + span + span + .checkboxOutline > .checkboxIcon-unchecked {
+    /* background-color set by theme */
+    display: none !important;
+}
+
+.emby-checkbox:checked[disabled] + span + span + .checkboxOutline > .checkboxIcon {
+    background-color: rgba(0, 0, 0, 0.26);
+}
+
+.checkboxLabel {
+    position: relative;
+    margin: 0;
+}
+
+.checkboxList > .emby-checkbox-label {
+    display: flex;
+    margin: .5em 0;
+}
+
+.checkboxList-verticalwrap {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+    .checkboxList-verticalwrap > .emby-checkbox-label {
+        display: inline-flex;
+        margin: .3em 0 .3em 0;
+        width: 12em;
+    }
+
+.checkboxList-paperList {
+    padding: 1em !important;
+}
+
+.checkboxListLabel {
+    margin-bottom: .25em;
+}
+
+@-webkit-keyframes repaintChrome {
+    from {
+        padding: 0;
+    }
+
+    to {
+        padding: 0;
+    }
+}