How to set up autoprefixer.browsers value using docpad.coffee config? - coffeescript

(What a mess to find all the below setup infos already :-/ )
I could get autoprefixer to run with docpad, but I (guess I) did not succeed in setting the browsers value...
my environment:
docpad 6.69.1
IE 11, FF 31.0 + Firebug
What I tried so far (docpad install with plugins: jade, less, livereload, marked):
simple install worked (default browsers setup):
docpad install autoprefix
I got some style.css.less file with some imports and especially some background: radial-gradient(...) ; background: linear-gradient(...) rules.
I renamed my style.css.less to style.css.autoprefix.css.less (style.css.autoprefix.less did not work)
Till here it worked only with warning(s) about that the less->css or css->autoprefix conversions did not do anything which should be ok.
autoprefixer added some -webkit... versions of my ...gradient... rules above.
not possible to set browsers without docpad stylus plugin?
... it seemed to me ... so I continued like this:
docpad install stylus
added the autoprefixer stylus setup to my docpad.coffee setup file:
docpadConfig = {
#...
plugins:
stylus:
stylusLibraries:
'autoprefixer-stylus': true
options:
use: [
#() -> require('autoprefixer-stylus')('ie 6')
() -> require('autoprefixer-stylus')('ff > 3')
#() -> require('autoprefixer-stylus')('last 2 versions')
]
}
# Export our DocPad Configuration
module.exports = docpadConfig
The effect is, that now my style.css is obviously autoprefixed again, but switching between the options above does not have an effect.
How to make browsers settings work from here?
All the setup info to here I collected from different sources so I likely missed something. Maybe it is already possible to configure the browsers settings without the stylus plugin?
Here the sources that helped me more or less to get to this point:
https://www.npmjs.com/package/docpad-plugin-autoprefix
https://www.npmjs.com/package/autoprefixer
https://www.npmjs.com/package/docpad-plugin-stylus
https://www.npmjs.com/package/autoprefixer-stylus
http://blog.sapegin.me/all/css-workflow
https://github.com/kizu/docpad-test/blob/master/docpad.coffee
My main test case
Adding the additional -moz-radial-gradient.../-moz-linear-gradient... rules in my css manually shows me the proper gradients. Removing them doesn't show any gradient (not even from the standard syntax and independent of using the autoprefixer ... this may be an unrelated/left problem, because I would expect the much more complex style.css to change on the above browsers options changes at least gradually.)

It works - the problem layed somewhere else!
Thus the question already contains the answer how to set it up ...
The following gradient-related issue made me check for my gradient-syntax:
https://github.com/artpolikarpov/fotorama/issues/91
And following the specs: http://www.w3schools.com/css/css3_gradients.asp
more thoroughly and since changing
background: linear-gradient( top, red, yellow);
background: radial-gradient( top right, red, yellow);
to
background: linear-gradient( to bottom left, red, yellow )
background: radial-gradient( ellipse farthest-corner at top right, red, yellow )
it works like a charm :-)

Related

preserve existing code for arbitrary scalafmt settings

