Im working through an accessibility audit for one of our sites. One of the things that has came back is empty headers where we have used vue for the text content. The audit is not seeing the rendered content and is hightlighting this as an issue. Does anyone have any ideas as to a solution?
<h3 v-html="post.title.rendered"></h3>
This is seen as an empty h3
I found an link here that helps
Screen readers and Javascript
Thanks for the replies
Related
Table.vue contains Row.vue and Form.vue inside.
Wanted behavior:
Row of the table will say the component comes from Row.vue
I was right-clicking the Row and went on "View page source", "inspect" and explored, but I couldn't find the answer.
Any solutions?
Also it would be awesome if there's a tool that helps with what I explained above with visual like this: instead of margin, border and such. It would be like Table.vue, Row.vue, etc...
I'm sorry it's not clear to me what you're trying to achieve, but there is a browser-based tool that might help you with debugging. It is compatible with both v2 and v3 and can be installed on firefox or chromium-based browsers
https://devtools.vuejs.org/
use this icon to target the component
I come to you because I have not found anything answering my questions.
I am currently doing a project in vue.js and when putting in production some elements lose their css. If someone has already had the same problem and could help me :)
(sorry for my bad english)
Some pictures so you can see what I'm talking about
This is my div in local
And this one in prod...
I'm trying to create a link on my vue app to local pdf files. Right now here's my problem.
My pdfs are located in assets/static/ and presently linking to them like this.
<template>
<div id="forms" class="view-wrapper">
<h3>Downloadable Forms</h3>
Claim Form
</div>
</template>
This brings up a link on the page, but when I click it, I'm taken to a blank page on my app with just the navbar and footer and nothing in between. I'm hoping to have it bring up the document in the browsers pdf viewer in another tab. Some help would be greatly appreciated.
Edit: SOLVED: #dan helped me realize that I just had to use one dot to access my assets folder.
To render a pdf in the browser use an <iframe src="path-to-pdf" />. Unless you're binding reactive data to the element you don't have to do anything different in vue. Check out https://stackoverflow.com/a/52644970/6890774 this is a similar issue.
I am playing around with x-editable and I am wondering how they do the last example in their demo page.
http://vitalets.github.io/x-editable/demo-bs3.html?c=inline (Custom input, several fields)
I can't find any thing that actually shows you the code for each part. I only can dig through it with firebug but that is more time consuming and I rather just see the parts I need.
Any have the pieces of code that does it?
Yes, #marcb is right!
So here: https://github.com/vitalets/x-editable
Or to be exact: https://github.com/vitalets/x-editable/blob/master/src/inputs-ext/address/address.js
The code for this can be found in the X-editable Bootstrap 3 download, under "inputs-ext", and then the "address" folder.
I've searched the web for a simple lightbox using dojo, and I've had no luck whatsoever!
Most of the examples use the dojo Dialog which IMHO is quite fugly.
I would like the ability just to display an arbitrary div with dimmed background, and I'll be in charge complete of what content is shown.
Anyone have any ideas?
Have you looked in dojox.image? There are both Lightbox and LightboxDialog variations. The plain lightbox doesn't have much styling. The Dialog one probably offers a choice of Dijit themes.
Look in the svn trunk > /dojox/image/tests. There are plenty of examples.
http://svn.dojotoolkit.org/src/dojox/trunk/image/tests/
Tip : Prevent multiple instances of Lightbox ! Use a singleton instead !