Skip to content

Commit

Permalink
new version
Browse files Browse the repository at this point in the history
  • Loading branch information
Ben Rubin authored and Ben Rubin committed Jul 20, 2016
1 parent c576c76 commit 3bea928
Show file tree
Hide file tree
Showing 6 changed files with 128 additions and 89 deletions.
2 changes: 1 addition & 1 deletion bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "angular-material-expansion-panel",
"version": "0.4.8",
"version": "0.5.0",
"description": "Material Design Expansion Panels.",
"main": [
"dist/md-expansion-panel.js",
Expand Down
81 changes: 37 additions & 44 deletions dist/md-expansion-panel.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@ md-expansion-panel {
md-expansion-panel md-expansion-panel-footer .md-expansion-panel-footer-container,
md-expansion-panel md-expansion-panel-header .md-expansion-panel-header-container {
border-color: #DDD; }
md-expansion-panel .md-expansion-panel-icon-container .md-expansion-panel-icon {
color: #999; }
md-expansion-panel .md-expansion-panel-icon svg {
fill: #999; }
md-expansion-panel[disabled] md-expansion-panel-collapsed {
color: #DDD; }
md-expansion-panel:not(.md-open):not([disabled]):focus,
Expand All @@ -41,10 +41,10 @@ md-expansion-panel {
margin-top: 0; }
md-expansion-panel.md-close {
overflow: hidden; }
md-expansion-panel.md-open {
md-expansion-panel:not(.md-no-animation).md-open {
-webkit-transition: margin-top 0.12s cubic-bezier(0.25, 0.8, 0.25, 1), margin-bottom 0.12s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: margin-top 0.12s cubic-bezier(0.25, 0.8, 0.25, 1), margin-bottom 0.12s cubic-bezier(0.25, 0.8, 0.25, 1); }
md-expansion-panel.md-close {
md-expansion-panel:not(.md-no-animation).md-close {
-webkit-transition: margin-top 0.08s cubic-bezier(0.25, 0.8, 0.25, 1), margin-bottom 0.08s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: margin-top 0.08s cubic-bezier(0.25, 0.8, 0.25, 1), margin-bottom 0.08s cubic-bezier(0.25, 0.8, 0.25, 1); }

Expand Down Expand Up @@ -74,7 +74,7 @@ md-expansion-panel-header .md-summary {
white-space: nowrap; }

/* --- Expansion Panel Collapsed ---- */
md-expansion-panel-collapsed {
md-expansion-panel md-expansion-panel-collapsed {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
Expand All @@ -84,38 +84,41 @@ md-expansion-panel-collapsed {
opacity: 1;
z-index: 2;
box-sizing: border-box; }
md-expansion-panel-collapsed.md-absolute {
md-expansion-panel md-expansion-panel-collapsed.md-absolute {
position: absolute; }
md-expansion-panel-collapsed.md-show {
-webkit-transition: opacity 0.03s linear;
transition: opacity 0.03s linear;
-webkit-transition-delay: 0.03s;
transition-delay: 0.03s; }
md-expansion-panel-collapsed.md-hide {
-webkit-transition: opacity 0.1s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: opacity 0.1s cubic-bezier(0.25, 0.8, 0.25, 1);
md-expansion-panel md-expansion-panel-collapsed.md-hide {
opacity: 0; }

md-expansion-panel:not(.md-no-animation) md-expansion-panel-collapsed.md-show {
-webkit-transition: opacity 0.03s linear;
transition: opacity 0.03s linear; }

md-expansion-panel:not(.md-no-animation) md-expansion-panel-collapsed.md-hide {
-webkit-transition: opacity 0.1s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: opacity 0.1s cubic-bezier(0.25, 0.8, 0.25, 1); }

/* --- Expansion Panel Expanded --- */
md-expansion-panel-expanded {
md-expansion-panel md-expansion-panel-expanded {
display: none;
min-height: 48px; }
md-expansion-panel-expanded.md-show {
-webkit-transition: max-height 0.12s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.12s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: max-height 0.12s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.12s cubic-bezier(0.25, 0.8, 0.25, 1); }
md-expansion-panel-expanded.md-hide {
-webkit-transition: max-height 0.08s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.08s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: max-height 0.08s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.08s cubic-bezier(0.25, 0.8, 0.25, 1); }
md-expansion-panel-expanded.md-show, md-expansion-panel-expanded.md-hide {
md-expansion-panel md-expansion-panel-expanded.md-show, md-expansion-panel md-expansion-panel-expanded.md-hide {
display: block; }
md-expansion-panel-expanded.md-scroll-y {
md-expansion-panel md-expansion-panel-expanded.md-scroll-y {
overflow-y: auto; }
md-expansion-panel-expanded.md-overflow {
md-expansion-panel md-expansion-panel-expanded.md-overflow {
overflow: hidden; }
md-expansion-panel-expanded md-expansion-panel-content {
md-expansion-panel md-expansion-panel-expanded md-expansion-panel-content {
display: block;
padding: 16px 24px; }

md-expansion-panel:not(.md-no-animation) md-expansion-panel-expanded.md-show {
-webkit-transition: max-height 0.12s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.12s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: max-height 0.12s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.12s cubic-bezier(0.25, 0.8, 0.25, 1); }

md-expansion-panel:not(.md-no-animation) md-expansion-panel-expanded.md-hide {
-webkit-transition: max-height 0.06s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.06s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: max-height 0.06s cubic-bezier(0.25, 0.8, 0.25, 1), opacity 0.06s cubic-bezier(0.25, 0.8, 0.25, 1); }

/* --- Expansion Panel Header --- */
md-expansion-panel-header {
display: block;
Expand Down Expand Up @@ -162,26 +165,16 @@ md-expansion-panel-footer {
z-index: 2; }

/* --- expand icon --- */
md-expansion-panel .md-expansion-panel-icon-container:first-child {
padding-right: 12px; }
md-expansion-panel:not(.md-no-animation) .md-expansion-panel-icon {
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: -webkit-transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1); }

md-expansion-panel .md-expansion-panel-icon-container .md-expansion-panel-icon:after {
font-family: 'mdMaterialIcons';
font-size: 18px;
font-weight: 600;
display: block;
content: '\e315';
position: relative;
speak: none;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), -webkit-transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }

md-expansion-panel.md-open > md-expansion-panel-collasped .md-expansion-panel-icon-container .md-expansion-panel-icon:after,
md-expansion-panel.md-open > md-expansion-panel-header .md-expansion-panel-icon-container .md-expansion-panel-icon:after {
md-expansion-panel .md-expansion-panel-icon:first-child {
margin-right: 18px; }

md-expansion-panel.md-open .md-expansion-panel-icon {
-webkit-transform: rotate(90deg);
transform: rotate(90deg); }

Expand Down
Loading

0 comments on commit 3bea928

Please sign in to comment.