How to add "$" string to an interpolated value? - css

say I want to produce $small by adding an interpolated value to '$', or, in other words, by concatenating the string '$' to an interpolated value. Something like this:
$#{value}
or this:
"$" + #{value}
None of them seem to work in sass/scss. Is there a working syntax for this?
I need this because I'm building this mixin that accept media queries names (it comes from my framework, too long to explain, and a little offtopic) and I'd like to strip out the dollar when passing arguments:
#mixin prog-prop($property-name, $mq-values){
#each $mq in $mq-values{
#include mq(#{nth($mq, 1)}){ #{$property-name}: #{nth($mq, 2)} }
}
}

I don't know why you want to do so, but this is a way:
$value:'string';
$value: '$#{$value}';
.value{
content: $value;
}

Related

Stylus: how to create a CSS variable with a Mixin interpolation

How can a Stylus Mixin interpolate for both sides of the definition of a variable, such as:
--MyVariable: MyVariable
In the compiled CSS, --MyVariable should remain as the variable name, whereas the second variable should be the numerical value computed for this Stylus variable defined elsewhere.
I will have many such pairs of a CSS variable and a Stylus variable. Now, even though I could just manually write them down in the Stylus file, I would like to have a Mixin that allows me to create them by writing the shared part of the names just once as the Mixin's single argument, such as:
VariablePair(MyVariable-1) // --MyVariable-1: MyVariable-1
VariablePair(MyVariable-2) // --MyVariable-2: MyVariable-2
VariablePair(MyVariable-3) // --MyVariable-3: MyVariable-3
I tried:
VariablePair(VariableName)
--{VariableName}: VariableName
VariablePair(MyVariable)
It didn't parse.
I realized that MyVariable without '' would come as an actual value that couldn't be affixed to --. But, adding '' to it as VariablePair('MyVariable') would result in the right side of the definition itself becoming a string instead of the Stylus variable for computation.
I tried the different combinations of the presence/lack of the brackets and '' and $ as well as concatenations, but none of them seem to work. '--' + VariableName + ': ' + VariableName (with/without the brackets/$) isn't working, it either doesn't parse or does parse but without creating a line in the compiled CSS.
Is there a solution to this?
unquote works for this:
VariablePair(name, val)
{unquote('--' + name)}: val
.selector
VariablePair('fontcolor', red)
color: var(--fontcolor)
will output
.selector {
--fontcolor: #f00;
color: var(--fontcolor);
}

Is there a way to print SASS value to output?

Suppose we have:-
$value: 13.37;
$length: $value + 0em;
Now i wanted to check the value of $length.
Is there anything similar to Javascript's Console.log?
If you want it to appear on the page itself, I believe you could attach it as the value of a pseudo-element. Something like:
body::before{ content: "#{$length}"}
Additionally, sass includes #error, #warn, #debug directives that will log things to the terminal to verying degrees of of noisiness.
#error "the value of $length is `#{$length}`"
More info on those can be found here

Remove parentheses in QString

I have a QString containing "(M001)" and I want to remove the parentheses in text. The result should be "M001". How should I use a QRegExp for this?
I see two possible way to do it:
1.Using QString::remove() like this:
str.remove("(");
str.remove(")");
2.Using QRegExp class like this:
str.remove(QRegExp("[()]"));
In both of variants I get "M001" string.
Of course, there are some restrictions: all parentheses will be removed.But seems like it's what you want, don't you?
If you know your string always has parenthesis, you could just do something like:
str = str.mid(1); // Remove first character
str.chop(1); // Remove last character
Otherwise you could also do this instead of using a regular expression:
if (str.startsWith('(') && str.endsWith(')')) {
str = str.mid(1); // Remove first character
str.chop(1); // Remove last character
}
But if you insist using a QRegExp, try this:
str.remove(QRegExp("^\\(|\\)$"));
or this:
str.replace(QRegExp("^\\((.*)\\)$"), "\\1");
EDIT: If you want to remove ALL parenthesis from the string you can try:
str.remove('(').remove(')');
or
str.remove(QRegExp("[()]"));

How to remove double qoutes in Objective-C

