mirror of
https://github.com/wassname/talk.git
synced 2026-07-15 11:26:58 +08:00
Belén Curcio
b1cb624e4f
Merge pull request #1731 from coralproject/next-watcher-flags Watcher --only Use JSDocs comments (#1727) Merge branch 'next' into prevent-compile-loop-relay Merge pull request #1726 from coralproject/prevent-compile-loop-relay [next] Adapt relay watch config [next] Remove nodemon (#1725) * Remove old nodemon configs * Remove nodemon [next] Jest implementation for React Components (#1733) * Make jest testing work with custom path and css modules * Add first test * feat: added unit tests to ci * fix: updated package-lock.json * Update cssTransform.js * Update cssTransform.js * Fix test in ci Adapt files.exclude (#1736) Permalink ui Adding Copy to clipboard functionality WIP clean request wip progress progress work in progress wip ui functionality Translations :/ wip Merge branch 'permalink' of github.com:coralproject/talk into permalink * 'permalink' of github.com:coralproject/talk: (42 commits) [next] Support server side jest testing (#1747) Update snapshots Add comments Remove precss Move react-responsive to dev deps Remove comment Mobile first approach Support standard css variables, dynamically set spacing-unit Add docs Fully implement Flex and MatchMedia Responsive Components <3 fix: linting fix: adjusted pageInfo Remove obsoloe snapshot Move jsdom to dev deps Mark comments as always returning a value Add comment Fix unit tests Translate, concept for translation and id strings Add aria props ... Adding Attachment and Popover Component merge conflicts progress Any Working Support for refs Ready
82 lines
2.7 KiB
JavaScript
82 lines
2.7 KiB
JavaScript
// Allow importing typescript files.
|
|
require("ts-node/register");
|
|
|
|
const kebabCase = require("lodash/kebabCase");
|
|
const mapKeys = require("lodash/mapKeys");
|
|
const mapValues = require("lodash/mapValues");
|
|
const pickBy = require("lodash/pickBy");
|
|
const flat = require("flat");
|
|
const paths = require("./paths");
|
|
const autoprefixer = require("autoprefixer");
|
|
const postcssFontMagician = require("postcss-font-magician");
|
|
const postcssFlexbugsFixes = require("postcss-flexbugs-fixes");
|
|
const postcssVariables = require("postcss-css-variables");
|
|
const postcssPresetEnv = require("postcss-preset-env");
|
|
const postcssNested = require("postcss-nested");
|
|
const postcssImport = require("postcss-import");
|
|
const postcssPrependImports = require("postcss-prepend-imports");
|
|
const postcssAdvancedVariables = require("postcss-advanced-variables");
|
|
|
|
delete require.cache[paths.appThemeVariables];
|
|
const variables = require(paths.appThemeVariables).default;
|
|
const flatKebabVariables = mapKeys(
|
|
mapValues(flat(variables, { delimiter: "-" }), v => v.toString()),
|
|
(_, k) => kebabCase(k)
|
|
);
|
|
|
|
// These are the default css standard variables.
|
|
const cssVariables = pickBy(
|
|
flatKebabVariables,
|
|
(v, k) => !k.startsWith("breakpoints-")
|
|
);
|
|
|
|
// These are sass style variables used in media queries.
|
|
const mediaQueryVariables = mapValues(
|
|
pickBy(flatKebabVariables, (v, k) => k.startsWith("breakpoints-")),
|
|
// Add unit to breakpoints.
|
|
// Add 1 to support mobile first approach where we start
|
|
// with the smallest screen and gradually add styling for the
|
|
// next bigger screen. This is realized using `min-width` without
|
|
// ever using `max-width`.
|
|
v => `${Number.parseInt(v) + 1}px`
|
|
);
|
|
|
|
module.exports = {
|
|
// Necessary for external CSS imports to work
|
|
// https://github.com/facebookincubator/create-react-app/issues/2677
|
|
ident: "postcss",
|
|
plugins: [
|
|
// This allows us to define dynamic css variables.
|
|
postcssPrependImports({
|
|
path: "",
|
|
files: [paths.appThemeVariablesCSS],
|
|
}),
|
|
// Needed by above plugin.
|
|
postcssImport(),
|
|
// Support nesting.
|
|
postcssNested(),
|
|
// Sass style variables to be used in media queries.
|
|
postcssAdvancedVariables({ variables: mediaQueryVariables }),
|
|
// CSS standard variables for everything else.
|
|
postcssVariables({
|
|
variables: cssVariables,
|
|
}),
|
|
// Provides a modern CSS environment.
|
|
postcssPresetEnv(),
|
|
// Does all the font handling logic.
|
|
postcssFontMagician(),
|
|
// Fix known flexbox bugs.
|
|
postcssFlexbugsFixes,
|
|
// Vendor prefixing.
|
|
autoprefixer({
|
|
browsers: [
|
|
">1%",
|
|
"last 4 versions",
|
|
"Firefox ESR",
|
|
"not ie < 9", // React doesn't support IE8 anyway
|
|
],
|
|
flexbox: "no-2009",
|
|
}),
|
|
],
|
|
};
|