I was thinking to use bootstrap and materialize css but it happen that they have the same class.
If you want to add custom style to an object that already has it's style defined by other css class, sometimes you will have to replace some styles. Here's how to do it:
Firstly, check which class overrides it.
Let's say your markup returns:
<div class="range-specific range"></div>
If your css is defined like that:
.range-specific { foo; }
.range { bar; }
Then the range will win.
If you change it to:
.range-specific.range { foo; }
.range { bar; } `
Then the specific will win.
If you want to hack it even more, do this:
.range-specific.range-specific { foo; }
.range { bar; }
And specific will surely win.
It's even better to do this:
.range { bar; }
.range-specific { foo; }
If u want to override that class you can use nav.app-bg or use !important
Here you can check Overrides of Material-UI
Related
Vue 3 deprecated using v-deep as a combinator: https://github.com/vuejs/rfcs/blob/master/active-rfcs/0023-scoped-styles-changes.md
We have existing code using SCSS and v-deep like this:
.class ::v-deep {
.child-class1 {...}
.child-class2 {...}
}
Which compiles into something like this:
.class[data-xxxxxx] .child-class1 {...}
.class[data-xxxxxx] .child-class2 {...}
In Vue 3, this syntax is deprecated, and we need to do this instead:
.class {
::v-deep(.child-class1) {...}
::v-deep(.child-class2) {...}
}
We have to repeat v-deep for every nested rule. In reality, there are many more, and some complicated rules.
Is there any way, in SCSS to construct a nested block where all the inner rules are wrapped into this ::v-deep(...) syntax?
I'm looking for something like this (not actual syntax):
::v-deep(&) {
.child-class1 {...}
.child-class2 {...}
}
Except that the self-selector (&) would have kind of the opposite meaning, referencing the child selector instead of the parent.
You can do pretty much the same thing with an empty selector argument:
.class ::v-deep() {
.child-class1 {...}
.child-class2 {...}
}
I'd like to change a method with a certain signature:
public OldReturnType get.*(Params) {
//lots of code
}
to this:
public NewReturnTyp get.*(Params) {
//lots of code
}
-> I'd like to replace the return type. I tried this with SSR:
Copy existing Template "methods of the class". This yields the template:
class $Class$ {
$ReturnType$ $MethodName$($ParameterType$ $Parameter$);
}
I first tried to replace $ReturnType$ OldType and NewType respectivly:
Search Template:
class $Class$ {
OldType $MethodName$($ParameterType$ $Parameter$);
}
Replace Template:
class $Class$ {
NewType $MethodName$($ParameterType$ $Parameter$);
}
This gives me all the methods, but if I replace it, the method gets removed.
I then tried to changed the pattern the following way:
Search Template:
class $Class$ {
$OldType$ $MethodName$($ParameterType$ $Parameter$);
}
And specified, that $OldType$ should be the target of the search. I also specified a RegEx pattern: OldType for this variable.
Replace Template:
class $Class$ {
NewType $MethodName$($ParameterType$ $Parameter$);
}
This also finds all the methods but they get removed if I replace. I tried very different, always with the same result: The method gets removed if I replace the match. How do I have to specify the search/replace Template to just replace OldType with NewType in the signature.
You have encountered a bug in Structural Search & Replace. Probably this one: https://youtrack.jetbrains.com/issue/IDEA-127835
But there is a workaround. Use the following Search Template:
class $Class$ {
OldType $MethodName$($ParameterType$ $Parameter$) {
$statement$;
}
$other$;
}
Make sure "This variable is target of the search" for $MethodName$ is NOT set, or it won't work.
$statement$
minimum count: 0
maximum count: unlimited
$other$
minimum count: 0
maximum count: unlimited
The rest as in the methods of the class existing template.
Replacement Template as you would expect is the same as the Search Template, only with NewType replacing OldType.
Let me know if it works, or if you have any more problems.
We usually do things lik
- (void)setFoo:(Foo *)foo
{
_foo = foo;
// other computation
}
Getter and Setters give me warning that I cant set my own property. I am guessing it needs a computed property. What would be the best way to translate this idiom in Swift?
If you're doing computation tightly integrated with setting the internal storage of foo, especially if setting the storage is conditional on such computation, the computed-property/stored-property pair #matt suggests is probably the solution you need.
Otherwise—if you need to need to do work unconditionally in response to the setting of a property—what you're looking for is Swift's property observers feature.
var foo: Foo {
willSet(newFoo) {
// do work that happens before the internal storage changes
// use 'newFoo' to reference the value to be stored
}
didSet {
// do work that happens after the internal storage changes
// use 'oldValue' to reference the value from before the change
}
}
You can "shadow" a public computed variable with a stored private variable, like this:
private var _foo : Foo!
var foo : Foo {
get {
return _foo
}
set (newfoo) {
_foo = newfoo
}
}
That is the analogy to what Objective-C #synthesize does. But you should also ask yourself whether you really need this. In most cases, you don't.
Is there a way to reuse the pseudo class in less?
For Example:
This class already exists in some external file which I cannot modify.
.cssClass:before{
}
Now, I would like to make use of that pseudo class in my current code. Is it possible?
For example:
.lessClass{
.cssClass:before; //but this is giving error
}
In Less you can not mixin pseudo classes, see also Allow for pseudo-classes to be used as mixins.
Probably you can use extend to solve your problem as already suggested by #Harry.
.cssClass:before {
content: "test";
}
.lessClass:extend(.cssClass:before){}
The preceding Less code will compile into the following CSS code:
.cssClass:before,
.lessClass {
content: "test";
}
or use: .lessClass:before:extend(.cssClass:before){} that will compile into:
.cssClass:before,
.lessClass:before {
content: "test";
}
Given two selectors e.g. "Div.aClass" and ".sub" is there a shorthand in LESS that would mean:
Div.aClass .sub, Div.aClass.sub
i.e. any element that has a sub class but is also either a Div with aClass or a child of such a div ?
I suppose I can use:
Div.aClass {
&.sub, & .sub {
}
}
but a shorter syntax would be nice.
You really do not have much shorter of a syntax available. The most you can eliminate is one &:
Div.aClass {
&.sub, .sub {
prop: test;
}
}