@vinicunca/unocss-preset 0.0.2

package/package.json

@@ -0,0 +1,82 @@
+{
+  "name": "@vinicunca/unocss-preset",
+  "version": "0.0.2",
+  "packageManager": "pnpm@7.15.2",
+  "description": "UnoCSS custom preset",
+  "author": "praburangki<https://github.com/praburangki>",
+  "license": "MIT",
+  "homepage": "https://github.com/vinicunca/unocss-preset#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vinicunca/unocss-preset.git"
+  },
+  "bugs": {
+    "url": "https://github.com/vinicunca/unocss-preset/issues"
+  },
+  "keywords": [
+    "unocss",
+    "unocss-preset"
+  ],
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "require": "./dist/index.cjs",
+      "import": "./dist/index.mjs"
+    },
+    "./client": {
+      "types": "./dist/client.d.ts",
+      "require": "./dist/client.cjs",
+      "import": "./dist/client.mjs"
+    },
+    "./*": "./styles/*"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "client": [
+        "./dist/client.d.ts"
+      ]
+    }
+  },
+  "files": [
+    "dist",
+    "styles"
+  ],
+  "peerDependencies": {
+    "unocss": "*",
+    "@vinicunca/js-utilities": "*"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^17.4.2",
+    "@commitlint/config-conventional": "^17.4.2",
+    "@vinicunca/eslint-config": "^1.6.2",
+    "@vinicunca/js-utilities": "^2.6.4",
+    "bumpp": "^8.2.1",
+    "commitizen": "^4.2.6",
+    "conventional-changelog-cli": "^2.2.2",
+    "cz-customizable": "^7.0.0",
+    "eslint": "^8.32.0",
+    "eslint-define-config": "^1.14.0",
+    "husky": "^8.0.3",
+    "is-ci": "^3.0.1",
+    "lint-staged": "^13.1.0",
+    "typescript": "^4.9.4",
+    "unbuild": "^1.1.1",
+    "unocss": "^0.49.0",
+    "vitest": "^0.28.2"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "release": "bumpp package.json --commit --push --tag --commit 'chore: release v'",
+    "build": "unbuild",
+    "dev": "unbuild --stub",
+    "lint": "eslint --fix .",
+    "precommit": "lint-staged -c ./.husky/.lintstagedrc -q",
+    "test": "vitest -u"
+  }
+}

package/styles/reset.css

