@pacem/pacem-theme-less 1.0.0-amaldi

package/pacem/scaffolding/dark/geolocate.less

@@ -0,0 +1,12 @@
+@import "../../../shared";
+@import "../shared";
+
+@{P}-geolocate {
+    .FormFieldItemWrapper();
+
+    @media (min-width: @threshold_lg) {
+        @{P}-suggest:not(.field-stretch) {
+            display: block;
+        }
+    }
+}

package/pacem/scaffolding/dark/hierarchy.less

@@ -0,0 +1,82 @@
+@import "../shared";
+@import "../../ui/shared";
+
+@{P}-hierarchy {
+
+    .hierarchy-level {
+        margin-bottom: @grid_spacing;
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+        align-items: flex-start;
+        flex-wrap: wrap;
+
+        > .hierarchy-item {
+            display: grid;
+            grid-template-columns: auto 1fr auto;
+            column-gap: @grid_spacing/3;
+            margin: @grid_spacing/3;
+            flex: 0 0 auto;
+            border: 2px solid @color_border;
+            cursor: default;
+            user-select: none;
+            background-color: @color_background;
+            border-radius: @border_radius;
+
+            & when(@shadows = true) {
+                box-shadow: 0 2px @grid_spacing/2 rgba(0,0,0,0.25);
+            }
+
+            &.@{PCSS}-dragging.item-drag {
+                border-color: @color_accent;
+            }
+
+            &.@{PCSS}-dropping {
+                border-color: @color_success;
+            }
+
+            &.item-disabled {
+                background-color: @color_disabled;
+                color: @color_disabled_inv;
+            }
+
+            > * {
+                align-self: center;
+            }
+
+            > .item-content {
+                grid-column: 2;
+            }
+
+            > .item-move {
+                grid-column: 1;
+                cursor: move;
+            }
+
+            > .item-link {
+                grid-column: 3;
+                cursor: pointer;
+            }
+
+            > @{P}-icon > i {
+                pointer-events: none;
+            }
+        }
+    }
+
+    &.@{PCSS}-readonly .hierarchy-level > .hierarchy-item > .item-link,
+    .hierarchy-level > .hierarchy-item.item-disabled > .item-link {
+        .Inert();
+    }
+}
+
+svg.@{PCSS}-binder.hierarchy-binder {
+
+    path {
+        cursor: pointer;
+
+        &:hover {
+            opacity: 1;
+        }
+    }
+}

package/pacem/scaffolding/dark/image.less

