I'm using columntoggle mode because the output style is what I need/like. The system adds that row/button with "Columns..." (presumably so that you can pick which columns at run-time...which doesn't seem to work on my droid anyway. I just want to remove it.
Here is a demo: http://jsfiddle.net/ezanker/28tNw/
Basically you can just add the following CSS to hide the button:
.ui-table-columntoggle-btn {
display: none;
}
Related
In my opinion the higlighting of a TODO "flag" in the atom editor is too weak/unobtrusively.
How can I change this? I DON'T wanna list the todos in a sidebar (https://atom.io/packages/todo-show).
Here to compare:
In Vim editor there is very strong highlighting (desired):
In Atom editor:
The main problem is, that atom highlights many other code words in this color...
As GitHub's Atom Editor is built around HTML5 and CSS3 you can very easily change your style sheet, I've done a little recording on how to make this specific change below although you can apply the same principals to any styled element within the editor:
Step by Step
The first thing you will need to do is find an instance of the element you want to style, in this case I created a new, empty, file with the text //TODO: is too subtle.
You now need to find the appropriate selector for the word TODO, simply place your cursor in between the letters of the word TODO and press CtrlAltShiftP or select Editor: Log Cursor Scope from the command palette.
The selectors that apply to that location are listed from the least specific at the top to the most specific at the bottom, in this case you want the most specific selector at the bottom, go ahead and copy that into your clipboard.
Next you need to open your personal stylesheet, you can do this by selecting "Edit" and then "Stylesheet...", you can also choose Application: Open Your Stylesheet from the command palette.
Scroll to the bottom of the Stylesheet and paste in your selector from Step 2, you will need to add a period (full-stop) at the beginning to make this a valid selector.
Go ahead and add your preferred styling such your VIM style preference:
atom-text-editor::shadow .type.class.todo {
background-color: yellow;
color: black;
font-style: normal;
}
Finally save your stylesheet and switch back to your test document to see the resulting changes.
Thanks to zypro for pointing out that my original answer didn't account for the use of the Shadow DOM in recent versions of Atom.
Update: At some point, Atom got rid of the Shadow DOM. I'm using version 1.34.0 which takes the following entry in the above-mentioned stylesheet:
atom-text-editor.editor .syntax--type.syntax--class.syntax--todo {
background-color: yellow;
color: black;
font-style: normal;
}
Also, for Python (and some other languages) you will need to uncheck "Use Tree Sitter Parsers" in the Core settings.
I'm using the :focus state to show content, when the parent element has focus. Like so:
.child { display: none; }
.parent:focus .child { display: block; }
Note that the parent element has tabindex="0" set. Is there a way to get this to work in iOS browsers? I'm asking to see if a CSS-only solution is possible, no javascript please.
I've set up a reduced test case fiddle here: http://jsfiddle.net/E8zCU/
An answer that worked for me for a similar problem is here.
As the poster in that thread said, you just have to add
<body ontouchstart="">
to the top of your html code.
Is there a proper way to have 2 differently styled jquery ui buttons on the same page?
I am able to copy css around for the second button but there are a lot of different !important styles that I keep needing to add a second !important after the first in order to change the style.
for ex:
.ui-state-active {
background:none !important;
background-color:#E1E1E1 !important;
color:#000 !important;
}
I will then have to go and add right after (and it needs to be after
.new-theme.ui-state-active {
background:none !important;
background-color:red !important;
color:#000 !important;
}
the problem is these important styles are all over for each state so I have to mind where they go. Is this normal or is this usually handled a different way?
Are you using an older version of jQuery UI that requires you to use !important to override their styles? Newer version have fixed this: Use of !important in jquery-ui.css should be avoided.
If you can/are using a newer version, try getting rid of !important and instead rely on selector specificity to get your desired results.
I would recommend using jqueryui-speciffic css. Except difficulties with different button stylings, there may be performance problems while rendering larger amounts of buttons.
This resource is relatively old but I found it very valuable while using jqueryui css.
I have a jsfiddle to show what I'm trying to do: http://jsfiddle.net/n9bSC/3/
The jsfiddle works well and does not demonstrate the bug.
In my actual code, the transfer finishes directly below the target (instead of directly at the target).
I've tried removing the float, adding various "position" styles, etc.
Any thoughts on what could be causing the behavior that I've described?
I don't fully understand this, but I think the problem is fixed.
Our CSS had:
body{
position: relative;
}
So I now change that to "inherit" on the page where I'm doing the jquery-ui transfer effect.
Then, I use conditional CSS for only IE7 to do this:
.joyride-tip-guide {
margin-top: -10px;
}
(I'm using Joyride and noticed that changing the body position messed up the Joyride tour step positioning for Internet Explorer 7.)
I realize that there is a meta tag for disabling the auto formatting of a telephone number in iOS but I wondered if its possible in iOS for things like a date or time.
Anyone have any ideas?
There is no meta way at the moment. However there are two tricks to break the detection.
I advise to split the date/time with a harmless HTML element, like a span:
Mon<span></span>day
Another trick is adding a zero-width space:
Mon​day
However this is less stable, for example in the preview text of iOS 6-8, there the zero with space is displayed like a regular space.
Add this tag to your header
<meta name="format-detection" content="date=no">
This isn't possible for dates or addresses. Unfortunately, phone numbers are the only type covered in Apple's documentation:
https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
Or just hide it with css by styling the generated links like
your-element-containg-days a {
color: #000 !important;
text-decoration: none !important;
}
You have to add !important to overrule the generated styling.