mirror of
https://github.com/mantinedev/next-app-template.git
synced 2025-11-10 04:22:01 +10:00
Compare commits
1 Commits
d93f938bc9
...
sass-embed
| Author | SHA1 | Date | |
|---|---|---|---|
| 8d8c25b729 |
64
_mantine.scss
Normal file
64
_mantine.scss
Normal file
@ -0,0 +1,64 @@
|
||||
@use 'sass:math';
|
||||
|
||||
// Define variables for your breakpoints,
|
||||
// values must be the same as in your theme
|
||||
$mantine-breakpoint-xs: '36em';
|
||||
$mantine-breakpoint-sm: '48em';
|
||||
$mantine-breakpoint-md: '62em';
|
||||
$mantine-breakpoint-lg: '75em';
|
||||
$mantine-breakpoint-xl: '88em';
|
||||
|
||||
@function rem($value) {
|
||||
@return #{math.div(math.div($value, $value * 0 + 1), 16)}rem;
|
||||
}
|
||||
|
||||
@mixin light {
|
||||
[data-mantine-color-scheme='light'] & {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin dark {
|
||||
[data-mantine-color-scheme='dark'] & {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin hover {
|
||||
@media (hover: hover) {
|
||||
&:hover {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@media (hover: none) {
|
||||
&:active {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin smaller-than($breakpoint) {
|
||||
@media (max-width: $breakpoint) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin larger-than($breakpoint) {
|
||||
@media (min-width: $breakpoint) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
// Add direction mixins if you need rtl support
|
||||
@mixin rtl {
|
||||
[dir='rtl'] & {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin ltr {
|
||||
[dir='ltr'] & {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
@ -1,10 +0,0 @@
|
||||
.title {
|
||||
color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
|
||||
font-size: rem(100px);
|
||||
font-weight: 900;
|
||||
letter-spacing: rem(-2px);
|
||||
|
||||
@media (max-width: $mantine-breakpoint-md) {
|
||||
font-size: rem(50px);
|
||||
}
|
||||
}
|
||||
10
components/Welcome/Welcome.module.scss
Normal file
10
components/Welcome/Welcome.module.scss
Normal file
@ -0,0 +1,10 @@
|
||||
.title {
|
||||
color: light-dark(var(--mantine-color-black), var(--mantine-color-white));
|
||||
font-size: mantine.rem(100px);
|
||||
font-weight: 900;
|
||||
letter-spacing: mantine.rem(-2px);
|
||||
|
||||
@media (max-width: mantine.$mantine-breakpoint-md) {
|
||||
font-size: mantine.rem(50px);
|
||||
}
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
import classes from './Welcome.module.scss';
|
||||
import { Anchor, Text, Title } from '@mantine/core';
|
||||
import classes from './Welcome.module.css';
|
||||
|
||||
export function Welcome() {
|
||||
return (
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import path from 'path';
|
||||
import bundleAnalyzer from '@next/bundle-analyzer';
|
||||
|
||||
const withBundleAnalyzer = bundleAnalyzer({
|
||||
@ -12,4 +13,9 @@ export default withBundleAnalyzer({
|
||||
experimental: {
|
||||
optimizePackageImports: ['@mantine/core', '@mantine/hooks'],
|
||||
},
|
||||
|
||||
sassOptions: {
|
||||
implementation: 'sass-embedded',
|
||||
additionalData: `@use "${path.join(process.cwd(), '_mantine')}" as mantine;`,
|
||||
},
|
||||
});
|
||||
|
||||
@ -59,6 +59,7 @@
|
||||
"postcss-preset-mantine": "1.17.0",
|
||||
"postcss-simple-vars": "^7.0.1",
|
||||
"prettier": "^3.3.2",
|
||||
"sass-embedded": "^1.80.6",
|
||||
"storybook": "^8.1.10",
|
||||
"storybook-dark-mode": "^4.0.2",
|
||||
"stylelint": "^16.6.1",
|
||||
|
||||
265
yarn.lock
265
yarn.lock
@ -2521,6 +2521,13 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@bufbuild/protobuf@npm:^2.0.0":
|
||||
version: 2.2.2
|
||||
resolution: "@bufbuild/protobuf@npm:2.2.2"
|
||||
checksum: 10c0/17687c36c85b2e489c7ffd676479c54e12437270eb5a724775cb880b09948cad205b79e5822a4d10cefde0eef433b781350d73bb649d8de9e84d7745871ee719
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@colors/colors@npm:1.5.0":
|
||||
version: 1.5.0
|
||||
resolution: "@colors/colors@npm:1.5.0"
|
||||
@ -7007,6 +7014,13 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"buffer-builder@npm:^0.2.0":
|
||||
version: 0.2.0
|
||||
resolution: "buffer-builder@npm:0.2.0"
|
||||
checksum: 10c0/e50c3a379f4acaea75ade1ee3e8c07ed6d7c5dfc3f98adbcf0159bfe1a4ce8ca1fe3689e861fcdb3fcef0012ebd4345a6112a5b8a1185295452bb66d7b6dc8a1
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"buffer-from@npm:^1.0.0":
|
||||
version: 1.1.2
|
||||
resolution: "buffer-from@npm:1.1.2"
|
||||
@ -7474,6 +7488,13 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"colorjs.io@npm:^0.5.0":
|
||||
version: 0.5.2
|
||||
resolution: "colorjs.io@npm:0.5.2"
|
||||
checksum: 10c0/2e6ea43629e325e721b92429239de3a6f42fb6d88ba6e4c2aeff0288c196d876f2f7ee82aea95bd40072d5cdc8cb87f042f4d94c134dcabf0e34a717e4caacb9
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"combined-stream@npm:^1.0.8":
|
||||
version: 1.0.8
|
||||
resolution: "combined-stream@npm:1.0.8"
|
||||
@ -10604,6 +10625,13 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"immutable@npm:^4.0.0":
|
||||
version: 4.3.7
|
||||
resolution: "immutable@npm:4.3.7"
|
||||
checksum: 10c0/9b099197081b22f6433003e34929da8ecddbbdc1474cdc8aa3b7669dee4adda349c06143de22def36016d1b6de5322b043eccd7a11db1dad2ca85dad4fff5435
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"import-fresh@npm:^3.2.1, import-fresh@npm:^3.3.0":
|
||||
version: 3.3.0
|
||||
resolution: "import-fresh@npm:3.3.0"
|
||||
@ -12333,6 +12361,7 @@ __metadata:
|
||||
prettier: "npm:^3.3.2"
|
||||
react: "npm:18.3.1"
|
||||
react-dom: "npm:18.3.1"
|
||||
sass-embedded: "npm:^1.80.6"
|
||||
storybook: "npm:^8.1.10"
|
||||
storybook-dark-mode: "npm:^4.0.2"
|
||||
stylelint: "npm:^16.6.1"
|
||||
@ -14738,6 +14767,15 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"rxjs@npm:^7.4.0":
|
||||
version: 7.8.1
|
||||
resolution: "rxjs@npm:7.8.1"
|
||||
dependencies:
|
||||
tslib: "npm:^2.1.0"
|
||||
checksum: 10c0/3c49c1ecd66170b175c9cacf5cef67f8914dcbc7cd0162855538d365c83fea631167cacb644b3ce533b2ea0e9a4d0b12175186985f89d75abe73dbd8f7f06f68
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"safe-array-concat@npm:^1.0.1":
|
||||
version: 1.0.1
|
||||
resolution: "safe-array-concat@npm:1.0.1"
|
||||
@ -14805,6 +14843,224 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-android-arm64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-android-arm64@npm:1.80.6"
|
||||
conditions: os=android & cpu=arm64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-android-arm@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-android-arm@npm:1.80.6"
|
||||
conditions: os=android & cpu=arm
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-android-ia32@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-android-ia32@npm:1.80.6"
|
||||
conditions: os=android & cpu=ia32
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-android-riscv64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-android-riscv64@npm:1.80.6"
|
||||
conditions: os=android & cpu=riscv64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-android-x64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-android-x64@npm:1.80.6"
|
||||
conditions: os=android & cpu=x64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-darwin-arm64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-darwin-arm64@npm:1.80.6"
|
||||
conditions: os=darwin & cpu=arm64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-darwin-x64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-darwin-x64@npm:1.80.6"
|
||||
conditions: os=darwin & cpu=x64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-arm64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-arm64@npm:1.80.6"
|
||||
conditions: os=linux & cpu=arm64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-arm@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-arm@npm:1.80.6"
|
||||
conditions: os=linux & cpu=arm
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-ia32@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-ia32@npm:1.80.6"
|
||||
conditions: os=linux & cpu=ia32
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-musl-arm64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-musl-arm64@npm:1.80.6"
|
||||
conditions: os=linux & cpu=arm64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-musl-arm@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-musl-arm@npm:1.80.6"
|
||||
conditions: os=linux & cpu=arm
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-musl-ia32@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-musl-ia32@npm:1.80.6"
|
||||
conditions: os=linux & cpu=ia32
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-musl-riscv64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-musl-riscv64@npm:1.80.6"
|
||||
conditions: os=linux & cpu=riscv64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-musl-x64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-musl-x64@npm:1.80.6"
|
||||
conditions: os=linux & cpu=x64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-riscv64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-riscv64@npm:1.80.6"
|
||||
conditions: os=linux & cpu=riscv64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-linux-x64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-linux-x64@npm:1.80.6"
|
||||
conditions: os=linux & cpu=x64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-win32-arm64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-win32-arm64@npm:1.80.6"
|
||||
conditions: os=win32 & cpu=arm64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-win32-ia32@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-win32-ia32@npm:1.80.6"
|
||||
conditions: os=win32 & cpu=ia32
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded-win32-x64@npm:1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded-win32-x64@npm:1.80.6"
|
||||
conditions: os=win32 & cpu=x64
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-embedded@npm:^1.80.6":
|
||||
version: 1.80.6
|
||||
resolution: "sass-embedded@npm:1.80.6"
|
||||
dependencies:
|
||||
"@bufbuild/protobuf": "npm:^2.0.0"
|
||||
buffer-builder: "npm:^0.2.0"
|
||||
colorjs.io: "npm:^0.5.0"
|
||||
immutable: "npm:^4.0.0"
|
||||
rxjs: "npm:^7.4.0"
|
||||
sass-embedded-android-arm: "npm:1.80.6"
|
||||
sass-embedded-android-arm64: "npm:1.80.6"
|
||||
sass-embedded-android-ia32: "npm:1.80.6"
|
||||
sass-embedded-android-riscv64: "npm:1.80.6"
|
||||
sass-embedded-android-x64: "npm:1.80.6"
|
||||
sass-embedded-darwin-arm64: "npm:1.80.6"
|
||||
sass-embedded-darwin-x64: "npm:1.80.6"
|
||||
sass-embedded-linux-arm: "npm:1.80.6"
|
||||
sass-embedded-linux-arm64: "npm:1.80.6"
|
||||
sass-embedded-linux-ia32: "npm:1.80.6"
|
||||
sass-embedded-linux-musl-arm: "npm:1.80.6"
|
||||
sass-embedded-linux-musl-arm64: "npm:1.80.6"
|
||||
sass-embedded-linux-musl-ia32: "npm:1.80.6"
|
||||
sass-embedded-linux-musl-riscv64: "npm:1.80.6"
|
||||
sass-embedded-linux-musl-x64: "npm:1.80.6"
|
||||
sass-embedded-linux-riscv64: "npm:1.80.6"
|
||||
sass-embedded-linux-x64: "npm:1.80.6"
|
||||
sass-embedded-win32-arm64: "npm:1.80.6"
|
||||
sass-embedded-win32-ia32: "npm:1.80.6"
|
||||
sass-embedded-win32-x64: "npm:1.80.6"
|
||||
supports-color: "npm:^8.1.1"
|
||||
varint: "npm:^6.0.0"
|
||||
dependenciesMeta:
|
||||
sass-embedded-android-arm:
|
||||
optional: true
|
||||
sass-embedded-android-arm64:
|
||||
optional: true
|
||||
sass-embedded-android-ia32:
|
||||
optional: true
|
||||
sass-embedded-android-riscv64:
|
||||
optional: true
|
||||
sass-embedded-android-x64:
|
||||
optional: true
|
||||
sass-embedded-darwin-arm64:
|
||||
optional: true
|
||||
sass-embedded-darwin-x64:
|
||||
optional: true
|
||||
sass-embedded-linux-arm:
|
||||
optional: true
|
||||
sass-embedded-linux-arm64:
|
||||
optional: true
|
||||
sass-embedded-linux-ia32:
|
||||
optional: true
|
||||
sass-embedded-linux-musl-arm:
|
||||
optional: true
|
||||
sass-embedded-linux-musl-arm64:
|
||||
optional: true
|
||||
sass-embedded-linux-musl-ia32:
|
||||
optional: true
|
||||
sass-embedded-linux-musl-riscv64:
|
||||
optional: true
|
||||
sass-embedded-linux-musl-x64:
|
||||
optional: true
|
||||
sass-embedded-linux-riscv64:
|
||||
optional: true
|
||||
sass-embedded-linux-x64:
|
||||
optional: true
|
||||
sass-embedded-win32-arm64:
|
||||
optional: true
|
||||
sass-embedded-win32-ia32:
|
||||
optional: true
|
||||
sass-embedded-win32-x64:
|
||||
optional: true
|
||||
bin:
|
||||
sass: dist/bin/sass.js
|
||||
checksum: 10c0/3b6cdba8ccc894d23c828989e159cdaee2331b0622f340af51067427dcca2ffee1580bc15cc69a68ef24d42d5be5cf923b5b05f0eb52b2afb4764c73773d8eda
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"sass-loader@npm:^12.4.0":
|
||||
version: 12.6.0
|
||||
resolution: "sass-loader@npm:12.6.0"
|
||||
@ -15900,7 +16156,7 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"supports-color@npm:^8.0.0":
|
||||
"supports-color@npm:^8.0.0, supports-color@npm:^8.1.1":
|
||||
version: 8.1.1
|
||||
resolution: "supports-color@npm:8.1.1"
|
||||
dependencies:
|
||||
@ -16837,6 +17093,13 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"varint@npm:^6.0.0":
|
||||
version: 6.0.0
|
||||
resolution: "varint@npm:6.0.0"
|
||||
checksum: 10c0/737fc37088a62ed3bd21466e318d21ca7ac4991d0f25546f518f017703be4ed0f9df1c5559f1dd533dddba4435a1b758fd9230e4772c1a930ef72b42f5c750fd
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"vary@npm:~1.1.2":
|
||||
version: 1.1.2
|
||||
resolution: "vary@npm:1.1.2"
|
||||
|
||||
Reference in New Issue
Block a user