Tirius Comments - Answer Overflow

Topics

Tirius

KPCKevin Powell - Community

•Created by snxxwyy on 7/6/2024 in #front-end

Input design method

I missed that author need to include "cm" text, 100% input width does not work here then. Make input take as much space as possible so it will be easier to click on it, remove input border and use .input-group border to indicate focus state using :focus-within selector. But for something more reliable and reusable, you should change you class names/css selectors to something more isolated. And you can also make it as web components if you want to easy reuse it and at the same time keep it in vanilla ecosystem (example - https://codepen.io/The-Tirius/pen/ExBYzRq) or better use a proper js framework.

15 replies

KPCKevin Powell - Community

•Created by snxxwyy on 7/6/2024 in #front-end

Input design method

Look carefully, input-group have a padding that prevent input from taking all the width

15 replies

KPCKevin Powell - Community

•Created by snxxwyy on 7/6/2024 in #front-end

Input design method

There is many things that can be improved about it, it's depends on how far you would like to go. But for the bare minimum I'll recomend you to make input size equal to wrapper size, so when you focus you don't have that double border effect.

15 replies

KPCKevin Powell - Community

•Created by 𝚓𝚎𝚛𝚎𝚖𝚢 𝚙𝚊𝚛𝚔𝚎𝚛 on 6/17/2024 in #front-end

Are CSS Variables Bad?

You definitely shouldn't be afraid to use them. CSS Variables are great, and can do most of the job that CSS preprocessor do. They also give easy ability to override styles of module/plugins/components if they are using them. They are super handly for theming. Idealy I try to use both, Less(CSS preprocessor) variables for static part and CSS variables for dynamic part. You probably can use PHP instead of CSS preprocessor if you comfortable with it, but you still want to minimize your CSS somehow..

10 replies

KPCKevin Powell - Community

•Created by Vipe on 6/16/2024 in #front-end

Struggling to display titles from api (RapidAPI)

Fix this first

21 replies

KPCKevin Powell - Community

•Created by Vipe on 6/16/2024 in #front-end

Struggling to display titles from api (RapidAPI)

You are using router-link but you have not install vue-router

21 replies

•Created by Tirius on 6/11/2024 in #❓・help

Nuxt Kit - addComponentsDir how exacly does import work ?

Thanks. Than all I need is Lazy prefix

4 replies

•Created by Hjelmdal on 6/11/2024 in #❓・help

Nuxt 3.12.1 - CONNECTION_REFUSED

Also node update was needed 18.18.2 was not enough for nuxt kit, I have installed 18.20.3

9 replies

•Created by Hjelmdal on 6/11/2024 in #❓・help

Nuxt 3.12.1 - CONNECTION_REFUSED

Recommended command to upgrade does not worked for me, I was needed to manually upgrade version of some modules in package.json

9 replies

•Created by Hjelmdal on 6/11/2024 in #❓・help

Nuxt 3.12.1 - CONNECTION_REFUSED

Try delete .nuxt, node_modules and make install

9 replies

•Created by Hjelmdal on 6/11/2024 in #❓・help

Nuxt 3.12.1 - CONNECTION_REFUSED

Think I have seen similar error while my app was not fully upgraded to 3.12.1

9 replies

•Created by Hjelmdal on 6/11/2024 in #❓・help

Nuxt 3.12.1 - CONNECTION_REFUSED

Is 24678 actual port where your app is running ?@Hjelmdal

9 replies

•Created by rightnow on 6/11/2024 in #❓・help

When upgrading to 3.12.1 -> @nuxt/schema & @nuxt/kit to be at least 3.12.1 but got 1.0.0

or similar command for your package manager

13 replies

•Created by rightnow on 6/11/2024 in #❓・help

When upgrading to 3.12.1 -> @nuxt/schema & @nuxt/kit to be at least 3.12.1 but got 1.0.0

you can try yarn why @nuxt/kit

13 replies

•Created by rightnow on 6/11/2024 in #❓・help

When upgrading to 3.12.1 -> @nuxt/schema & @nuxt/kit to be at least 3.12.1 but got 1.0.0

It could help if you share list of your packages

13 replies

•Created by rightnow on 6/11/2024 in #❓・help

When upgrading to 3.12.1 -> @nuxt/schema & @nuxt/kit to be at least 3.12.1 but got 1.0.0

Then it strange, need some exorcist

13 replies

•Created by rightnow on 6/11/2024 in #❓・help

When upgrading to 3.12.1 -> @nuxt/schema & @nuxt/kit to be at least 3.12.1 but got 1.0.0

Try to manually update this packages versions in package.json, delete node_modules, .nuxt, lock files and make install

"@nuxt/kit": "^3.12.1",

"@nuxt/kit": "^3.12.1",

and etc

13 replies

•Created by Tirius on 6/11/2024 in #❓・help

Nuxt Kit - addComponentsDir how exacly does import work ?

Currently I don't see that my components loaded only when I navigate to the page that use them. I wonder if I miss something, or can it be optimized some how, to load only when used.

4 replies

•Created by w7a9q on 6/10/2024 in #❓・help

useStorage in nuxt/test-utils

Bump. I'm interested in solution too. How to handle/mock auto imported composables.

8 replies

•Created by Tirius on 6/10/2024 in #❓・help

Testing custom Module.

I found out that you can resolve '#build' imports by adding resolve option to vitest.config

{
    resolve: {
        alias: {
            '#build/ui.options.mjs': resolve('./test/mocks/ui.options.js'),
        },
    }
}

{
    resolve: {
        alias: {
            '#build/ui.options.mjs': resolve('./test/mocks/ui.options.js'),
        },
    }
}

So with that setup I was able to test components using @vue/test-utils, but it was needed to remove composable and use direct import of options in components import moduleOptions from '#build/ui.options.mjs';

3 replies