diff --git a/.storybook/preview.css b/.storybook/preview.css
index d2e9fcd..79ab5c4 100644
--- a/.storybook/preview.css
+++ b/.storybook/preview.css
@@ -38,7 +38,7 @@ html, body, #storybook-root, #wrapper {
.hide-controls-column > div > table {
& > thead > tr > th:last-child,
& > tbody > tr:not(:first-child) > td:last-child {
- display: none !important;
+ display: none;
}
& > thead > tr th:nth-child(1),
diff --git a/index.html b/index.html
index eb9288b..105148f 100644
--- a/index.html
+++ b/index.html
@@ -6,26 +6,6 @@
Title
diff --git a/src/ui/widget.ts b/src/ui/widget.ts
index 8a12711..65335c4 100644
--- a/src/ui/widget.ts
+++ b/src/ui/widget.ts
@@ -1,8 +1,6 @@
import { h, ref, onBeforeUnmount, inject, computed } from 'vue';
-import './styles/main.css'
+import './styles/main.css';
-import 'virtual:uno.css';
-import PFooter from './components/Footer.vue';
import type { IWidgetSettings } from './interfaces';
import { resolveView } from './utils/router';
import type { Theme } from './utils/theme';
@@ -11,41 +9,38 @@ import { translatorKey } from './utils/translator';
export function App(theme: Theme, settings: Partial): any {
return {
provide: {
- theme
+ theme,
},
- setup(){
- const isMobile = ref(false)
- const i18n = inject(translatorKey) as Translator
+ setup() {
+ const isMobile = ref(false);
+ const i18n = inject(translatorKey) as Translator;
function onResize() {
- isMobile.value = window.innerWidth < 600
+ isMobile.value = window.innerWidth < 600;
}
- window.addEventListener('resize', onResize, { passive: true })
- onResize()
+ window.addEventListener('resize', onResize, { passive: true });
+ onResize();
onBeforeUnmount(() => {
if (typeof window !== 'undefined') {
- window.removeEventListener('resize', onResize)
+ window.removeEventListener('resize', onResize);
}
- })
+ });
return {
- resolvedView: computed(() => resolveView(settings.mode)) ,
+ resolvedView: computed(() => resolveView(settings.mode)),
isMobile,
- locale: i18n.localeRef
- }
+ locale: i18n.localeRef,
+ };
},
- render(){
+ render() {
return h(
'div',
{
class: 'pa__widget',
- key: this.locale
+ key: this.locale,
},
- this.resolvedView && h(
- this.resolvedView
- )
- )
- }
+ this.resolvedView && h(this.resolvedView)
+ );
+ },
};
}
-
diff --git a/stories/02.GettingStarted.mdx b/stories/02.GettingStarted.mdx
index 8397f88..ba8da4d 100644
--- a/stories/02.GettingStarted.mdx
+++ b/stories/02.GettingStarted.mdx
@@ -160,16 +160,12 @@ You can configure social button appearance and footer behavior globally:
```javascript
new PlusAuthWidget('#widget', {
- socialLogin: {
- buttonVariant: 'circle' // or 'block'
- },
footer: {
enabled: false
}
}, window.PlusAuth)
```
-- `socialLogin.buttonVariant`: renders social buttons as `block` or `circle`
- `footer.enabled`: hides or shows the footer locale/legal links area
## Development And Testing
diff --git a/uno.config.ts b/uno.config.ts
index 4ff9ef3..67db930 100644
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -1,4 +1,4 @@
-import presetRemToPx from '@unocss/preset-rem-to-px'
+import presetRemToPx from '@unocss/preset-rem-to-px';
import {
defineConfig,
presetIcons,
@@ -7,27 +7,26 @@ import {
presetWebFonts,
transformerDirectives,
transformerVariantGroup,
-} from 'unocss'
+} from 'unocss';
const colorRange = (name: string, prefix = 'pa-') => {
const obj: Record = {
- DEFAULT: `rgb(var(--${prefix}color-${name}))`
- }
- const stops = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
- stops.forEach(stop => {
- obj[stop] = `rgb(var(--${prefix}color-${name}-${stop}))`
- })
- return obj
-}
+ DEFAULT: `rgb(var(--${prefix}color-${name}))`,
+ };
+ const stops = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
+ stops.forEach((stop) => {
+ obj[stop] = `rgb(var(--${prefix}color-${name}-${stop}))`;
+ });
+ return obj;
+};
export default defineConfig({
-
theme: {
fontSize: {
- base: '1.5rem'
+ base: '1.5rem',
},
width: {
- '20': '20%'
+ '20': '20%',
},
colors: {
primary: colorRange('primary'),
@@ -42,13 +41,13 @@ export default defineConfig({
presets: [
presetWind4({
variablePrefix: 'pa-',
+ preflights: {
+ property: false,
+ },
}),
presetIcons(),
presetTypography(),
- presetRemToPx()
- ],
- transformers: [
- transformerDirectives(),
- transformerVariantGroup(),
+ presetRemToPx(),
],
-})
\ No newline at end of file
+ transformers: [transformerDirectives(), transformerVariantGroup()],
+});