File size: 3,243 Bytes
c73f86b ec0311d c73f86b 4dcc03d 06ea972 c73f86b 4dcc03d 1821efa bf612c7 c73f86b 4b04f2c ec303d1 4b04f2c c73f86b ec0311d c73f86b |
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 |
---
import Analytics from "../components/Analytics/Analytics.astro";
export interface Props {
title: string;
}
export interface BaseLayoutProps extends 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: 2px 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: #424242;
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> |