I'm trying to gently introduce scalafmt to a large existing codebase and I want it to make virtually no changes except for a handful of noncontroversial settings the whole team can agree on.
With some settings like maxColumn I can override the default of 80 to something absurd like 5000 to have no changes. But with other settings I have to make choices that will modify the existing code like with continuationIndent.callSite. The setting requires a number which would aggressively introduce changes on the first run on our codebase.
Is there anything I can do in my scalafmt config to preserve all my code except for a few specific settings?
EDIT: I will also accept suggestions of other tools that solve the same issue.
Consider project.includeFilters:
Configure which source files should be formatted in this project.
# manually include files to format.
project.includeFilters = [
regex1
regex2
]
For example, say we have project structure with foo, bar, baz, etc. packages like so
someProject/src/main/scala/com/example/foo/*.scala
someProject/src/main/scala/com/example/bar/*.scala
someProject/src/main/scala/com/example/baz/qux/*.scala
...
Then the following .scalafmt.conf
project.includeFilters = [
"foo/.*"
]
continuationIndent.callSite = 2
...
will format only files in foo package. Now we can proceed to gradually introduce formatting to the codebase package-by-package
project.includeFilters = [
"foo/.*"
"bar/.*"
]
continuationIndent.callSite = 2
...
or even file-by-file
project.includeFilters = [
"foo/FooA\.scala"
"foo/FooB\.scala"
]
continuationIndent.callSite = 2
...

How to avoid VsCode Prettier to break chain functions in new lines.?

I'm working with VSCode, Prettier and TSLint.
When I do have chained functions call with more than 2 calls like
let m = moment().startOf("day").subtract(30, "days");
Prettier breaks into
let m = moment()
.startOf("day")
.subtract(30, "days")
I already set the TSLint rule
{
"defaultSeverity": "warning",
"extends": ["tslint:recommended"],
"linterOptions": {
"exclude": ["node_modules/**"]
},
"rules": {
// ...
"newline-per-chained-call": false
}
}
and the fallowing settings
"prettier.tslintIntegration": true
But the chained functions still breking into new lines.
What can I do to avoid the line breaking but still using the TSLint?
[EDIT] In Prettier v2.0.4 this issue is fixed. Update to latest version
This is an issue in prettier. The PR's to add this feature has not yet been merged from what i understand.
Currently to get what you want, what i can suggest is to ignore the next node in the abstract syntax tree from formatting using the // prettier-ignore comments.
// prettier-ignore
let m = moment().startOf("day").subtract(30, "days");
There are variations of these ignore statements, like one could ignore within a ranger or one could even ignore a particular file too. Do check out the official prettier documentations to know more of it's implementation.
Note that in Prettier v2.0.4 this issue is fixed. Now, as long as your line of code is within the length specified in your config or the default 80, it will be left in one line. Otherwise, it will be wrapped to multiple lines.
I had to upgrade my prettier in order for these changes to be put into affect.
$ yarn upgrade -g prettier --latest

Backend Folder-Styles are gone after copy

In the backend in the sitetree we gave some folders a special style (edit folder -> Behaviour -> Contain Plugin -> News). So that this folders get the class .t3-icon-pages-contains-news and are blue.
Now I copied different typo3 files into that installation, but use the same database. Everything works fine, but this folders dont have the class .t3-icon-pages-contains-news anymore. The Behaviour -> Contain Plugin is still set to news.
Any ideas where this is coming from?
You did not provide any code example so it is hard to figure out what is going wrong in your situation.
However, here a example how it should look like:
typo3conf/ext/myext/ext_tables.php or typo3conf/extTables.php
if (!$TCA['pages']['columns']['module']['config']['items']) {
$TCA['pages']['columns']['module']['config']['items'] = array();
}
$TCA['pages']['columns']['module']['config']['items'][] = array('your label', 'myext', 'EXT:myext/Resources/Public/Icons/FolderIcon.gif');
\TYPO3\CMS\Backend\Sprite\SpriteManager::addTcaTypeIcon('pages', 'contains-myext', '../typo3conf/myext/Resources/Public/Icons/FolderIcon.gif');

Added Liquid Fire to Ember CLI project, {{liquid-outlet}} does nothing

I recently added Liquid Fire to my Ember CLI 0.2.3 project by following this steps outline in this tutorial: http://www.programwitherik.com/doing-animations-and-transitions-with-liquid-fire-and-ember/
I added Liquid Fire with npm install --save-dev liquid-fire. I added a transitions.js file with the code outlined in the tutorial. I replaced {{outlet}} with {{liquid-outlet}}. And...nothing. Nothing is happening. No errors in the logs or console, and nothing is displayed where the outlet is. I've tried exactly what the tutorial says. Am I missing a step to make {{liquid-outlet}} work?
I had the same issue. My problem was that I wasn't using the correct route names.
I enabled the ENV.APP.LOG_TRANSITIONS = true; option in /config/environment.js. This prints the route names in your console when transitioning, which helped me write the correct transitions in /app/transitions.js. Also make sure to add {{liquid-outlet}} to ALL of your outlets when nesting routes.
Heres my transitions.js file:
export default function(){
this.transition(
this.fromRoute('dashboard'),
this.toRoute('bots'),
this.use('toLeft'),
this.reverse('toRight')
);
this.transition(
this.fromRoute('bots.bot'),
this.toRoute('bots.create'),
this.use('toLeft'),
this.reverse('toRight')
);
this.transition(
this.fromRoute('bots.bot'),
this.toRoute('bots.index'),
this.use('toRight'),
this.reverse('toLeft')
);
this.transition(
this.fromRoute('bots.bot.index'),
this.toRoute('bots.bot.edit'),
this.use('toLeft'),
this.reverse('toRight')
);
this.transition(
this.fromRoute('bots.bot'),
this.toRoute('bots.bot.edit'),
this.use('toDown'),
this.reverse('toUp')
);
}
You can debug your transitions by placing this.debug() as the final argument in the transitions that you think should match. For each outlet, that will print to the console why each transition rule did not match.
See here: http://ef4.github.io/liquid-fire/#/transition-map/debugging-constraints
I had the same issue.
I simply misplaced transitions.js in / instead of within /app/. Now all works!
Things you can try:
Add an explicit animation to the outlet {{liquid-outlet use="toLeft"}}. If that works it's probably your app/transition.js file.
Add this.debug() to app/transition.js and see if it logs correctly. If yes then do your routes match up? See example
Make sure to wrap the entire transitions.js file in export default function() { ... };
Using Ember CLI 1.13.13:
Restart 'ember serve'.
Open your terminal where 'ember serve' is running.
Type Ctrl+C and wait for ember to finish.
Type 'ember serve' again and reopen your ember webpage (http://localhost:4200/).
Worked for me. Good luck!

Turn off auto-closing parentheses in ipython

I stay up-to-date with ipython's dev branch (because ipython is pretty much the most awesome thing ever). Fairly recently (before yesterday's awesome ipython 2.0 release) I noticed that it has started to automatically close parentheses, brackets, quotes, etc., as I type them. It happens in both terminal [nothing else I use in terminal does it] and notebook sessions, so I assume it was an intentional choice on the part of the developers. I can respect that other people might like this feature, but it drives me completely nuts.
I can't find any option for it in the configuration files. I can't even google for it, because I don't know what it's called. The only thing that comes up is the different feature of automatic parentheses. I did actually find this question, but that's old, and suggests that the behavior I'm seeing can't happen.
How can I turn this feature off?
[I mostly just use the notebook interface anyway, so just turning it off there would be fine, but I'd prefer to turn it off in both notebooks and ipython sessions at the terminal.]
#minrk's answer is the meat and bones of the fix, but you'll need to wrap it in an initialization callback, at least with IPython-3.1.0. In your custom.js:
require(['base/js/namespace', 'base/js/events'], function(IPython, events) {
events.on('app_initialized.NotebookApp', function() {
IPython.CodeCell.options_default.cm_config.autoCloseBrackets = false;
});
});
Thanks #Mike for your comment about IPython's RequireJS dependency loading and the pointer to a better formulation at IPython/Jupyter Installing Extensions.
Edit for Jupyter 4.0.x:
The current IPython notebook implementation, Jupyter 4.0.0, revamped JS customizations. It now uses ~/.jupyter/custom/custom.js by default, and you'll need to replace that whole require(... events.on(...)) snippet with just the following in global scope:
IPython.CodeCell.options_default.cm_config.autoCloseBrackets = false;
Likewise, if you want to use jQuery to manipulate anything, just use the jQuery global directly. For example, I like to hide the fixed header by default, which gives me another 40px of space for my code, which I find a bit more valuable than looking at the Jupyter logo all the time:
jQuery('#header-container').hide();
Edit for Jupyter ≥ 4.0.6 (but < Jupyter Lab):
If the custom.js solution above doesn't work, try adding the following to your ~/.jupyter/nbconfig/notebook.json:
{
"CodeCell": {
"cm_config": {
"autoCloseBrackets": false
}
}
}
The notebook behavior is the result of the CodeMirror autoCloseBrackets plugin. You can turn this off by editing (create it with ipython profile create if you haven't already) ~/.ipython/profile_default/static/custom/custom.js and adding:
if (IPython.CodeCell) {
IPython.CodeCell.options_default.cm_config.autoCloseBrackets = false;
}
As for the terminal, I don't see the parenthesis behavior you describe. Do you perhaps have a PYTHONSTARTUP defined? IPython executes this file by default, which you can disable by adding to ~/.ipython/profile_default/ipython_config.py:
c.InteractiveShellApp.exec_PYTHONSTARTUP = False
If you want to do it just from python:
from notebook.services.config import ConfigManager
c = ConfigManager()
c.update('notebook', {"CodeCell": {"cm_config": {"autoCloseBrackets": False}}})
This is what works for me in Jupyter 4.0.6:
require(['notebook/js/codecell'], function (codecell) {
codecell.CodeCell.options_default.cm_config.autoCloseBrackets = false;
})
in ~/.jupyter/custom/custom.js.
BTW, If you additionally want to switch off the syntax higlighting of matching parentheses:
codecell.CodeCell.options_default.cm_config.matchBrackets = false;
In the JupyterLab Notebook you can turn off the autoClosingBrackets plugin in the settings menu. Go to Settings --> Advanced Settings Editor and add the following in the User Overrides section:
{
"codeCellConfig": {
"autoClosingBrackets": false
}
}
Screenshot
This worked with JupyterLab 0.32.1 and jupyter_core 4.4.0
The above suggestions didn't worked for me in Jupyter 4.3.0 with Jupyter Notebook 5.0.0
I found that I needed to create a file called ~/.jupyter/custom/custom.js with the following contents:
var cell = Jupyter.notebook.get_selected_cell();
var patch = {
CodeCell: {
cm_config: {
autoCloseBrackets: false,
}
}
}
cell.config.update(patch);
Note that the directory ~/.juypter/custom didn't exist before I did this.
This was hacked together from suggestions in v5.0 docs, and for future readers these are the latest
For Jupyter Notebook 5.1 use the same thing as for 4.2, i.e. put the following snippet into ~/.jupyter/custom/custom.js:
require(['notebook/js/codecell'], function (codecell) {
codecell.CodeCell.options_default.cm_config.autoCloseBrackets = false;
})
I found it was not mentioned in other answers. In my case(OS X, Jupyter 4.2.0), custom.js is located in
~/anaconda/lib/python3.5/site-packages/notebook/static/custom/custom.js
I think it may help somebody like me.
We can do that from jupyter console, try it.