gerrit.onap Code Review - vnfsdk/refrepo.git/blob

   1 /*!
   2  * Angular Material Design
   3  * https://github.com/angular/material
   4  * @license MIT
   5  * v1.1.3
   6  */
   7 md-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-icon > svg {
  46           height: inherit;
  47           width: inherit; }
  48       md-card md-card-header md-card-avatar + md-card-header-text {
  49         max-height: 40px; }
  50         md-card md-card-header md-card-avatar + md-card-header-text .md-title {
  51           font-size: 14px; }
  52     md-card md-card-header md-card-header-text {
  53       display: -webkit-box;
  54       display: -webkit-flex;
  55       display: flex;
  56       -webkit-box-flex: 1;
  57       -webkit-flex: 1;
  58               flex: 1;
  59       -webkit-box-orient: vertical;
  60       -webkit-box-direction: normal;
  61       -webkit-flex-direction: column;
  62               flex-direction: column; }
  63       md-card md-card-header md-card-header-text .md-subhead {
  64         font-size: 14px; }
  65   md-card > img,
  66   md-card > md-card-header img,
  67   md-card md-card-title-media img {
  68     box-sizing: border-box;
  69     display: -webkit-box;
  70     display: -webkit-flex;
  71     display: flex;
  72     -webkit-box-flex: 0;
  73     -webkit-flex: 0 0 auto;
  74             flex: 0 0 auto;
  75     width: 100%;
  76     height: auto; }
  77   md-card md-card-title {
  78     padding: 24px 16px 16px;
  79     display: -webkit-box;
  80     display: -webkit-flex;
  81     display: flex;
  82     -webkit-box-flex: 1;
  83     -webkit-flex: 1 1 auto;
  84             flex: 1 1 auto;
  85     -webkit-box-orient: horizontal;
  86     -webkit-box-direction: normal;
  87     -webkit-flex-direction: row;
  88             flex-direction: row; }
  89     md-card md-card-title + md-card-content {
  90       padding-top: 0; }
  91     md-card md-card-title md-card-title-text {
  92       -webkit-box-flex: 1;
  93       -webkit-flex: 1;
  94               flex: 1;
  95       -webkit-box-orient: vertical;
  96       -webkit-box-direction: normal;
  97       -webkit-flex-direction: column;
  98               flex-direction: column;
  99       display: -webkit-box;
 100       display: -webkit-flex;
 101       display: flex; }
 102       md-card md-card-title md-card-title-text .md-subhead {
 103         padding-top: 0;
 104         font-size: 14px; }
 105       md-card md-card-title md-card-title-text:only-child .md-subhead {
 106         padding-top: 12px; }
 107     md-card md-card-title md-card-title-media {
 108       margin-top: -8px; }
 109       md-card md-card-title md-card-title-media .md-media-sm {
 110         height: 80px;
 111         width: 80px; }
 112       md-card md-card-title md-card-title-media .md-media-md {
 113         height: 112px;
 114         width: 112px; }
 115       md-card md-card-title md-card-title-media .md-media-lg {
 116         height: 152px;
 117         width: 152px; }
 118   md-card md-card-content {
 119     display: block;
 120     padding: 16px; }
 121     md-card md-card-content > p:first-child {
 122       margin-top: 0; }
 123     md-card md-card-content > p:last-child {
 124       margin-bottom: 0; }
 125     md-card md-card-content .md-media-xl {
 126       height: 240px;
 127       width: 240px; }
 128   md-card .md-actions, md-card md-card-actions {
 129     margin: 8px; }
 130     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) {
 131       margin: 2px 0; }
 132       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 {
 133         margin-top: 0; }
 134       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 {
 135         margin-bottom: 0; }
 136     md-card .md-actions.layout-column .md-button.md-icon-button, md-card md-card-actions.layout-column .md-button.md-icon-button {
 137       margin-top: 6px;
 138       margin-bottom: 6px; }
 139     md-card .md-actions md-card-icon-actions, md-card md-card-actions md-card-icon-actions {
 140       -webkit-box-flex: 1;
 141       -webkit-flex: 1;
 142               flex: 1;
 143       -webkit-box-pack: start;
 144       -webkit-justify-content: flex-start;
 145               justify-content: flex-start;
 146       display: -webkit-box;
 147       display: -webkit-flex;
 148       display: flex;
 149       -webkit-box-orient: horizontal;
 150       -webkit-box-direction: normal;
 151       -webkit-flex-direction: row;
 152               flex-direction: row; }
 153     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) {
 154       margin: 0 4px; }
 155       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 {
 156         margin-left: 0; }
 157         [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 {
 158           margin-left: auto;
 159           margin-right: 0; }
 160       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 {
 161         margin-right: 0; }
 162         [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 {
 163           margin-right: auto;
 164           margin-left: 0; }
 165     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 {
 166       margin-left: 6px;
 167       margin-right: 6px; }
 168       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 {
 169         margin-left: 12px; }
 170         [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 {
 171           margin-left: auto;
 172           margin-right: 12px; }
 173       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 {
 174         margin-right: 12px; }
 175         [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 {
 176           margin-right: auto;
 177           margin-left: 12px; }
 178     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 {
 179       -webkit-box-flex: 1;
 180       -webkit-flex: 1;
 181               flex: 1;
 182       -webkit-box-pack: end;
 183       -webkit-justify-content: flex-end;
 184               justify-content: flex-end;
 185       display: -webkit-box;
 186       display: -webkit-flex;
 187       display: flex;
 188       -webkit-box-orient: horizontal;
 189       -webkit-box-direction: normal;
 190       -webkit-flex-direction: row;
 191               flex-direction: row; }
 192   md-card md-card-footer {
 193     margin-top: auto;
 194     padding: 16px; }
 195
 196 @media screen and (-ms-high-contrast: active) {
 197   md-card {
 198     border: 1px solid #fff; } }
 199
 200 .md-image-no-fill > img {
 201   width: auto;
 202   height: auto; }