@@ -0,0 +1,195 @@
+@import "../../../shared";
+@import "../shared";
+
+@_tools_margin: round(@grid_spacing * 1.3333);
+
+@{P}-dialog {
+
+    @{P}-edit-image {
+        overflow: hidden;
+        display: block;
+
+        @{P}-img {
+            display: inline-block;
+            font-size: 0;
+            border: solid @grid_spacing / 3 transparent;
+            width: 25%;
+            box-sizing: border-box;
+            min-height: 90px;
+
+            &.@{PCSS}-selected {
+                border-color: @color_highlight;
+            }
+        }
+
+        .@{PCSS}-edit-image {
+            transition: transform @easing_default .3s;
+            display: flex;
+            flex-direction: row;
+
+            > div {
+                position: relative;
+                flex: 0 0 100%;
+
+                &:nth-child(2) {
+                    display: flex;
+                    justify-content: center;
+                }
+            }
+
+            &.@{PCSS}-snapshot-enabled,
+            &.@{PCSS}-upload-enabled {
+                @{P}-input-search {
+                    margin-right: @_tools_margin;
+                }
+            }
+
+            @{P}-upload {
+                position: absolute;
+                top: 0;
+                right: 0;
+
+                .@{PCSS}-upload-filewrapper:before {
+                    .Icon('file_upload');
+                    cursor: pointer;
+                }
+            }
+
+            @{P}-button.@{PCSS}-snapshot {
+                position: absolute;
+                top: 0;
+                right: 0;
+                width: @grid_spacing;
+                height: @grid_spacing;
+
+                &:before {
+                    .Icon('add_a_photo');
+                }
+            }
+
+            @{P}-snapshot {
+            }
+
+            &.@{PCSS}-snapshot-enabled.@{PCSS}-upload-enabled {
+                @{P}-input-search {
+                    margin-right: @grid_spacing * 4;
+                }
+
+                @{P}-upload {
+                    right: @grid_spacing * 2;
+                }
+            }
+
+            &.@{PCSS}-snapshot {
+                transform: translateX(-100%);
+            }
+        }
+
+        @{P}-progressbar {
+            margin: 2 * @grid_spacing 0;
+
+            .@{PCSS}-progressbar {
+                @_thickness: 10px;
+                @_overall: 32px;
+                .GradientVertical(0, @_overall - @_thickness, @_overall - @_thickness, @_overall, transparent, transparent, rgba(0,0,0,0.1), rgba(0,0,0,0.1));
+            }
+        }
+    }
+}
+
+@{P}-input-image {
+    display: inline-block;
+
+    .@{PCSS}-input-image {
+        position: relative;
+        min-height: 2 * @grid_spacing;
+        .FormFieldItemMultiline();
+        padding-right: @_tools_margin;
+
+        @{P}-img {
+            //min-width: @grid_spacing * 5;
+            min-height: @grid_spacing * 5;
+            width: 100%;
+            height: 100%;
+            background-color: fade(@color_default, 10);
+        }
+
+        .@{PCSS}-input-image-dashboard {
+            position: absolute;
+            right: 0;
+            top: 0;
+            width: @grid_spacing;
+            height: 100%;
+
+            @{P}-button {
+                display: block;
+                font-size: 0;
+                width: @grid_spacing;
+                height: @grid_spacing;
+                background: transparent;
+
+                &.@{PCSS}-edit:before {
+                    .Icon('edit');
+                }
+
+                &.@{PCSS}-clear:before {
+                    .Icon('clear');
+                }
+
+                &::before {
+                    left: 0;
+                    top: 0;
+                }
+            }
+        }
+
+        @{P}-input-url {
+            display: block;
+            margin-top: @grid_spacing/4;
+
+            .@{PCSS}-input {
+                min-width: @field_min_width_wide;
+            }
+        }
+    }
+
+
+    dl {
+        @_h: @grid_spacing * 1.3333;
+        padding: @grid_spacing/6 0;
+        overflow: hidden;
+        height: @_h;
+
+        dt, dd {
+            line-height: @_h * .5;
+            height: @_h * .5;
+        }
+
+        dt {
+            float: left;
+            vertical-align: middle;
+            width: @grid_spacing / 1.5;
+            background: center center no-repeat;
+            background-size: contain;
+            font-size: 0;
+
+            &:nth-of-type(2):before {
+                .Icon('file_download', @grid_spacing * 2 / 4);
+            }
+
+            &:nth-of-type(1):before {
+                .Icon('crop_free', @grid_spacing * 2 / 4);
+            }
+        }
+
+        dd {
+            clear: right;
+            margin-left: @grid_spacing;
+            .FontTech(.8);
+
+            &:nth-of-type(2) {
+                //color: fade(@color_tech, 100);
+            }
+        }
+    }
+}

package/pacem/scaffolding/dark/index.less

@@ -0,0 +1,57 @@
+@{P}-form
+{
+    display: block;
+}
+
+@{P}-input-email,
+@{P}-input-number,
+@{P}-input-password,
+@{P}-input-search,
+@{P}-input-tel,
+@{P}-input-text,
+@{P}-input-code,
+@{P}-input-url,
+@{P}-select,
+@{P}-radio,
+@{P}-checkbox,
+@{P}-calendar-picker,
+@{P}-textarea {
+    display: inline-block;
+}
+
+    .Inert();
+}
+
+label.@{PCSS}-label{
+    user-select: none;
+}
+
+@import "validators";
+@import "input";
+@import "password";
+@import "textarea";
+@import "markdown";
+@import "select";
+@import "datepicker";
+@import "latlng";
+@import "upload";
+@import "checkbox-radio-shared";
+@import "checkbox";
+@import "radio";
+@import "contenteditable";
+@import "search";
+@import "url";
+@import "tel";
+@import "color";
+@import "number";
+@import "suggest";
+@import "tags";
+@import "snapshot";
+@import "image";
+@import "slider";
+@import "namevalue-list";
+@import "char-counter";
+@import "chars";
+@import "formfield";
+@import "form";
+@import "dialog-overrides";

package/pacem/scaffolding/dark/input.less

