rsnext/test/integration/scss-fixtures/with-tailwindcss-and-purgecss/pages/index.js
Alexander Dreith 8449ebc221 [Experimental] Add built-in Sass support (#10133)
* Add built-in Sass support

* Add copy of CSS tests for SCSS

* Fix failing tests

* Fix url-loader tests

* Remove css file generated by tests

* Fix nprogress import for css file

* Fix SCSS modules (still 2 tests that need investigating)

* Update documentation for Sass support

* Fix plain CSS import test

* Fix formatting with prettier fix

* Update test output to reflect scss usage

* Revert "Fix plain CSS import test"

This reverts commit 380319d9d0c4bfb19e28c210262ccd82d19f3556.

# Conflicts:
#	test/integration/scss-modules/test/index.test.js

* Update loader structure

* Resolve loaders before passing to compile function

* Remove dead filter  code

* Arrange loaders in order and push to array

* Fix loader order bug

* Fix global Sass loader and make module prepocessor optional

* Adjust Sass Modules Implementation

* Fix typo

* Adjust regexps

* Use regexes

* Simplify global setup

* Adjust comments

* fix regex

* Simplify identifier file

* Update Sass Instructions

* Remove unneeded fixtures

* Adjust global tests

* Remove wrapper

* Update source maps

* Flag scss behavior

* Fix css property value

* Update fixtures with Sass vars

* Turn on Scss support

* fix HMR test

* Fix snapshots

Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: Joe Haddad <timer150@gmail.com>
2020-01-22 15:26:51 -05:00

38 lines
903 B
JavaScript

import Link from 'next/link'
const links = [
{ href: 'https://github.com/zeit/next.js', label: 'GitHub' },
{ href: 'https://nextjs.org/docs', label: 'Docs' },
]
function Nav() {
return (
<nav>
<ul className="flex justify-between items-center p-8">
<li>
<Link href="/">
<a className="text-blue-500 no-underline">Home</a>
</Link>
</li>
<ul className="flex justify-between items-center">
{links.map(({ href, label }) => (
<li key={`${href}${label}`} className="ml-4">
<a href={href} className="btn-blue no-underline">
{label}
</a>
</li>
))}
</ul>
</ul>
</nav>
)
}
export default () => (
<div>
<Nav />
<div className="hero">
<h1 className="title">Next.js + Tailwind CSS + PurgeCSS</h1>
</div>
</div>
)