Let me introduce myself.
My name is Vladimir, C++ programmer, I am from Serbia. two weeks ago I have started to learn objective-C and it was fine until tonight.
Problem:
I cant remove double quotes from my NSLog output.
NSLog(#"The best singers:%#", list.best);
Strings are joined with componentsJoinedByString:#" and "
I would like to get something like this:
The best singers: Mickey and John.
But I get this:
The best singers: ("Mickey", and "John").
I cant remove comma (,) and parentheses either.
I have tried with "replaceOccurencesOfString" but with no success. It can remove any character except qoute and comma.
Also I have used -(NSString *)description method to return string.
You are getting the raw output from your list (which I assume is an array). You will have to do your own formatting to get this to display in the format that you want. You can achieve this by building your string by iterating through your array. Note that this probably isn't the most efficient nor the most robust way to achieve this.
NSMutableString *finalString = [NSMutableString string];
BOOL first = YES;
for (NSString *nameString in list) {
if (first) {
[finalString appendString:nameString];
first = NO;
} else {
[finalString appendString:[NSString stringWithFormat:#" and %#", nameString]];
}
}

How can I search CSS with Perl?

First question from a long time user.
I'm writing a Perl script that will go through a number of HTML files, search them line-by-line for instances of "color:" or "background-color:" (the CSS tags) and print the entire line when it comes across one of these instances. This is fairly straightforward.
Now I'll admit I'm still a beginning programmer, so this next part may be extremely obvious, but that's why I came here :).
What I want it to do is when it finds an instance of "color:" or "background-color:" I want it to trace back and find the name of the element, and print that as well. For example:
If my document contained the following CSS:
.css_class {
font-size: 18px;
font-weight: bold;
color: #FFEFA1;
font-family: Arial, Helvetica, sans-serif;
}
I would want the script to output something like:
css_class,#FFEFA1
Ideally it would output this as a text file.
I would greatly appreciate any advice that could be given to me regarding this!
Here is my script in full thus far:
$color = "color:";
open (FILE, "index.html");
#document = `<FILE>`;
close (FILE);
foreach $line (#document){
if($line =~ /$color/){
print $line;
}
}
Since you asked for advice (and this isn't a coding service) I'll offer just that.
Always use strictures and warnings:
use strict;
use warnings;
Always check the return value of open calls:
open(FILE, 'filename') or die "Can't read file 'filename' [$!]\n";
Use the three-arg form of open and lexical filehandles instead of globs:
open(my $fh, '<', 'filename') or die "Can't read file 'filename' [$!]\n";
Don't slurp when line-by-line processing will do:
while (my $line = <$fh>) {
# do something with $line
}
Use backreferences to retrieve data from regex matches:
if ($line =~ /color *: *(#[0-9a-fA-F]{6})/) {
# color value is in $1
}
Save the class name in a temporary variable so that you have it when you match a color:
if ($line =~ /^.(\w+) *\{/) {
$class = $1;
}
Well, this is not as simple as it seems.
CSS classes can be defined in many ways. For example,
.classy {
color: black;
}
Good luck using a line-by-line approach for parsing that.
Actually, my first approach would be searching CPAN. This looks promising:
CSS - Object oriented access to Cascading Style Sheets (CSS)
Edit:
I installed HTML::TreeBuilder and CSS modules from CPAN and concocted the following aberration:
use strict;
use HTML::TreeBuilder;
use CSS;
foreach my $file_name (#ARGV) {
my $tree = HTML::TreeBuilder->new; # empty tree
$tree->parse_file($file_name);
my $styles = $tree->find('style');
if ($styles) {
foreach my $style ($styles) {
# This is an insane hack, not guarantee
# to work in the future.
my $css = CSS->new;
$css->read_string(join "\n", #{$style->{_content}});
print $css->output;
}
}
$tree = $tree->delete;
}
This thing only prints all the CSS selectors from list of HTML files, but nicely formatted so you should be able to continue from here.
For yet another way to do it, you can ask perl to read from the file in sections other than lines, for example by using the "}" as a record separator.
my $color = "color:";
open (my $fh, '<', "index.html") || die "Can't open file: $!";
{
local $/ = "}";
while( my $section = <$fh>) {
if($section =~ /$color(.*)/) {
my ($selector) = $line =~ /(.*){/;
print "$selector, $section\n";
}
}
Untested! Also, this of course assumes that your CSS neatly ends its sections with a } on a line on it's own.
I'm not having problems with the regex's but rather with the capture of data. Since CSS elements are typically multi-line, I need to figure out how to create an array between the { and } with each linebreak as a delimiter for list items.
No, you don't.
For the problem as stated, the only lines of interest will be those containing either a class name or a color definition, and possibly also lines containing } to mark the end of a class. All other lines can be ignored, so there's no need to put them into an array.
Since class specifications cannot be nested[1], the last seen set of class names will always be the active set of classes. Therefore, you need only record the last seen set of class names and, when a color specification is encountered, print those class names.
There are still some potential difficulties handling cases in which a specification block is shared by multiple classes (.foo, .bar, .baz { ... }), which may or may not be spread across multiple lines, or if multiple attributes are defined on the same line, but dealing with those should follow fairly easily from what I've already laid out. Depending on your input data, you may also need to include a basic state engine to keep track of whether you're in comments or not.
[1] i.e., Although you can have semantically-nested classes, such as .foo and .foo .bar, they have to be specified in the CSS file as
.foo {
...
}
.foo .bar {
...
}
and cannot be
.foo {
...
.bar {
...
}
}
Although I have not tested the code below, but something like this should work:
if ($line =~ m/\.(.*?) \{(.*?)color:(.*?);(.*)/) {
print "$1,$3\n";
}
You should invest some time learning regular expressions for Perl.

Resources