File size: 3,470 Bytes
c73f86b ec0311d c73f86b e2a780e c73f86b e2a780e c73f86b e2a780e c73f86b e2a780e |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 |
---
import Analytics from "../components/Analytics/Analytics.astro";
export interface Props {
permalink?: string;
title?: string;
description?: string;
}
const {
permalink = "",
title = "driver.js",
description = "A light-weight, no-dependency, vanilla JavaScript library to drive user's focus across the page.",
} = Astro.props;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>{title}</title>
<meta name="robots" content="index,follow" />
<meta name="description" itemprop="description" content={description} />
<link href={`https://driverjs.com${permalink}`} rel="canonical" />
<meta content="Kamran Ahmed" name="author" />
<meta content="summary_large_image" name="twitter:card" />
<meta content="@kamrify" name="twitter:creator" />
<meta content="1200" property="og:image:width" />
<meta content="630" property="og:image:height" />
<meta content="https://driverjs.com/og-img.png" property="og:image" />
<meta content="driverjs.com" property="og:image:alt" />
<meta content="driverjs.com" property="og:site_name" />
<meta content="Driver.js" property="og:title" />
<meta
content="A light-weight, no-dependency, vanilla JavaScript library to drive user's focus across the page."
property="og:description"
/>
<meta content="website" property="og:type" />
<meta content="https://driverjs.com/" property="og:url" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<style is:global>
.driver-popover.driverjs-theme {
background-color: #fde047;
color: #000;
}
.driver-popover.driverjs-theme .driver-popover-title {
font-size: 20px;
}
.driver-popover.driverjs-theme .driver-popover-title,
.driver-popover.driverjs-theme .driver-popover-description,
.driver-popover.driverjs-theme .driver-popover-progress-text {
color: #000;
}
.driver-popover.driverjs-theme button {
flex: 1;
text-align: center;
background-color: #000;
color: #ffffff;
border: 1px solid #000;
text-shadow: none;
font-size: 14px;
padding: 5px 8px;
border-radius: 6px;
}
.driver-popover.driverjs-theme button:focus,
.driver-popover.driverjs-theme button:hover {
background-color: #000;
opacity: 0.8;
color: #ffffff;
}
.driver-popover.driverjs-theme .driver-popover-navigation-btns {
justify-content: space-between;
gap: 3px;
}
.driver-popover.driverjs-theme .driver-popover-close-btn {
color: #9b9b9b;
}
.driver-popover.driverjs-theme .driver-popover-close-btn:hover {
color: #000;
}
.driver-popover.driverjs-theme .driver-popover-arrow-side-left.driver-popover-arrow {
border-left-color: #fde047;
}
.driver-popover.driverjs-theme .driver-popover-arrow-side-right.driver-popover-arrow {
border-right-color: #fde047;
}
.driver-popover.driverjs-theme .driver-popover-arrow-side-top.driver-popover-arrow {
border-top-color: #fde047;
}
.driver-popover.driverjs-theme .driver-popover-arrow-side-bottom.driver-popover-arrow {
border-bottom-color: #fde047;
}
</style>
</head>
<body>
<slot />
<Analytics />
</body>
</html>
|