@@ -0,0 +1,318 @@
+* {
+  /* Remove default margin on everything */
+  margin: 0;
+
+  /* Remove default padding on everything */
+  padding: 0;
+  
+  /* Calc `em` based line height, bigger line height for smaller font size and smaller line height for bigger font size: https://kittygiraudel.com/2020/05/18/using-calc-to-figure-out-optimal-line-height/ */
+  line-height: calc(0.25rem + 1em + 0.25rem);
+}
+
+*,
+::before,
+::after {
+  /* Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) */
+  box-sizing: border-box;
+
+  /* Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */
+  border-width: 0;
+  border-style: solid;
+  border-color: currentColor;
+
+  /* Remove border and set sensible defaults for backgrounds, on all elements except fieldset progress and meter */
+  background-origin: border-box;
+  background-repeat: no-repeat;
+}
+
+html {
+  /* Making sure text size is only controlled by font-size */
+  -webkit-text-size-adjust: none;
+  
+  /* Use a more readable tab size. */
+  -moz-tab-size: 4;
+  tab-size: 4;
+  
+  /* Use the user's configured `sans` font-family by default. */
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
+    'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+}
+
+/* Smooth scrolling for users that don't prefer reduced motion */
+@media (prefers-reduced-motion: no-preference) {
+  html:focus-within {
+    scroll-behavior: smooth;
+  }
+}
+
+body {
+  /* Improve text rendering */
+  -webkit-font-smoothing: antialiased;
+  
+  /* https://marco.org/2012/11/15/text-rendering-optimize-legibility */
+  text-rendering: optimizeSpeed;
+  
+  /* Allow percentage-based heights in the application */
+  min-block-size: 100%;
+}
+
+:where(hr) {
+  /* Add the correct height in Firefox. */
+  height: 0;
+  /* Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) */
+  color: inherit;
+  /* Ensure horizontal rules are visible by default. */
+  border-top-width: 1px;
+}
+
+/* Add the correct text decoration in Chrome, Edge, and Safari. */
+abbr:where([title]) {
+  text-decoration: underline dotted;
+}
+
+/* Avoid text overflows */
+:where(p, h1, h2, h3, h4, h5, h6) {
+  overflow-wrap: break-word;
+}
+
+/* Remove the default font size and weight for headings. */
+:where(h1, h2, h3, h4, h5, h6) {
+  font-size: inherit;
+  font-weight: inherit;
+}
+
+/* Reset links to optimize for opt-in styling instead of opt-out. */
+:where(a) {
+  color: inherit;
+  text-decoration: inherit;
+}
+
+/* Add the correct font weight in Edge and Safari. */
+:where(b, strong) {
+  font-weight: bolder;
+}
+
+/* Use the user's configured `mono` font family by default. */
+:where(code, kbd, samp, pre) {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+    'Liberation Mono', 'Courier New', monospace; /* 1 */
+  /* Correct the odd `em` font sizing in all browsers. */
+  font-size: 1em; /* 2 */
+}
+
+/* Add the correct font size in all browsers. */
+:where(small) {
+  font-size: 80%;
+}
+
+/* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
+:where(sub, sup) {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+:where(sub) {
+  bottom: -0.25em;
+}
+
+:where(sup) {
+  top: -0.5em;
+}
+
+:where(table) {
+  /* Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) */
+  text-indent: 0;
+  /* Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) */
+  border-color: inherit;
+  /* Remove gaps between table borders by default. */
+  border-collapse: collapse;
+}
+
+/* Change the font styles in all browsers. */
+:where(button, input, optgroup, select, textarea),
+:where(input[type="file"])::-webkit-file-upload-button {
+  font-family: inherit;
+  font-size: 100%;
+  line-height: inherit;
+  color: inherit;
+  font: inherit;
+  font-size: inherit;
+}
+
+/* Remove the inheritance of text transform in Edge and Firefox. */
+:where(button, select) {
+  text-transform: none;
+}
+
+:where(button, [type='button'], [type='reset'], [type='submit']) {
+  /* Correct the inability to style clickable types in iOS and Safari. */
+  -webkit-appearance: button;
+  /* Remove default button styles. */
+  background-color: transparent;
+  background-image: none;
+}
+
+/* Use the modern Firefox focus style for all focusable elements. */
+:where(:-moz-focusring) {
+  outline: auto;
+}
+
+/* Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) */
+:where(:-moz-ui-invalid) {
+  box-shadow: none;
+}
+
+/* Add the correct vertical alignment in Chrome and Firefox. */
+:where(progress) {
+  vertical-align: baseline;
+}
+
+/* Correct the cursor style of increment and decrement buttons in Safari. */
+:where(::-webkit-inner-spin-button, ::-webkit-outer-spin-button) {
+  height: auto;
+}
+
+:where([type='search']) {
+  /* Correct the odd appearance in Chrome and Safari. */
+  -webkit-appearance: textfield;
+  /* Correct the outline style in Safari. */
+  outline-offset: -2px;
+}
+
+/* Remove the inner padding in Chrome and Safari on macOS. */
+:where(::-webkit-search-decoration) {
+  -webkit-appearance: none;
+}
+
+:where(::-webkit-file-upload-button) {
+  /* Correct the inability to style clickable types in iOS and Safari. */
+  -webkit-appearance: button;
+  /* Change font properties in Safari. */
+  font: inherit;
+}
+
+/* Add the correct display in Chrome and Safari. */
+:where(summary) {
+  display: list-item;
+}
+
+/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
+:where(ul, ol, menu)[role="list"] {
+  list-style: none;
+}
+
+/* Change textarea resize to vertical only and block only if the browser supports that */
+:where(textarea) {
+  resize: vertical;
+}
+@supports (resize: block) {
+  :where(textarea) {
+    resize: block;
+  }
+}
+
+:where(input::placeholder, textarea::placeholder) {
+  /* Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) */
+  opacity: 1;
+  /* Set the default placeholder color to the user's configured gray 400 color. */
+  color: #9ca3af;
+}
+
+/* Set the default cursor for buttons. */
+:where(button, [role='button']) {
+  cursor: pointer;
+}
+
+/* Make sure users can't select button text */
+:where(button, button[type], input[type="button"], input[type="submit"], input[type="reset"]),
+:where(input[type="file"])::-webkit-file-upload-button,
+:where(input[type="file"])::file-selector-button {
+  -webkit-tap-highlight-color: transparent;
+  -webkit-touch-callout: none;
+  user-select: none;
+  text-align: center;
+}
+
+/* Disabled cursor for disabled buttons */
+:where(button, button[type], input[type="button"], input[type="submit"], input[type="reset"])[disabled] {
+  cursor: not-allowed;
+}
+
+:where(img, svg, video, canvas, audio, iframe, embed, object) {
+  /* Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) */
+  display: block;
+  /* Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design. */
+  vertical-align: middle; /* 2 */
+}
+
+/* Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) */
+:where(img, video) {
+  max-width: 100%;
+  height: auto;
+}
+
+:where(img, svg, video) {
+  block-size: auto;
+  max-inline-size: 100%;
+}
+
+/* More readable underline style for anchor tags without a class. This could be set on anchor tags globally, but it can cause conflicts. */
+a:not([class]) {
+  text-decoration-skip-ink: auto;
+}
+
+/* Make it clear that interactive elements are interactive */
+:where(a[href], area, button, input, label[for], select, summary, textarea, [tabindex]:not([tabindex*="-"])) {
+  cursor: pointer;
+  touch-action: manipulation;
+}
+:where(input[type="file"]) {
+  cursor: auto;
+}
+:where(input[type="file"])::-webkit-file-upload-button,
+:where(input[type="file"])::file-selector-button {
+  cursor: pointer;
+}
+
+/* Ensure the default browser behavior of the `hidden` attribute. */
+:where([hidden]) {
+  display: none;
+}
+
+/* Remove stroke and set fill colour to the inherited font colour */
+:where(svg) {
+  stroke: none;
+  fill: currentColor;
+}
+
+/* SVG's without a fill attribute */
+:where(svg):where(:not([fill])) {
+  /* Remove fill and set stroke colour to the inherited font colour */
+  stroke: currentColor;
+  fill: none;
+  /* Rounded stroke */
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+/* Set a size for SVG's without a width attribute */
+:where(svg):where(:not([width])) {
+  inline-size: 5rem;
+}
+
+/* Animate focus outline */
+@media (prefers-reduced-motion: no-preference) {
+  :focus-visible {
+    transition: outline-offset 145ms cubic-bezier(0.25, 0, 0.4, 1);
+  }
+  :where(:not(:active)):focus-visible {
+    transition-duration: 0.25s;
+  }
+}
+:where(:not(:active)):focus-visible {
+  outline-offset: 5px;
+}