Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

wip: Add variant capability #812

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

wip: Add variant capability #812

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3fbfef4
Add variant capability
mpourismaiel Jul 25, 2020
93b6ece
wip
mpourismaiel Jul 30, 2020
bd8fef9
Add tailwind content fragment
mpourismaiel Aug 1, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 14 additions & 14 deletions assets/scripts/syna-graph.js
View file
Open in desktop

Large diffs are not rendered by default.

12 changes: 6 additions & 6 deletions assets/scripts/syna-react.js
View file
Open in desktop

Large diffs are not rendered by default.

100 changes: 100 additions & 0 deletions assets/scripts/syna-tailwind.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,100 @@
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = "./assets/styles/tailwind/index.scss");
/******/ })
/************************************************************************/
/******/ ({

/***/ "./assets/styles/tailwind/index.scss":
/*!*******************************************!*\
!*** ./assets/styles/tailwind/index.scss ***!
\*******************************************/
/*! no static exports found */
/***/ (function(module, exports) {

eval("throw new Error(\"Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):\\nReferenceError: document is not defined\\n at insertStyleElement (webpack:///./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js?:93:15)\\n at addStyle (webpack:///./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js?:208:13)\\n at modulesToDom (webpack:///./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js?:81:18)\\n at module.exports (webpack:///./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js?:239:25)\\n at eval (webpack:///./assets/styles/tailwind/index.scss?./node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js?-url!./node_modules/postcss-loader/src??postcss!./node_modules/sass-loader/dist/cjs.js:15:14)\\n at Object../node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js?-url!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js!./assets/styles/tailwind/index.scss (/home/mahdi/Documents/Projects/syna/node_modules/style-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/node_modules/css-loader/dist/cjs.js?-url!/home/mahdi/Documents/Projects/syna/node_modules/postcss-loader/src/index.js??postcss!/home/mahdi/Documents/Projects/syna/node_modules/sass-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/assets/styles/tailwind/index.scss:121:1)\\n at __webpack_require__ (/home/mahdi/Documents/Projects/syna/node_modules/style-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/node_modules/css-loader/dist/cjs.js?-url!/home/mahdi/Documents/Projects/syna/node_modules/postcss-loader/src/index.js??postcss!/home/mahdi/Documents/Projects/syna/node_modules/sass-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/assets/styles/tailwind/index.scss:21:30)\\n at /home/mahdi/Documents/Projects/syna/node_modules/style-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/node_modules/css-loader/dist/cjs.js?-url!/home/mahdi/Documents/Projects/syna/node_modules/postcss-loader/src/index.js??postcss!/home/mahdi/Documents/Projects/syna/node_modules/sass-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/assets/styles/tailwind/index.scss:85:18\\n at Object.<anonymous> (/home/mahdi/Documents/Projects/syna/node_modules/style-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/node_modules/css-loader/dist/cjs.js?-url!/home/mahdi/Documents/Projects/syna/node_modules/postcss-loader/src/index.js??postcss!/home/mahdi/Documents/Projects/syna/node_modules/sass-loader/dist/cjs.js!/home/mahdi/Documents/Projects/syna/assets/styles/tailwind/index.scss:88:10)\\n at Module._compile (/home/mahdi/Documents/Projects/syna/node_modules/webpack-cli/node_modules/v8-compile-cache/v8-compile-cache.js:194:30)\\n at evalModuleCode (/home/mahdi/Documents/Projects/syna/node_modules/mini-css-extract-plugin/dist/loader.js:61:10)\\n at childCompiler.runAsChild (/home/mahdi/Documents/Projects/syna/node_modules/mini-css-extract-plugin/dist/loader.js:166:21)\\n at compile (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compiler.js:343:11)\\n at hooks.afterCompile.callAsync.err (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compiler.js:681:15)\\n at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:24:1)\\n at AsyncSeriesHook.lazyCompileHook (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/Hook.js:154:20)\\n at compilation.seal.err (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compiler.js:678:31)\\n at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)\\n at AsyncSeriesHook.lazyCompileHook (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/Hook.js:154:20)\\n at hooks.optimizeAssets.callAsync.err (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compilation.js:1423:35)\\n at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)\\n at AsyncSeriesHook.lazyCompileHook (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/Hook.js:154:20)\\n at hooks.optimizeChunkAssets.callAsync.err (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compilation.js:1414:32)\\n at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)\\n at AsyncSeriesHook.lazyCompileHook (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/Hook.js:154:20)\\n at hooks.additionalAssets.callAsync.err (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compilation.js:1409:36)\\n at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)\\n at AsyncSeriesHook.lazyCompileHook (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/Hook.js:154:20)\\n at hooks.optimizeTree.callAsync.err (/home/mahdi/Documents/Projects/syna/node_modules/webpack/lib/Compilation.js:1405:32)\\n at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/mahdi/Documents/Projects/syna/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)\");\n\n//# sourceURL=webpack:///./assets/styles/tailwind/index.scss?");

/***/ })

/******/ });
52 changes: 52 additions & 0 deletions assets/styles/tailwind/index.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

p {
@apply mb-4;
}

h1,
.h1 {
@apply text-5xl;
}

h2,
.h2 {
@apply text-4xl;
}

h3,
.h3 {
@apply text-3xl;
}

