Why does adding a style or reference inside a parsed-literal break the theme of the block? - python-sphinx

When using parsed-literal, why does adding a style or reference break the theme?
For example with the sphinx_rtd_theme a parsed literal block has a green background. But If I add any style inside the parsed-literal block the background becomes white. How do I keep the theme, even when I have styles or references inside it?
This works fine and give green background
.. parsed-literal::
test
This background becomes white
.. parsed-literal::
test
**test**
I have tried to google for alternatives to parse-literal, but can find any options.

Related

How do I change the caret-color in an AceEditor theme?

How do I change the caret color in AceEditor? My theme makes the caret (the little blinking line where next character will type) nearly invisible. CSS offers caret-color but even if I add:
caret-color:white
to the CSS (either via the theme or directly into the CSS of the webpage) the AceEditor caret color remains the same. Direct CSS works fine for normal text inputs, just not AceEditor.
What's the correct way to change AceEditor's caret color? Thanks in advance.
Ace Editor calls the caret a "cursor". Thus, the CSS style in the CSS theme is:
.ace_cursor {
color:white
}
Just set the color to whatever color you want.

Customize the color of a progress circle

I'm using the "Progress circle" widget (version 2.0.0) in Mendix Studio Pro 9.2.0, and I would like to individually change the color(s) of each one of my progress circles, primarily the part that is shown in blue by default. By looking into Chrome DevTools, I found that the attribute stroke might be storing the color, but I'm not sure. Adding stroke: red in the Appearance > Common > Style form didn't work. On the other hand, adding background: red did have the intended effect of changing the background of the progress circle.
Can anyone help? I'm quite new to Mendix, so any help from you would be greatly appreciated.
By going into the documentation i found the source code of the widget.
Check this link: https://github.com/mendixlabs/progress-circle/tree/master/src/ui
In the ui folder there is a theme.scss and _variables.scss in which the developer defines the variables which drive the colors or theme of the widget. You could take some hints from there.
I am not suggesting to rebuild the widget but you can certainly do so by downloading the widget (.mpk gets downloaded) and then change the extension to .zip then change the source code.
Or since you can already inspect the DOM of the widget you can do: give a class to the widgets root DOM element. and then using cascading CSS selectors you can drill down to the element which affects background.

How to assign text colors when working with Vuetify themes

I'm quite new to Vuetify and struggling to figure out how themes, components and text colors work together (if they do at all).
I want to work with theme color names in my templates like primary, secondary, warning, error and assign colors to those keywords by adding a new theme or overwriting the existing one.
This all works out of the box but the problem is I can't figure out how to set text colors in the same way. I want to assign a primary-text-color, secondary-text-color, etc. and have it automatically use the correct text color by default.
Text colors seem to change automatically when I change the color on buttons but nowhere else.
If I add a theme color to buttons, Vuetify automatically changes the text color to be readable, for example (just using the default theme):
<v-btn color='primary'>Test</v-btn>
Text will change to primary and the button will be perfectly usable
while a lighter color will have dark text:
<v-btn>Test</v-btn>
But other components don't behave the same. For example a v-app-bar component with default color has dark text on a light background, but a primary app bar keeps the dark text on a blue background.
It looks like I need to explicitly change the text color with a helper class or similar, and even then I'd have to use something like white--text instead of primary--text (which just applies the actual primary color to text).
I think I've read all the docs on the website but I can't find any reference to this particular problem
Sorry for the links to images, I don't have enough flair to embed them in my post.
currently, this works primary--text
<v-list-item-title v-if="company_name" class="title primary--text">
{{ company_name.company_name }}
</v-list-item-title>

Is it possible to style the color of the font?

I would like to change the default black color of the font to white. I tried to add this to the styling section of my graph:
style request-rejected fill:#e74c3c,color:#FFFFFF;
The background is correctly changed to #e74c3c but the font stays black. It looks however that normal CSS styles are used in the .less source.
Is it possible to change the font color in a graph?
I know that this is a SUPER old post - but just in case someone else ends up here...
Please see Mermaid documentation for information on styling

Change colour of ckeditor show blocks border

The ckeditor editor window for the site content areas has a blue background to match the website so that the client sees a true representation of the website while adding content.
When "show blocks" is selected the blocks border displayed is barely visible on the blue background.
Therefore, where can the colour of the show blocks border be changed to a darker colour?
Unfortunately, color of border displayed for blocks isn't customizable. CSS that styles them is generated by JS. You can find it here http://dev.ckeditor.com/browser/CKEditor/trunk/_source/plugins/showblocks/plugin.js#L28
I guess that you're using compiled version of CKEditor, so source is minified. You'll have to open ckeditor.js file and find this fragment and change it manually.
Or you can try to clone CKEditor 4 (new version that will be release next Tuesday), change this value here https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/showblocks/plugin.js#L48 and then compile your build of CKEditor (you can find instructions here https://github.com/ckeditor/ckeditor-dev). But to do this you'd need Mac or Linux, because build script is written in Bash.
CKEDITOR.replace( 'textarea_id', {
uiColor: '#14B8C4'
});
Update :-
Check the sample url:ckeditor

Resources