Is there any way to make paperscript work in Adobe Brackets?
It's my first time using paperjs and the paperscript script doesn't work.
Basically the text inside the script is not run at all.
Not sure what you are asking but I'd like to make a few points in hopes these will help you.
You must write your paperscript inside script tag in your html document, if you try to link it from external .js file it won't work because of CORS.
Brackets live preview feature doesn't support javascript of any kind to my knowledge (haven't used that editor for 6 months so this might be outdated information).
Related
I'm trying to customize a theme for a Magento 2 website (it was purchased), and for the most part I know where most of the .css calls are coming from. However, there is one sub-menu, I cannot find the source css file for the life of me.
Normally I use Chrome's inspection window to identify the css that is generating the colors/details that I'm looking for, and then search the source files for the same .css reference, and then make the modification as needed.
However, as mentioned I'm struggling to find a specific piece of css code, and I'm wondering if there might be a better way to find what I'm looking for?
http://bricss.net/post/33788072565/using-sass-source-maps-in-webkit-inspector - Try this one!
https://developers.google.com/web/tools/chrome-devtools/javascript/source-maps?utm_source=dcc&utm_medium=redirect&utm_campaign=2016q3 - this is how you set up your css source mapping by using default developer tools :)
i have made a webpage and now it is "feature-complete".
As a next step i want to put some style to it.
The project is based on the Play framework and i choose SCSS as my CSS alternative (with an SBT plugin to convert SCSS -> CSS).
Every time i change some CSS i have to reload the page in the browser, which takes a while, see if i like it and keep or revert. Then start over.
This workflow does not seem right to me. How do you style a webpage built with Play (specifically: i use Play templates, so i cannot just copy every piece of HTML into a CSS editor and style everything from there)?
The best way that i found is to change the CSS directly in Chrome, remember the changes and apply them to the source file later on.
Is there a more "automatic" way of doing things? Any nice editors or browser plugins that change the source file directly? What am i missing?
What are other people, using Play framework (or other templating systems) doing?
Thank you!
Maybe you can download an extension that automatically refresh's your page every ... seconds. On this way you only have to "Alt-tab" between your code and your page.
BTW: I couldn't comment this, I need 50 reputation. Otherwise I wouldn't have commented it because this isn't really an answer but this is just my advice.
I am making a Google Apps Script for Google Docs with a side panel.
I would like to match the style of buttons, scroll bars, etc. that Google Docs has.
FYI, a lot of the CSS seems to have be minified/obfuscated.
scb-button-icon
jfk-star
Where might I find such a thing?
I would have thought Google Apps Script might have provided something like this, since consistency makes the UX better.
If the official source is not available, is an unofficial one available?
EDIT: Sidebar CSS is now freely available, see CSS Package for Add-ons.
For research only, of course:
View Source of the page you wish to research. Copy and...
Paste into a text editor. Remove everything up to and including the <style> tag, and from the </style> tag to the end. Copy and...
Paste into an HTML decoder, to remove the encoding. Now you have all the CSS, it's just badly formatted. Copy and...
Paste into a CSS Formatter, and tidy it up. Optionally, output as a file.
At this point, you've got a CSS file that can be experimentally built into your for-personal-use-only app. Browser inspectors are handy for determining the HTML others have used to produce the UI elements you want to learn from.
Here's my own little experiment, a sidebar in a Google Doc, with an assortment of elements:
Not sure if you'll be able to find the source code, so here is an alternative:
CSS Unminify
This tool will take minified CSS and expand it. This will allow you to at the very least read the CSS and hopefully figure out which rules you need.
If copyright infringement is not an issue then you could simply recreate the design that Google adopt for their buttons. It should be fairly simple with CSS. The font Google + uses is called Roboto and is free to download
I talked to some of the guys at Google and got a alpha version of the CSS.
It does not yet, however, completely support IE or Firefox, and has (very minor) differences, so I accepted Mogsdad's answer.
I often have a problem where I'm working on a dynamic web app with tons of front-end or back-end code and there is a CSS problem that just eludes me despite an hour of scratching my head. I know that StackOverflow could solve it in a second, and I'd like to post it, but I either have to
Make the app public along with steps to reproduce the state, or
Tediously copy out the DOM and assets (CSS) along with the current state.
Neither is very straightforward. Note that the DOM is dynamically generated so "View Source" won't cut it. Similarly, the CSS could be spread out across multiple files and I'd like to just grab it all at once.
Is there an easy way to copy out the DOM and all CSS as a single file so that I can insert it into something like JSFiddle and be on my way?
The quickest way to get all HTML on the page as-is is to paste this in the address bar:
javascript:alert(document.body.outerHTML)
You can also use the console, of course, but the above works even in old IE versions and is easier to copy/paste.
I don't think there's a good way to get the CSS at all, but you could try using a jQuery selector or similar to get the URLs:
$('link[type="text/css"]')
.each(function(x, link){
console.log(link.attributes.href.value)});
And downloading and concatenating the CSS.
I want to make css file from accessible from everywhere (home, office etc) and ready to edit.
and save.
I will do hand coding ,just want syntax highlighting and saving on net facility.
I tried google docs (it's good because i can save online and it has revision history feature too which is useful) but it doesn't have syntax highlighting and also tried http://www.amyeditor.com/ it's same as i want but it save file on our local pc.
and i usually use jsbin.com but i heard it will delete the code if nothing will happen to code in 3 month.
Update:
In nutshell I'm looking for online editor like Dreamweaver source view. with code hosting too.
Update 2
i found it useful but , no facility for saving.
http://marijn.haverbeke.nl/codemirror/csstest.html
https://bespin.mozilla.com/
Bespin is a mozilla project with a lot of potential. I couldn't recommend it more highly.
See following
http://snipplr.com
http://gist.github.com/
See here if you could get any solution.
If you don't like then use a blog with syntaxhighlighter.
Dabblet is pretty impressive !
Saves to github gists. For more info look at the help/about page
You could just use wordpad witch comes with windows, and then you could upload it to a server such as Dropbox. Simples.(Make sure you put .css at the end of the filename).