mirror of https://github.com/vuejs/vitepress
parent
2478b53c07
commit
4ab40bf26b
@ -1,109 +0,0 @@
|
|||||||
<script>
|
|
||||||
import { h, onMounted } from 'vue'
|
|
||||||
|
|
||||||
/* global _bsa */
|
|
||||||
const ID = 'bsa-cpc-script'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'BuySellAds',
|
|
||||||
props: {
|
|
||||||
serve: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
placement: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
setup(props) {
|
|
||||||
function load() {
|
|
||||||
if (typeof _bsa !== 'undefined' && _bsa) {
|
|
||||||
_bsa.init('default', props.serve, `placement:${props.placement}`, {
|
|
||||||
target: '.bsa-cpc',
|
|
||||||
align: 'horizontal',
|
|
||||||
disable_css: 'true'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
if (!document.getElementById(ID)) {
|
|
||||||
const s = document.createElement('script')
|
|
||||||
s.id = ID
|
|
||||||
s.src = `//m.servedby-buysellads.com/monetization.js`
|
|
||||||
document.head.appendChild(s)
|
|
||||||
s.onload = () => {
|
|
||||||
load()
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
load()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
return () =>
|
|
||||||
h('div', { class: 'bsa-cpc-wrapper' }, [h('div', { class: 'bsa-cpc' })])
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.bsa-cpc-wrapper {
|
|
||||||
font-size: 0.95rem;
|
|
||||||
/* from Page.vue */
|
|
||||||
max-width: 50rem;
|
|
||||||
margin: 0px auto;
|
|
||||||
padding: 1rem 2rem 0;
|
|
||||||
margin-bottom: -1rem;
|
|
||||||
}
|
|
||||||
@media (max-width: 419px) {
|
|
||||||
.bsa-cpc-wrapper {
|
|
||||||
padding: 0 1.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.bsa-cpc {
|
|
||||||
font-size: 0.9em;
|
|
||||||
background-color: #f8f8f8;
|
|
||||||
border-radius: 6px;
|
|
||||||
}
|
|
||||||
.bsa-cpc a._default_ {
|
|
||||||
text-align: left;
|
|
||||||
display: block;
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 10px 15px 12px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: #666;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 18px;
|
|
||||||
}
|
|
||||||
.bsa-cpc a._default_ .default-image img {
|
|
||||||
height: 20px;
|
|
||||||
border-radius: 3px;
|
|
||||||
vertical-align: middle;
|
|
||||||
position: relative;
|
|
||||||
top: -1px;
|
|
||||||
}
|
|
||||||
.bsa-cpc a._default_ .default-title {
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
.bsa-cpc a._default_ .default-description:after {
|
|
||||||
font-size: 0.85em;
|
|
||||||
content: 'Sponsored';
|
|
||||||
color: #1c90f3;
|
|
||||||
border: 1px solid #1c90f3;
|
|
||||||
border-radius: 3px;
|
|
||||||
padding: 0 4px 1px;
|
|
||||||
margin-left: 6px;
|
|
||||||
}
|
|
||||||
.bsa-cpc .default-ad {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.bsa-cpc a._default_ .default-image,
|
|
||||||
.bsa-cpc a._default_ .default-title,
|
|
||||||
.bsa-cpc a._default_ .default-description {
|
|
||||||
display: inline;
|
|
||||||
vertical-align: middle;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -1,68 +0,0 @@
|
|||||||
<script>
|
|
||||||
import { h, onMounted, ref } from 'vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'CarbonAds',
|
|
||||||
props: {
|
|
||||||
serve: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
placement: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
setup(props) {
|
|
||||||
const el = ref()
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
const s = document.createElement('script')
|
|
||||||
s.id = '_carbonads_js'
|
|
||||||
s.src = `//cdn.carbonads.com/carbon.js?serve=${props.serve}&placement=${props.placement}`
|
|
||||||
el.value.appendChild(s)
|
|
||||||
})
|
|
||||||
|
|
||||||
return () => h('div', { class: 'carbon-ads', ref: el })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.carbon-ads {
|
|
||||||
min-height: 102px;
|
|
||||||
padding: 1.5rem 1.5rem 0;
|
|
||||||
margin-bottom: 0.5rem;
|
|
||||||
font-size: 0.75rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carbon-ads a {
|
|
||||||
color: #444;
|
|
||||||
font-weight: normal;
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carbon-ads .carbon-img {
|
|
||||||
float: left;
|
|
||||||
margin-right: 1rem;
|
|
||||||
border: 1px solid var(--border-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.carbon-ads .carbon-img img {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.carbon-ads .carbon-poweredby {
|
|
||||||
color: #999;
|
|
||||||
display: block;
|
|
||||||
margin-top: 0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 719px) {
|
|
||||||
.carbon-ads .carbon-img img {
|
|
||||||
width: 100px;
|
|
||||||
height: 77px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Reference in new issue