mozbrick / brick-progressbar Goto Github PK
View Code? Open in Web Editor NEW<brick-progressbar> - Custom element for bootStrap based progress-bar
License: MIT License
<brick-progressbar> - Custom element for bootStrap based progress-bar
License: MIT License
Good work so far!
Great that you used our generator as a starting point!
Here are a few comments on your code:
Instead of creating the DOM as a String in brick-progressbar.js#L17 you could use a template, which you can put in brick-progressbar.html
. For an example see brick-tabbar on how to import and use the template see here. (Don't worry about the styling stuff there, just leave your css-import outside of the template for now.). For a more general introduction to templates look at this article.
For the general styling: Bootstrap styles are a good starting point, but our brick components will have their own style, which will be similar to FirefoxOS components, the corresponding basic style for progress-bar can be found here. (Use the dropdown menu to see progress-bar.) You could use that as a basis for your style.
You do not need to save attributes like max to your this.options
object (example). It might be enough to refer to the attribute when looking up the max value, so you save yourself the work of keeping the attribute and the internal value in sync, when someone changes the attribute.
You can also use the attributes to apply styling to your components. For example use the selector brick-progressbar[striped]
so you don't have to keep styling classes in sync with the attribute. We do this to keep the components as simple as possible first, before we optimize them where necessary.
If you have time and are interested you can try and optimize some of those points. If you have any questions, feel free to ask!
When you think your code is ready, we can transfer or fork it to the mozbrick repository, if you like. It does not have to be perfect and we can keep working on it there.
Thanks for your good work and interest in Brick!
As of January 1 2019, Mozilla requires that all GitHub projects include this CODE_OF_CONDUCT.md file in the project root. The file has two parts:
If you have any questions about this file, or Code of Conduct policies and procedures, please reach out to [email protected].
(Message COC001)
this component still need a gaia-like styling for its default theme.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.