adata-ui 2.1.41-beta.1 → 2.1.41

package/README.md

@@ -1,75 +1,75 @@
-# Adata UI with Nuxt 3 using Layers
-
-Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
-
-## Setup
-
-Make sure to install the dependencies:
-
-```bash
-# npm
-npm install
-
-# pnpm
-pnpm install
-
-# yarn
-yarn install
-
-# bun
-bun install
-```
-
-## Development Server
-
-Start the development server on `https://localhost:3000`:
-
-```bash
-# npm
-npm run dev
-
-# pnpm
-pnpm run dev
-
-# yarn
-yarn dev
-
-# bun
-bun run dev
-```
-
-## Production
-
-Build the application for production:
-
-```bash
-# npm
-npm run build
-
-# pnpm
-pnpm run build
-
-# yarn
-yarn build
-
-# bun
-bun run build
-```
-
-Locally preview production build:
-
-```bash
-# npm
-npm run preview
-
-# pnpm
-pnpm run preview
-
-# yarn
-yarn preview
-
-# bun
-bun run preview
-```
-
-Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
+# Adata UI with Nuxt 3 using Layers
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `https://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

package/app.config.ts

@@ -1,28 +1,28 @@
-export default defineAppConfig({
-  myLayer: {
-    name: 'Adata UI v2',
-  },
-})
-
-declare module '@nuxt/schema' {
-  interface AppConfigInput {
-    myLayer?: {
-      /** Project name */
-      name?: string
-      loginUrl?: string
-      oldVersion?: string
-      landingUrl?: string
-      pkUrl?: string
-      tenderUrl?: string
-      workUrl?: string
-      avtoUrl?: string
-      analyticsUrl?: string
-      tnvedUrl?: string
-      complianceUrl?: string
-      counterParty?: string
-      langIsOn?: boolean
-      authMode?: 'local' | 'separate'
-      cloudPayments?: string
-    }
-  }
-}
+export default defineAppConfig({
+  myLayer: {
+    name: 'Adata UI v2',
+  },
+})
+
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    myLayer?: {
+      /** Project name */
+      name?: string
+      loginUrl?: string
+      oldVersion?: string
+      landingUrl?: string
+      pkUrl?: string
+      tenderUrl?: string
+      workUrl?: string
+      avtoUrl?: string
+      analyticsUrl?: string
+      tnvedUrl?: string
+      complianceUrl?: string
+      counterParty?: string
+      langIsOn?: boolean
+      authMode?: 'local' | 'separate'
+      cloudPayments?: string
+    }
+  }
+}

package/app.vue

@@ -1,8 +1,8 @@
-<template>
-  <nuxt-layout>
-    <a-header />
-    <nuxt-page></nuxt-page>
-  </nuxt-layout>
-</template>
-<script setup lang="ts">
-</script>
+<template>
+  <nuxt-layout>
+    <a-header />
+    <nuxt-page></nuxt-page>
+  </nuxt-layout>
+</template>
+<script setup lang="ts">
+</script>

package/assets/styles/index.scss

@@ -0,0 +1,166 @@
+
+@use './modules/typography' as *;
+@use "./modules/base" as *;
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+
+html {
+  scrollbar-gutter: stable;
+}
+
+.dark {
+  color-scheme: dark;
+}
+
+body {
+  padding: 0 !important;
+  color: #2C3E50;
+  background-color: #F4F5F6;
+}
+
+.dark body {
+  color: #E3E5E8;
+  background-color: #161617;
+}
+
+html::-webkit-scrollbar {
+  width: 15px;
+}
+
+html::-webkit-scrollbar-thumb {
+  background: #c4c4c4;
+}
+
+.no-scrollbar::-webkit-scrollbar {
+  display: none;
+}
+
+/* Hide scrollbar for IE, Edge and Firefox */
+.no-scrollbar {
+  -ms-overflow-style: none;  /* IE and Edge */
+  scrollbar-width: none;  /* Firefox */
+}
+
+@media (min-width: 320px) and (max-width: 767px) {
+  .a-container {
+    padding: 0
+  }
+  .mobile-padding {
+    padding: 16px;
+  }
+}
+@media (prefers-color-scheme: dark) {
+  .bg-gradient-blue {
+    background: linear-gradient(236.46deg, #4FBDFF -2.39%, #1B98E2 79.1%);
+  }
+}
+@media (prefers-color-scheme: light) {
+  .bg-gradient-blue {
+    background: linear-gradient(236.46deg, #479FFF -2.39%, #0070EB 79.1%);
+  }
+}
+
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.Toastify__toast-container {
+  z-index: 10002 !important;
+}
+
+@media (min-width: 481px) {
+  .Toastify__toast-container {
+    width: 600px;
+  }
+}
+
+.Toastify__toast-container .Toastify__toast {
+  min-height: 71px;
+  padding: 14px 16px;
+  border: 1px solid transparent;
+  border-left-width: 4px; /* акцентная полоса слева */
+  border-radius: 12px;
+  box-shadow: none;
+}
+
+.Toastify__toast-container .Toastify__toast-body {
+  margin: 0;
+  padding: 0;
+  gap: 12px;
+  align-items: center;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 24px;
+}
+
+.Toastify__toast-container .Toastify__toast-icon {
+  width: 24px;
+  height: 24px;
+  margin-inline-end: 0;
+}
+
+.Toastify__toast-container .Toastify__toast-icon svg {
+  width: 24px;
+  height: 24px;
+}
+
+.Toastify__toast-container .Toastify__close-button {
+  align-self: center;
+  color: #2c3e50;
+  opacity: 0.6;
+}
+
+.Toastify__toast-container .Toastify__close-button:hover {
+  opacity: 1;
+}
+
+.Toastify__toast-container .Toastify__toast--info    { background: #eff6ff; border-color: #068dff; color: #068dff; }
+.Toastify__toast-container .Toastify__toast--success { background: #f0fdf4; border-color: #00a63e; color: #00a63e; }
+.Toastify__toast-container .Toastify__toast--warning { background: #fffbeb; border-color: #e17100; color: #e17100; }
+.Toastify__toast-container .Toastify__toast--error   { background: #fef2f2; border-color: #e7000b; color: #e7000b; }
+
+.Toastify__toast-container .Toastify__toast--info    .Toastify__progress-bar { background: #068dff; }
+.Toastify__toast-container .Toastify__toast--success .Toastify__progress-bar { background: #00a63e; }
+.Toastify__toast-container .Toastify__toast--warning .Toastify__progress-bar { background: #e17100; }
+.Toastify__toast-container .Toastify__toast--error   .Toastify__progress-bar { background: #e7000b; }
+
+/* Тёмная тема (нежная): фон = тинт solid-хекса тона /10, но непрозрачный (тост плавает
+   над контентом) — композит поверх #161617; бордер rgba(solid,0.4); текст/иконка -400. */
+.dark .Toastify__toast-container .Toastify__close-button { color: #e3e5e8; }
+
+.dark .Toastify__toast-container .Toastify__toast--info    { background: #14222e; border-color: rgba(6, 141, 255, 0.4); color: #43afed; }
+.dark .Toastify__toast-container .Toastify__toast--success { background: #14241b; border-color: rgba(0, 166, 62, 0.4); color: #6bbd6e; }
+.dark .Toastify__toast-container .Toastify__toast--warning { background: #2a1f15; border-color: rgba(225, 113, 0, 0.4); color: #ffc31e; }
+.dark .Toastify__toast-container .Toastify__toast--error   { background: #2b1416; border-color: rgba(231, 0, 11, 0.4); color: #f47e75; }
+
+input[type="search"]::-webkit-search-cancel-button {
+  -webkit-appearance: none;
+  appearance: none;
+}
+
+input[type="search"]::-ms-clear {
+  display: none;
+  width: 0;
+  height: 0;
+}
+/* Firefox */
+input[type=number] {
+  -moz-appearance: textfield;
+}
+
+.visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  border: 0;
+  padding: 0;
+  white-space: nowrap;
+  clip-path: inset(100%);
+  clip: rect(0 0 0 0);
+  overflow: hidden;
+}

package/assets/styles/modules/_base.scss

@@ -0,0 +1,5 @@
+@layer components {
+  .a-container {
+    @apply  container mx-auto px-4 2xl:px-16;
+  }
+}

package/assets/styles/modules/_typography.scss

@@ -0,0 +1,152 @@
+// Visit https://www.figma.com/file/nJY45RLoow0IsmpMZ35aTR/DE blue-defaultSIGN-SYSTEM-NEW?type=design&node-id=619-53613&mode=design&t=tY2NLdArlQhUP9d3-0
+// for more information on typography styles
+// And see https://tailwindcss.com/docs/adding-custom-styles for more information on adding custom styles
+
+@layer components {
+
+  // Headings
+  .heading-01 {
+    @apply font-bold text-[2rem] leading-10;
+  }
+
+  .heading-02 {
+    @apply font-bold text-2xl leading-8;
+  }
+
+  .heading-03 {
+    @apply font-semibold text-xl leading-6;
+  }
+
+  .heading-04 {
+    @apply font-semibold text-base leading-5;
+  }
+
+  .heading-05 {
+    @apply font-semibold text-sm leading-5;
+  }
+
+  // Body
+  .body-400 {
+    @apply font-normal text-sm leading-5;
+  }
+
+  .body-500 {
+    @apply font-medium text-sm leading-5;
+  }
+
+  .body-600 {
+    @apply font-semibold text-sm leading-5
+  }
+
+  .body-s-400 {
+    @apply font-normal text-sm leading-4;
+  }
+
+  .body-s-500 {
+    @apply font-medium text-sm leading-4;
+  }
+
+  // Caption
+  .caption-400 {
+    @apply font-normal text-[0.625rem] leading-4;
+  }
+
+  .caption-500 {
+    @apply font-medium text-[0.625rem] leading-4;
+  }
+
+  .caption-700 {
+    @apply font-bold text-[0.625rem] leading-4;
+  }
+
+  // Form
+  .label-400 {
+    @apply font-normal text-sm leading-5;
+  }
+
+  .label-600 {
+    @apply font-semibold text-sm leading-5;
+  }
+
+  .label-s-400 {
+    @apply font-normal text-xs leading-4;
+  }
+
+  .label-s-700 {
+    @apply font-bold text-xs leading-4;
+  }
+
+  .optional-i-700 {
+    @apply font-bold italic text-sm leading-5;
+  }
+
+  .placeholder-300 {
+    @apply font-light text-sm leading-5;
+  }
+
+  .description-400 {
+    @apply font-normal text-xs leading-5;
+  }
+
+  //  Link
+  .link-400 {
+    @apply text-blue-500 font-normal text-sm leading-5;
+  }
+
+  .link-stroke-400 {
+    @apply text-blue-500 font-normal text-sm leading-5;
+  }
+
+  .link-s-400 {
+    @apply text-blue-500 font-normal text-sm leading-4;
+  }
+
+  .link-s-stroke-400 {
+    @apply text-blue-500 font-normal text-sm leading-4;
+  }
+
+  .link-small-800 {
+    @apply text-blue-500 font-bold text-sm leading-4;
+  }
+
+  //  Special Styles
+  .display-80-700 {
+    @apply font-bold text-[5rem] leading-[6.5rem];
+  }
+
+  .display-80-400 {
+    @apply font-normal text-[5rem] leading-[6.5rem];
+  }
+
+  .display-60-700 {
+    @apply font-bold text-[3.75rem] leading-[4.750rem];
+  }
+
+  .display-60-400 {
+    @apply font-normal text-[3.75rem] leading-[4.750rem];
+  }
+
+  .display-48-700 {
+    @apply font-bold text-[3rem] leading-[4rem];
+  }
+
+  .display-48-400 {
+    @apply font-normal text-[3rem] leading-[4rem];
+  }
+
+  .numbers-60-700 {
+    @apply font-bold text-[3.75rem] leading-[3.5rem];
+  }
+
+  .numbers-60-400 {
+    @apply font-normal text-[3.75rem] leading-[3.5rem];
+  }
+
+  .numbers-40-700 {
+    @apply font-bold text-[2.5rem] leading-[3.375rem];
+  }
+
+  .numbers-40-400 {
+    @apply font-normal text-[2.5rem] leading-[3.375rem];
+  }
+}

package/components/elements/README.md

@@ -1 +1 @@
-# button, alerts, dropdown
+# button, alerts, dropdown