gatsby-openrpc-theme
Version:
A gatsby theme for generated OpenRPC documentation
48 lines • 3.04 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const gatsby_1 = require("gatsby");
const material_1 = require("@mui/material");
const ArrowBack_1 = __importDefault(require("@mui/icons-material/ArrowBack"));
const ArrowForward_1 = __importDefault(require("@mui/icons-material/ArrowForward"));
const NextAndPrev = ({ next, prev }) => {
const theme = (0, material_1.useTheme)();
const isDarkMode = theme.palette.mode === 'dark';
if (!next && !prev) {
return null;
}
return (react_1.default.createElement(material_1.Box, { sx: {
mt: 6,
pt: 2,
borderTop: 1,
borderColor: 'divider',
} },
react_1.default.createElement(material_1.Grid, { container: true, spacing: 2, justifyContent: "space-between" },
react_1.default.createElement(material_1.Grid, { item: true, xs: 12, sm: 6 }, prev && (react_1.default.createElement(material_1.Button, { component: gatsby_1.Link, to: prev.fields.slug, startIcon: react_1.default.createElement(ArrowBack_1.default, null), variant: "outlined", color: "primary", sx: {
textAlign: 'left',
justifyContent: 'flex-start',
width: '100%',
height: '100%',
p: 2,
backgroundColor: isDarkMode ? 'rgba(255, 255, 255, 0.05)' : 'rgba(0, 0, 0, 0.02)',
} },
react_1.default.createElement(material_1.Box, null,
react_1.default.createElement(material_1.Typography, { variant: "caption", display: "block", color: "text.secondary" }, "Previous"),
react_1.default.createElement(material_1.Typography, { variant: "body2", noWrap: true }, prev.frontmatter.title))))),
react_1.default.createElement(material_1.Grid, { item: true, xs: 12, sm: 6 }, next && (react_1.default.createElement(material_1.Button, { component: gatsby_1.Link, to: next.fields.slug, endIcon: react_1.default.createElement(ArrowForward_1.default, null), variant: "outlined", color: "primary", sx: {
textAlign: 'right',
justifyContent: 'flex-end',
width: '100%',
height: '100%',
p: 2,
backgroundColor: isDarkMode ? 'rgba(255, 255, 255, 0.05)' : 'rgba(0, 0, 0, 0.02)',
} },
react_1.default.createElement(material_1.Box, null,
react_1.default.createElement(material_1.Typography, { variant: "caption", display: "block", color: "text.secondary" }, "Next"),
react_1.default.createElement(material_1.Typography, { variant: "body2", noWrap: true }, next.frontmatter.title))))))));
};
exports.default = NextAndPrev;
//# sourceMappingURL=NextAndPrev.js.map