load css from js

This commit is contained in:
NhanPT 2022-03-25 14:26:21 +07:00
parent b5d52b52d5
commit e9a0dc89ef
3 changed files with 17 additions and 5 deletions

View file

@ -25,7 +25,7 @@ body {
padding: 15px !important;
margin-bottom: 0 !important;
border-radius: 0.7rem !important;
align-items: center;
align-items: end !important;
line-height: 2;
transition: all 0.25s;
display: flex;
@ -35,10 +35,11 @@ body {
.group-items h6 {
align-items: center;
margin-top: 5px !important;
margin-bottom: 0 !important;
margin-left: 0.5em !important;
display: inline-block;
vertical-align: middle;
text-align: center;
vertical-align: bottom !important;
font-weight: bold;
}

View file

@ -9,9 +9,9 @@
<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="../public/css/custom.css">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="../public/css/custom.css">
<link rel="stylesheet" href="css/magma.css">
</head>

View file

@ -1,4 +1,14 @@
// Get CSS
var declaration = document.styleSheets[1].cssRules[0];
var allVar = declaration.style.cssText.split(";");
var cssRootKeys = {}
for (var i = 0; i < allVar.length; i++) {
var a = allVar[i].split(':');
if (a[0] !== "")
cssRootKeys[a[0].trim()] = a[1].trim();
}
// Set Clock
var clock = document.getElementById("clock");
const clockOptions = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric' };
(function clockTick() {
@ -6,5 +16,6 @@ const clockOptions = { weekday: 'long', year: 'numeric', month: 'long', day: 'nu
setTimeout(clockTick, 2000);
})();
var skycons = new Skycons({ "color": "pink" });
// Set weather icon
var skycons = new Skycons({ "color": cssRootKeys["--accentColor"] });
skycons.add("weather-icon", Skycons.PARTLY_CLOUDY_DAY);