Foundation Sass, Accordion and Tabs not working - javascript

I am having problems with Foundation and the Accordion and Tabs modules. I created my project using the command line compass create <project name> -r zurb-foundation --using foundation and I then customized the style sheet using Sass and the _settings.scss.
Although, I can't get the Accordion and Tabs modules working and I don't understand why. I realized that both foundation.accordion.js and foundation.tab.js files do not come with, in the JS folder when creating a project like I did. I therefore decided to put them myself there from a standard downloading of Foundation but it is still not working. I obviously included the script tags for them at the end my Html page.
Do you guys know if there's any possibility to create a Foundation project using Sass that includes those two modules? I can't use the standard Foundation since I am like customizing everything.
Thanks for your help.

I finally found the answer to my problem. I used to create foundation projects using the command above. Although, I realized it is preferable to create the project using foundation new PROJECT_NAME (NodeJS and Bower are needed). Like this, everything comes along, including the foundation.accordion.js and the foundation.tab.js.
Actually, it is the last version of Foundation that is downloaded and everything works perfectly like this.

Related

How to make use of an external Js file in .net core 2.1 and Angular 6

I am new to Angular 6 and .Net Core 2.1. I've created a some application but now I need to make use of jquery events. I have installed Jquery packages to node_modules as well.
Could anyone please help me!!
Thanks in advance
Even in the angular-cli.json file, I've added the jquery files and my custom js file.
But still not working.
Below are my configuration and code
Solution Structure
You will find here an example link
I would recommend to keep JQuery out of your Angular project. You have to understand how Angular 2+ works and you will see that there is no need for JQuery.
With JQuery you were selecting an element in the page and modify it but with Angular the UI changes based on a model property. It is another way of thinking about the UI.
You can read more about the differences between the two here link. I also tried to use JQuery when I began using Angular because of my previous experience but I learned that was a mistake.
if you want to use jQuery u will need to put the files in the wwwroot folder. You can link it from there.

Using Bootstrap and ng-bootstrap is good?

I have two modules in my angular website , one is "bootstrap" and another one is "ng-bootstarp".
Does both modules are required , or any one is needed?
I am planning to keep only "ng-bootstarp" 4.0.0.0 and to remove "bootstrap"
Is this fine?
Also let me know the steps to remove "Bootstrap" ?
Can i just go ahead and delete the bootstrap from the ng_module folder or do i need to use any commands?
Don't delete it unless it's causing issues, Bootstrap is intended to be installed alongside ng-bootstrap.
Bootstrap is supposed to be installed when using ng-bootstrap, because ng-bootstrap
relies on Bootstrap's CSS, but it replaces everything else that comes with Bootstrap, as you can see in their dependencies. The CSS is then set in your angular.json or imported into the main styles.css
That said, the non-CSS parts of Bootstrap are unused and could be deleted, but if you're using a package manger, e.g. NPM, this could cause issues when updating and you'll need to repeat this process each update.
As pointed out by #Eliseo, an alternative to using the normal Boostrap with everything included is to use bootstrap-only-css, which can be installed using NPM or Bower, details here. This isn't an official Boostrap distribution as far as I can tell, so keep that in mind.
TLDR: there's no good reason to delete Boostrap.
Angular Material is the official UI framework for Angular, and is maintained (aside from open-source contributors) by Google engineers.
The community is fantastic, the documentation is excellent, and all of the components and utilities are designed to be used with Angular specifically. The source is a case-study in how to write code the Angular way.
It is for the reasons outlined above that I picked AM to be our company’s preferred UI framework.
I haven’t used Bootstrap in a very long time and I would not consider using it in a new project now.

Adding css framework to Meteor App

I'm creating Meteor app, I would like to use one of custom css frameworks i.e. Get Shit Done or Bootflat, but there are no packages for theme in Atmosphere.
Should I create those packages for my own or use standard approach by adding libraries using <link> tag?
Currently I tried second solution, but colors are incorrect.
Meteor will automatically detect CSS files. Just make sure you place them in the client folder. Organize your files according to the file load rules to get the correct hierarchy with your CSS files. Read about file loading here: http://docs.meteor.com/#/full/structuringyourapp
It would be nice though if you could place it in a package and keep it up to date on Atmosphere.
Why not just create your own package for the theme? that way you can use it in your own project and also share it on atmosphere. Here is a nice tutorial on how to create a package and use it locally as well as push it to atmosphere. Meteor package tutorial #meteorchef
Hope this helps!

How to disable resources of a grails plugin

I am working on a project which I have divided into several independent plugins. So like wise for each functionality I have a plugin which is integrated and can be re-used in another project.
So now I am using the plugin of my theme in development mode without packaging with grails.plugin.location.'MyThemePlugin' = "../MyThemePlugin"
All goes well till now but these is another plugin which I recently integrated and it has few same CSS and JS file names but of very old versions. So due to this problem my theme breaks and does not work.
So is there any way to disable the resource (css and js) files of this other plugin?
If there is no use of the css and js file of the new plugin then why don't you simply delete those files from plugin directory itself. Inline plugin editing seems should work.

One JavaScript code file for multiple locations

We are developing multiple Java EE applications (8 for the moment) that are all based on the same sort of code. However, all the apps are clearly separated as different projects in Eclipse, they all have their own folder on Windows Explorer, and they all have their own repo on the Git server.
The idea was to put the redundant code somewhere (another project named "core"), and use it on every apps automatically without having to recode the same thing 8 times.
For the Java part, we did a "link source" in each project, which create sort of a symlink inside Eclipse to the "core" project, and use the specified "core" package in Java source with no problem.
But it doesn't work so well for the JavaScript/CSS part. I have absolutely no clue about how to code my redundant JS/CSS onto the "core" project, and use it elsewhere without having to manually copy it each and every time I modify it.
I think you should look into git for a solution to your problem. After all you still want the js file to be included in every project, but be maintained in a seperate project (as far as I understand it). There ought to be some sort of submodules and/or commit-handles or whatever to solve this using git.
This is what the User Library functionality in the JavaScript Include Path properties of your project is for.

Categories