ares-ide/enyo/samples/DataRepeaterSample.css

A browser-based code editor and UI designer for Enyo 2 projects

.data-repeater-sample, .data-repeater-sample .repeater-item, .data-repeater-sample .name-wrapper, .data-repeater-sample .repeater-item span {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box;}
.data-repeater-sample .repeater-item {width: 100%; width: 320px; height: 100px; color: #FFFFFF; margin-bottom: 10px; position: relative;}
.data-repeater-sample .name-wrapper {position: absolute; height: 35px; top: 50%; left: 0px; margin-top: -17.5px; width: 100%;}
.data-repeater-sample .repeater-item .name {padding: 4px; font-size: 35px; font-weight: bold; line-height: 35px;}
.data-repeater-sample .repeater-item .name.last {font-weight: normal; font-size: 20px; font-style: italic;}
.data-repeater-sample .repeater-item .name.last-letter {display: block; position: absolute; top: 50%; right: 0; margin-top: -25px; text-align: right; font-weight: normal; font-size: 30px; background-color: #FFFFFF; line-height: 42px; height: 50px;
	width: 40px; padding: 5px; border-radius: 25px 0 0 25px;}
.data-repeater-sample .repeater-item.class1 .name.last-letter {color: #FF7200;}
.data-repeater-sample .repeater-item.class2 .name.last-letter {color: #FBAA12;}
.data-repeater-sample .repeater-item.class3 .name.last-letter {color: #067AB5;}
.data-repeater-sample .repeater-item.class4 .name.last-letter {color: #2E92CE;}
.data-repeater-sample .repeater-item.class5 .name.last-letter {color: #333333;}
.data-repeater-sample .repeater-item.class1 {background: #FF7200;}
.data-repeater-sample .repeater-item.class2 {background: #FBAA12;}
.data-repeater-sample .repeater-item.class3 {background: #067AB5;}
.data-repeater-sample .repeater-item.class4 {background: #2E92CE;}
.data-repeater-sample .repeater-item.class5 {background: #333333;}
.data-repeater-sample .repeater-item.class1.selected,
.data-repeater-sample .repeater-item.class2.selected,
.data-repeater-sample .repeater-item.class3.selected,
.data-repeater-sample .repeater-item.class4.selected,
.data-repeater-sample .repeater-item.class5.selected {background: #FFFFFF; color: #000000;}
/* because there is some generic .item css applied with no scope in sampler */
.data-repeater-sample .item {border-bottom: none;}