Edit files in an installed package


#1

What is the proper way to customize a package I’ve installed from Atmosphere?

For example, in my instance, I have installed ian:accounts-ui-bootstrap-3, and I want to customize the CSS classes and the markup in the login form in the dropdown. Specifically, I want to add a CSS class to the links at the bottom of the dropdown, so they will conform to the stylesheet I’ve defined for my app.

I read the instructions on the package’s Atmosphere and Github pages. It mentions all sorts of ways to customize the information collected during sign up, the authentication method, etc. But I didn’t see a way to edit the markup of the form itself.

Should I just edit the package files directly? Somehow, that doesn’t feel like the Meteor way. I’m guessing I should probably create some template file that will override the default template, but I want to be sure.

Thanks


#2

I hate to do this “not an answer to your question but do it this way” type answer, but I’m positive someone here will help you out in that area.

Having said that, you shouldn’t edit the CSS of a package you installed. Instead overwrite what you need using CSS. Meteor will first load the assets of packages you have installed, and load your styles last. You will be able to override any styles you want.

Next version of the package comes out and you’re going to have to make that manual tweak again after updating. Technical debt sucks!


#3

Yeah, I see your point. No, I definitely don’t want to add edits that I’d have to redo every time a package (or Meteor itself) was updated.

And it does make a lot of sense to make CSS modifications using the specificity of CSS to override other declarations.

But my problem is I need to add a class name to the list of classes in the class=‘whatever’ attribute in the HTML for the login form. So I can’t just override it with CSS.

I realize editing the actual HTML in the package is probably a bad idea. What’s the best way to make modifications of this sort to an installed package?