I have a folder with images and folder with vue-app(archy)
so i need to get in components those images
I tried something like this, but didn't succeed
<div v-if='photo' class="post-img">
<img :src="`~#/../../uploads/posts/${photo}`" alt="img">
</div>
any suggestions?
Related
I am currently working on a CMS web application. To select images i am using the following code. The input type is IFormFile(BigImage is of type IFormFile)
<div class="input-group input-group-sm mb-2 custom-file-button">
<label class="input-group-text" for="inputGroupFile">GroßesBild</label>
<input class="form-control" form="addUpdateSubmenu" asp-for="BigImage" id="inputGroupFile">
</div>
Now my question is if it is possible to set a default folder path like: "\abc33\images\bilder"
Now it is just opening any folder which was used the latest.
So if i would select an image the directory would look like shown on this screenshot
There is no concept of folder selection in the HTML/JavaScript platform. Even if you could select one, you wouldn't be able to do anything with the folder path. Web applications do not have access to a client's file system.
Here is a similar issue, You can refer to it.
Browsers don't allow you to modify deafault file path(value)of<input type="file"/> due to security issue,the value only changes when you select a file yourself
While creating a project on the Nuxt + Tailwind stack, I stumbled upon another problem.
Following the documentation I wanted to add a background image, but css does not display it (other Tailwind classes work)
**.vue
<div class="bg-[url('img/stories/desktop/18-days-voyage.jpg')]">
<h3>The Mountains</h3>
<p>by John Appleseed</p>
Read story
</div>
However, if I am use the img tag with the same path to the image, then it displays.
<img src="img/stories/desktop/18-days-voyage.jpg" alt="" />
Need to make the first way work. Can you tell me where to dig? Thanks in advance.
Having a trouble placing a background image in one of simple Vue.js project that I'm currently doing!
I've tried all the possible solutions that I could come up with. But no luck. That's why I'm here to have experts' help like you!
Having created the hero section, I tried to add a background image to that. Yes, the background image is imported to the right folder and the location of the folder is correctly written as well. However, once the compiler compiled the program, I get crickets! Nothing!
Here's the Sass code
.hero
background: url ('..../assets/clouds.jpg')
background-size: cover
background-color:#ffffff
And here's the HTML code for your reference
<div class = "home">
<section class="hero">
<div class="hero-body">
<div class=" container">
<h1 class="title"> {{heading}} </h1>
<div class="is-two-thids column is-paddingless">
<h2 class="subtitile is-4"> {{subheading}} </h2>
</div>
<a class="button is-large is-primary" id ="learn"> Learn More</a>
</div>
</div>
</section>
</div>
The funny thing is there's no error message shown. That's right, zero error messages.
This is the final product I received
For most of you out there, this should be a pretty simple fix. So, can you help this beginner out from this agony!
Thank you!
Edit: Got the following error message after adapting the change
background: url ('#/assets/clouds.jpg')
Edit 2: Sass file and its location.
It's location is src/router/mq.saas
Edit 3: Got the required one
Your issue is that ..../ is not a valid relative-path traversal symbol. Only ./ (current directory) or ../ (parent directory) are valid.
Assuming you've built the app with Vue CLI (v3), you should be able to use
background: url ('#/assets/clouds.jpg')
where # is configured as an alias for <projectRoot>/src.
See https://cli.vuejs.org/guide/html-and-static-assets.html#url-transform-rules
Alternately, construct a valid relative path from your Sass file / Vue component.
For example, say you're in src/mq.sass and want to reference src/assets/clouds.jpg, the relative path would be
background: url('./assets/clouds.jpg')
I've included the package, the pdf gets generated but somehow the images dont appear on the pdf. The HTML content and CSS works like expected.
When i return the view as how you'd normally return a view in laravel, the receipt displays nicely along with the images.
But when i:
return PDF::html('receipt.show', $data);
The images dont appear.
My view file has the image like so:
<img class="img-responsive" src="img/receipt/banner.jpg">
The image is within:
public/img/receipt/banner.jpg
This is a laravel app running on homestead environment.
You need to use absolute path in image src attribute instead of relative. Smth like:
<img class="img-responsive" src="http://your-domain.com/img/receipt/banner.jpg">
You can use
<base href="http://your-domain.com/" />
into your head and it will help for all your links
I have a .vm (Velocity) file which is run to generate a DOC file. I want to have a very simple header and footer in this resultant DOC file. How can I write code in .vm file for this.
I do not want to include header and footer files as external files. I want simple code in the same .vm file.
Please help!!!
Without including a separate file? Just write the HTML. The following code is an extract from a vm file:
<div class="footer">
<div class="footerlinks">
<ul>
<li class="first">Something</li>
</ul>
</div>
</div>