mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

update shared components

Browse source
This commit is contained in:
Luke Pulverenti 2016-03-09 12:40:22 -05:00
parent fb269362ff
commit 71811cb9e3
221 changed files with 32936 additions and 101 deletions
Download patch file Download diff file Expand all files Collapse all files

157
dashboard-ui/bower_components/material-design-lite/src/list/_list.scss vendored Normal file
View file

@ -0,0 +1,157 @@
/**
* Copyright 2015 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
@import "../variables";
@import "../mixins";
.mdl-list {
display: block;
padding: $list-border 0;
list-style: none;
}
.mdl-list__item {
@include typo-subhead();
line-height: 1;
display: flex;
min-height: $list-min-height;
box-sizing: border-box;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
padding: $list-min-padding;
cursor: default;
color: $list-main-text-text-color;
overflow: hidden;
& .mdl-list__item-primary-content {
order: 0;
flex-grow: 2;
text-decoration: none;
box-sizing: border-box;
display: flex;
align-items: center;
& .mdl-list__item-icon {
margin-right: $list-icon-text-left-distance - $list-icon-size - $list-min-padding;
}
& .mdl-list__item-avatar {
margin-right: $list-avatar-text-left-distance - $list-avatar-size - $list-min-padding;
}
}
& .mdl-list__item-secondary-content {
display: flex;
flex-flow: column;
align-items: flex-end;
margin-left: $list-min-padding;
& .mdl-list__item-secondary-action label { display: inline; }
& .mdl-list__item-secondary-info {
@include typo-caption();
color: $list-supporting-text-text-color;
}
& .mdl-list__item-sub-header {
padding: 0 0 0 $list-min-padding;
}
}
}
.mdl-list__item-icon,
.mdl-list__item-icon.material-icons {
height: $list-icon-size;
width: $list-icon-size;
font-size: $list-icon-size;
box-sizing: border-box;
color: $list-icon-color;
}
.mdl-list__item-avatar,
.mdl-list__item-avatar.material-icons {
height: $list-avatar-size;
width: $list-avatar-size;
box-sizing: border-box;
border-radius: 50%;
// Set a background colour in case the user doesn't provide an image.
background-color: $list-icon-color;
// Set a font size and color in case the user provides a Material Icon.
font-size: $list-avatar-size;
color: $list-avatar-color;
}
.mdl-list__item--two-line {
height: $list-two-line-height;
& .mdl-list__item-primary-content {
height: $list-two-line-height - $list-min-padding - $list-bottom-padding;
line-height: 20px;
display: block;
& .mdl-list__item-avatar{
float: left;
}
& .mdl-list__item-icon {
float: left;
// Icons are aligned to center of text in a two line list.
margin-top:
($list-two-line-height - $list-min-padding - $list-bottom-padding -
$list-icon-size) / 2;
}
& .mdl-list__item-secondary-content {
height: $list-two-line-height - $list-min-padding - $list-bottom-padding;
}
& .mdl-list__item-sub-title {
@include typo-body-1();
line-height: 18px;
color: $list-supporting-text-text-color;
display: block;
padding: 0;
}
}
}
.mdl-list__item--three-line {
height: $list-three-line-height;
& .mdl-list__item-primary-content {
height: $list-three-line-height - $list-min-padding - $list-bottom-padding;
line-height: 20px;
display: block;
& .mdl-list__item-avatar,
& .mdl-list__item-icon {
float: left;
}
}
& .mdl-list__item-secondary-content {
height: $list-three-line-height - $list-min-padding - $list-bottom-padding;
}
& .mdl-list__item-text-body {
@include typo-body-1();
line-height: 18px;
height: $list-three-line-height - $list-min-padding - $list-bottom-padding;
color: $list-supporting-text-text-color;
display: block;
padding: 0;
}
}

32
dashboard-ui/bower_components/material-design-lite/src/list/snippets/action.html vendored Normal file
View file

@ -0,0 +1,32 @@
<!-- List items with avatar and action -->
<style>
.demo-list-action {
width: 300px;
}
</style>
<div class="demo-list-action mdl-list">
<div class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Bryan Cranston</span>
</span>
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</div>
<div class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Aaron Paul</span>
</span>
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</div>
<div class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Bob Odenkirk</span>
</span>
<span class="mdl-list__item-secondary-content">
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</div>
</div>

27
dashboard-ui/bower_components/material-design-lite/src/list/snippets/icon.html vendored Normal file
View file

@ -0,0 +1,27 @@
<!-- Icon List -->
<style>
.demo-list-icon {
width: 300px;
}
</style>
<ul class="demo-list-icon mdl-list">
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-icon">person</i>
Bryan Cranston
</span>
</li>
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-icon">person</i>
Aaron Paul
</span>
</li>
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-icon">person</i>
Bob Odenkirk
</span>
</li>
</ul>

46
dashboard-ui/bower_components/material-design-lite/src/list/snippets/list-control.html vendored Normal file
View file

@ -0,0 +1,46 @@
<!-- List with avatar and controls -->
<style>
.demo-list-control {
width: 300px;
}
.demo-list-radio {
display: inline;
}
</style>
<ul class="demo-list-control mdl-list">
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
Bryan Cranston
</span>
<span class="mdl-list__item-secondary-action">
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="list-checkbox-1">
<input type="checkbox" id="list-checkbox-1" class="mdl-checkbox__input" checked />
</label>
</span>
</li>
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
Aaron Paul
</span>
<span class="mdl-list__item-secondary-action">
<label class="demo-list-radio mdl-radio mdl-js-radio mdl-js-ripple-effect" for="list-option-1">
<input type="radio" id="list-option-1" class="mdl-radio__button" name="options" value="1" checked />
</label>
</span>
</li>
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
Bob Odenkirk
</span>
<span class="mdl-list__item-secondary-action">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="list-switch-1">
<input type="checkbox" id="list-switch-1" class="mdl-switch__input" checked />
</label>
</span>
</li>
</ul>

24
dashboard-ui/bower_components/material-design-lite/src/list/snippets/list-item.html vendored Normal file
View file

@ -0,0 +1,24 @@
<!-- Simple list -->
<style>
.demo-list-item {
width: 300px;
}
</style>
<ul class="demo-list-item mdl-list">
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
Bryan Cranston
</span>
</li>
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
Aaron Paul
</span>
</li>
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
Bob Odenkirk
</span>
</li>
</ul>

48
dashboard-ui/bower_components/material-design-lite/src/list/snippets/three-line.html vendored Normal file
View file

@ -0,0 +1,48 @@
<!-- Three Line List with secondary info and action -->
<style>
.demo-list-three {
width: 650px;
}
</style>
<ul class="demo-list-three mdl-list">
<li class="mdl-list__item mdl-list__item--three-line">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Bryan Cranston</span>
<span class="mdl-list__item-text-body">
Bryan Cranston played the role of Walter in Breaking Bad. He is also known
for playing Hal in Malcom in the Middle.
</span>
</span>
<span class="mdl-list__item-secondary-content">
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</li>
<li class="mdl-list__item mdl-list__item--three-line">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Aaron Paul</span>
<span class="mdl-list__item-text-body">
Aaron Paul played the role of Jesse in Breaking Bad. He also featured in
the "Need For Speed" Movie.
</span>
</span>
<span class="mdl-list__item-secondary-content">
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</li>
<li class="mdl-list__item mdl-list__item--three-line">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Bob Odenkirk</span>
<span class="mdl-list__item-text-body">
Bob Odinkrik played the role of Saul in Breaking Bad. Due to public fondness for the
character, Bob stars in his own show now, called "Better Call Saul".
</span>
</span>
<span class="mdl-list__item-secondary-content">
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</li>
</ul>

40
dashboard-ui/bower_components/material-design-lite/src/list/snippets/two-line.html vendored Normal file
View file

@ -0,0 +1,40 @@
<!-- Two Line List with secondary info and action -->
<style>
.demo-list-two {
width: 300px;
}
</style>
<ul class="demo-list-two mdl-list">
<li class="mdl-list__item mdl-list__item--two-line">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Bryan Cranston</span>
<span class="mdl-list__item-sub-title">62 Episodes</span>
</span>
<span class="mdl-list__item-secondary-content">
<span class="mdl-list__item-secondary-info">Actor</span>
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</li>
<li class="mdl-list__item mdl-list__item--two-line">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Aaron Paul</span>
<span class="mdl-list__item-sub-title">62 Episodes</span>
</span>
<span class="mdl-list__item-secondary-content">
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</li>
<li class="mdl-list__item mdl-list__item--two-line">
<span class="mdl-list__item-primary-content">
<i class="material-icons mdl-list__item-avatar">person</i>
<span>Bob Odenkirk</span>
<span class="mdl-list__item-sub-title">62 Episodes</span>
</span>
<span class="mdl-list__item-secondary-content">
<a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
</span>
</li>
</ul>