chore: Monorepo style

.github/PULL_REQUEST_TEMPLATE.md

@@ -16,7 +16,7 @@ Please go over the checklist and make sure all conditions are met.
 - [ ] Styles are added to `NewComponent.modules.scss` file inside the `NewComponent` folder.
 - [ ] Component uses CSS Modules.
 - [ ] Design is compatible with [Monday Design System](https://design.monday.com/).
-- [ ] Styles are defined using [monday-ui-style](https://github.com/mondaycom/monday-ui-style) tokens
+- [ ] Styles are defined using [monday-ui-style](https://github.com/mondaycom/monday-ui-react-core/tree/monorepo-style/packages/monday-ui-style) tokens
 - [ ] Displays correctly in all the themes
 
 #### Storybook

packages/core/.storybook/preview.d.ts

@@ -1,5 +1,5 @@
 import { Preview } from "@storybook/react";
-import "monday-ui-style/dist/index.min.css";
+import "../../style/dist/index.min.css";
 import "vibe-storybook-components/index.css";
 declare const preview: Preview;
 export default preview;

packages/core/.storybook/preview.tsx

@@ -29,7 +29,7 @@ import {
   StorybookLink
 } from "vibe-storybook-components";
 import { ComponentNameDecorator, PropsTable, RelatedComponentsDecorator } from "../src/storybook";
-import "monday-ui-style/dist/index.min.css";
+import "../../style/dist/index.min.css";
 import "vibe-storybook-components/dist/index.css";
 import introCode from "../src/storybook/stand-alone-documentaion/playground/playground-helpers";
 

packages/core/src/style-imports.ts

@@ -1 +1 @@
-import "monday-ui-style/dist/index.min.css";
+import "../../style/dist/index.min.css";

packages/style/ICON_REQUEST.md

@@ -0,0 +1,12 @@
+# Icon Request
+> We are working hard to keep our icon library most relevant and consistent as possible, we want to make sure that we accommodate all the icon needs of our users
+
+## New Icon Submission
+Please open a PR with the title - "New Icon Request - IconName". In the body of the request please make sure to provide the following
+
+- [ ] Icon Name
+- [ ] Icon Description
+- [ ] Usage Example
+- [ ] Relevant Icon Examples.
+
+You can also submit an icon design yourself in an SVG format. Our designers will go over the icon and give the appropriate PR comments 

packages/style/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 monday.com LTD
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

packages/style/README.md

@@ -0,0 +1,26 @@
+# monday.com UI styles
+This package includes all of the styling foundations of monday.com
+Theme definition, colors, shadows, dimensions, icons, etc.
+
+## Installation
+```
+npm install monday-ui-style
+```
+
+## Usage
+We are building the icons using [Wix's svg2react-icon](https://github.com/wix/svg2react-icon) npm package it is generating a React component for each icon
+``` javascript
+import { IconName } from "monday-ui-style/dist/Icons"
+import IconName from "monday-ui-style/dist/Icons/IconName"
+```
+
+## Adding a new icon
+When adding a new icon please make sure of the following
+- We don't have a similar icon - if so either replace the icon or make sure that we need another version of it
+- Make sure to switch all fill/stroke.. colors to `currentColor`as we want to inherit the color of the font (we are not doing so automatically to leave the option to preserve svg with colors) 
+- Update the [metadata file](./src/Icons/iconsMetaData.js) for that icon
+
+
+### New icon request
+If you want us to create a non existing monday.com style icon open a PR with please see the [guidelines](ICON_REQUEST.md)
+

packages/style/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "monday-ui-style",
+  "version": "0.1.210",
+  "description": "Monday UI CSS Foundations",
+  "main": "dist/index.css",
+  "scripts": {
+    "auto:bump-patch": "node scripts/autobump_patch.js",
+    "auto:bump-minor": "node scripts/autobump_minor.js",
+    "auto:bump-major": "node scripts/autobump_major.js",
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "compile-styles": "sass --style=expanded --precision 6 ./src/index.scss dist/index.css",
+    "css-minify": "cleancss --level 1 --format breaksWith=lf --output dist/index.min.css dist/index.css",
+    "build": "yarn compile-styles && yarn css-minify"
+  },
+  "peerDependencies": {
+    "react": ">=16.9.0",
+    "prop-types": "^15.7.2"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/mondaycom/monday-ui-react-core.git"
+  },
+  "keywords": [
+    "CSS",
+    "THEMES"
+  ],
+  "author": "monday.com",
+  "license": "MIT",
+  "files": [
+    "src/",
+    "dist/",
+    "stylelint-config/"
+  ],
+  "bugs": {
+    "url": "https://github.com/mondaycom/monday-ui-react-core/issues"
+  },
+  "homepage": "https://github.com/mondaycom/monday-ui-react-core#readme",
+  "devDependencies": {
+    "clean-css-cli": "^4.3.0",
+    "sass": "^1.70.0",
+    "prettier": "^2.0.5"
+  }
+}