ywana-core8 0.0.239 → 0.0.243

package/dist/index.css

@@ -535,7 +535,9 @@ input:checked ~ .checkmark:after {
 }
 .property {
     flex:1;
+    max-height: 3rem;
     display: flex;
+    flex-direction: row;
 }
 
 .property-name {
@@ -543,8 +545,9 @@ input:checked ~ .checkmark:after {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    padding: .5rem 0 .5rem .5rem;
-
+    display: flex;
+    align-items: center;
+    padding: .5rem;
 }
 
 .property-value {
@@ -552,7 +555,22 @@ input:checked ~ .checkmark:after {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    padding: .5rem .5rem .5rem 0
+    display: flex;
+    align-items: center;
+    position: relative;
+}
+
+.property-value>input {
+    width: 100%;
+    height: 100%;
+    border: solid 0px;
+    background-color: rgba(240,240,240,.5);
+    padding: .5rem;
+}
+
+.property-value>.icon {
+    position: absolute;
+    right: .5rem;
 }
 .radio {
     flex: 1;
@@ -892,6 +910,175 @@ input:read-only ~ label,
   background-color: var(--primary-color-lighter);
 }
 
+.textarea {
+  flex: 1;
+  position: relative;
+  padding-top: 1.5rem;
+  overflow: hidden;
+  display: flex;
+  min-height: 3.5;
+}
+
+.textarea.no-label {
+  padding-top: .5rem;
+  padding-bottom: .5rem;
+}
+
+.textarea > textarea {
+  flex: 1;
+  padding: 10px 10px 10px .5rem;
+  display: block;
+  border: none;
+  border-bottom: 1px solid var(--divider-color);
+  overflow: hidden;
+  font-size: 1rem;
+  color: var(--text-color);
+  background-color: var(--paper-color);
+}
+
+.textarea > textarea:focus {
+  outline: none;
+}
+
+.textarea>.icon {
+  position: absolute;
+  top: 1.5rem;
+  right: .2rem;
+  color: rgba(150,150,150,1);
+}
+
+.textarea-date>.icon,
+.textarea-DATE>.icon {
+  right: 2.5rem;
+}
+
+.textarea > label {
+  color: var(--primary-color);
+  font-size: .9rem;
+  font-weight: normal;
+  position: absolute;
+  pointer-events: none;
+  left: .4rem;
+  top: 2rem;
+  transition: 0.2s ease all;
+  -moz-transition: 0.2s ease all;
+  -webkit-transition: 0.2s ease all;
+}
+
+textarea:-moz-read-only {
+  background-color: rgba(200,200,200,.1);
+  border: 0px !important;
+}
+
+textarea:read-only {
+  background-color: rgba(200,200,200,.1);
+  border: 0px !important;
+}
+
+.textarea textarea[type="date"] ~ label {
+    top: .3rem;
+    font-size: .8rem;
+    color: var(--primary-color);
+}
+
+/* active state */
+textarea:-moz-read-only ~ label {
+  top: .3rem;
+  font-size: .8rem;
+  color: var(--primary-color);
+}
+textarea:read-only ~ label,
+.textarea > textarea:focus ~ label,
+.textarea > textarea:valid ~ label {
+  top: .3rem;
+  font-size: .8rem;
+  color: var(--primary-color);
+}
+
+.textarea > .bar {
+  position: relative;
+  display: block;
+}
+
+.textarea > .bar:before,
+.textarea > .bar:after {
+  content: "";
+  height: 2px;
+  width: 0;
+  bottom: 1px;
+  position: absolute;
+  background: #5264ae;
+  transition: 0.2s ease all;
+  -moz-transition: 0.2s ease all;
+  -webkit-transition: 0.2s ease all;
+}
+
+.textarea > .bar:before {
+  left: 50%;
+}
+
+.textarea > .bar:after {
+  right: 50%;
+}
+
+/* active state */
+.textarea > textarea:focus ~ .bar:before,
+.textarea > textarea:focus ~ .bar:after {
+  width: 50%;
+}
+
+.dropdown {
+  position: relative;
+}
+
+.dropdown>.icon {
+  position: absolute;
+  top: 1.7rem;
+  right: .2rem;
+}
+
+.dropdown>.textarea>.icon,
+.dropdown>.textarea-outlined>.icon {
+  position: absolute;
+  top: 1.7rem;
+  right: 2rem;
+  color: rgba(150,150,150,1);
+}
+
+.dropdown>menu {
+  z-index: 11;
+  position: absolute;
+  top: 3.8rem;
+  left: 0px;
+  right: 0px;
+  margin: 0;
+  border: solid 1px var(--divider-color);
+  color: var(--text-color);
+  background-color: var(--paper-color);
+  padding: 0;
+  max-height: 20rem;
+  overflow: auto;
+}
+
+.dropdown>menu ul {
+  list-style: none;
+  margin: 0;
+  padding: .5rem 0;
+  cursor: pointer;
+}
+
+.dropdown>menu li {
+  min-height: 2rem;
+  padding: 0 .5rem;
+  display: flex;
+  align-items: center;
+  font-size: .9rem;
+}
+
+.dropdown>menu li:hover {
+  background-color: var(--primary-color-lighter);
+}
+
 .datatable8 {
     overflow: hidden;
     border: solid 0px var(--divider-color);
@@ -1444,6 +1631,190 @@ details[open].tree-node>summary::before {
     justify-content: center;
     align-items: center;
 }
+.planner-box {
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    border: solid 1px var(--divider-color);
+}
+
+.planner-box > header > label { 
+    min-width:13rem;
+}
+
+.planner {
+    flex: 1;
+    display: flex;
+    height: 70rem;
+    overflow-y: auto;
+    margin: 1rem;
+
+    --row-height: 8rem;
+    --column-width: 14rem;
+}
+
+.planner > .column0 {
+    position: -webkit-sticky;
+    position: sticky;
+    left: 0px;
+    z-index: 11;
+    background-color: var(--paper-color);
+    width: var(--column-width);
+    border-right: solid 1px var(--divider-color);
+}
+
+.column-header {
+    width: var(--column-width);
+    background-color: var(--paper-color);
+    height: 2.6rem;
+}
+
+.date-header {
+    display: flex;
+    padding: 0.5rem 1rem;
+    align-items: baseline;
+}
+
+.weekend {
+    background-color: rgb(245, 245, 245);
+}
+
+.month-header {
+    padding: 0.5rem 1rem;
+    border-top: solid 1px var(--divider-color);
+}
+
+.month-header>* {
+    display: none
+}
+
+.month-header.first {
+    border-left: solid 1px var(--divider-color);
+}
+
+.month-header.first>* {
+    display: block
+}
+
+.column0 > .column-header {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0px;
+    height: 6rem;
+    border-bottom: solid 1px var(--divider-color);
+    border-right: solid 1px var(--divider-color);
+}
+
+.row-header {
+    width: var(--column-width);
+    height: var(--row-height);
+    border-bottom: solid 1px var(--divider-color);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.planner > .rows {
+    flex: 1;
+}
+
+.planner .row {
+    height: var(--row-height);
+    border-bottom: solid 1px var(--divider-color);
+    display: flex;
+}
+
+.planner .row0 {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0px;
+    z-index: 10;
+    height: 3rem;
+    background-color: var(--paper-color);
+    border-bottom: solid 1px var(--divider-color);
+}
+
+.planner .row1 {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 3rem;
+    z-index: 10;
+    height: 3rem;
+    background-color: var(--paper-color);
+    border-bottom: solid 1px var(--divider-color);
+}
+
+.planner .cell {
+    width: var(--column-width);
+    height: 100%;
+    padding: 0.5rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    border-right: dotted 1px var(--divider-color);
+}
+
+.photoshoot-icon {
+    border: solid 0px var(--divider-color);
+    border-radius: 4px;
+    flex: 1;
+    height: 100%;
+    padding: 0.5rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: rgba(200, 200, 200, 0.5);
+}
+
+.photoshoot-icon.dragOver {
+    background-color: rgba(225,225,250);
+}
+
+.photoshoot-card {
+    border: solid 1px var(--divider-color);
+    border-radius: 4px;
+    flex: 1;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+
+.photoshoot-card > * {
+    background-color: #FFF;
+    opacity: .8;
+}
+
+.photoshoot-card > header {
+    padding:  0 0.5rem ;
+
+}
+
+.photoshoot-card > main {
+    padding:  0 0.5rem ;
+    flex: 1;
+}
+
+.photoshoot-card > footer {
+    display: flex;
+}
+
+.photoshoot-card.disabled {
+    opacity: 0.3;
+}
+
+.photoshoot-card:hover {
+    cursor: pointer;
+    box-shadow: var(--shadow1);
+}
+
+.expand {
+    flex: 1;
+}
+
+
 .page6 {
     height: 100%;
     color: var(--text-color);
@@ -1457,6 +1828,7 @@ details[open].tree-node>summary::before {
     color: var(--page-menu-color);
     background-color: var(--page-menu-bgcolor);
     border-right: solid 1px var(--divider-color);
+    resize: horizontal;
 }
 
 .page6>header {
@@ -1583,6 +1955,7 @@ details[open].tree-node>summary::before {
 .site6>main {
     grid-area: main;
     overflow: hidden;
+    resize: horizontal;
 }
 
 .site6>aside {