react-carbon-ads
Version:
add your `carbon` embed code with jsx
101 lines (89 loc) • 2.08 kB
CSS
.carbon-adds-wrapper {
margin: 40px 0px; }
#carbonads {
--width: 300px;
--font-size: 14px; }
#carbonads {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;
display: block;
overflow: hidden;
margin-bottom: 20px;
max-width: var(--width);
border-radius: 4px;
text-align: center;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
background-color: #fafafa;
font-size: var(--font-size);
line-height: 1.5;
text-align: left;
margin: 0 auto;
margin-bottom: 30px; }
#carbonads a {
color: inherit;
text-decoration: none; }
#carbonads a.carbon-img {
float: left;
padding: 0px;
margin: 0px; }
#carbonads a:hover {
color: inherit; }
#carbonads span {
position: relative;
display: block;
overflow: hidden;
color: #000; }
.carbon-img {
display: block;
margin-bottom: 8px;
max-width: var(--width);
line-height: 1; }
.carbon-img img {
display: block;
margin: 0 auto;
max-width: var(--width) ;
width: auto;
height: 100px;
float: left; }
.carbon-text {
display: block;
padding: 0px;
padding-left: 137px;
padding-right: 4px;
pading-top: 10px;
position: relative;
font-size: 13px; }
.carbon-poweredby {
display: block;
padding: 10px var(--font-size);
text-transform: uppercase;
letter-spacing: .5px;
font-weight: 600;
font-size: 9px;
line-height: 0;
color: #9a9a9a ; }
@media only screen and (min-width: 320px) and (max-width: 759px) {
#carbonads {
float: none;
margin: 0 auto;
max-width: 330px;
margin-bottom: 30px; }
#carbonads span {
position: relative; }
#carbonads > span {
max-width: none; }
.carbon-img {
float: left;
margin: 0; }
.carbon-img img {
max-width: 130px ; }
.carbon-text {
float: left;
margin-bottom: 0;
padding: 8px 20px;
text-align: left;
max-width: calc(100% - 130px - 3em); }
.carbon-poweredby {
left: 130px;
bottom: 0;
display: block;
width: 100%; } }