-
-
Save NikkyAI/9d9cfa8dd17ad7650d4fbf203e0f2607 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| generateHtml { | |
| lang = "en" | |
| head { | |
| meta { | |
| charset = "utf-8" | |
| } | |
| meta { | |
| attributes["http-equiv"] = "X-UA-Compatible" | |
| content = "IE=edge" | |
| } | |
| meta { | |
| name = "description" | |
| content = "A portfolio template that uses Material Design Lite." | |
| } | |
| meta { | |
| name = "viewport" | |
| content = "width=device-width, initial-scale=1.0, minimum-scale=1.0" | |
| } | |
| title { +"""MDL-Static Website""" } | |
| link { | |
| rel = "stylesheet" | |
| href = | |
| "https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&lang=en" | |
| } | |
| link { | |
| rel = "stylesheet" | |
| href = "https://code.getmdl.io/1.3.0/material.grey-pink.min.css" | |
| } | |
| link { | |
| rel = "stylesheet" | |
| href = "styles.css" | |
| } | |
| link { | |
| rel = "stylesheet" | |
| href = "https://fonts.googleapis.com/icon?family=Material+Icons" | |
| } | |
| } | |
| body { | |
| div("mdl-layout mdl-js-layout mdl-layout--fixed-header") { | |
| header("mdl-layout__header mdl-layout__header--waterfall portfolio-header") { | |
| div("mdl-layout__header-row portfolio-logo-row") { | |
| span("mdl-layout__title") { | |
| div("portfolio-logo") { | |
| } | |
| span("mdl-layout__title") { +"""Simple portfolio website""" } | |
| } | |
| } | |
| div("mdl-layout__header-row portfolio-navigation-row mdl-layout--large-screen-only") { | |
| nav("mdl-navigation mdl-typography--body-1-force-preferred-font") { | |
| a(classes = "mdl-navigation__link is-active") { | |
| href = "index.html" | |
| +"""Portfolio""" | |
| } | |
| a(classes = "mdl-navigation__link") { | |
| href = "blog.html" | |
| +"""Blog""" | |
| } | |
| a(classes = "mdl-navigation__link") { | |
| href = "about.html" | |
| +"""About""" | |
| } | |
| a(classes = "mdl-navigation__link") { | |
| href = "contact.html" | |
| +"""Contact""" | |
| } | |
| } | |
| } | |
| } | |
| div("mdl-layout__drawer mdl-layout--small-screen-only") { | |
| nav("mdl-navigation mdl-typography--body-1-force-preferred-font") { | |
| a(classes = "mdl-navigation__link is-active") { | |
| href = "index.html" | |
| +"""Portfolio""" | |
| } | |
| a(classes = "mdl-navigation__link") { | |
| href = "blog.html" | |
| +"""Blog""" | |
| } | |
| a(classes = "mdl-navigation__link") { | |
| href = "about.html" | |
| +"""About""" | |
| } | |
| a(classes = "mdl-navigation__link") { | |
| href = "contact.html" | |
| +"""Contact""" | |
| } | |
| } | |
| } | |
| main("mdl-layout__content") { | |
| div("mdl-grid portfolio-max-width") { | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work01.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Blog template""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work07.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Sunt nulla""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work02.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Android.com website""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work03.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Dashboard template""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work04.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Text-heavy website""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work08.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Ex officia laborum""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work05.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Stand-alone article""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work06.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""MDL website""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| div("mdl-cell mdl-card mdl-shadow--4dp portfolio-card") { | |
| div("mdl-card__media") { | |
| img(classes = "article-image") { | |
| src = " images/example-work09.jpg" | |
| border = "0" | |
| alt = "" | |
| } | |
| } | |
| div("mdl-card__title") { | |
| h2("mdl-card__title-text") { +"""Consequat ut quis""" } | |
| } | |
| div("mdl-card__supporting-text") { +"""Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.""" } | |
| div("mdl-card__actions mdl-card--border") { | |
| a(classes = "mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect mdl-button--accent") { | |
| href = "portfolio-example01.html" | |
| +"""Read more""" | |
| } | |
| } | |
| } | |
| } | |
| footer("mdl-mini-footer") { | |
| div("mdl-mini-footer__left-section") { | |
| div("mdl-logo") { +"""Simple portfolio website""" } | |
| } | |
| div("mdl-mini-footer__right-section") { | |
| ul("mdl-mini-footer__link-list") { | |
| li { | |
| a { | |
| href = "#" | |
| +"""Help""" | |
| } | |
| } | |
| li { | |
| a { | |
| href = "#" | |
| +"""Privacy & Terms""" | |
| } | |
| } | |
| } | |
| } | |
| } | |
| } | |
| } | |
| script { | |
| src = "https://code.getmdl.io/1.3.0/material.min.js" | |
| } | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment