liquid_feedback_frontend

annotate style/mdl/list/_list.scss @ 1532:3c15fea3f1c0

Added FirstLife group mirroring
author bsw
date Sun Oct 04 16:31:47 2020 +0200 (2020-10-04)
parents 32cc544d5a5b
children
rev   line source
bsw/jbe@1309 1 /**
bsw/jbe@1309 2 * Copyright 2015 Google Inc. All Rights Reserved.
bsw/jbe@1309 3 *
bsw/jbe@1309 4 * Licensed under the Apache License, Version 2.0 (the "License");
bsw/jbe@1309 5 * you may not use this file except in compliance with the License.
bsw/jbe@1309 6 * You may obtain a copy of the License at
bsw/jbe@1309 7 *
bsw/jbe@1309 8 * http://www.apache.org/licenses/LICENSE-2.0
bsw/jbe@1309 9 *
bsw/jbe@1309 10 * Unless required by applicable law or agreed to in writing, software
bsw/jbe@1309 11 * distributed under the License is distributed on an "AS IS" BASIS,
bsw/jbe@1309 12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
bsw/jbe@1309 13 * See the License for the specific language governing permissions and
bsw/jbe@1309 14 * limitations under the License.
bsw/jbe@1309 15 */
bsw/jbe@1309 16
bsw/jbe@1309 17 @import "../variables";
bsw/jbe@1309 18 @import "../mixins";
bsw/jbe@1309 19
bsw/jbe@1309 20
bsw/jbe@1309 21 .mdl-list {
bsw/jbe@1309 22 display: block;
bsw/jbe@1309 23 padding: $list-border 0;
bsw/jbe@1309 24 list-style: none;
bsw/jbe@1309 25 }
bsw/jbe@1309 26
bsw/jbe@1309 27 .mdl-list__item {
bsw/jbe@1309 28 @include typo-subhead();
bsw/jbe@1309 29 line-height: 1;
bsw/jbe@1309 30 display: flex;
bsw/jbe@1309 31 min-height: $list-min-height;
bsw/jbe@1309 32 box-sizing: border-box;
bsw/jbe@1309 33 flex-direction: row;
bsw/jbe@1309 34 flex-wrap: nowrap;
bsw/jbe@1309 35 align-items: center;
bsw/jbe@1309 36 padding: $list-min-padding;
bsw/jbe@1309 37 cursor: default;
bsw/jbe@1309 38 color: $list-main-text-text-color;
bsw/jbe@1309 39 overflow: hidden;
bsw/jbe@1309 40
bsw/jbe@1309 41 & .mdl-list__item-primary-content {
bsw/jbe@1309 42 order: 0;
bsw/jbe@1309 43 flex-grow: 2;
bsw/jbe@1309 44 text-decoration: none;
bsw/jbe@1309 45 box-sizing: border-box;
bsw/jbe@1309 46 display: flex;
bsw/jbe@1309 47 align-items: center;
bsw/jbe@1309 48
bsw/jbe@1309 49 & .mdl-list__item-icon {
bsw/jbe@1309 50 margin-right: $list-icon-text-left-distance - $list-icon-size - $list-min-padding;
bsw/jbe@1309 51 }
bsw/jbe@1309 52
bsw/jbe@1309 53 & .mdl-list__item-avatar {
bsw/jbe@1309 54 margin-right: $list-avatar-text-left-distance - $list-avatar-size - $list-min-padding;
bsw/jbe@1309 55 }
bsw/jbe@1309 56 }
bsw/jbe@1309 57
bsw/jbe@1309 58 & .mdl-list__item-secondary-content {
bsw/jbe@1309 59 display: flex;
bsw/jbe@1309 60 flex-flow: column;
bsw/jbe@1309 61 align-items: flex-end;
bsw/jbe@1309 62 margin-left: $list-min-padding;
bsw/jbe@1309 63
bsw/jbe@1309 64 & .mdl-list__item-secondary-action label { display: inline; }
bsw/jbe@1309 65 & .mdl-list__item-secondary-info {
bsw/jbe@1309 66 @include typo-caption();
bsw/jbe@1309 67 color: $list-supporting-text-text-color;
bsw/jbe@1309 68 }
bsw/jbe@1309 69 & .mdl-list__item-sub-header {
bsw/jbe@1309 70 padding: 0 0 0 $list-min-padding;
bsw/jbe@1309 71 }
bsw/jbe@1309 72 }
bsw/jbe@1309 73 }
bsw/jbe@1309 74
bsw/jbe@1309 75 .mdl-list__item-icon,
bsw/jbe@1309 76 .mdl-list__item-icon.material-icons {
bsw/jbe@1309 77 height: $list-icon-size;
bsw/jbe@1309 78 width: $list-icon-size;
bsw/jbe@1309 79 font-size: $list-icon-size;
bsw/jbe@1309 80 box-sizing: border-box;
bsw/jbe@1309 81 color: $list-icon-color;
bsw/jbe@1309 82 }
bsw/jbe@1309 83
bsw/jbe@1309 84 .mdl-list__item-avatar,
bsw/jbe@1309 85 .mdl-list__item-avatar.material-icons {
bsw/jbe@1309 86 height: $list-avatar-size;
bsw/jbe@1309 87 width: $list-avatar-size;
bsw/jbe@1309 88 box-sizing: border-box;
bsw/jbe@1309 89 border-radius: 50%;
bsw/jbe@1309 90 // Set a background colour in case the user doesn't provide an image.
bsw/jbe@1309 91 background-color: $list-icon-color;
bsw/jbe@1309 92 // Set a font size and color in case the user provides a Material Icon.
bsw/jbe@1309 93 font-size: $list-avatar-size;
bsw/jbe@1309 94 color: $list-avatar-color;
bsw/jbe@1309 95 }
bsw/jbe@1309 96
bsw/jbe@1309 97 .mdl-list__item--two-line {
bsw/jbe@1309 98 height: $list-two-line-height;
bsw/jbe@1309 99
bsw/jbe@1309 100 & .mdl-list__item-primary-content {
bsw/jbe@1309 101 height: $list-two-line-height - $list-min-padding - $list-bottom-padding;
bsw/jbe@1309 102 line-height: 20px;
bsw/jbe@1309 103 display: block;
bsw/jbe@1309 104
bsw/jbe@1309 105 & .mdl-list__item-avatar{
bsw/jbe@1309 106 float: left;
bsw/jbe@1309 107 }
bsw/jbe@1309 108
bsw/jbe@1309 109 & .mdl-list__item-icon {
bsw/jbe@1309 110 float: left;
bsw/jbe@1309 111 // Icons are aligned to center of text in a two line list.
bsw/jbe@1309 112 margin-top:
bsw/jbe@1309 113 ($list-two-line-height - $list-min-padding - $list-bottom-padding -
bsw/jbe@1309 114 $list-icon-size) / 2;
bsw/jbe@1309 115 }
bsw/jbe@1309 116
bsw/jbe@1309 117 & .mdl-list__item-secondary-content {
bsw/jbe@1309 118 height: $list-two-line-height - $list-min-padding - $list-bottom-padding;
bsw/jbe@1309 119 }
bsw/jbe@1309 120
bsw/jbe@1309 121 & .mdl-list__item-sub-title {
bsw/jbe@1309 122 @include typo-body-1();
bsw/jbe@1309 123 line-height: 18px;
bsw/jbe@1309 124 color: $list-supporting-text-text-color;
bsw/jbe@1309 125 display: block;
bsw/jbe@1309 126 padding: 0;
bsw/jbe@1309 127 }
bsw/jbe@1309 128 }
bsw/jbe@1309 129 }
bsw/jbe@1309 130
bsw/jbe@1309 131 .mdl-list__item--three-line {
bsw/jbe@1309 132 height: $list-three-line-height;
bsw/jbe@1309 133
bsw/jbe@1309 134 & .mdl-list__item-primary-content {
bsw/jbe@1309 135 height: $list-three-line-height - $list-min-padding - $list-bottom-padding;
bsw/jbe@1309 136 line-height: 20px;
bsw/jbe@1309 137 display: block;
bsw/jbe@1309 138
bsw/jbe@1309 139 & .mdl-list__item-avatar,
bsw/jbe@1309 140 & .mdl-list__item-icon {
bsw/jbe@1309 141 float: left;
bsw/jbe@1309 142 }
bsw/jbe@1309 143 }
bsw/jbe@1309 144
bsw/jbe@1309 145 & .mdl-list__item-secondary-content {
bsw/jbe@1309 146 height: $list-three-line-height - $list-min-padding - $list-bottom-padding;
bsw/jbe@1309 147 }
bsw/jbe@1309 148
bsw/jbe@1309 149 & .mdl-list__item-text-body {
bsw/jbe@1309 150 @include typo-body-1();
bsw/jbe@1309 151 line-height: 18px;
bsw/jbe@1309 152 height: $list-three-line-height - $list-min-padding - $list-bottom-padding;
bsw/jbe@1309 153 color: $list-supporting-text-text-color;
bsw/jbe@1309 154 display: block;
bsw/jbe@1309 155 padding: 0;
bsw/jbe@1309 156 }
bsw/jbe@1309 157 }

Impressum / About Us