I do not manage to force sphinx to apply first line indentation to paragraphs with the ReadTheDoc theme. I tried
texinfo_elements = {'paragraphindent': 2}
but it does not seem to work. Is there another thing to do?
You can use a custom style with text-indent.
You can add this style to a custom.css file and include it in your conf.py as a configuration option html_css_files.
custom.css
p {
text-indent: 1em;
}
conf.py
html_css_files = ['custom.css']
Related
I am using RinohType for generating my RST files to PDF.
I am trying to understand how to provide custom styles in the PDF for my logo and other elements.
I somehow felt the explanation in the Default matcher doesn't provide examples on how to do this.
conf.py
rinoh_documents = [dict(doc='index', # top-level file (index.rst)
target='manual',
template='rinohtype.rtt',
logo='_static/rr-logo-vertical2022-1100px-transp.png')]
rhinotype.rtt
[TEMPLATE_CONFIGURATION]
name = my article configuration
template = article
stylesheet = my_stylesheet.rts
parts =
title
;front_matter
contents
language = fr
abstract_location = title
[SectionTitles]
contents = 'Contents'
[AdmonitionTitles]
caution = 'Careful!'
warning = 'Please be warned'
[VARIABLES]
paper_size = A5
[title]
page_number_format = lowercase roman
end_at_page = left
[contents]
page_number_format = number
[title_page]
top_margin = 2cm
my_stylesheet.rts
Here I am trying to change the width of my logo in the PDF.
What is the correct way to give the css properties here.
width: 100px
The default matcher defines the title page logo style. To adjust the style of this element, you can create a style sheet that builds upon the default sphinx style sheet and tweak the title page logo style:
[STYLESHEET]
name=My Style Sheet
description=My tweaks to the Sphinx style sheet
base=sphinx
[title page logo]
width = 4cm
This style accepts the FlowableStyle style attributes. In the linked documentation, you can see the width attribute supports a bunch of units but not px.
Please stay tuned for better documentation. Something is actually happening in that area!
P.S. If you want to make more changes to the styling of your document, the style log can be very useful to find out which style name corresponds to a particular document element.
I am using the Material Design Components for Web library. I have a tab component that I'd like to change the underline-color of.
The instructions say
To customize the tab indicator, use the following mixins.
Then it gives a table. For underline color, it says
underline-color($color) Customizes the color of the underline.
So, I try in my scss file, the following:
.mdc-tab-indicator {
underline-color(red);
}
I compile my sass (using dart-sass) and get the following error
Error: expected "{".
It says this is a "Sass Mixin." So, I look at the SASS documentation on mixins. I see nothing that follows the syntax mixin-name($variable). Everything in there looks like
#mixin reset-list {
margin: 0;
}
with curly braces, not parentheses. But, the error said it was expecting a curly brace, and also apparently the # symbol is required. So, I try:
.mdc-tab-indicator {
#underline-color(red);
}
This doesn't throw an error, but doesn't cause the underline color to change. I try to follow the syntax of the sass docs:
.mdc-tab-indicator {
#underline-color(red){};
}
No error, but no color change. I try to match the syntax better:
.mdc-tab-indicator {
#mixin underline-color(red){};
}
This throws
Error: expected ")".
I try
.mdc-tab-indicator {
#mixin underline-color(red);
}
Same error.
I don't understand what the material components documentation is instructing. What does it mean when it says "To customize the tab indicator, use the following mixins." ? How can I change the underline color of the Material Design Component tab indicator?
Mixins are defined using the #mixin at-rule, which is written #mixin { ... } or #mixin name() { ... }. A mixin’s name can be any Sass identifier, and it can contain any statement other than top-level statements. They can be used to encapsulate styles that can be dropped into a single style rule; they can contain style rules of their own that can be nested in other rules or included at the top level of the stylesheet; or they can just serve to modify variables.
Mixins are included into the current context using the #include at-rule, which is written #include or #include (), with the name of the mixin being included.
So, to include your specific mixin use:
.mdc-tab-indicator {
#include underline-color(red);
}
See more at https://sass-lang.com/documentation/at-rules/mixin
I have a similar question to this, except for Sphinx and RST. Namely, I would like to prevent text from being hyphenated at the end of the line.
For example I want this:
This is my long sent-
ence.
To be:
This is my long
sentence.
How do I do this?
Hyphenation is implemented by the stylesheet basic.css in the Sphinx theme "basic".
div.body p, div.body dd, div.body li, div.body blockquote {
-moz-hyphens: auto;
-ms-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
You can override these styles with your own. See my answer to How do I customize Sphinx RtD Theme default search settings?
Your theme may have JavaScript or other styles that implement hyphenation.
For PDF output, see https://tex.stackexchange.com/a/5039
After reading pointers from #steve-piercy, I managed to find a solution for the problem. I need to customize conf.py in my project. My conf.py has the following settings:
# ...
# ...
# -- Options for LaTeX output ------------------------------------------------
latex_elements = {
# The paper size ('letterpaper' or 'a4paper').
#
'papersize': 'a4paper',
# The font size ('10pt', '11pt' or '12pt').
#
'pointsize': '12pt',
# Additional stuff for the LaTeX preamble.
#
'preamble': r'''
\usepackage[none]{hyphenat}
'''
# Latex figure (float) alignment
#
# 'figure_align': 'htbp',
}
# ...
# ...
I am using Sphinx 1.8.2, MikTex 2.9 and Strawberry Perl 5.28.1. This new change in conf.py will download new perl package(s).
I use TYPO3 7.6.2 LTSwith the new fluid_styled_content. It's brilliant! Very easy to change the header types or upload elements or text/image stuff ...
But how can I change the Labels at Backend-TCA for the Header element f.e. Is it still over TSconfig or a locallang-file? And where it is?
And how can I disable some headlines. I only use Layout 1-3. If I found this, i'll never go back to css_styled_content..
Thanks for your advice.
The old way was like this TSconfig ..
TCEFORM.tt_content.header_layout.altLabels {
1 = H2 rot
2 = Grafische Ueberschrift
3 = Versteckt (CSS)
4 = Nicht ausgeben
}
TCEFORM.tt_content.header_layout.removeItems = 5,6,7,8,9,10,100
And TS setup
lib.stdheader = CASE
lib.stdheader {
key.field = header_layout ..
Nothing should have changed within TSconfig ... tested it ... works like a charm.
The frontend rendering of the header is not defined via TS any more (mostly), but via partials. Checkout the path settings in the TypoScript of lib.fluidContent. You can overwrite the default templates, partials and layout with your own fluid templates.
I have a SCSS project that builds on top of Foundation via Compass. It defines a set of sass variables, then defines a bunch of rules in terms of those variables: (my project has many more variable settings and import statements; this is simplified.)
vars.scss:
$foo = #fafafa
$bar = 14px;
// rules using $foo and $bar
#import '_rules';
I then use compass to compile vars.scss, and everything is great for that set of sass variables. However, I also want the ability to theme my app differently, and generate a different theme by defining a new set of variables which can override the original variables:
vars.scss:
$foo = #fafafa
$bar = 14px;
#import 'otherVars';
#import '_rules';
I can't edit the file manually when I have 70+ themes. (Having that many themes is necessary for the purposes of my app.) What I really want is to be able to do something like the following:
vars.scss:
$foo = #fafafa
$bar = 14px;
#import '{{otherVars}}';
#import '_rules';
And then I could call something like:
compass --otherVars themes/theme2
It would then be easy to whip out all the themes, because I could call compass once for each theme.
Does SCSS let you do this? I looked into it, and it doesn't look like it.
My current workaround is to split the original vars.scss into a prefix and suffix:
_app_prefix.scss:
$foo = #fafafa
$bar = 14px;
_app_suffix.scss:
#import '_rules';
app.scss:
#import '_app_prefix';
// no overrides by default
#import '_app_suffix';
And to override it for a specific theme, you'd make a file that looks like:
theme2.scss:
#import '_app_prefix';
// only override $foo - let the original value of $bar stand
$foo = #ebebeb;
#import '_app_suffix';
This works, but is sorta painful and introduces additional boilerplate.
My next problem is wanting to have additional #import 'rules_foo' statements, which also need to be constructed dynamically. So my overall fantasy would look like:
vars.scss:
$foo = #fafafa
$bar = 14px;
#import '{{otherVars}}';
#import '_rules';
{{ #import 'additional_rules' for additional_rules in rules }}
And I could call:
compass --otherVars themes/theme2 --rules "rules_1" "rules_2" "rules_3"
(Obviously this is somewhat handwavy but hopefully you get the idea.)
Is there a way to do this? Or am I going to have to resort to handlebars or some other templating language?
For people who are using Grunt to compile their SCSS/SASS files, the solution was to add an extra parameter loadPath to "sass" task configuration as follows:
sass: {
options: {
loadPath: ['../src/css/themes/myTheme/'],
style: 'nested',
precision: 2
},
And then in the /src/css/import.scss you can include those files from the theme as if they were in current directory:
#import "config";
The file was included from /src/css/themes/myTheme/config.scss.
NOTE: You can of course add a parameter to your Grunt task and have that theme name dynamic!
You could always generate a temporary file that you send to compass. With python code:
import sys
with open('tmp.scss', 'w') as out:
out.write(("""
$foo = #fafafa
$bar = 14px;
#import '%(pre-rules)s';
#import '_rules';
%(post-rules)s
""" % {'pre-rules': sys.argv[1], 'post-rules': '\n'.join(["#import '%s';" % x for x in sys.argv[2:]])}).strip())
You'd call it like:
python stackoverflow.py themes/theme2 rules_1 rules_2 rules_3
And it creates/overwrites tmp.scss with the output you want.