diff options
Diffstat (limited to 'sass/partials/_banner.scss')
| -rw-r--r-- | sass/partials/_banner.scss | 109 |
1 files changed, 109 insertions, 0 deletions
diff --git a/sass/partials/_banner.scss b/sass/partials/_banner.scss new file mode 100644 index 0000000..3164048 --- /dev/null +++ b/sass/partials/_banner.scss @@ -0,0 +1,109 @@ +#banner{ + margin-bottom: 30px; + position: relative; + height: 300px; + @include user-select(none); + .image{ + width: 1120px; + position: absolute; + left: 40px; + height: 100%; + overflow: hidden; + background: #000; + .wrap{ + position: absolute; + left: 0; + height: 100%; + } + img{ + height: 100%; + position: absolute; + &:first-child{ + display: block; + } + } + } + .loading, .error{ + width: 1200px; + height: 100%; + position: absolute; + top: 0; + left: 0; + background: #000; + color: #fff; + &:before{ + position: absolute; + top: 50%; + margin-top: -20px; + width: 100%; + text-align: center; + font: 40px/1 $symbol; + } + div{ + position: absolute; + top: 50%; + width: 100%; + text-align: center; + margin-top: 40px; + } + } + .loading{ + &:before{ + content: "P"; + } + } + .error{ + &:before{ + content: "'"; + } + } + .prev, .next{ + position: absolute; + height: 100%; + width: 35px; + background: $black; + cursor: pointer; + &:before{ + position: absolute; + top: 50%; + font: 20px/1 $symbol; + color: #fff; + margin-top: -10px; + } + &:hover{ + background: #000; + } + } + .prev{ + left: 0; + &:before{ + content: "<"; + left: 10px; + } + } + .next{ + right: 0; + &:before{ + content: ">"; + right: 10px; + } + } + .dots{ + position: absolute; + bottom: -40px; + right: 0; + z-index: 1; + li{ + display: inline-block; + margin-left: 10px; + background: $black; + cursor: pointer; + overflow: hidden; + position: relative; + @include square(10px); + &.current, &:hover{ + background: $main; + } + } + } +}
\ No newline at end of file |