corbin/FRCBanner
1
0
Fork 0
mirror of https://github.com/frc1418/banners.css.git synced 2026-03-09 13:46:41 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

SASS & LESS copies

Browse Source
This commit is contained in:
ErikBoesen
2016-09-12 10:23:40 -04:00
parent ffb26ae604
commit e772eb1d5b
3 changed files with 153 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
banners.less Normal file
View File

@@ -0,0 +1,89 @@
@blue: #0f4bcb;
@font-face {
font-family: 'Adam';
src: url('adam.otf') format('opentype');
unicode-range: U+0000-00FF;
}
.banners {
box-sizing: border-box;
margin: 0;
padding: 0;
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
li {
background: @blue;
color: white;
display: inline-block;
font-family: 'Adam', sans-serif;
line-height: 1.2;
margin: 0 3px 30px;
padding: 10px;
position: relative;
text-align: center;
vertical-align: top;
white-space: normal;
width: 120px;
&:after {
border-bottom: 20px transparent solid;
border-top-width: 5px;
border: 60px solid @color0;
content: '';
display: block;
left: 0;
position: absolute;
top: 100%;
}
}
img {
margin-bottom: 5px;
width: 75px;
}
}
.banner {
background: @color0;
box-sizing: border-box;
color: white;
display: inline-block;
font-family: 'Adam', sans-serif;
line-height: 1.2;
margin: 0;
margin: 0 3px 30px;
padding: 0;
padding: 10px;
position: relative;
text-align: center;
vertical-align: top;
white-space: normal;
width: 120px;
img {
margin-bottom: 5px;
width: 75px;
}
&:after {
border-bottom: 20px transparent solid;
border-top-width: 5px;
border: 60px solid @blue;
content: '';
display: block;
left: 0;
position: absolute;
top: 100%;
}
}
.banner-parent {
overflow: scroll;
width: 100%;
.banners {
white-space: nowrap;
width: auto;
}
}
.banners li, .banners li:after, .banner, .banner:after {
-webkit-filter: drop-shadow(0 10px 5px rgba(0, 0, 0, .1));
filter: drop-shadow(0 10px 5px rgba(0, 0, 0, .1));
}