@@ -0,0 +1,134 @@
+@import "../shared";
+
+@{P}-input-text,
+@{P}-input-chars,
+@{P}-input-password,
+@{P}-input-tel,
+@{P}-input-url,
+@{P}-input-email,
+@{P}-input-search,
+@{P}-suggest,
+@{P}-checkbox,
+@{P}-radio,
+@{P}-textarea,
+@{P}-textarea-markdown,
+@{P}-input-number,
+@{P}-calendar-picker {
+    .FormFieldItemWrapper();
+
+    .@{PCSS}-input {
+        .FormFieldItem();
+        .FormFieldItemInline();
+    }
+
+    &::before {
+        color: @color_input_icon;
+    }
+
+    &.@{PCSS}-focus::before {
+        color: @field_forecolor;
+    }
+}
+
+@media (min-width: @threshold_lg) {
+    @{P}-form-field.field-stretch > @{P}-form > .@{PCSS}-input-container {
+
+        @{P}-input-text,
+        @{P}-input-password,
+        @{P}-input-tel,
+        @{P}-input-url,
+        @{P}-input-email,
+        @{P}-input-search,
+        @{P}-suggest,
+        @{P}-checkbox,
+        @{P}-radio,
+        @{P}-textarea,
+        @{P}-textarea-markdown,
+        @{P}-input-number,
+        @{P}-calendar-picker {
+            min-width: 0;
+        }
+    }
+}
+
+.ToggleBlur() {
+    border-color: transparent;
+    background-color: transparent;
+    padding: 0;
+}
+
+.ToggleAnim() {
+    transition: padding .2s @easing_in_out_sine, background-color .25s linear, border-color .25s linear;
+}
+
+@{P}-form-field.field-toggle {
+    @{P}-input-text,
+    @{P}-input-password,
+    @{P}-input-tel,
+    @{P}-input-url,
+    @{P}-input-email,
+    @{P}-input-search,
+    @{P}-suggest,
+    @{P}-textarea,
+    @{P}-textarea-markdown,
+    @{P}-input-number {
+
+        &:not(.@{PCSS}-focus) > .@{PCSS}-input {
+            .ToggleBlur();
+        }
+    }
+}
+
+@{P}-input-text,
+@{P}-input-password,
+@{P}-input-tel,
+@{P}-input-url,
+@{P}-input-email,
+@{P}-input-search,
+@{P}-suggest,
+@{P}-textarea,
+@{P}-textarea-markdown,
+@{P}-input-number {
+
+    &.input-toggle:not(.@{PCSS}-focus) > .@{PCSS}-input {
+        .ToggleBlur();
+    }
+}
+
+.@{PCSS}-body.@{PCSS}-animations {
+
+    @{P}-form-field.field-toggle {
+        @{P}-input-text,
+        @{P}-input-password,
+        @{P}-input-tel,
+        @{P}-input-url,
+        @{P}-input-email,
+        @{P}-input-search,
+        @{P}-suggest,
+        @{P}-textarea,
+        @{P}-textarea-markdown,
+        @{P}-input-number {
+
+            > .@{PCSS}-input {
+                .ToggleAnim();
+            }
+        }
+    }
+
+
+    @{P}-input-text,
+    @{P}-input-password,
+    @{P}-input-tel,
+    @{P}-input-url,
+    @{P}-input-email,
+    @{P}-input-search,
+    @{P}-suggest,
+    @{P}-textarea,
+    @{P}-textarea-markdown,
+    @{P}-input-number {
+
+        &.input-toggle > .@{PCSS}-input {
+            .ToggleAnim();
+        }
+    }
+}

package/pacem/scaffolding/dark/latlng.less

