filtering?
For example, in that case, but instead of having banner-main-title and banner-sub-title I have 'title is-1' and 'title is-3' how can I give a margin to that?
here's what I mean, I really don't understand the purpose of that negative margin, I am surely doing something wrong
I was thinking about putting it inside a column, but it doesn't sound right.
We'd have to see the code.
Or potentially inspect the html through dev tools, but ain't nobody got time for that!
my navbar only has a single item left, and one right... and I'd like to preserve them regardless of media device
will i have to ditch the navbar has use a banner of sorts, instead?
When using a menu list, how would I go about adding an anchor to the right hand side of each li? So far, I have this which is near what I want... but I want the first anchor to be expanded.
<li>
<div class="field has-addons">
<a class="is-active">foo</a>
<a class="is-small is-primary">
<span class="icon is-small">
<i class="fas fa-minus"></i>
</span>
</a>
</div>
</li>
Adding
flex-grow: 1 to the first anchor does the trick, but perhaps that's not the most appropriate way. For now, I'll do that with a temporary bit of inline css while I wait to see if anyone can come up with a better solution.
just heads up, my new app is fully responsive now - feedback welcome https://smartpoll.io/vote?poll=NO5Z8FRbjxWitd2jBWLO
Hi! Maybe this is a stupiud question, but how can I disable any action (hover, file choose dialog) of a file input with name most easily? I am using it wrapped inside a vue base component.
<div class="file has-name is-fullwidth">
<label class="file-label">
<input class="file-input" type="file" name="resume">
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-label">
Choose a file…
</span>
</span>
<span class="file-name">
Screen Shot 2017-07-29 at 15.54.25.png
</span>
</label>
</div>
hi guys! I am using .sass
I have imported the "tiles" component:
@import "bulma/sass/grid/tiles"and I have copied the first example from https://bulma.io/documentation/layout/tiles/ but it's not working
I see this: https://i.imgur.com/QUIOFcQ.png
as the tiles component is not imported.
the examlpe code:
<div class="container">
<div class="tile is-ancestor">
<div class="tile is-vertical is-8">
<div class="tile">
<div class="tile is-parent is-vertical">
<article class="tile is-child notification is-primary">
<p class="title">Vertical...</p>
<p class="subtitle">Top tile</p>
</article>
<article class="tile is-child notification is-warning">
<p class="title">...tiles</p>
<p class="subtitle">Bottom tile</p>
</article>
</div>
<div class="tile is-parent">
<article class="tile is-child notification is-info">
<p class="title">Middle tile</p>
<p class="subtitle">With an image</p>
<figure class="image is-4by3">
<img src="https://bulma.io/images/placeholders/640x480.png">
</figure>
</article>
</div>
</div>
<div class="tile is-parent">
<article class="tile is-child notification is-danger">
<p class="title">Wide tile</p>
<p class="subtitle">Aligned with the right tile</p>
<div class="content">
<!-- Content -->
</div>
</article>
</div>
</div>
<div class="tile is-parent">
<article class="tile is-child notification is-success">
<div class="content">
<p class="title">Tall tile</p>
<p class="subtitle">With even more content</p>
<div class="content">
<!-- Content -->
</div>
</div>
</article>
</div>
</div>
</div>
maybe I need to add some other component from the sass?
if I import the complete bulma.css file it works. what I've missed?
The changes made in the
With
Bulma root folder isn't reflecting in the docs.With
npm run start in root folder this happens when I save my file: "status": 1,
"file": "/Users/abner/Projects/bulma/sass/form/checkbox-radio.sass",
"line": 9,
"column": 12,
"message": "Undefined variable: \"$input-hover-color\".",
"formatted": "Error: Undefined variable: \"$input-hover-color\"
Would that be a good idea to have an issue to replace img tags in documentation from being void elements to their closed variation? eg
<img src="..." > => <img src="..." />Why? Because JSX doesn't recognize void elements and fails to compile sample snippets
index.js: Expected corresponding JSX closing tag for <img> (152:20)
150 | <p className="image is-32x32">
151 | <img src="https://bulma.io/images/placeholders/128x128.png">
> 152 | </p>
| ^