My browser shows only the default BootStrap fonts
Is it possible to fix this problem without using Sass?
Other Details
Using Live Server Vscode Extension
I’m a beginner
I like green tea
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bootstrap demo</title>
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<style>
@import url('https://fonts.googleapis.com/css2?family=Danfo&display=swap');
:rout,
[data-bs-theme=light] {
--bs-body-font-family: "Danfo" !important;
}
:rout,
[data-bs-theme=dark] {
--bs-body-font-family: "Danfo" !important;
}
</style>
</head>
<body>
<div class="container text-center">
<div class="row g=0">
<div class="col-auto bg-primary text-white">Font</div>
<div class="col-5 bg-danger text-white">Welcome, Home...</div>
</div>
<div class="row">
<div class="col bg-black text-white">Welcome, Home...</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script>
</body>
</html>```