Is there a way in Less to expand the contents of a variable to a string?
My specific use case:
#thecolor: #3B98D5
.theclass {
...
}
.theclass:before {
content: "#3B98D5"; // How do I use #thecolor here instead?
}
Then in HTML:
<div class="theclass">
#3B98D5 <!-- What I want in the end -->
</div>
The use case is to create a static page that shows a set of colors, where I would like the color code in the HTML, but only ever specify it in the Less.
So in the end I want it to be a HTML text node. Is this possible at all?
Just enclose the variable within double quotes and use variable interpolation (Format: #{var-name}).
#thecolor: #3B98D5;
.theclass:before {
content: "#{thecolor}";
}
The variable needs to be enclosed within quotes because otherwise the content property will not take it as a string and display. When you use "#theccolor", Less compiler just treats it as a normal string (and not as a variable which is present within quotes needing to be evaluated). The "#{theclass}" is the format for using variable interpolation which lets the compiler know that the value inside quotes is a variable which needs to be evaluated.
.theclass:before {
content: "#3B98D5";
}
.theclasswrong:before {
content: #3B98D5;
}
<div class='theclass'>- Correct Output</div>
<div class='theclasswrong'> - Will not give output without quotes</div>
Related
I want to update a string in quotes in yaml file in Jenkins Job. While updating the file, single quotes around the string are replaced by triple quotes. Following is the method that I have written:
{
def fileName = 'config.yml'
datas = readYaml file: fileName
var = "'" + params.ReleaseBranchName + "'"
println var // this shows output as expected, string in single quotes -> 'rel-21.9'
datas.branchName = var
println datas // this prints the yaml with single quotes -> productiveBranch='rel-21.9',
writeYaml file: fileName, data: datas, overwrite: true //this show value in triple quotes -> productiveBranch: '''rel-21.9'''
}
Could someone suggest how can I save string with single quotes in yaml file? Thanks!
The value of var, as written, is 'rel-21.9', i.e. the single quotes are part of the value.
In YAML input, when 'rel-21.9' is encountered, the single quotes are not part of the value; they are part of the syntax and enclose the value, so the value is rel-21.9.
Therefore, if you want your value to be rel-21.9, which is most probably what you want, do not put single quotes in the value; just do var = params.ReleaseBranchName.
Your code does not do anything with var; I assume what you're trying is to put it into datas. This would result in YAML writing out "'rel-21.9'" (not triple single quotes, that can't happen since it would be invalid YAML). By surrounding the value with double quotes, the single quotes become part of the value just like your code requested.
When you do not put single quotes into the data, YAML will probably serialise it without any quotes. This is expected since rel-21.9 does not contain any special characters that would require quoting. There are ways to force a YAML processor to quote a value, but they are complex and I am unsure whether the API is exposed to Groovy. For references, this is how you would do it in Java.
Since you are editing a YAML file, you might want to read this question which details how and why updating YAML files in code can lead to style changes.
I'm trying to split a string (separated with the HTML break tag), without deleting the break tag. I think it's pretty messy to add a break as string after splitting, so is there any function/possibility to keep the separator while "splitting"?
Example:
<HTML><BODY><p>some text<br/>some more text</p></BODY></HTML>
Expected result:
<HTML><BODY><p>some text<br/>
some more text</p></BODY></HTML>
As far as I know SPLIT removes the separator from the results and it doesn't seem like you can change that.
But you could create your own separator by first replacing your <br/> tag with <br/> plus an arbitrary string that is highly unlikely to ever appear in your HTML source, and then split the HTML using this arbitrary string as a separator instead.
types:
begin of t_result,
segment(2000) type c,
end of t_result.
DATA:
source type string,
separator type string,
brtag type string,
repl type string,
result_tab type standard table of t_result,
result_row TYPE t_result.
brtag = '<br/>'.
separator = '|***SEP***|'.
concatenate brtag separator into repl.
source = '<HTML><BODY><p>some text<br/>some more text</p></BODY></HTML>'.
replace all occurrences of brtag in source with repl.
split source at separator into table result_tab.
LOOP AT result_tab INTO result_row.
WRITE:
result_row-segment.
ENDLOOP.
Output of that example report:
<HTML><BODY><p>some text<br/>
some more text</p></BODY></HTML>
The caveat of this solution is that your custom separator, if not chosen with some care, might appear in your HTML source on its own. I therefore would choose an arbitrary string with a special character or two that would be encoded in HTML (like umlauts) and therefore not appear in your source.
Just use the replace command. replace <br/> with <br/>CR_LF
The CR_LF refers to the carriage return linefeed character.
In more complex cases you can use regex expressions in abap.
class ZTEST_SO definition public create public .
public section.
methods t1.
ENDCLASS.
CLASS ZTEST_SO IMPLEMENTATION.
METHOD T1.
data: my_break type string,
my_string type string
value '<HTML><BODY><p>some text<br/>some more text</p></BODY></HTML>'.
my_break = '<br/>' && CL_ABAP_CHAR_UTILITIES=>CR_LF.
replace all occurrences of '<br/>' in my_string with my_break in character mode.
"check my_string in the debugger :)
"<HTML><BODY><p>some text<br/>
"some more text</p></BODY></HTML>
ENDMETHOD.
ENDCLASS.
I want to programatically modify the color of variables. I have attempted with this
<p> \(\overline{<font color="#0000EE" id="test_A">A</font>+B}+\overline{B}\)</p>
But it will just break the syntax. I can't break the equation into multiple equations due to it being nested within an overline.
Any tips on adding an identifier to a mathjax variable so I can refer to it within javascript?
Write css class rules instead, then \class{yourClass}{yourVariable} :
.yourClass{
color:#0000EE;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_CHTML-full"></script>
<p> \(\overline{\class{yourClass}{A}+B}+\overline{B}\)</p>
You now have an 'identifier' for your variable, once it's processed, you can easyly change color with javascript
var button = document.querySelector('button');
button.addEventListener('click',changeColor);
function changeColor(){
document.querySelector('.yourClass').style.color='red';
}
.yourClass{
color:#0000EE;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS_CHTML-full"></script>
<p> \(\overline{\class{yourClass}{A}+B}+\overline{B}\)</p>
<button>click</button>
I see a very weird problem when json when used in nodejs, it is skipping single quote from revision key . I want to pass this json as input to node request module and since single quote is missing from 'revision' key so it is not taking as valid json input. Could someone help how to retain it so that I can use it. I have tried multiple attempts but not able to get it correct.
What did I try ?
console.log(jsondata)
jsondata = {
'splits': {
'os-name': 'ubuntu',
'platform-version': 'os',
'traffic-percent': 100,
'revision': 'master'
}
}
Expected :-
{ splits:
{ 'os-name': 'ubuntu',
'platform-version': 'os',
'traffic-percent': 100,
'revision': 'master'
}
}
But in actual output single quote is missing from revision key :-
{ splits:
{ 'os-name': 'ubuntu',
'platform-version': 'os',
'traffic-percent': 100,
revision: 'master'
}
}
Run 2 :- Tried below code this also produce same thing.
data = JSON.stringify(jsondata)
result = JSON.parse(data)
console.log(result)
Run 3:- Used another way to achieve it
jsondata = {}
temp = {}
splits = []
temp['revision'] = 'master',
temp['os-name'] = 'ubuntu'
temp['platform-version'] = 'os'
temp['traffic-percent'] = 100
splits.push(temp)
jsondata['splits'] = splits
console.log(jsondata)
Run 4: tries replacing single quotes to double quotes
Run 5 : Change the order of revision line
This is what is supposed to happen. The quotes are kept only if the object key it’s not a valid JavaScript identifier. In your example, the 'splits' & 'revision' don't have a dash in their name, so they are the only ones with the quotes removed.
You shouldn't receive any error using this object - if you do, update this post mentioning the scenario and the error.
You should note that JSON and JavaScript are not the same things.
JSON is a format where all keys and values are surrounded by double quotes ("key" and "value"). A JSON string is produced by JSON.stringify, and is required by JSON.parse.
A JavaScript object has very similar syntax to the JSON file format, but is more flexible - the values can be surrounded by double quotes or single quotes, and the keys can have no quotes at all as long as they are valid JavaScript identifiers. If the keys have spaces, dashes, or other non-valid characters, then they need to be surrounded by single quotes or double quotes.
If you need your string to be valid JSON, generate it with JSON.stringify. If it's OK for it to be just valid JavaScript, then it's already fine - it does not matter whether the quotes are there or not.
If, for some reason, you need some imaginary third option (perhaps you are interacting with an API where someone has written their own custom string parser, and they are demanding that all keys are surrounded by single quotes?) you will probably need to write your own little string generator.
I have a String which contains minified CSS and handlebars.js notations (if statements, variables and so on). Because that the String is minified, it also contains stuff like '{{{' or '}}}' which I need to replace with '{ {{' or '}} }' (put one space between) in order to compile it correctly through handlebars.
Trouble is that I cannot manage to put the correct Regex together for this simple task. I guess the { symbols make the whole thing difficult since its a Regex-specific character.
String:
.class1{{{#if style.textColor}}color:{{style.textColor}};{{/if}}}item-price{{{#if style.showPrice}}display:block;{{else}}display:none;{{/if}}{{#if style.fontSizeItemPrice}}font-size:{{style.fontSizeItemPrice}}px;{{/if}}}
Expected output:
.class1{ {{#if style.textColor}}color:{{style.textColor}};{{/if}} }item-price{ {{#if style.showPrice}}display:block;{{else}}display:none;{{/if}}{{#if style.fontSizeItemPrice}}font-size:{{style.fontSizeItemPrice}}px;{{/if}} }
Simply substituting triple mustaches works, but only for the first occurance:
css = css.replace("{{{", "{ {{");
css = css.replace("}}}", "}} }")
String.replace function automatically converts the first string param to regex (without the global option set). That's why only the first occurrence is replaced. If you want to replace all occurrences of the pattern, you can create a regex with global option set. Try the following snippet.
css = css.replace(/{{{/g, '{ {{').replace(/}}}/g, '}} }')