Files
website/src/client/site/common/adsense/adsense.scss
T
Andrew Miner ebf3443e96 Update Adsense to place ads on all devices
The current adsense implementation only places ads on desktop-sized
screens.  This change allows ads of the appropriate size to be
displayed on any device.

fixes #224
2016-05-03 20:25:56 -07:00

70 lines
1.5 KiB
SCSS

//
// Crafting Guide - adsense.scss
//
// Copyright © 2014-2016 by Redwood Labs
// All rights reserved.
//
.view__adsense {
left : 50%;
margin : $size-margin-large 0;
position : relative;
transform : translate(-50%);
ins {
position: absolute; top: 0; right: 0; bottom: 0; left: 0;
}
&.large-mobile-banner {
height : $size-ad-large-mobile-banner-height;
width : $size-ad-large-mobile-banner-width;
&.placeholder:before {
font-size : $font-size-large;
}
}
&.leaderboard {
height : $size-ad-leaderboard-height;
width : $size-ad-leaderboard-width;
&.placeholder:before {
font-size : $font-size-xxlarge;
}
}
&.skyscraper {
height : $size-ad-skyscraper-height;
width : $size-ad-skyscraper-width;
&.placeholder:before {
transform : rotate(90deg);
font-size : $font-size-xxlarge;
}
&:first-child {
margin-top : 0;
}
}
&.placeholder {
border : $size-border-small solid $color-gray-faint;
display : flex;
align-items : center;
justify-content : center;
&:before {
color : $color-gray-faint;
content : "GOOGLE ADSENSE";
font-family : $font-family-control;
letter-spacing : $size-margin-small;
white-space : nowrap;
}
}
}
.view__mod_tile + .view__adsense {
margin-top : 0;
}