From 44e5a55736c4ff99d404441936b055483ed9c42d Mon Sep 17 00:00:00 2001 From: kj_sh604 Date: Sat, 14 Feb 2026 12:39:43 -0500 Subject: fork: initial commit, derived from water.css (d950cbc) --- .github/CODE_OF_CONDUCT.md | 76 ++++++++++++++++++++ .github/CONTRIBUTING.md | 169 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 245 insertions(+) create mode 100644 .github/CODE_OF_CONDUCT.md create mode 100755 .github/CONTRIBUTING.md (limited to '.github') diff --git a/.github/CODE_OF_CONDUCT.md b/.github/CODE_OF_CONDUCT.md new file mode 100644 index 0000000..1409a78 --- /dev/null +++ b/.github/CODE_OF_CONDUCT.md @@ -0,0 +1,76 @@ +# Contributor Covenant Code of Conduct + +## Our Pledge + +In the interest of fostering an open and welcoming environment, we as +contributors and maintainers pledge to making participation in our project and +our community a harassment-free experience for everyone, regardless of age, body +size, disability, ethnicity, sex characteristics, gender identity and expression, +level of experience, education, socio-economic status, nationality, personal +appearance, race, religion, or sexual identity and orientation. + +## Our Standards + +Examples of behavior that contributes to creating a positive environment +include: + +* Using welcoming and inclusive language +* Being respectful of differing viewpoints and experiences +* Gracefully accepting constructive criticism +* Focusing on what is best for the community +* Showing empathy towards other community members + +Examples of unacceptable behavior by participants include: + +* The use of sexualized language or imagery and unwelcome sexual attention or + advances +* Trolling, insulting/derogatory comments, and personal or political attacks +* Public or private harassment +* Publishing others' private information, such as a physical or electronic + address, without explicit permission +* Other conduct which could reasonably be considered inappropriate in a + professional setting + +## Our Responsibilities + +Project maintainers are responsible for clarifying the standards of acceptable +behavior and are expected to take appropriate and fair corrective action in +response to any instances of unacceptable behavior. + +Project maintainers have the right and responsibility to remove, edit, or +reject comments, commits, code, wiki edits, issues, and other contributions +that are not aligned to this Code of Conduct, or to ban temporarily or +permanently any contributor for other behaviors that they deem inappropriate, +threatening, offensive, or harmful. + +## Scope + +This Code of Conduct applies both within project spaces and in public spaces +when an individual is representing the project or its community. Examples of +representing a project or community include using an official project e-mail +address, posting via an official social media account, or acting as an appointed +representative at an online or offline event. Representation of a project may be +further defined and clarified by project maintainers. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be +reported by contacting the project team at hi@kognise.dev. All +complaints will be reviewed and investigated and will result in a response that +is deemed necessary and appropriate to the circumstances. The project team is +obligated to maintain confidentiality with regard to the reporter of an incident. +Further details of specific enforcement policies may be posted separately. + +Project maintainers who do not follow or enforce the Code of Conduct in good +faith may face temporary or permanent repercussions as determined by other +members of the project's leadership. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, +available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html + +[homepage]: https://www.contributor-covenant.org + +For answers to common questions about this code of conduct, see +https://www.contributor-covenant.org/faq diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md new file mode 100755 index 0000000..8985ceb --- /dev/null +++ b/.github/CONTRIBUTING.md @@ -0,0 +1,169 @@ +# Contributing to Water.css + +Water.css becomes better for everyone when people like you help make it better! + +Have any questions or concerns? Did I forget an element or selector? Does something look ugly? Feel free to submit an issue or pull request. + +Before contributing, please read the [code of conduct](CODE_OF_CONDUCT.md). Also, you agree that your contributions will be licensed under this project's [MIT License](../LICENSE.md). + +## Overview + +Please take a moment to read through the following guidelines: + +- [Get started](#get-started) +- [Find issues to work on](#find-issues-to-work-on) +- [Add or change styles](#add-or-change-styles) +- [Create your pull request](#create-your-pull-request) +- [Project structure](#project-structure) + +
+ +> **Quickstart**: +> 1. `yarn install` – install dependencies +> 2. `yarn dev` – start the dev server, make your changes +> 3. `yarn validate` – make sure your changes pass all tests +> 4. `yarn changeset` – describe your changes for the changelog + +
+ +## Get started + +1. Get a copy of the repository. It is recommended to [fork](https://github.com/kognise/water.css/fork) it first and clone to your machine using `git`. + +2. Make sure that you have [yarn installed](https://classic.yarnpkg.com/en/docs/install/), then install dependencies by running: + + ``` + yarn install + ``` + +3. Start the development server with live reload: + + ``` + yarn dev + ``` + +4. Now you can visit [localhost:3000](http://localhost:3000) and start playing around with the framework – when you make changes to Water.css, the site will reload automatically so you can see what changed. + +*Note:* A script that builds distribution ready files is also available but it is not the part of development workflow. It is designed to be triggered automatically while publishing a new version of Water.css, but if you want to inspect the minified assets meant for production, you can run it manually: `yarn build` + +> Alternatively, you can develop in Repl.it, a supercool in-browser IDE! Just click this button: [![Run on Repl.it](https://repl.it/badge/github/kognise/water.css)](https://repl.it/github/kognise/water.css) + +## Find issues to work on + +If you are new to contributing open-source software, you can start by picking any relevant issue that is [tagged with **`good first issue`**]( +https://github.com/kognise/water.css/contribute). + +Also, everyone is welcome to contribute on issues [tagged with **`help wanted`**, you can find it filtered here](https://github.com/kognise/water.css/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22). + +## Add or change styles + +There are a few rules for working in the Water.css source code: + +1. The styles must not use any classes or IDs. Water.css is made entirely of basic style rules that only target HTML elements. + +2. Don't specify colors directly in the source files (`src/parts/*`). Only use named variables there, which are declared in `src/variables-*.css`. + + ❌ Bad: + ```css + color: #fff; + ``` + + ✔ Good: + ```css + color: var(--text-bright); + ``` + +3. Reuse existing colors where possible. Before introducing a new color to our palette, check if one of the existing colors fits your needs. + +4. If you introduce a new variable, make sure to declare it both in `variables-dark.css` and `variables-light.css` so it's available in both themes. Also, add the new variable to the list of variables available for theming in the [README](../README.md#theming). + +## Create your pull request + +Once you're happy with your changes, you need to **commit** them, create a **changelog** and **submit a pull request**. + +A few general rules of thumb about what makes a good pull request: + +- Make sure that your pull request covers a small and well defined scope +- Make small commits with clear and explainful messages +- Provide a clear description about your contribution on GitHub + +### Commit + +When you commit code, Water.css will run some checks to make sure that your changes have no errors and match the project's coding style – a process called [**Linting**](https://www.freecodecamp.org/news/what-is-linting-and-how-can-it-save-you-time). It will also verify that all **colors are accessible**, which means they need to have enough contrast to be easily readable. + +If the code you introduced has errors or some of the colors aren't accessible, you'll see an error and the commit will abort. +You can check whether your changes pass all tests before committing them by running: + +``` +yarn validate +``` + +If there are errors, you can try to fix them automatically by running: + +``` +yarn lint +``` + +
+ ℹ A note about puppeteer and WSL +
+
+ The accessibility checks use puppeteer, a tool that uses Chrome to render websites "headlessly", without a visible interface. In some environments like the Windows Subsystem for Linux, you'll need to manually configure and run an X-Server in order for puppeteer to work. +
+
+ +
+ +### Changelog + +Now that your changes are commited, you'll need to **generate a changelog**: + +We use a tool called [Changesets](https://github.com/atlassian/changesets) to keep track of what changes have been made between versions. Make sure to create a changelog before creating your pull request! + +Just run this command for each change you made, and then answer a few questions: + +``` +yarn changeset +``` + +If you're not sure what kind of change you're making, pick "patch". + +### Submit a Pull Request + +Once your changes have been committed and you've created a changelog, you'll want to [submit a pull request](https://github.com/kognise/water.css/compare). + +Be sure to provide a clear description of what your pull request includes. If your pull request will close an existing issue, make sure to write `Closes #[id]` in the pull request description, where `[id]` is replaced by the issue your pull request will close. + +After submitting a pull request, it will need to be reviewed by a maintainer of the project before being merged. You may be asked to make some changes to your pull request. + +After your change has been reviewed and merged, you can celebrate as the newest contributor to the Water.css project! 🎉 + +## Project structure + +``` +. +├── out +├── dist +└── docs + └── icons +└── src + ├── assets + ├── builds + └── parts +``` + +- **`out`** is ignored by git – it contains built assets for distribution + +- **`dist`** contains old assets, for backwards compatibility - ignore this + +- **`docs`** contains the documentation and demo page + +- **`docs/icons`** contains water.css favicons used in the documentation + +- **`src`** contains all the source stylesheets grouped into folders and variables + +- **`src/assets`** contains images/icons used for UI element styling + +- **`src/builds`** contains entry files for the different versions water.css comes in: auto, dark and light + +- **`src/parts`** contains the water.css source code organized in separate files by its kind, like "forms" or "typography" -- cgit v1.2.3