arnaucube
arnaucube/commonroutesAppPublic Self-hosted repository
commonroutesApp/www/lib/angular-material/modules/js/card/card.css
www/lib/angular-material/modules/js/card/card.cssRaw
  1/*!
  2 * Angular Material Design
  3 * https://github.com/angular/material
  4 * @license MIT
  5 * v1.1.1
  6 */
  7md-card {
  8  box-sizing: border-box;
  9  display: -webkit-box;
 10  display: -webkit-flex;
 11  display: flex;
 12  -webkit-box-orient: vertical;
 13  -webkit-box-direction: normal;
 14  -webkit-flex-direction: column;
 15          flex-direction: column;
 16  margin: 8px;
 17  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12); }
 18  md-card md-card-header {
 19    padding: 16px;
 20    display: -webkit-box;
 21    display: -webkit-flex;
 22    display: flex;
 23    -webkit-box-orient: horizontal;
 24    -webkit-box-direction: normal;
 25    -webkit-flex-direction: row;
 26            flex-direction: row; }
 27    md-card md-card-header:first-child md-card-avatar {
 28      margin-right: 12px; }
 29      [dir=rtl] md-card md-card-header:first-child md-card-avatar {
 30        margin-right: auto;
 31        margin-left: 12px; }
 32    md-card md-card-header:last-child md-card-avatar {
 33      margin-left: 12px; }
 34      [dir=rtl] md-card md-card-header:last-child md-card-avatar {
 35        margin-left: auto;
 36        margin-right: 12px; }
 37    md-card md-card-header md-card-avatar {
 38      width: 40px;
 39      height: 40px; }
 40      md-card md-card-header md-card-avatar .md-user-avatar,
 41      md-card md-card-header md-card-avatar md-icon {
 42        border-radius: 50%; }
 43      md-card md-card-header md-card-avatar md-icon {
 44        padding: 8px; }
 45      md-card md-card-header md-card-avatar + md-card-header-text {
 46        max-height: 40px; }
 47        md-card md-card-header md-card-avatar + md-card-header-text .md-title {
 48          font-size: 14px; }
 49    md-card md-card-header md-card-header-text {
 50      display: -webkit-box;
 51      display: -webkit-flex;
 52      display: flex;
 53      -webkit-box-flex: 1;
 54      -webkit-flex: 1;
 55              flex: 1;
 56      -webkit-box-orient: vertical;
 57      -webkit-box-direction: normal;
 58      -webkit-flex-direction: column;
 59              flex-direction: column; }
 60      md-card md-card-header md-card-header-text .md-subhead {
 61        font-size: 14px; }
 62  md-card > img,
 63  md-card > md-card-header img,
 64  md-card md-card-title-media img {
 65    box-sizing: border-box;
 66    display: -webkit-box;
 67    display: -webkit-flex;
 68    display: flex;
 69    -webkit-box-flex: 0;
 70    -webkit-flex: 0 0 auto;
 71            flex: 0 0 auto;
 72    width: 100%;
 73    height: auto; }
 74  md-card md-card-title {
 75    padding: 24px 16px 16px;
 76    display: -webkit-box;
 77    display: -webkit-flex;
 78    display: flex;
 79    -webkit-box-flex: 1;
 80    -webkit-flex: 1 1 auto;
 81            flex: 1 1 auto;
 82    -webkit-box-orient: horizontal;
 83    -webkit-box-direction: normal;
 84    -webkit-flex-direction: row;
 85            flex-direction: row; }
 86    md-card md-card-title + md-card-content {
 87      padding-top: 0; }
 88    md-card md-card-title md-card-title-text {
 89      -webkit-box-flex: 1;
 90      -webkit-flex: 1;
 91              flex: 1;
 92      -webkit-box-orient: vertical;
 93      -webkit-box-direction: normal;
 94      -webkit-flex-direction: column;
 95              flex-direction: column;
 96      display: -webkit-box;
 97      display: -webkit-flex;
 98      display: flex; }
 99      md-card md-card-title md-card-title-text .md-subhead {
100        padding-top: 0;
101        font-size: 14px; }
102      md-card md-card-title md-card-title-text:only-child .md-subhead {
103        padding-top: 12px; }
104    md-card md-card-title md-card-title-media {
105      margin-top: -8px; }
106      md-card md-card-title md-card-title-media .md-media-sm {
107        height: 80px;
108        width: 80px; }
109      md-card md-card-title md-card-title-media .md-media-md {
110        height: 112px;
111        width: 112px; }
112      md-card md-card-title md-card-title-media .md-media-lg {
113        height: 152px;
114        width: 152px; }
115  md-card md-card-content {
116    display: block;
117    padding: 16px; }
118    md-card md-card-content > p:first-child {
119      margin-top: 0; }
120    md-card md-card-content > p:last-child {
121      margin-bottom: 0; }
122    md-card md-card-content .md-media-xl {
123      height: 240px;
124      width: 240px; }
125  md-card .md-actions, md-card md-card-actions {
126    margin: 8px; }
127    md-card .md-actions.layout-column .md-button:not(.md-icon-button), md-card md-card-actions.layout-column .md-button:not(.md-icon-button) {
128      margin: 2px 0; }
129      md-card .md-actions.layout-column .md-button:not(.md-icon-button):first-of-type, md-card md-card-actions.layout-column .md-button:not(.md-icon-button):first-of-type {
130        margin-top: 0; }
131      md-card .md-actions.layout-column .md-button:not(.md-icon-button):last-of-type, md-card md-card-actions.layout-column .md-button:not(.md-icon-button):last-of-type {
132        margin-bottom: 0; }
133    md-card .md-actions.layout-column .md-button.md-icon-button, md-card md-card-actions.layout-column .md-button.md-icon-button {
134      margin-top: 6px;
135      margin-bottom: 6px; }
136    md-card .md-actions md-card-icon-actions, md-card md-card-actions md-card-icon-actions {
137      -webkit-box-flex: 1;
138      -webkit-flex: 1;
139              flex: 1;
140      -webkit-box-pack: start;
141      -webkit-justify-content: flex-start;
142              justify-content: flex-start;
143      display: -webkit-box;
144      display: -webkit-flex;
145      display: flex;
146      -webkit-box-orient: horizontal;
147      -webkit-box-direction: normal;
148      -webkit-flex-direction: row;
149              flex-direction: row; }
150    md-card .md-actions:not(.layout-column) .md-button:not(.md-icon-button), md-card md-card-actions:not(.layout-column) .md-button:not(.md-icon-button) {
151      margin: 0 4px; }
152      md-card .md-actions:not(.layout-column) .md-button:not(.md-icon-button):first-of-type, md-card md-card-actions:not(.layout-column) .md-button:not(.md-icon-button):first-of-type {
153        margin-left: 0; }
154        [dir=rtl] md-card .md-actions:not(.layout-column) .md-button:not(.md-icon-button):first-of-type, [dir=rtl] md-card md-card-actions:not(.layout-column) .md-button:not(.md-icon-button):first-of-type {
155          margin-left: auto;
156          margin-right: 0; }
157      md-card .md-actions:not(.layout-column) .md-button:not(.md-icon-button):last-of-type, md-card md-card-actions:not(.layout-column) .md-button:not(.md-icon-button):last-of-type {
158        margin-right: 0; }
159        [dir=rtl] md-card .md-actions:not(.layout-column) .md-button:not(.md-icon-button):last-of-type, [dir=rtl] md-card md-card-actions:not(.layout-column) .md-button:not(.md-icon-button):last-of-type {
160          margin-right: auto;
161          margin-left: 0; }
162    md-card .md-actions:not(.layout-column) .md-button.md-icon-button, md-card md-card-actions:not(.layout-column) .md-button.md-icon-button {
163      margin-left: 6px;
164      margin-right: 6px; }
165      md-card .md-actions:not(.layout-column) .md-button.md-icon-button:first-of-type, md-card md-card-actions:not(.layout-column) .md-button.md-icon-button:first-of-type {
166        margin-left: 12px; }
167        [dir=rtl] md-card .md-actions:not(.layout-column) .md-button.md-icon-button:first-of-type, [dir=rtl] md-card md-card-actions:not(.layout-column) .md-button.md-icon-button:first-of-type {
168          margin-left: auto;
169          margin-right: 12px; }
170      md-card .md-actions:not(.layout-column) .md-button.md-icon-button:last-of-type, md-card md-card-actions:not(.layout-column) .md-button.md-icon-button:last-of-type {
171        margin-right: 12px; }
172        [dir=rtl] md-card .md-actions:not(.layout-column) .md-button.md-icon-button:last-of-type, [dir=rtl] md-card md-card-actions:not(.layout-column) .md-button.md-icon-button:last-of-type {
173          margin-right: auto;
174          margin-left: 12px; }
175    md-card .md-actions:not(.layout-column) .md-button + md-card-icon-actions, md-card md-card-actions:not(.layout-column) .md-button + md-card-icon-actions {
176      -webkit-box-flex: 1;
177      -webkit-flex: 1;
178              flex: 1;
179      -webkit-box-pack: end;
180      -webkit-justify-content: flex-end;
181              justify-content: flex-end;
182      display: -webkit-box;
183      display: -webkit-flex;
184      display: flex;
185      -webkit-box-orient: horizontal;
186      -webkit-box-direction: normal;
187      -webkit-flex-direction: row;
188              flex-direction: row; }
189  md-card md-card-footer {
190    margin-top: auto;
191    padding: 16px; }
192
193@media screen and (-ms-high-contrast: active) {
194  md-card {
195    border: 1px solid #fff; } }
196
197.md-image-no-fill > img {
198  width: auto;
199  height: auto; }