I made a flask app with flask-bootstrap. I am using virtualenv as well. Where would I find the stylesheet that I edit to customize the colors? Or is there another way to have custom colors?
Add you custom colors to a css file, e.g. mystyle.css, put it under the static folder, then add your custom css file to your template.
{% block styles %}
{{super()}}
<link rel="stylesheet" href="{{url_for('.static', filename='mystyle.css')}}">
{% endblock %}
Check the documentation here: Adding a custom CSS file:
Related
Let's just say I have a basic class-based view like:
from django.views.generic import TemplateView
class HomePage(TemplateView):
template_name = "homepage.html"
and in homepage.html of course we load some CSS, apocryphally:
{% extends "base.html" %}
{% load static %}
{% block CSS %}
<link rel="stylesheet" type="text/css" href="{% static 'css/default.css' %}" />
<link rel="stylesheet" type="text/css" href="some CDN based CSS file' %}" />
{% endblock %}
Now I'd like the view to read/load the CSS that will be sent to the client.
If we could just find the source files, we could parse them with cssutils.
And of course it's technically possible to find and parse the template file too, but Django already implements that and has a template loader. Is there any way short of rendering the template into a string, and trying to parse the HTML to extract CSS rules? And even if that's the path we need to pursue, is there a package that will given rendered HTML, and return the CSS rules?
An interesting problem that arises from the need, server-side, to extract some CSS information, notably colours.
I am using Django i18n translation system and there are two languages:
LANGUAGES = (
('fa', _('Persian')),
('en', _('English')),
)
Persian is Right-To-Left and I want to serve another CSS file when user change language to persian.
Or maybe there is a better way to change LTR to RTL when user change the language?
I am using nginx with wsgi on a Ubuntu vps.
One possible way:
I assume you have 2 css files for example static/css/fa.css and static/css/en.css
In template, when you link your css you can do it like this:
<link type="text/css" href="{% trans 'static/css/en.css' %}">
In your Persian translation file you put then something like this:
msgid "static/css/en.css"
msgstr "static/css/fa.css"
Alternatively, if the only thing you want from css is to change LTR to RTL you could do in your template:
{%load i18n%}
{%get_current_language as LANGUAGE_CODE%}
{%get_language_info for LANGUAGE_CODE as lang%}
....
{% if lang.bidi %}
<!-- Some HTML code for RTL -->
{% else %}
<!-- Some HTML code for LTR -->
{% endif %}
I assume you have following file and directory structure:
/static/fa/css/default.css
/static/en/css/default.css
And then I would go with:
{% get_static_prefix %}{% get_current_language %}"/css/default.css"
I've just installed Sylius. I'd like to add custom CSS (SCSS) files to the default Sylius theme (without creating a custom theme). How is it possible? Or is there a better way to copy this theme and create a custom one?
Easiest and hacky way:
Firstly add needed css file into public/ directory. Then you need to override vendor/sylius/sylius/src/Sylius/Bundle/ShopBundle/Resources/views/layout.html.twig template (stylesheets block) by copying this as templates/bundles/SyliusShopBundle/layout.html.twig and modifying it like this:
...
{% block stylesheets %}
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
{% include '#SyliusUi/_stylesheets.html.twig' with {'path': 'assets/shop/css/style.css'} %}
{% include '#SyliusUi/_stylesheets.html.twig' with {'path': 'my-custom-file.css'} %}
{{ sonata_block_render_event('sylius.shop.layout.stylesheets') }}
{% endblock %}
...
More about customizing see this article.
I have this static page built with Jekyll and host with GitHub Pages (repo), and I wanted to track it with Google Analytics.
I was following this tutorial.
But I've reached the step where it says:
Finally, open _includes/head.html and add the following code just before the end tag.
And actually my theme has no _include/head.html file!
So my question is, if I create a file called _include/head.html should it be automatically included in every page built by Jekyll? (I tried creating such a file and adding a placeholder image to see if that worked but it didn't)
The code that follows that quote should be included in every html page built by Jekyll, right? Like, that is what I want for it to work, no? So if I put it in footer.html instead it should work?
If you create that file, as the tutorial suggests, then you can use it everywhere, (in your layout for example) so every time you include it, it gets rendered.
Create the file _includes/head.html with the analytics content.
Then in your layout include it where you want it to appear like:
{% include head.html %}
Then you can place all your code that goes in your head there, so you have a cleaner layout
side note
I prefer to have the analytics code following Google recommendation immediately after the opening <body> tag. So my default layout looks like:
<!DOCTYPE html>
<html>
{% include head.html %}
<body>
{% include ganalytics.html %}
{% include header.html %}
{{ content }}
{% include footer.html %}
</body>
</html>
and _includes/ganalytics.html just contain the analytics code.
Simple add analytics marker in _layouts/default.html head tag. No need to add a head include.
Has anyone got or know if a printer friendly css file is available for the Django Admin site?
If you want to add in a print CSS stylesheet for the admin, add this to your admin/base_site.html template:
{% block extrastyle %}
{{block.super}}
<link rel="stylesheet" href="/path/to/your/print.css" type="text/css" media="print" charset="utf-8">
{% endblock %}
If you're looking to output the contents of the admin site, I would suggest exporting it as a CSV file first and then printing from spreadsheet software.
I have used this in the past and recommend it: https://django-import-export.readthedocs.org/en/latest/