mirror of
https://github.com/veggiemonk/awesome-docker.git
synced 2025-01-03 03:31:18 -05:00
Table is production ready
This commit is contained in:
Julien Bisconti
parent
c7b93e9431
commit
c852e15b99
25
build.js
25
build.js
@ -2,6 +2,7 @@ const fs = require('fs');
|
||||
const showdown = require('showdown');
|
||||
const cheerio = require('cheerio');
|
||||
const Parcel = require('parcel-bundler');
|
||||
const sm = require('sitemap');
|
||||
|
||||
process.env.NODE_ENV = 'production';
|
||||
|
||||
@ -63,7 +64,29 @@ const bundle = (dest = destination) => {
|
||||
})
|
||||
.bundle()
|
||||
.then(() => {
|
||||
fs.copyFileSync('website/sitemap.xml', 'dist/sitemap.xml');
|
||||
// Creates a sitemap object given the input configuration with URLs
|
||||
const sitemap = sm.createSitemap({
|
||||
hostname: 'https://awesome-docker.netlify.com/',
|
||||
cacheTime: 6000000, // 600 sec (10 min) cache purge period
|
||||
urls: [
|
||||
{
|
||||
url: '/',
|
||||
changefreq: 'daily',
|
||||
priority: 0.8,
|
||||
lastmodrealtime: true,
|
||||
lastmodfile: 'dist/index.html',
|
||||
},
|
||||
{
|
||||
url: '/table.html',
|
||||
changefreq: 'weekly',
|
||||
priority: 0.8,
|
||||
lastmodrealtime: true,
|
||||
lastmodfile: 'dist/table.html',
|
||||
},
|
||||
],
|
||||
});
|
||||
fs.writeFileSync('dist/sitemap.xml', sitemap.toString());
|
||||
// fs.copyFileSync('website/sitemap.xml', 'dist/sitemap.xml');
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
const fs = require('fs');
|
||||
const cheerio = require('cheerio');
|
||||
const dayjs = require('dayjs');
|
||||
const icons = require('./icons');
|
||||
|
||||
const getLatestFilename = fs.readFileSync('data/latest', 'utf-8');
|
||||
console.log(getLatestFilename);
|
||||
@ -38,6 +37,22 @@ const getLastUpdate = updated => {
|
||||
return updated;
|
||||
};
|
||||
|
||||
const mapHomePage = h => {
|
||||
if (h === 'manageiq.org') return 'https://manageiq.org';
|
||||
else if (h === 'dev-sec.io') return 'https://dev-sec.io';
|
||||
return h;
|
||||
};
|
||||
|
||||
const mapLicense = l => {
|
||||
if (l === 'GNU Lesser General Public License v3.0') return 'GNU LGPL v3.0';
|
||||
else if (l === 'GNU General Public License v2.0') return 'GNU GPL v2.0';
|
||||
else if (l === 'GNU General Public License v3.0') return 'GNU GPL v3.0';
|
||||
else if (l === 'BSD 3-Clause "New" or "Revised" License')
|
||||
return 'BSD 3-Clause';
|
||||
else if (l === 'BSD 2-Clause "Simplified" License') return 'BSD 2-Clause';
|
||||
return l;
|
||||
};
|
||||
|
||||
const formatEntry = (
|
||||
{
|
||||
name,
|
||||
@ -62,19 +77,19 @@ const formatEntry = (
|
||||
updated,
|
||||
)}</p>`,
|
||||
(homepage &&
|
||||
`<a href="${homepage}" class="link ${valueNames[2]}">🔗 website</a>`) ||
|
||||
`<a href="${mapHomePage(homepage)}" class="link ${
|
||||
valueNames[2]
|
||||
}">website</a>`) ||
|
||||
'<p></p>',
|
||||
`<p class="${
|
||||
valueNames[3]
|
||||
} timestamp" data-timestamp="${stargazers}">⭐️${stargazers}</p>`,
|
||||
(language &&
|
||||
`<p class="${valueNames[5]}">${icons[language] ||
|
||||
'💻'}${language}</p>`) ||
|
||||
'<p></p>',
|
||||
(language && `<p class="${valueNames[5]}">💻${language}</p>`) || '<p></p>',
|
||||
(license &&
|
||||
`<a href="${license.url}" class="link ${valueNames[6]}">📃 ${
|
||||
license.name
|
||||
}</a>`) ||
|
||||
license.url !== null &&
|
||||
`<a href="${license.url}" class="link ${valueNames[6]}">${mapLicense(
|
||||
license.name,
|
||||
)}</a>`) ||
|
||||
'<p></p>',
|
||||
owner &&
|
||||
`<p>Made by </p><a href="${owner.html_url}" class="link ${
|
||||
@ -102,21 +117,6 @@ function main() {
|
||||
].join(''),
|
||||
);
|
||||
|
||||
$('body').append(
|
||||
'<script src="//cdnjs.cloudflare.com/ajax/libs/list.js/1.5.0/list.js"></script>',
|
||||
);
|
||||
|
||||
$('body').append(
|
||||
[
|
||||
'<script>',
|
||||
`const userList = new List('md', {`,
|
||||
` valueNames: ['name','description','homepage','star','updated','language','license','author'],`,
|
||||
// ` page: 20,`,
|
||||
// ` pagination: true,`,
|
||||
`});`,
|
||||
'</script>',
|
||||
].join(''),
|
||||
);
|
||||
console.log('Writing table.html');
|
||||
fs.writeFileSync(destination, $.html(), 'utf8');
|
||||
console.log('DONE 👍');
|
||||
|
||||
11
package.json
11
package.json
@ -4,11 +4,7 @@
|
||||
"description": "A curated list of Docker resources and projects Inspired by @sindresorhus and improved by amazing contributors",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"build": "rimraf ./dist/ && node build.js",
|
||||
"convert": "showdown makehtml -i README.md -o README.html --omitExtraWLInCodeBlocks --simplifiedAutoLink --excludeTrailingPunctuationFromURLs --literalMidWordUnderscores --strikethrough --tables --tablesHeaderId --ghCodeBlocks --tasklists --disableForced4SpacesIndentedSublists --simpleLineBreaks --requireSpaceBeforeHeadingText --ghCompatibleHeaderId --ghMentions --backslashEscapesHTMLTags --emoji --splitAdjacentBlockquotes",
|
||||
"package": "parcel build index.html --public-url /awesome-docker",
|
||||
"fetchdata": "node fetchRepos.js",
|
||||
"table": "node buildTable.js"
|
||||
"build": "node buildTable.js && rimraf ./dist/ && node build.js"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@ -30,7 +26,8 @@
|
||||
"node-fetch": "^2.1.2",
|
||||
"parcel-bundler": "^1.8.1",
|
||||
"rimraf": "^2.6.2",
|
||||
"showdown": "^1.8.6"
|
||||
"showdown": "^1.8.6",
|
||||
"sitemap": "^1.13.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-eslint": "^8.2.3",
|
||||
@ -40,6 +37,6 @@
|
||||
"eslint-plugin-import": "^2.12.0",
|
||||
"eslint-plugin-jsx-a11y": "^6.0.3",
|
||||
"eslint-plugin-prettier": "^2.6.0",
|
||||
"prettier": "^1.13.4"
|
||||
"prettier": "^1.13.5"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,7 +1,19 @@
|
||||
const list = require('list.js');
|
||||
const List = require('list.js');
|
||||
|
||||
const main = () => {
|
||||
console.log('hi!');
|
||||
const userList = new List('md', {
|
||||
valueNames: [
|
||||
'name',
|
||||
'description',
|
||||
'homepage',
|
||||
'star',
|
||||
'updated',
|
||||
'language',
|
||||
'license',
|
||||
'author',
|
||||
],
|
||||
});
|
||||
console.log(`There are ${userList.size()} projects`);
|
||||
};
|
||||
|
||||
main();
|
||||
|
||||
@ -195,6 +195,7 @@
|
||||
<h1 class="project-name">Awesome-docker</h1>
|
||||
<h2 class="project-tagline">A curated list of Docker resources and projects</h2>
|
||||
<a href="https://github.com/veggiemonk/awesome-docker" class="btn">View on GitHub</a>
|
||||
<a href="table.html" class="btn">View Beta</a>
|
||||
<br>
|
||||
<!-- Place this tag where you want the button to render. -->
|
||||
<a class="github-button" href="https://github.com/veggiemonk/awesome-docker" data-icon="octicon-star" data-size="large" data-count-href="/veggiemonk/awesome-docker/stargazers"
|
||||
|
||||
163
website/style.css
vendored
163
website/style.css
vendored
@ -1,163 +0,0 @@
|
||||
:root {
|
||||
--main-list-header: #5dbcd2;
|
||||
--main-list-footer: #5dbcd2;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: grid;
|
||||
/* grid-template-columns: 1fr 1fr 1fr; */
|
||||
grid-template-columns: 1fr 1fr;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
.searchbar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.searchbar > .search {
|
||||
border-radius: 5px;
|
||||
padding: 10px 20px 10px 20px;
|
||||
margin: 20px 0 20px 0;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
.sortbtn {
|
||||
display: grid;
|
||||
grid-template-rows: repeat(auto-fill, 1fr);
|
||||
grid-template-columns: 100px 100px 100px 100px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.sortbtn :first-child {
|
||||
grid-row: span 3;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.sort {
|
||||
border-radius: 6px;
|
||||
border: 1px solid white;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background-color: #28a8e0;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.sort:hover {
|
||||
text-decoration: none;
|
||||
background-color: #1b8aba;
|
||||
}
|
||||
|
||||
.sort:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.sort:after {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-bottom: 5px solid transparent;
|
||||
content: "";
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
.sort.asc:after {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-top: 5px solid #fff;
|
||||
content: "";
|
||||
position: relative;
|
||||
top: 13px;
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
.sort.desc:after {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-bottom: 5px solid #fff;
|
||||
content: "";
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
.list {
|
||||
display: grid;
|
||||
grid-gap: 20px;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
line-height: 1;
|
||||
padding: 20px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.list > li {
|
||||
display: grid;
|
||||
grid-template-rows: 40px 1fr 30px;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
list-style: none;
|
||||
box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
li > .description,
|
||||
li > .name,
|
||||
li > .updated {
|
||||
grid-column: span 2;
|
||||
}
|
||||
|
||||
.list li > * {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.language > svg {
|
||||
height: 1.5rem;
|
||||
}
|
||||
|
||||
.list li > :first-child {
|
||||
color: white;
|
||||
background-color: var(--main-list-header);
|
||||
border-radius: 20px 20px 0 0;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.list li > .description {
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
|
||||
.list > li > :nth-last-child(3),
|
||||
.list > li > :nth-last-child(4) {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.list > li > :last-child {
|
||||
color: white;
|
||||
background-color: var(--main-list-footer);
|
||||
border-radius: 0 0 20px 0;
|
||||
padding: 10px 0 10px 0;
|
||||
}
|
||||
.list > li > :nth-last-child(2) {
|
||||
color: white;
|
||||
background-color: var(--main-list-footer);
|
||||
border-radius: 0 0 0 20px;
|
||||
padding: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
.pagination li {
|
||||
display:inline-block;
|
||||
padding:5px;
|
||||
}
|
||||
@ -13,6 +13,10 @@
|
||||
<meta name="google-site-verification" content="_yiugvz0gCtfsBLyLl1LnkALXb6D4ofiwCyV1XOlYBM" />
|
||||
<link rel="icon" type="image/png" href="favicon.png">
|
||||
<style>
|
||||
:root {
|
||||
--main-list-header: #5dbcd2;
|
||||
--main-list-footer: #5dbcd2;
|
||||
}
|
||||
* {
|
||||
box-sizing: border-box
|
||||
}
|
||||
@ -55,10 +59,6 @@ img {
|
||||
border: 0
|
||||
}
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
margin-bottom: 1rem;
|
||||
@ -86,6 +86,168 @@ svg:not(:root) {
|
||||
opacity: .7
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
|
||||
.container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
.searchbar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.searchbar > .search {
|
||||
border-radius: .25rem;
|
||||
padding: .5rem 1rem .5rem 1rem;
|
||||
margin: 1rem 0 1rem 0;
|
||||
width: 18rem;
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
.sortbtn {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 6.5rem);
|
||||
justify-content: right;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.sortbtn :first-child {
|
||||
grid-row: span 4;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.sort {
|
||||
border-radius: 6px;
|
||||
border: 1px solid white;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background-color: var(--main-list-header);
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.sort:hover {
|
||||
text-decoration: none;
|
||||
background-color: #1b8aba;
|
||||
}
|
||||
|
||||
.sort:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.sort:after {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-bottom: 5px solid transparent;
|
||||
content: "";
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
.sort.asc:after {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-top: 5px solid #fff;
|
||||
content: "";
|
||||
position: relative;
|
||||
top: 13px;
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
.sort.desc:after {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-bottom: 5px solid #fff;
|
||||
content: "";
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
.list {
|
||||
display: grid;
|
||||
grid-gap: 1rem;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
line-height: 1;
|
||||
padding: 1rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.list > li {
|
||||
display: grid;
|
||||
grid-template-rows: 2rem 1fr 2rem 2rem 2rem;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
list-style: none;
|
||||
box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.3);
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
li > .description,
|
||||
li > .name,
|
||||
li > .updated {
|
||||
grid-column: span 2;
|
||||
}
|
||||
|
||||
.list li > * {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding-top: .25rem;
|
||||
padding-bottom: .25rem;
|
||||
}
|
||||
|
||||
.link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.list li > :first-child {
|
||||
color: white;
|
||||
background-color: var(--main-list-header);
|
||||
border-radius: 1rem 1rem 0 0;
|
||||
}
|
||||
.list li > .description {
|
||||
border-bottom: 1px solid var(--main-list-header);
|
||||
word-wrap: break-word;
|
||||
padding: 1rem;
|
||||
}
|
||||
.list li > .updated {
|
||||
border-bottom: 1px solid var(--main-list-header);
|
||||
}
|
||||
|
||||
.list > li > :nth-last-child(3),
|
||||
.list > li > :nth-last-child(4) {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.list > li > :last-child {
|
||||
color: white;
|
||||
background-color: var(--main-list-footer);
|
||||
border-radius: 0 0 1rem 0;
|
||||
padding: .5rem 0 .5rem 0;
|
||||
}
|
||||
.list > li > :nth-last-child(2) {
|
||||
color: white;
|
||||
background-color: var(--main-list-footer);
|
||||
border-radius: 0 0 0 1rem;
|
||||
padding: .5rem 0 .5rem 0;
|
||||
}
|
||||
|
||||
/*******************************************************/
|
||||
|
||||
@media screen and (min-width:64em) {
|
||||
.btn {
|
||||
padding: .75rem 1rem
|
||||
@ -100,7 +262,8 @@ svg:not(:root) {
|
||||
font-size: 1.25rem
|
||||
}
|
||||
.main-content {
|
||||
font-size: 1.1rem
|
||||
font-size: 1.1rem;
|
||||
margin: 0 8rem 0 8rem;
|
||||
}
|
||||
}
|
||||
|
||||
@ -142,9 +305,18 @@ svg:not(:root) {
|
||||
.main-content {
|
||||
font-size: 1rem
|
||||
}
|
||||
.container {
|
||||
grid-template-columns: 1fr;
|
||||
justify-content: center;
|
||||
}
|
||||
.sortbtn {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 6.5rem);
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<!-- <link rel="stylesheet" href="style.css"> -->
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -158,9 +330,9 @@ svg:not(:root) {
|
||||
data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star veggiemonk/awesome-docker on GitHub">Star</a>
|
||||
</section>
|
||||
<section id="md" class="main-content"></section>
|
||||
<!--<script src="index.js"></script> -->
|
||||
<script src="index.js"></script>
|
||||
<!--Place this tag in your head or just before your close body tag. -->
|
||||
<!-- <script async defer src="https://buttons.github.io/buttons.js"></script> -->
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user