From 594d8539a5bc69f2d8a06a94620dc4d59bd18fd2 Mon Sep 17 00:00:00 2001 From: Cesar Date: Mon, 25 Apr 2016 15:41:08 -0400 Subject: [PATCH 01/11] DropdownStyle: Added new dropdown sass style --- demo/index.html | 2 +- lib/common/components/DropDown/dropdown.scss | 46 ++++++++++---------- 2 files changed, 25 insertions(+), 23 deletions(-) diff --git a/demo/index.html b/demo/index.html index 0c4ccf2c..119c3c40 100644 --- a/demo/index.html +++ b/demo/index.html @@ -16,7 +16,7 @@ frameborder="0" scrolling="0" width="130px" height="30px"> - + diff --git a/lib/common/components/DropDown/dropdown.scss b/lib/common/components/DropDown/dropdown.scss index d9d2ef4b..93f6721c 100644 --- a/lib/common/components/DropDown/dropdown.scss +++ b/lib/common/components/DropDown/dropdown.scss @@ -1,13 +1,12 @@ @import '../../styles/variables'; -$silver: #666D71; -$background-silver: #EEEFEF; -$border: darken($background-silver, 2%); - :host { .dk-select { max-width: 100%; - font-family: $headers-font; + font-family: $headers-font, $headers-font-family; + font-size: .929em; + min-width: 100px; + width: auto; } .dk-selected:after { @@ -15,16 +14,11 @@ $border: darken($background-silver, 2%); } // button - .dk-selected { - color: $silver; - border-color: $silver; - padding: 0.4em 0.9em 0.4em 0.4em; - border-radius: 0.4rem; - } - - .dk-select-open-down .dk-selected { - border-radius: 0.4rem; + color: $secondary-color; + border-color: rgba($secondary-color, .5); + padding: 0.15em 0.6em 0.2em 0.5em; + border-radius: $border-radius; } .dk-select-open-down .dk-selected, .dk-selected:focus, .dk-selected:hover { @@ -34,37 +28,45 @@ $border: darken($background-silver, 2%); // tick .dk-selected:before { - border-top-color: $silver; + border-top-color: $secondary-color; border-width: .35em .35em 0; } .dk-select-open-down .dk-selected:before, .dk-select-open-up .dk-selected:before { border-bottom-color: $primary-color; - border-width: 0 .35em .35em; } // items .dk-select-multi:focus .dk-select-options, .dk-select-open-down .dk-select-options, .dk-select-open-up .dk-select-options { - border-color: $silver; + border-color: rgba($secondary-color, .2); + } + + .dk-select-options .dk-option-highlight { + background: #ffffff; } .dk-select-options { margin-top: 0.2em; - border-radius: 0.4em; + padding: 0; + border-radius: $border-radius; + box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.08) !important } .dk-option { - color: $black; - padding: 0.4em 0.4em; + color: $secondary-color; + padding: 0.16em 0.6em 0.2em 0.5em; &:hover { - background-color: $background-silver; + background-color: rgba($secondary-color, .12); + } + &:focus { + background-color: rgba($secondary-color, .12); } } .dk-option-selected { - background-color: $background-silver; + background-color: rgba(0, 0, 0, 0.05)!important; } } From 7612c1694a4fdd213e6aedf5c982574837ad36bf Mon Sep 17 00:00:00 2001 From: Cesar Date: Mon, 25 Apr 2016 15:42:16 -0400 Subject: [PATCH 02/11] DropdownStyle: Revert 80 after .io --- demo/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/demo/index.html b/demo/index.html index 119c3c40..0c4ccf2c 100644 --- a/demo/index.html +++ b/demo/index.html @@ -16,7 +16,7 @@ frameborder="0" scrolling="0" width="130px" height="30px"> - + From b65d8c96e5329492b135f0b33d03ce19772c4e4b Mon Sep 17 00:00:00 2001 From: Roman Hotsiy Date: Thu, 28 Apr 2016 20:17:38 +0300 Subject: [PATCH 03/11] Handle additional properties (fixes #4) --- .../JsonSchema/json-schema-common.scss | 6 +----- lib/components/JsonSchema/json-schema.html | 6 +++++- lib/components/JsonSchema/json-schema.js | 19 +++++++++++++++++-- lib/components/JsonSchema/json-schema.scss | 4 ++++ 4 files changed, 27 insertions(+), 8 deletions(-) diff --git a/lib/components/JsonSchema/json-schema-common.scss b/lib/components/JsonSchema/json-schema-common.scss index c03e356b..4b2d2953 100644 --- a/lib/components/JsonSchema/json-schema-common.scss +++ b/lib/components/JsonSchema/json-schema-common.scss @@ -70,7 +70,7 @@ $sub-schema-offset: ($bullet-size/2) + $bullet-margin; } .param-type { - color: $black; + color: rgba($black, 0.4); font-size: 0.929em; line-height: $param-name-height; vertical-align: middle; @@ -83,10 +83,6 @@ $sub-schema-offset: ($bullet-size/2) + $bullet-margin; font-weight: $base-font-weight; } -.param-type { - color: rgba($black, 0.4); -} - .param-type.with-hint { display: inline-block; margin-bottom: 0.4em; diff --git a/lib/components/JsonSchema/json-schema.html b/lib/components/JsonSchema/json-schema.html index f633f901..173a80ad 100644 --- a/lib/components/JsonSchema/json-schema.html +++ b/lib/components/JsonSchema/json-schema.html @@ -11,7 +11,11 @@