Added loadCSS(). Now css links are no longer required for both footer and navbar.
This commit is contained in:
parent
b234e14298
commit
58c108a229
7 changed files with 17 additions and 19 deletions
|
@ -6,16 +6,14 @@
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
|
|
||||||
<script src="lib/anime.min.js"></script>
|
<script src="../lib/anime.min.js"></script>
|
||||||
<script src="js/base.js"></script>
|
<script src="../js/base.js"></script>
|
||||||
|
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||||
rel="stylesheet">
|
rel="stylesheet">
|
||||||
<link href="css/base.css" rel="stylesheet">
|
|
||||||
<link href="css/navbar.css" rel="stylesheet">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -14,8 +14,6 @@
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||||
rel="stylesheet">
|
rel="stylesheet">
|
||||||
<link href="../css/base.css" rel="stylesheet">
|
|
||||||
<link href="../css/navbar.css" rel="stylesheet">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -14,8 +14,6 @@
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||||
rel="stylesheet">
|
rel="stylesheet">
|
||||||
<link href="../css/base.css" rel="stylesheet">
|
|
||||||
<link href="../css/navbar.css" rel="stylesheet">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -14,9 +14,6 @@
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||||
rel="stylesheet">
|
rel="stylesheet">
|
||||||
<link href="css/base.css" rel="stylesheet">
|
|
||||||
<link href="css/navbar.css" rel="stylesheet">
|
|
||||||
<link href="css/footer.css" rel="stylesheet">
|
|
||||||
<link href="css/index.css" rel="stylesheet">
|
<link href="css/index.css" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
|
|
@ -14,8 +14,6 @@
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||||
rel="stylesheet">
|
rel="stylesheet">
|
||||||
<link href="../css/base.css" rel="stylesheet">
|
|
||||||
<link href="../css/navbar.css" rel="stylesheet">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -14,8 +14,6 @@
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
|
||||||
rel="stylesheet">
|
rel="stylesheet">
|
||||||
<link href="../css/base.css" rel="stylesheet">
|
|
||||||
<link href="../css/navbar.css" rel="stylesheet">
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
19
js/base.js
19
js/base.js
|
@ -20,7 +20,7 @@ function load(urlHTML, elementHTML, urlJS, elementJS) {
|
||||||
})
|
})
|
||||||
.catch(
|
.catch(
|
||||||
function (err) {
|
function (err) {
|
||||||
console.warn('Could not load the Navbar.', err)
|
console.warn('Could not load '+urlHTML+': Add the correct tag ?', err);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -32,7 +32,7 @@ function loadHTML(url, element) {
|
||||||
element.innerHTML = htmltext;
|
element.innerHTML = htmltext;
|
||||||
}).catch(
|
}).catch(
|
||||||
function (err) {
|
function (err) {
|
||||||
console.warn('Could not load the Navbar.', err)
|
console.warn('Could not load '+url+': Add the correct tag ?', err);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -43,6 +43,13 @@ function loadJS(url, element) {
|
||||||
element.appendChild(scriptTag);
|
element.appendChild(scriptTag);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function loadCSS(url, element) {
|
||||||
|
var linkTag = document.createElement('link');
|
||||||
|
linkTag.rel = "stylesheet";
|
||||||
|
linkTag.href = url;
|
||||||
|
element.appendChild(linkTag);
|
||||||
|
}
|
||||||
|
|
||||||
function ready(callback) {
|
function ready(callback) {
|
||||||
// in case the document is already rendered
|
// in case the document is already rendered
|
||||||
if (document.readyState != 'loading') callback();
|
if (document.readyState != 'loading') callback();
|
||||||
|
@ -88,7 +95,11 @@ function concatPath(slashNum, basePath)
|
||||||
/* main */
|
/* main */
|
||||||
/****************************************/
|
/****************************************/
|
||||||
|
|
||||||
|
var headTag = document.getElementsByTagName("head")[0];
|
||||||
window.addEventListener('load', function () {
|
window.addEventListener('load', function () {
|
||||||
load(urlStr+"components/navbar.html", document.getElementsByTagName("Navbar")[0], urlStr+"js/navbar.js", this.document.getElementsByTagName("head")[0]);
|
loadCSS(urlStr+"css/base.css", headTag);
|
||||||
load(urlStr+"components/footer.html", document.getElementsByTagName("Footer")[0], urlStr+"js/footer.js", this.document.getElementsByTagName("head")[0]);
|
loadCSS(urlStr+"css/navbar.css", headTag);
|
||||||
|
load(urlStr+"components/navbar.html", document.getElementsByTagName("Navbar")[0], urlStr+"js/navbar.js", headTag);
|
||||||
|
loadCSS(urlStr+"css/footer.css", headTag);
|
||||||
|
load(urlStr+"components/footer.html", document.getElementsByTagName("Footer")[0], urlStr+"js/footer.js", headTag);
|
||||||
})
|
})
|
Loading…
Add table
Reference in a new issue