@@ -0,0 +1,163 @@
+@import "../../../shared";
+@import "../shared";
+
+@{P}-latlng {
+    .FormFieldItemWrapper();
+    .FormFieldItemMultiline();
+
+    .@{PCSS}-map {
+        margin-top: @grid_spacing/2;
+    }
+
+    .@{PCSS}-latlng {
+        .@{PCSS}-latlng-fields {
+
+            display: flex;
+            flex-wrap: nowrap;
+
+            @{P}-input-number {
+                padding-left: @grid_spacing;
+                position: relative;
+                box-sizing: border-box;
+
+                .@{PCSS}-input {
+                    padding-left: @grid_spacing/6;
+                    text-align: left;
+
+                    @media (min-width: @threshold_lg) {
+                        min-width: @field_min_width - @grid_spacing;
+                    }
+                }
+
+
+
+                &.@{PCSS}-lat:before {
+                    .Icon('swap_vert');
+                }
+
+                &.@{PCSS}-lng:before {
+                    .Icon('swap_horiz');
+                }
+
+                &.@{PCSS}-lat:before,
+                &.@{PCSS}-lng:before {
+                    left: 0;
+                    color: @color_default;
+                    line-height: @field_height;
+                }
+            }
+        }
+
+        dl {
+            @_h: ceil(@grid_spacing * 1.3333 * 1.5);
+            @_h_3: @_h/3;
+
+            padding: @grid_spacing/6 0 @grid_spacing/2 0;
+            overflow: hidden;
+            height: @_h;
+
+            dt, dd {
+                height: @_h_3;
+                line-height: $height;
+            }
+
+            dt {
+                float: left;
+                vertical-align: middle;
+                width: @grid_spacing / 1.5;
+                background: center center no-repeat;
+                background-size: contain;
+                font-size: 0;
+
+                &:nth-of-type(3)::before {
+                    .Icon('language', @grid_spacing * 2 / 4);
+                }
+
+                &:nth-of-type(2)::before {
+                    .Icon('location_on', @grid_spacing * 2 / 4);
+                }
+
+                &:nth-of-type(1)::before {
+                    .Icon('short_text', @grid_spacing * 2 / 4);
+                }
+
+                &::before {
+                    position: static !important;
+                    line-height: @_h_3 !important;
+                }
+            }
+
+            dd {
+                clear: right;
+                .FontTech(.8);
+                .Ellipsed(@field_min_width_wide - @grid_spacing/1.5);
+
+                &:nth-of-type(3) {
+                    color: fade(@color_tech, 100);
+
+                    @{P}-span {
+                        position: relative;
+                        padding-left: @grid_spacing;
+                        display: inline-block;
+
+                        &::before {
+                            color: @color_default;
+                            position: absolute;
+                            left: 0;
+                            top: 0;
+                        }
+                    }
+                }
+
+                @{P}-span.@{PCSS}-lat-north::before {
+                    content: 'N';
+                }
+
+                @{P}-span.@{PCSS}-lat-south::before {
+                    content: 'S';
+                }
+
+                @{P}-span.@{PCSS}-lng-east::before {
+                    content: 'E';
+                }
+
+                @{P}-span.@{PCSS}-lng-west::before {
+                    content: 'W';
+                }
+            }
+
+            &.@{PCSS}-hidden {
+                transition: all .3s;
+                transform: none;
+                height: 0;
+            }
+
+            &.@{PCSS}-shown {
+                transition: all .3s /*cubic-bezier(0.23, 1, 0.32, 1)*/ .1s;
+                transform: none;
+            }
+        }
+    }
+
+    .@{PCSS}-readonly {
+        padding-left: @grid_spacing;
+        line-height: @field_height;
+        .Ellipsed(@field_min_width_wide);
+
+        &::before {
+            .Icon('location_on', @field_left);
+            line-height: @field_height;
+            color: @color_primary;
+            left: 0;
+        }
+
+        small {
+            color: fade(@color_default, 60);
+            font-size: .8em;
+
+            &::before {
+                content: ' - ';
+            }
+        }
+    }
+}

package/pacem/scaffolding/dark/markdown.less

@@ -0,0 +1,20 @@
+@import "../shared";
+
+@{P}-textarea-markdown {
+    .FormFieldItemMultiline();
+
+    .@{PCSS}-readonly {
+        line-height: 1;
+    }
+
+    &.@{PCSS}-readonly .@{PCSS}-readonly {
+
+        > *:first-child {
+            margin-top: 0;
+        }
+
+        > *:last-child {
+            margin-bottom: 0;
+        }
+    }
+}

package/pacem/scaffolding/dark/namevalue-list.less

@@ -0,0 +1,13 @@
+@import "../shared";
+
+@{P}-namevalue-list {
+    display: block;
+
+    &.@{PCSS}-readonly {
+        .@{PCSS}-fieldset .@{PCSS}-fieldgroup .fieldgroup-prepend,
+        .@{PCSS}-fieldset .@{PCSS}-fieldgroup .fieldgroup-append {
+            border: none;
+            width: @input_padding_horiz; 
+        }
+    }
+}

package/pacem/scaffolding/dark/number.less

@@ -0,0 +1,12 @@
+@import "../shared";
+
+@{P}-input-number {
+
+    .@{PCSS}-input {
+        text-align: right;
+
+        &:after{
+            content: ' ';
+        }
+    }
+}

package/pacem/scaffolding/dark/password.less

@@ -0,0 +1,12 @@
+@import "../shared";
+
+@{P}-input-password{
+    i.@{PCSS}-icon.@{PCSS}-clickable{
+        margin-left: -@grid_spacing;
+    }
+
+    input[type=password],
+    input[type=text]{
+        padding-right: @grid_spacing * 1.25;
+    }
+}

package/pacem/scaffolding/dark/property-picker.less

@@ -0,0 +1,11 @@
+@import "../../../shared";
+@import "../shared";
+
+@{P}-property-picker {
+    .FormFieldItemWrapper();
+    display: inline-block;
+
+    @{P}-select{
+        display: block;
+    }
+}