I am using both products and cannot get rid of a conflict between these. I was told on the Foundation forum that it is because of some css classes being named the same. Has anyone experienced the same problem and figured out a fix? You can see it here:
http://jsfiddle.net/x270Lh7c/
if you add:
<link rel='stylesheet' href='http://cdn.foundation5.zurb.com/foundation.css'>
Thanks
If you use Foundation Sass you can choose only the pieces of the Foundation CSS that you want to use in your project. I would suggest doing this and not importing the Foundation tables styling.
Related
I've got TailwindCSS working locally but it's not working on GitHub pages. I'm very new to all of this so I'm unsure where to even look.
There is only one style in your head area in your DOM.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
But this is not the style you have built locally. This means you have to add the generated style from your local environment into your HTML head area.
I thing that is your style file what you need: https://github.com/syueyan/syueyan.github.io/blob/main/dist/assets/index.eb05b1e4.css
I have this problem in PrestaShop, I do not know what I did but now the image of my shopping cart does not work. It is written: F291 and I have no idea why. How can I change it?
I did not touch any code, just working in PrestaShop admin version.
F291 is a shortcode used with FontAwesome to display a shopping basket icon.
FontAwesome is a custom font that has symbols/icons that replace normal text characters, it is used in many templates, including PrestaShop templates.
You can double-check it here:
https://fontawesome.com/icons/shopping-basket?style=solid
Assuming you did not make any modifications to your template, the most probable cause is that the URL used to link the FontAwesome CSS file no longer works.
Steps to resolve this issue:
Search for fontawesome across all the files in your /themes/themename/ PrestaShop folder
Once you have found the file/line calling the FontAwesome CSS file, replace it with:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
I hope this helps.
AFAIK, no sites like jsfiddle or codepen currently support Famo.us. Are there other methods for sharing working code examples of Famo.us that are permanent enough to warrant using on Stack Overflow?
Starting on May 16th, Famo.us will begin testing a minified CDN version of famous.js that can be used in much the same way as one would use the minified CDN for JQuery and JQuery plugins. Once the CDN is in place, developers can fiddle with famo.us core, famo.us discrete examples, famo.us widgets and famo.us templates within famo.us university, jsfiddle and codepen.
In addition, we will also be testing a new BUILD MIN service to super minify your code. Send a .zip file to the BUILD MIN service of famo.us and get back a custom min'd and CDN'd famous.js that only uses the components needed for our app.
hope this helps.
I compiled famo.us so that it can be used in a jsfiddle.
Here is the jsfiddle http://jsfiddle.net/jperl/7wEWU.
Here is the compiled repo https://github.com/jperl/famous-compiled.
http://jsfiddle.net/7beq5/2
<html>
<script src='http://code.famo.us/lib/require.js'></script>
<script src='http://code.famo.us/famous/0.2/famous.min.js'></script>
<script> // (this could be another file)
require(['famous/core/Engine',
'famous/core/Surface',
'famous/core/Modifier'
], function(Engine, Surface, Modifier){
// --------------- use famo.us here ------------------ //
});
</script>
<html>
** EDIT **
Check out jonperls answer. He has compiled a working version of famo.us for use in JSFiddle. Simply use the External Links feature of JSFiddle to link to the compiled source.
** ORIGINAL **
I have not heard of any way to share snippets in line with working examples.. But you could always just host the code here.. then link to the working example.
The quickest and easiest way I found to share Famo.us demos has been to host the examples on amazon's S3 as a static webpage.
It is super easy to create a bucket and enable it to act as a static hosted site.
Worrying about DNS is optional. When you enable a bucket as a static host you get an endpoint. eg.
http://higherorderhuman.com.s3-website-us-east-1.amazonaws.com
It is up to you if you want to deal with setting up DNS and making that point to a more attractive URL. For me, both..
http://higherorderhuman.com.s3-website-us-east-1.amazonaws.com/examples/lens.html
and
http://higherorderhuman.com/examples/lens.html
Go to the same place.
By using folders on s3 and creating separate html files, I am able to host all examples from this single endpoind. eg. another example at..
http://higherorderhuman.com/examples/scrollbars.html
Just make sure all files that get uploaded are made public with.. 'Make Public'
Still looking forward for JSFiddle support.. But at least this does it for me for now!
The codefamo.us site launched today (May 19). It displays famo.us code stored as a GitHub Gist if saved with the name main.js.
To view the working example of the code, simply tack the gist identifier onto the end of the "gist.codefamo.us" uri:
For example:
http://gist.codefamo.us/74ca030bafdca1635e47
The code displays in a collapsible panel and runs in a preview panel. You can make changes to the code and see them reflected in the preview, similar to Famo.us University.
Disclosure: I'm one of the two people behind this site.
Use http://famousco.de/ and then post the link here!
p.s. i am the webmaster of famousco.de :)
I have used Foundation 4 with Custom Forms before and they work great. With Foundation 5 however I am unable to understand how to use them. Need help!
Going to the URL: http://foundation.zurb.com/stencils.html it gives strange guide on using it which I am not able to understand.
Stensils is a set of tools that helps you to quickly create interfaces in OmniGraffle.
More inforamation about OmniGraffle, here:
http://www.omnigroup.com/omnigraffle
If you need to create some custom forms for web, better to look here:
http://foundation.zurb.com/docs/components/forms.html
As you can see at
http://foundation.zurb.com/docs/upgrading.html#upgrading-the-sass
#import "foundation/components/sections";
#import "foundation/components/custom-forms";
have both been removed from the foundation framework. If you are looking to continue using custom forms as defined in Foundation 4 and as described in their official documentation
http://foundation.zurb.com/docs/v/4.3.2/components/custom-forms.html
Then you should probably switch back to Foundation 4.
As an alternative, you could always use CSS3 and pseudo elements to style the checkboxes and or radio buttons without having to use a javascript plugin to do it.
I’m working on a web application with Django, and I’m using the Flatpages app.
Now, I’m trying to embed the TinyMCE WYSIWYG editor in Flatpages. I’m following the steps mentioned in the Apress book: Practical Django Projects. And I’ve done everything right, but the TinyMCE app wouldn’t show up in the browser. When I asked the Django IRC channel we found out that it’s not a Django problem, the problem seems to be with TinyMCE itself. When I tried to look up the documentation at the TinyMCE website, all I found was either very outdated, or totally unrelated to my problem. How should I go about this?
Have you tried django-tinymce?
I had the django app but have ditched it in favour of:
http://code.djangoproject.com/wiki/AddWYSIWYGEditor
The instructions were simple and easy to follow - especially the flatpage bit.
The only real issue I had was having to set MEDIA_URL as a relative value. Until I did that - all my pop-up windows for links and html etc were blank!
Author James Bennett has put up the source code for Second Edition of the book so you can either: check your code against that, or simply download and use his code.
However, there are two specific questions that you need to answer before further help:
which version of the book? (Second Edition covers Django 1.1, i.e. from trunk)
which version of Django are you using?
which version of python do you have (python -V)?
If you're using the Second Edition and have svn'd Django from trunk, I can help - I have it working fine. Here's my (OS X) setup (just for working through the Second Edition of the book with Django from trunk):
in settings.py:
TEMPLATE_DIRS = (
'/Users/[myhome]/Sites/django-templates/cms/',
)
in urls.py:
(r'^tiny_mce/(?P<path>.*)$', 'django.views.static.serve',
{ 'document_root': '/Users/[myhome]/djangocode/cms/jscripts/tiny_mce/' }),
Then there's the copy of change_form.html duplicated from the django directory and copied to:
/django-templates/cms/admin/flatpages/flatpage/
which includes:
{{ media }}
<script type="text/javascript" src="/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode: "textareas",
theme: "simple" //or use advanced
});
</script>
{% endblock %}
Have a look through that and let us know how you get on!
I've been following the Practical Django Projects book myself. I got the TinyMCE embedded a few days ago as well. I can help, but I need a bit more info. Show me the line on the template where you include the TinyMCE javascript file. Also, describe where you placed the TinyMCE folder. I'm pretty sure your problem is that the script include reference doesn't match with the actual directory location.
A useful first check with JavaScript problems is to make sure all scripts are loaded. Take a look at the HTML source of the generated page in the browser, find all <script src="..."> tags and check that their paths are accessible.
You could also look at the terminal where you run the Django development server, or the "Net" tab of Firebug.
You can view the change_form.html code, which resides in my /[path to templates]/[project name]/admin/flatpages/flatpage/ and it works like a charm:
http://pastebin.com/f21a1cd97