Next.js css modules scroll to top - javascript

I'm trying the new Next.js /app folder. Everytime I import a .module.css file for a component (or page) A and use next/link on page B, if I click on the link in page B, the page A will load but the scroll will not be on the top of the page. I tried to add scroll={true} but it didn't work.
However, using the /pages folder, everything works fine.
I don't know if it's a bug (/app folder still in beta) or if I miss something.
I tried by starting 2 new projects, one with /app and the other with /pages. Everything is the same, one have the error, the other don't.
If i remove the 'import utils from "../styles/utils.module.css"', the scroll to top after a click on Link works great.
I created a repository on github so you can reproduce the problem.: https://github.com/CeliTop/Next.js-css-module-Link-scroll-to-top-problem
Any ideas are welcome, thank you.

Related

javascript and css loads but not working on navigation in React js

I am working in react js. I put all the assets links in public/index.html. When i start project, only first page works fine. When i navigate to other pages, all pages does not show the correct resul, and when i get back to first page it does not work. I checked the css and javascript files by ctrl+u. All files are loaded. The Both source files, before navigate and after navigate are same all files are loaded but on navigation it does not work. Please have a look on my index.html, how i use link tag to import css and javascript file. Any help would be appreciated.
Thank
I put all links to app.js and assets moved to src directory. Css files are working but jquery shows following error
import your CSS file in the "App.js" file. It'll work

insert php link in Gatsby / React

I am trying to link my form page contactpage.php into my Gatsby application. In the navbar (in the Component folder) I have set this code
<div>
<a className="int_link_about" href='./contactpage.php'>Contacts</a>
</div>
However, when I click on the link it just downloads the php page, it does not display it. How to actually be redirected to it?
Also, right now in development I manually copied the contactpage.php in the 'public' folder but when I will switch to production, where should I put the page?
This is a server related problem which can be checked by direct openning /contactpage.php
Solve this and your React code should work. There is a complete thread solving this: https://stackoverflow.com/a/9627827/4281310

Add folder to favorites and change folder icon [Electron macOS]

Since one week I'm looking for a solution to add a folder with a specific icon to the favorites sidebar (like Dropbox does it)
Is there any solution to do this with Electron or Objective C?
What I've found so far:
drag & drop it by yourself
fileicon
Programmatically add a folder to "Places" in Finder (don't know if I can extend electron)
Ok I've found this solution:
On macOS you can find this Folder
~/Library/Application Support/com.apple.sharedfilelist/
It contents some *.sfl files. You can edit them with this tool /usr/bin/sfltool. (It's installed on your mac >= 10.11 El Capitan automatically)
Example to add a folder to your favorites:
/usr/bin/sfltool add-item com.apple.LSSharedFileList.FavoriteItems file:///YOURPATH
I can run this command via require('child_process').exec in my electron app and add a folder icon with the fileicon module. (https://www.npmjs.com/package/fileicon)
This is a little bit dirty, but I don't know an other solution.
[UPDATE]: Read first comment
You can edit the sidebar on Mac using the com.apple.sidebarlists.plist preference file. The items will be in the favoriteitems dictionary.
The items you see are all set to being AlwaysVisible. You need to edit that file to add your own file.
I will give some links that might help you.
About the com.apple.sidebarlists.plist file,
http://www.thexlab.com/faqs/finder.html
Finding the com.apple.finder.plist,
https://discussions.apple.com/thread/4122582
Another post,
https://apple.stackexchange.com/questions/139305/how-can-i-add-new-folders-to-the-favorites-in-the-finder-sidebar

Angular2, links not working with lazy loaded modules, but worked on page refresh

I have Angular2 project built with Angular-CLI. I'm using lazy loading for modules which I guess causing my problem.
After I load project with Module A on browser, and I click navigation link which load Module B (with lazy loading) then clicking on simple link, ie.
Click me
it doesn't work, nothing happened, but when I refresh page on Module B, same links start working.
Does anyone have a clue why this is happening?
I checked on network tab and in both cases, all requests look the same, only difference that when switching between modules page is loading whole application with Module A, and then just loads required files for Module B.
I know this is not a very detailed description but for now I don't know what to say more.
Thanks for any help.
Finally, I found the solution. The problem was about how I've inserted HTML chunk in angular template.
Before I was using [innerHTML]="fullDescription" property which prevents from clicking in links.
Solution
<div innerHTML="{{fullDescription}}"></div>
Also I had to omit bypassSecurityTrustHtml from DomSanitizer.
Hope this will help someone.

jQuery 1.7.1 slider not working except on homepage

I have tried to place the slider on every page on this website: http://atripathi.com
It works on the homepage, but doesn't work on any of the other pages (About, Services, etc.)
I know it's probably an easy fix, but I can't get it at the moment.
Thank you for any help or suggestions!
Looks like the original suggestion above is correct. I'm seeing slider javascript includes at the top of your homepage that aren't on the other pages.
Generally, a good way of troubleshooting is to make copies of both pages, index-c.php and about-c.php perhaps, and start removing everything that isn't pertinent to the trouble you're having (other HTML, css includes, etc.) until you get down to only the slider on the page. Once you've done that, you might notice that the one page is slightly different than the other, making it work. You can copy back and forth until it does.
The other possibility is that there's a relative path problem somewhere, because your one page is inside a folder (though I'm guessing you have a .htaccess redirect to a root folder page)? So if all else fails, move the reduced about-c.php to the root folder and see if that then works. If so, you know it's a path problem.
Hope these suggestions help.
I see that jQuery is being included on all your pages but the cycle plugin is only included on the home page. You should be able to update your template(s) to fix this.

Categories

Resources