skydiver / nextjs-semantic Goto Github PK

Hi, I'm using your boilerplate to build my own project and I'm stuck on changing the font name, could you help me!

It seems when I use styled components (first time using it) it uses the BOLD type of fonts instead of regular.

  const heroText = {
    marginTop: "60px",
    fontSize: "70pt",
    color: "white",
    fontFamily: "Montserrat"
  };

Same as your example

see title above.

I'm trying to watch for changes, for now I'm working around this by using npm run semantic:build before running npm run dev

Already fix, sorry 🙏

Hi,

After update version my icon (icons.woff2) not loaded.

Before
{
"name": "nextjs-semantic",
"description": "Next.js + Semantic UI + Styled Components",
"version": "2.0.0",
"author": "Martín M.",
"license": "MIT",
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start",
"now-build": "npm run semantic:build && next build",
"semantic:build": "cd .semantic && gulp build-css build-assets",
"semantic:watch": "cd .semantic && npm run semantic:build && gulp watch",
"lint": "eslint .",
"lint:fix": "eslint . --fix"
},
"dependencies": {
"@zeit/next-css": "^1.0.1",
"dotenv": "^8.2.0",
"es6-promise": "^4.2.8",
"isomorphic-fetch": "^2.2.1",
"js-sha256": "^0.9.0",
"next": "^9.0.3",
"next-compose-plugins": "^2.2.0",
"react": "^16.8.6",
"react-datepicker": "^2.10.1",
"react-dom": "^16.8.6",
"react-number-format": "^4.3.1",
"semantic-ui-react": "^0.87.3",
"styled-components": "^4.3.2"
},
"devDependencies": {
"babel-eslint": "^10.0.2",
"eslint": "^6.1.0",
"eslint-config-airbnb": "^17.1.1",
"eslint-config-prettier": "^6.0.0",
"eslint-config-wesbos": "0.0.19",
"eslint-plugin-html": "^6.0.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.0",
"eslint-plugin-react": "^7.14.3",
"eslint-plugin-react-hooks": "^1.6.1",
"file-loader": "^4.1.0",
"fomantic-ui": "^2.7.7",
"prettier": "^1.18.2",
"url-loader": "^2.1.0"
}
}

After
{
"name": "nextjs-semantic",
"description": "Next.js + Semantic UI + Styled Components",
"version": "2.0.0",
"author": "Martín M.",
"license": "MIT",
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start",
"now-build": "npm run semantic:build && next build",
"semantic:build": "cd .semantic && gulp build-css build-assets",
"semantic:watch": "cd .semantic && npm run semantic:build && gulp watch",
"lint": "eslint .",
"lint:fix": "eslint . --fix"
},
"dependencies": {
"@zeit/next-css": "^1.0.1",
"dotenv": "^8.2.0",
"es6-promise": "^4.2.8",
"isomorphic-fetch": "^2.2.1",
"js-sha256": "^0.9.0",
"next": "^9.1.6",
"next-compose-plugins": "^2.2.0",
"react": "^16.12.0",
"react-datepicker": "^2.10.1",
"react-dom": "^16.12.0",
"react-number-format": "^4.3.1",
"semantic-ui-react": "^0.88.2",
"styled-components": "^4.4.1"
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.0.1",
"eslint-config-prettier": "^6.9.0",
"eslint-config-wesbos": "0.0.19",
"eslint-plugin-html": "^6.0.0",
"eslint-plugin-import": "^2.19.1",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.2",
"eslint-plugin-react": "^7.17.0",
"eslint-plugin-react-hooks": "^2.3.0",
"file-loader": "^5.0.2",
"fomantic-ui": "^2.8.3",
"prettier": "^1.19.1",
"url-loader": "^3.0.0"
}
}

Thank you

Brand new installation and one that is about 2 weeks old have issues displaying icons.

Followed README

1. clone repo
2. npm install
3. npm run semantic:build
4. npm run dev

Then just add
import { Icon } from "semantic-ui-react";

Then on the return

<Icon name="users" />

Icon does not show. I tried with many other icons.

I'm trying to use the Icon component but when using it the icon is not displaying, just a blank square.

npm run semantic:build leads to Error: Cannot find module 'inquirer'

npm i inquirer -D fixes problem

Thank you for awesome template!

This is just a suggestion. Why not name this as nextjs-fomantic? Spend some time double checking if this is actually fomantic. I ignored this library a couple of times while trying to search for a starter project.