Mermaid entity relation diagram - mermaid

I have read mermaid styling documentation section:
https://mermaid-js.github.io/mermaid/#/entityRelationshipDiagram?id=styling
Now, I can't figure out how to apply any styles for the ER diagram.There are no any examples or general info about styling.
Does any body have any idea?

I found the answer. The important part of the documentation is "Config options" section. this mean the styles should be placed accordinly.
Mermaid config could be placed into mermaid.initialize() or inline on the first line of your digram with %%{init: { }}%% expression. You can see details here https://mermaid-js.github.io/mermaid/#/./directives.
example for ER diagram styling:
%%{init: {'themeCSS': '.er.attributeBoxEven { fill: #f2f2f2; }' }}%%

Related

Change one word color in a text using D3 and D3Plus

I have the following code:
var data = [
{ text: `Notice also: #MapboxUnion isn't "Mapbox TECH Workers Union". We're organizing all of our US employees. Sales, Support, Engineering, Design... When we say we want to improve life for fellow Mapboxers, we mean all of them` },
];
new d3plus.TextBox()
.data(data)
.select("#container")
.fontSize(16)
.height(100)
.width(400)
.render()
But, I would like to change "#MapboxUnion" to be blue but I have no idea how to achieve this using D3.
Thanks for your time and help.
Example provided here says that you can use some tags inside of your text data - b, strong and i specifically.
var data = [
{ text: `Notice also: <b>#MapboxUnion</b> isn't "Mapbox TECH Workers Union". We're organizing all of our US employees. Sales, Support, Engineering, Design... When we say we want to improve life for fellow Mapboxers, we mean all of them` },
];
Then you can use normal CSS to style it:
#wrap tspan{
fill: blue;
}
I've created minimal example you can follow on Codepen.

Nested / Compounded roles: apply multiple roles to overlapping text

In my custom.css file I have,
.bold {
font-weight: bold;
}
.red {
color:red;
}
And in my _.rst file,
.. role:: bold
.. role:: red
But if I try to nest/compound them, only the outermost role takes effect, e.g.
:bold:`:red:`This is only bold``
This is only bold
Is there a way to combine these effects without defining a new (combined) role?
you can use a custom css class directive:
.. cssclass:: boldred
bold red text
and update the css to format the boldred class
Roles are defined that the can not be nested.
Neither HTML nor LaTeX, as backends, support overlapping of styles.

How can I add multiple tooltips on kendo ui grid.

I want to have different tooltips in different columns on a kendo ui grid.
I am examine the example
http://dojo.telerik.com/#pfilipov/iGetO/2
but I can't find the way to do it.
Do you require Angular syntax as in example? - I don't speak Angular, but here is basic solution where I do not need to.
Dojo example
Also there is content function where you can catch and react according to attributes - in that case Title. So if you need calculate some equation (for example) you can create condition if(title == Tooltip1) and do what you need.
You can do like below:
$("#Kendo-grid-div-id").kendoTooltip({
filter: "td:nth-child(2),td:nth-child(3)", //comma separated multiple columns
position: "bottom", //possible values: bottom,top,left,right,center
content: function(e){
var content = e.target.html();
return content;
}
}).data("kendoTooltip");
This works for me!!!

Sass with compas, selecting all divs with x class before hyphen

I am using Sass and currently selecting my divs via:
[class*='inner-']{
padding: $pad;
}
But i have two variants of this div which are: -left, -right but i wanted to see if there was a better way rather than doing individual style blocks for each one, if i could merge it into one block.
My variants have a slight variation on the padding.
So something like:
[class*='inner-']{
padding: $pad;
-left{
atttribute
}
-right{
attribute
}
}
I might be over thinking this and making it pointlessly complex, but it's helping me learn lots so if anyone can shed some light on the best solution I'd appreciate it.
Not sure I've understood what you need properly, but I think you making it too complex.
Nice and simple solution:
%inner {
padding: somepadding;
}
.inner-left {
#extend %inner;
some other: attributes for left;
}
.inner-right {
#extend %inner;
some other: attributes for right;
}
We use placeholder (%inner), it's like a silent class, won't be outputed until called. Then extend it to those two classes. Nice, clean and maintainable solution.

Flex 4 change popup's overlay color

How can I change the color or the transparency of the popup's overlay? I want to have another color and alpha 1.
http://mprami.wordpress.com/2008/04/22/alert_popup_modal_transparancy_color_blur_changes/
In flex ‘’ tag has mainly four attributes related to modal properties of pop-ups.
modalTransparency
modalTransparencyBlur
modalTransparencyColor
modalTransparencyDuration
In spark it looks like these were renamed slightly:
modal-transparency
modal-transparency-color
modal-transparency-duration
modal-transparency-blur (guessing on this one)
To extend on artjumble's answer, if you're using a css file, you can also declare it like that in the css file:
global {
modalTransparencyBlur: 0;
modalTransparency: 0.3;
modalTransparencyColor: black;
modalTransparencyDuration: 500;
}

Resources