Commit 78dc29e3 authored by  JosephK's avatar JosephK
Browse files

Background image on textual banner

parent 2cc06891
Pipeline #45062 passed with stages
in 1 minute
......@@ -25,6 +25,7 @@
#text {
border: 1px solid #ccc;
padding: 10px;
background-repeat: no-repeat;
}
img, video {
......@@ -118,6 +119,7 @@
#text {
height: 228px; /* 250 - 2 * 10 (padding) - 2 * 1 (border) */
background-position: center 160px;
}
button {
......@@ -127,6 +129,7 @@
@media (width: 728px) {
#text {
height: 68px; /* 90 - 2 * 10 (padding) - 2 * 1 (border) */
background-position: 438px 0px;
}
h1, h2, p {
......
......@@ -177,6 +177,7 @@
condition: s.is.bad('chrome'),
format: ['txt', '300x250', '728x90'],
link: { xx: 'https://www.mozilla.org/firefox/' },
img: 'img/bg/firefox.png',
text: {
en: [
['Drop Google Chrome', 'Surf 2x faster with Firefox Quantum'],
......@@ -193,6 +194,7 @@
condition: (bowser.msedge || bowser.msie),
format: ['txt', '300x250', '728x90'],
link: { xx: 'https://www.mozilla.org/firefox/' },
img: 'img/bg/firefox.png',
text: {
en: ['Your browser is unsecure', 'Firefox protects your data'],
fr: ['Votre navigateur n’est pas sûr', 'Firefox protège vos données'],
......@@ -203,6 +205,7 @@
condition: (bowser.firefox && bowser.version <= 56),
format: ['txt', '300x250', '728x90'],
colors: '#0a84ff,#363959,#363959,#00feff,#ff9400,#cccccc',
img: 'img/bg/firefox.png',
link: { xx: 'https://www.mozilla.org/firefox/' },
text: {
en: ['Firefox Quantum', 'Internet for people, not profit.'],
......@@ -214,6 +217,7 @@
condition: s.is.bad('browser'),
format: ['txt', '300x250', '728x90'],
colors: '#003eaa,#ffffff,#ffffff,#40b6f8,#16da00,#003eaa',
img: 'img/bg/firefox.png',
link: { xx: 'https://www.mozilla.org/firefox/' },
text: {
en: [
......@@ -298,6 +302,7 @@
ubuntu: {
condition: s.is.bad('win10'),
colors: '#e95420,#ffffff,#ffffff,#000000,#5E2750,#cccccc',
img: 'img/bg/ubuntu.png',
format: ['txt', '300x250', '728x90'],
link: {
en: 'https://www.ubuntu.com/desktop',
......@@ -383,6 +388,7 @@
wikipedia: {
condition: true,
format: ['txt', '300x250', '728x90'],
img: 'img/bg/wikipedia.png',
link: {
en: 'https://en.wikipedia.org',
fr: 'https://fr.wikipedia.org',
......@@ -472,7 +478,8 @@
// Add style if exist in params or in data{}
colors = d[id].colors || colors;
s.customize(colors);
const img = d[id].img || '';
s.customize(colors, img);
} else {
s.showInfos(lg);
}
......@@ -542,14 +549,16 @@
}
},
customize(param) {
const [bg, h1, h2, p, btn, bdr] = param.replace(' ', '').toLowerCase().split(',');
customize(colors, img) {
const [bg, h1, h2, p, btn, bdr] = colors.replace(' ', '').toLowerCase().split(',');
const bgImg = (img !== '') ? `background-image: url(${img});` : '';
const style = document.createElement('style');
style.innerHTML = `
#text {
background: ${bg.substr(0, 7)};
background-color: ${bg.substr(0, 7)};
border-color: ${bdr.substr(0, 7)};
${bgImg}
}
#text h1 {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment