@juligc99/loro-ui 0.0.1

package/package.json

@@ -0,0 +1,83 @@
+{
+  "name": "@juligc99/loro-ui",
+  "version": "0.0.1",
+  "description": "Loro UI design system and Angular component library.",
+  "author": "juligc99",
+  "license": "MIT",
+  "keywords": [
+    "angular",
+    "angular-21",
+    "ui-library",
+    "design-system",
+    "components",
+    "accessibility",
+    "storybook",
+    "loro-ui"
+  ],
+  "homepage": "https://github.com/juligc99/loro-ui#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/juligc99/loro-ui.git"
+  },
+  "bugs": {
+    "url": "https://github.com/juligc99/loro-ui/issues"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "peerDependencies": {
+    "@angular/animations": ">=21 <23",
+    "@angular/aria": ">=21 <23",
+    "@angular/cdk": ">=21 <23",
+    "@angular/common": ">=21 <23",
+    "@angular/core": ">=21 <23",
+    "@angular/forms": ">=21 <23",
+    "@angular/router": ">=21 <23",
+    "@capacitor/core": ">=8 <9",
+    "@capacitor/haptics": ">=8 <9",
+    "rxjs": "^7.8.0"
+  },
+  "peerDependenciesMeta": {
+    "@angular/animations": {
+      "optional": true
+    },
+    "@angular/aria": {
+      "optional": true
+    },
+    "@angular/cdk": {
+      "optional": true
+    },
+    "@angular/forms": {
+      "optional": true
+    },
+    "@angular/router": {
+      "optional": true
+    },
+    "@capacitor/core": {
+      "optional": true
+    },
+    "@capacitor/haptics": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": [
+    "**/*.css",
+    "**/*.scss"
+  ],
+  "module": "fesm2022/juligc99-loro-ui.mjs",
+  "typings": "types/juligc99-loro-ui.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./types/juligc99-loro-ui.d.ts",
+      "default": "./fesm2022/juligc99-loro-ui.mjs"
+    }
+  },
+  "type": "module"
+}

package/styles/_breakpoints.scss

@@ -0,0 +1,28 @@
+$mobile-tablet-max: 1023.88px;
+$phone-max: 479.99px;
+$desktop-min: 1024px;
+$smart-tv-min: 1600px;
+
+@mixin on-phone-portrait {
+  @media (max-width: $phone-max) and (orientation: portrait) {
+    @content;
+  }
+}
+
+@mixin on-mobile-tablet-landscape {
+  @media (min-width: $phone-max) and (max-width: $mobile-tablet-max) and (orientation: landscape) {
+    @content;
+  }
+}
+
+@mixin on-desktop {
+  @media (min-width: $desktop-min) {
+    @content;
+  }
+}
+
+@mixin on-smart-tv {
+  @media (min-width: $smart-tv-min) {
+    @content;
+  }
+}