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 :)
Related
So I am a very new developer (less than a month) with no formal education and I am working on bugfixes with a WebApp (.NET Framework). I was asked to remove a button from one of graphs as it was redundant. So I open dev tools and inspect the element. Go to the html (picture below) and "add" a (style = "Display:none") attribute to the HTML and it does the job exactly as I want it! yay!
Now I need to change the source code... but For the life of me I cannot find anything related to this. I search for the class, ID, and various other attributes in VStudio but nothing. I assume this is because the HTML and/or CSS is spawned from a JS file.
How do I now trace the source code responsible for this? And in general, how does one translate a change made on dev tools to the real code? We use w2ui, plotly, and bootstrap.
I have already tried the sources page on dev tools but the file it referes to is basically empty.
Sorry if this is phrased poorly or a repost, I am really new to all of this but LOVE every second of it.
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.
So using XAMPP, it shows a list of folders and files that are hosted locally on my machine. So far, it shows all of these directories in a simple, plain list. What I'd like to do is to be able to use CSS to style it. This may sound confusing so here's some images explaining what I am trying to accomplish.
to...
It is possible to do this because I downloaded a theme for it a while back, I am having trouble trying to find it again so I was windering, if someone out there knows where it is, it would be much appreciated if you would send me the link :)
Here is a tutorial devoted to customizing directory listings:
http://perishablepress.com/better-default-directory-views-with-htaccess/
It shows exact what actions to perform in order to customize it. So shouldn't be too hard to follow.
Sadly, I'm unable to find the style you provided. So I will update this reply in-case I have.
Here are some other nice directory listing styles:
https://github.com/meodai/mod_autoindex.oh
http://adamwhitcroft.com/apaxy/
https://github.com/search?utf8=%E2%9C%93&q=mod_autoindex&type=Repositories&ref=searchresults
You can use the built-in functionality of Apache’s mod_autoindex module to style and enhance your default directory views.
You can go through this link
It has a very detailed description for changing and customizing the views the way you want them to be.
You can customize the icons as well as the css.
I have a massive CSS file that is applied to several pages. I'm hoping to break it down to a common CSS file and several page-level CSS files, since it is becoming difficult to work with. Unfortunately, it's not easy to tell what exactly is common. I was hoping there was a way to quickly see what lines/selectors were being used on a given page. Does anyone know of a tool that can do this? I don't want to use developer tools and go through the DOM elements one by one. I'd like to look at the CSS file and see unused selectors grayed out or something. Thanks!
You can use, at least in Chrome, the Audits tab in the developer tools. Once you run it, it says you which styles aren't used in the current page.
Testing it on this site:
And for Firefox there an add-on called CSS Usage – might be worth a look too.
I've been looking for the CSS files of the different AjaxControlToolkit controls but i can't find them.
Specifically I'm looking for the Combobox.css file which according to google an ajax site, is located in "AjaxControlToolkit\ComboBox\ComboBox.css", the problem here is that i can't find that folder "AjaxControlToolkit".
When you download the binary, it comes with a sample site which has a combobox folder but there's no CSS in there!
Can someone point me in the right direction here please?
Maybe a direct link where i can find the different CSS for the entire Ajax Library.
Thank you.
You can always browse the Source Code
http://ajaxcontroltoolkit.codeplex.com/SourceControl/BrowseLatest
But I'm not sure what you mean, as there is no such thing, this is up to you, to create your own theme, check Matt examples