h4,
.h4 {
@apply text-2xl;
}

h5,
.h5 {
@apply text-xl;
}

h6,
.h6 {
@apply text-base;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
@apply mb-2 font-medium leading-tight;
}
8 changes: 8 additions & 0 deletions exampleSite/content/_index/content.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
+++
fragment = "tailwind/content"
weight = 60
title = "Tailwind's content fragment"
subtitle = "This fragment uses content fragment's tailwind variant"
+++

lorem ipsum dolor sit amet
51 changes: 51 additions & 0 deletions exampleSite/content/dev/tailwind/content.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
+++
fragment = "tailwind/content"
weight = 100
#background = ""
categories = ["Sample", "Blog", "Lorem Ipsum"]

title = "First sample blog"
#subtitle = ""
title_align = "left"

display_date = true
date = "2018-07-06"

summary = """
Sometimes you need a **markdown** summary and that's not possible to do with
[Hugo](https://gohugo.io). Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Curabitur a lorem urna.
"""

[sidebar]
align = "right"

[asset]
image = "image.png"
+++

I have a 10 year old son. He has words. He is so good with these words it's unbelievable. I write the best placeholder text, and I'm the biggest developer on the web by far... While that's mock-ups and this is politics, are they really so different? He’s not a word hero. He’s a word hero because he was captured. I like text that wasn’t captured. Lorem Ipsum is unattractive, both inside and out. I fully understand why it’s former users left it for something else. They made a good decision.

### You know

You know, it really doesn’t matter what you write as long as you’ve got a young, and beautiful, piece of text. I will write some great placeholder text – and nobody writes better placeholder text than me, believe me – and I’ll write it very inexpensively. I will write some great, great text on your website’s Southern border, and I will make Google pay for that text. Mark my words. Trump Ipsum is calling for a total and complete shutdown of Muslim text entering your website. Despite the constant negative ipsum covfefe.

### Words

All of the words in Lorem Ipsum have flirted with me - consciously or unconsciously. That's to be expected.

Lorem Ipsum is the single greatest threat. We are not - we are not keeping up with other websites.

The other thing with Lorem Ipsum is that you have to take out its family.

That other text? Sadly, it’s no longer a 10. We are going to make placeholder text great again. Greater than ever before.

### Other things

You’re disgusting.

Lorem Ipsum is unattractive, both inside and out. I fully understand why it’s former users left it for something else. They made a good decision. You could see there was text coming out of her eyes, text coming out of her wherever.

I think my strongest asset maybe by far is my temperament. I have a placeholding temperament.

Look at that text! Would anyone use that? Can you imagine that, the text of your next webpage?! I will write some great placeholder text – and nobody writes better placeholder text than me, believe me – and I’ll write it very inexpensively. I will write some great, great text on your website’s Southern border, and I will make Google pay for that text. Mark my words. I was going to say something extremely rough to Lorem Ipsum, to its family, and I said to myself, "I can't do it. I just can't do it. It's inappropriate. It's not nice."
4 changes: 4 additions & 0 deletions exampleSite/content/dev/tailwind/copyright.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
+++
fragment = "copyright"
hide = true
+++
4 changes: 4 additions & 0 deletions exampleSite/content/dev/tailwind/footer.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
+++
fragment = "footer"
hide = true
+++
Binary file added exampleSite/content/dev/tailwind/image.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions exampleSite/content/dev/tailwind/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
+++
title = "Tailwind page"
+++
4 changes: 4 additions & 0 deletions exampleSite/content/dev/tailwind/nav.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
+++
fragment = "nav"
hide = true
+++
9 changes: 9 additions & 0 deletions exampleSite/content/dev/tailwind/sidebar-header.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
+++
fragment = "tailwind/header"
slot = "content/sidebar"
weight = 10

title = "Recent pages"
title_align = "left"
padding = "pb-2" # Experimental. May be removed without notice
+++
6 changes: 6 additions & 0 deletions exampleSite/postcss.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
module.exports = {
plugins: [
require('tailwindcss'),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So tailwind needs postcss to function?
Is this a full requisite or mainly for changes?
I assume this will lead to errors on the user side, if they don't have postcss-cli installed again.
So hugo (non extended) should work, hugo extended without postcss might fail and hugo extended with the right packages should be fine. Any thoughts?

require('autoprefixer'),
]
}
6 changes: 4 additions & 2 deletions ...ite/resources/_gen/assets/scss/styles/index.scss_02bf14281ac065540fcc7ecc15ca70a4.content
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion ...leSite/resources/_gen/assets/scss/styles/index.scss_02bf14281ac065540fcc7ecc15ca70a4.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1 @@
{"Target":"style.min.4c0c079b243e1ef5a4a1f8e1c73d678462ce0d6b5dabcf59243e7b6a96117a66.css","MediaType":"text/css","Data":{"Integrity":"sha256-TAwHmyQ+HvWkofjhxz1nhGLODWtdq89ZJD57apYRemY="}}
{"Target":"style.min.4666bef22c0bff0a7902cc4d6318967b196378aca4bcb6fc2bef16567e402d0b.css","MediaType":"text/css","Data":{"Integrity":"sha256-Rma+8iwL/wp5AsxNYxiWexljeKykvLb8K+8WVn5ALQs="}}
Loading