iron-doc-property.css 2.61 KB
/*
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
*/
:host {
  @apply(--paper-font-body1);
  box-sizing: border-box;
  display: block;
  padding: 16px 24px;
}

.type:before {
  content: '\007b'; /* https://github.com/Polymer/polymer/issues/1291 */
}
.type:after {
  content: '\007d'; /* https://github.com/Polymer/polymer/issues/1291 */
}

#transitionMask {
  position: relative;
  overflow: hidden;
}

[hidden] {
  display: none;
}

#signature {
  @apply(--paper-font-code1);
  width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  float: left;
}

#signature .name {
  @apply(--paper-font-code2);
}

:host([function]) #signature {
  position: static;
  width: 100%;
}

:host:not([function]) #signature .params {
  display: none;
}

:host([function]) #type {
  display: none;
}

#details {
  margin-left: 160px;
  flex: 1;
}

@media (max-width: 500px) {
  #details {
    margin-left: 0;
  }
}

/* Metadata */

#meta {
  display: flex;
}

#type {
  @apply(--paper-font-code1);
}

#default {
  flex: 1;
  text-align: right;
}
#default .value {
  @apply(--paper-font-code1);
}

/* Function Parameters */

#params {
  background: rgba(0,0,0,0.05);
  list-style: none;
  margin: 8px -8px 0 -8px;
  padding: 0 8px;
}

#params .type {
  @apply(--paper-font-code1);
}

#params li {
  padding: 4px 0;
}
#params li:first-child {
  padding-top: 8px;
}
#params li:last-child {
  padding-bottom: 8px;
}

#params marked-element {
  display: inline-block;
}
#params .markdown-html p {
  margin: 0;
}

/* Description */

#desc {
  display: block;
}

#desc .markdown-html > :first-child {
  margin-top: 0;
}

#desc .markdown-html > :last-child {
  margin-bottom: 0;
}

#desc .markdown-html code {
  @apply(--paper-font-code1);
}

/* State Transitions */

#transitionMask {
  transition: height ease-in-out 150ms;
}
#meta {
  transition: opacity ease-in-out 150ms;
}
#desc {
  transition: transform ease-in-out 150ms, opacity  ease-in-out 150ms;
}

/* Collapsed State */

:host([_collapsed]) #transitionMask {
  height: 20px; /* 1 line of text */
  overflow: hidden;
}
:host([_collapsed]) #meta {
  opacity: 0;
}
:host([_collapsed]) #desc {
  transform: translateY(-34px);
}
:host([_collapsed][function]) #desc {
  opacity: 0;
}