I am building a site that has a page titled 'CSS'. So, to me, the most logical place to store the page's index.html file is in the corresponding css/ folder.
Are there any potential problems I could run into using the css/ directory as a subpage folder as well as the place I store my css/sass like i the following directory:
siteroot
css/
index.html (sub-page I am asking about)
mainstyle.css
sass/
index.html
js/
app.js
img/
example.png
It's worth pointing out I'm not using relative URLs, so I can't see file paths being an issue.
Related
Trying to change the font in styles.css file in GitHub pages, here is the code:
#font-face {
font-family: "Samim";
src: url("/resources/Samim.ttf") format("truetype");
}
Here is the directory and font saved in resources folder
project files directory
the problem is that font doesn't change, also tried to move the font to main directory but no change, it also works properly locally on vscode live preview.
You have to provide the Relative Path to the file,
For Example Take This Directory Structure:
- root
- system-files
- vahid
- github-pages
- resources
- Samim.ttf
- README.md
- index.html
- styles.css
Here the "root" is the Drive On which your Operating System is Stored On, and "system-files" contains your Operating System's Important Files and finally you have this folder "vahid" which contains the user's files, and inside "vahid" you have "github-pages" folder where all your github pages code is stored.
In Path the / means the root, in Windows take this as like if you open C:\ in Windows Explorer.
And this period . means current directory, and when you use ./ instead of / you're specifying a path to a file/folder in current Directory.
Now when in my styles.css if I use this Path /resources/Samim.ttf what it means is "Samim.ttf" File in inside of the "resources" folder in the root directory.
Did you notice something? Let me try to show this path in the directory Structure.
- root
- resources
- Samim.ttf
As you can see the Path we specified doesn't exist, try to compare it to the Real Directory Structure Given Above.
So instead of using / we have to use ./ because the "resources" folder is in the same folder as of the "styles.css".
So you have to replace your Absolute Path with Relative Path, which will be this:
./resources/Samim.ttf
Read More About Relative And Absolute Path At LinuxHandBook.com
I changed the directory path like this:
url("./resources/Samim.ttf")
just added one . after /, idk why but it works now!
also trided ../resources , ..resources and /resources and didn't worked.
Docs that there is a possibility to use src folder in Next.js.
I think this is a good pattern to separate actual business logic from app configs.
It would feel natural to me to put the public folder also under the src folder.
No. The public folder has to be in root folder
Config files like next.config.js and tsconfig.json should be inside the root directory, moving them to src won't work. Same goes for the public directory
I am running the pug CLI with
pug src --out web --watch
If I have
src/
index.pug
includes/
scripts.pug
web/
index.html (generated)
And in index.pug: include includes/scripts.pug
With this setup if I modify the scripts.pug, it generates web/includes/scripts.html that I don't need and I don't want in order to keep things clean.
Is there a way to avoit certain files / directories to compile?
(for now a workaround is having the includes in html form but maybe there's a way)
Adding an underscore prefix to files should tell Pug to not compile them directly. This is super helpful for files that are only used as includes.
So you should rename scripts.pug to _scripts.pug:
src/
index.pug
includes/
_scripts.pug
web/
index.html (generated)
And then rewrite your include statement in index.pug to be: include includes/_scripts.pug
The pug-cli doesn't know about not compiling certain files. Like the previous answer mentions, it does work with gulp-pug but not pug-cli. The only way I can think of not to compile includes or extends files is to put those files in a separate root directory. For example:
src/
templates/
views/
index.pug
includes/
scripts.pug
web/
index.html (generated)
Then set pug to compile the views directory only.
pug -w src/templates/views/ -o web/ -P
I am using rsync to deploy a git branch with my production server. Currently, I got js files stored in two locations:
assets/js/
js/
When I run rsync using --exclude js, non of the both folders will be sync, while I want the assets/js/ folder to be synced and the js/ folder inside my root folder to be skipped. How can I achieve this?
You need to specify the pattern for those files and directories:
using:
CWRULE [PATTERN_OR_FILENAME]
CWRULE,MODIFIERS [PATTERN_OR_FILENAME]
so you would have something like
CW- js/
For even more detailed info you can see the man page at the section
Include/Exclude Pattern Rules
from this link, hope it helps
If an image shows up in a div when I code:
background:url(/imgs/crowd1.jpg)
in the css, but is doesn't when I code
background:url(imgs/crowd1.jpg)
what does that indicate I am doing wrong?
/ means that it the file or folder is in the root folder while without the / means that the file or folder is in the current directory.
Here is a brief description of other file paths:
./ means the current directory
../ means the parent of the current directory, not the root directory
/ is the root directory
myfile.text is in the current directory, as is ./myfile.text
../myfile.text is one level above you and /myfile.text lives in your root directory.