Update CSS to support select box

This commit is contained in:
Robbie Trencheny 2019-03-09 19:10:55 -08:00
parent f675dc6b52
commit 1c5f0655b3
No known key found for this signature in database
GPG Key ID: 1E236BB235BF0021
2 changed files with 12 additions and 12 deletions

View File

@ -1,11 +1,11 @@
#components-page{ #components-page{
.component-search{ .component-search{
margin-bottom: 24px; margin-bottom: 24px;
input{ input{
width: 100%; width: 100%;
padding: 10px; padding: 10px;
background-color: #fefefe; background-color: #fefefe;
border-radius: 2px; border-radius: 2px;
border: 1px solid; border: 1px solid;
@ -54,7 +54,7 @@
margin-top: 12px; margin-top: 12px;
} }
.added_two_versions_ago { .version_select {
margin-bottom: 12px; margin-bottom: 12px;
} }
@ -76,18 +76,18 @@
// styles for the cards // styles for the cards
.hass-option-cards { .hass-option-cards {
display: -ms-flexbox; display: -ms-flexbox;
display: -webkit-box; display: -webkit-box;
display: -webkit-flexbox; display: -webkit-flexbox;
display: -webkit-flex; display: -webkit-flex;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
margin: -4px; // grid trick, has to match option-card's margin margin: -4px; // grid trick, has to match option-card's margin
p.note{ p.note{
width: 100%; width: 100%;
} }
@ -139,7 +139,7 @@
color: #AAA; color: #AAA;
} }
} }
// fade-in animation // fade-in animation
&.show-items .option-card{ &.show-items .option-card{
opacity:0; opacity:0;
@ -147,7 +147,7 @@
-o-animation:new-item-animation .2s linear forwards; -o-animation:new-item-animation .2s linear forwards;
animation:new-item-animation .2s linear forwards; animation:new-item-animation .2s linear forwards;
} }
// fade-out animation // fade-out animation
&.remove-items .option-card{ &.remove-items .option-card{
-webkit-animation:removed-item-animation .2s cubic-bezier(.55,-0.04,.91,.94) forwards; -webkit-animation:removed-item-animation .2s cubic-bezier(.55,-0.04,.91,.94) forwards;

View File

@ -44,7 +44,7 @@ Support for these components is provided by the Home Assistant community.
<a href='#version/{{ current_version.label }}' class="btn added_in_current_version">Added in {{ current_version.label }} ({{ current_version.new_components_count }})</a> <a href='#version/{{ current_version.label }}' class="btn added_in_current_version">Added in {{ current_version.label }} ({{ current_version.new_components_count }})</a>
<a href='#version/{{ one_version_ago.label }}' class="btn added_one_version_ago">Added in {{ one_version_ago.label }} ({{ one_version_ago.new_components_count }})</a> <a href='#version/{{ one_version_ago.label }}' class="btn added_one_version_ago">Added in {{ one_version_ago.label }} ({{ one_version_ago.new_components_count }})</a>
<a href='#version/{{ two_versions_ago.label }}' class="btn added_two_versions_ago">Added in {{ two_versions_ago.label }} ({{ two_versions_ago.new_components_count }})</a> <a href='#version/{{ two_versions_ago.label }}' class="btn added_two_versions_ago">Added in {{ two_versions_ago.label }} ({{ two_versions_ago.new_components_count }})</a>
Added in <select name="versions"> Added in <select name="versions" class="version_select">
{%- for group in components_by_version -%} {%- for group in components_by_version -%}
<optgroup label="{{ group.label }} ({{group.new_components_count}})"> <optgroup label="{{ group.label }} ({{group.new_components_count}})">
{%- for version in group.versions -%} {%- for version in group.versions -%}