@mongodb-js/mongodb-ui-components
Version:
A collection of frequently used functional UI components found on mongodb properties
431 lines (418 loc) • 11.1 kB
HTML
<!doctype html>
<html>
<head>
<title>Testing Environment</title>
<style>
@font-face {
font-family: 'Akzidenz Grotesk BQ Light';
src: url('fonts/akzidenzgroteskbq_light-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Akzidenz Grotesk BQ Medium';
src: url('fonts/akzidenzgroteskbq_medium-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
body {
margin: 0;
height: 2000px;
position: relative;
}
* {
box-sizing: border-box;
}
</style>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="/nav/index.css" />
<link rel="stylesheet" href="mongodb-framework.css" />
<link rel="stylesheet" href="mongodb-general.css" />
</head>
<body>
<div id="nav-root" style="position:relative"></div>
<div id="footer-root" style="position:relative;margin-top:1500px"></div>
</body>
<!-- Testing for .com -->
<script src="nav/index.js"></script>
<script src="footer/index.js"></script>
<script>
window.MongoFooter.render('#footer-root', {
languages: [
['English', 'en'],
['Deutsch', 'de'],
['Español', 'es'],
['Français', 'fr'],
['Italiano', 'it'],
['简体中文', 'zh']
]
})
window.MongoNav.render('#nav-root', {
logoUrl: 'https://webassets.mongodb.com/_com_assets/global/mongodb-logo-white.png',
logoHref: 'https://docs.mongodb.com',
top: {
left: [
{text: 'Products', opens: 'products'},
{text: 'Solutions', opens: 'solutions'},
{text: 'Customers', opens: 'customers'},
{text: 'Resources', opens: 'resources'}
],
right: [
{text: 'Docs', opens: 'docs'},
{text: 'What is MongoDB', opens: 'what-is-mongodb'},
{text: 'Contact', href: '/contact'}
]
},
panels: [
{
id: 'products',
height: 408,
sections: [
{
title: 'Cloud',
links: [
{
title: 'MongoDB Atlas',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/atlas'
}, {
title: 'MongoDB Stitch',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'MongoDB Charts (Beta)',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Cloud Migration',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
]
}, {
title: 'Software',
links: [
{
title: 'MongoDB Server',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'MongoDB Mobile',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}, {
title: 'MongoDB Compass',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Cloud Ops Manager',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
]
}, {
title: 'Analytics',
links: [
{
title: 'MongoDB Charts (Beta)',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'MongoDB Connector for BI',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}, {
title: 'MongoDB Connector for Spark',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
]
}, {
title: 'Services',
links: [
{
title: 'Consulting',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Training',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}
]
}
]
}, {
id: 'solutions',
height: 408,
sections: [
{
title: 'Initiatives',
links: [
{
title: 'Legacy Modernization',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/atlas'
}, {
title: 'Data as a Service',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Cloud Data Strategy',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Business Agility',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
]
}, {
title: 'Use Cases',
links: [
{
title: 'Single View',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Internet of Things',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}, {
title: 'Mobile',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Real-Time Analytics',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
]
}, {
links: [
{
title: 'Personalization',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Content Management',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}, {
title: 'Catalog',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Intelligent Apps',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
]
}, {
links: [
{
title: 'Mainframe Offload',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Machine Learninng',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}
]
}
]
}, {
id: 'customers',
height: 318,
width: '1000px',
sections: [
{
title: 'Customer Success Stories',
links: [
{
title: 'Coinbase',
icon: 'logo-coin.png',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/atlas'
}, {
title: 'Cisco',
icon: 'logo-cisco.png',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}
],
link: {
text: 'View all customers',
href: ''
}
}, {
links: [
{
title: 'Genomics England',
icon: 'logo-genomics.png',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: ''
}, {
title: 'Ticketek',
icon: 'logo-ticketek.png',
text: 'Lorum ipsum dolor sit amet, consectetur',
href: '/cloud/stitch'
}
]
}, {
title: 'Industries',
links: [
{
title: 'Government',
href: ''
}, {
title: 'Retail',
href: ''
}, {
title: 'High Tech',
href: ''
}, {
title: 'Financial Services',
href: ''
}
],
link: {
text: 'View all industries',
href: ''
}
}
]
}, {
id: 'resources',
height: 318,
width: '700px',
sections: [
{
title: 'Resources',
links: [
{
title: 'Blog',
href: ''
}, {
title: 'Webinars',
href: ''
}, {
title: 'Presentations',
href: ''
}, {
title: 'White Papers',
href: ''
}
]
}, {
links: [
{
title: 'Datasheets',
href: ''
}, {
title: 'Events',
href: ''
}, {
title: 'University',
href: ''
}, {
title: 'Documentation',
href: ''
}
]
}, {
title: 'Partners',
links: [
{
title: 'Find a Partner',
href: ''
}, {
title: 'Become a Partner',
href: ''
}
]
}
],
callout: {
title: 'Featured Event',
html: `
<p><strong>MongoDB.local</strong> San Francisco</p>
<small class='disp-block'>At your MongoDB.local, you'll learn technologies, tools, and best practices that make it easy for you to build data-driven applications without distraction.</small>
`,
link: {
text: 'Learn more',
href: ''
}
}
}
],
dropdowns: [
{
id: 'docs',
height: 160,
items: [
{
title: 'Documentation',
text: 'Guides to all of our products',
href: ''
}, {
title: 'University',
text: 'Learn MongoDB from MongoDB',
href: ''
}
]
}, {
id: 'what_is_mongodb',
height: 290,
items: [
{
title: 'Architecture',
text: 'Proin fermentum sem nec ipsum',
href: ''
}, {
title: 'Scalability',
text: 'Proin fermentum sem nec ipsum',
href: ''
}, {
title: 'Getting Started with MongoDB',
text: 'Proin fermentum sem nec ipsum',
href: ''
}, {
title: 'The Evolution of MongoDB',
text: 'Proin fermentum sem nec ipsum',
href: ''
}
]
}
],
mobileLinks: [
{
text: 'Contact',
href: '/contact'
}, {
text: 'Docs',
href: ''
}, {
text: 'University',
href: ''
}, {
text: 'What is MongoDB?',
href: '/what-is-mongodb'
}, {
text: 'Architecture',
href: ''
}, {
text: 'Scalability',
href: ''
}, {
text: 'Getting Started with MongoDB',
href: ''
}, {
text: 'The Evolution of MongoDB',
href: ''
}
]
})
</script>
</html>