|
v1nce posted:help Holy poo poo thank you. I'm unexpectedly away from home base for the night but I'm going to be making most of these changes tomorrow, and if you're around maybe you can review them. I'll reply with a point by point when I get home. No, I don't use an IDE I just have sublime text (which does have some tag/bracket error highlighting) and SASS. ps: I hate that booking modal too, but the guy's business is based on the booking software that provides that function. I messaged them and while they don't have any improvements coming in the near future, but will eventually. Sucks cause both livery sites I linked (and another upcoming client) use ridebits.
|
#
?
Feb 7, 2016 01:54
|
|
|
|
| # ? May 15, 2024 08:32 |
|
|
Kings Of Calabria posted:Ok, here's four current sites I'm working on... I didn't look at the code but design-wise these look way better than most of the sites I end up working on 
|
|
#
?
Feb 7, 2016 11:10
|
|
|
nvm
ufarn fucked around with this message at 15:56 on Feb 9, 2016 |
|
#
?
Feb 7, 2016 22:29
|
|
|
Speaking of Font Awesome -- I've never used them, but drat if it doesn't look like they at least have a ton of good icons. Except is it actually a trap, because the people behind it doesn't really seem to know what they're doing? https://fortawesome.github.io/Font-Awesome/examples/ -- look at these spinners And this bug about them: https://github.com/FortAwesome/Font-Awesome/issues/671  Oh yeah, the spin effect rails your CPU on Mac
|
|
#
?
Feb 8, 2016 16:14
|
|
|
Data Graham posted:Speaking of Font Awesome -- I've never used them, but drat if it doesn't look like they at least have a ton of good icons. Except is it actually a trap, because the people behind it doesn't really seem to know what they're doing? I develop on a Mac and use Font Awesome all the time. Never really had an issue with the spin class so I guess YMMV. The only thing I get annoyed about is their constant push to their paid font icon set.
|
|
#
?
Feb 8, 2016 16:36
|
|
|
Data Graham posted:Speaking of Font Awesome -- I've never used them, but drat if it doesn't look like they at least have a ton of good icons. Except is it actually a trap, because the people behind it doesn't really seem to know what they're doing?
|
|
#
?
Feb 8, 2016 17:16
|
|
|
I mean I'm on a retina Mac too, and also just checked it on an iPhone, and the spinners are wobbling around like they're drunk. I'm sure it's not just me  E: at least the CPU railing was only because I had the devtools open. e2: confirmed on Safari, Chrome, and Firefox Data Graham fucked around with this message at 22:36 on Feb 8, 2016 |
|
#
?
Feb 8, 2016 22:15
|
|
|
Data Graham posted:I mean I'm on a retina Mac too, and also just checked it on an iPhone, and the spinners are wobbling around like they're drunk. I'm sure it's not just me I don't think the font/CSS spinners look great when scaled up, but they look fine and perform well enough otherwise. The fa-pulse class helps the wobbling. I like font awesome because I'm lazy. Custom designed SVG animations are 
|
|
#
?
Feb 8, 2016 23:19
|
|
|
And this is why GIFs will never die. (Well, that and cats + cucumbers)
|
|
#
?
Feb 8, 2016 23:25
|
|
|
Data Graham posted:(Well, that and cats + cucumbers) 
|
|
#
?
Feb 8, 2016 23:34
|
|
|
https://www.youtube.com/watch?v=_BRp7ezUqbI
|
|
#
?
Feb 9, 2016 00:09
|
|
|
Thank you, I completely forgot about that! Back when I first saw it, I tried it on my two cats. They didn't react that way at all. It was more like 
|
|
#
?
Feb 9, 2016 00:17
|
|
|
Data Graham posted:I mean I'm on a retina Mac too, and also just checked it on an iPhone, and the spinners are wobbling around like they're drunk. I'm sure it's not just me I never noticed that before. Interesting.
|
|
#
?
Feb 9, 2016 05:13
|
|
|
spacebard posted:I don't think the font/CSS spinners look great when scaled up, but they look fine and perform well enough otherwise. The fa-pulse class helps the wobbling. also some very popular browsers don't scale them (SVGs) very well last I checked 
|
|
#
?
Feb 9, 2016 15:35
|
|
|
Croc Monster posted:Thank you, I completely forgot about that! You know they do that because they think it's a snake and you're giving them PTSD.
|
|
#
?
Feb 9, 2016 16:39
|
|
|
What are everyone's thoughts on CSS variables? They're shipping with Chrome 49 (and have been in Firefox for a while). Here's a good article about them. At first I assumed they'd be nothing more than SCSS variables in the browser (which is fine by me), but they seem to add some pretty good stuff, like being able to define variables inside media queries.
|
|
#
?
Feb 9, 2016 17:55
|
|
|
The syntax is pretty awful, but it's also confined in a way that will force a more universal style, which will be a godsend for maintainability and collaboration, so I'm sort of okay with it, especially in the age of macros and autocomplete.
|
|
#
?
Feb 9, 2016 18:24
|
|
|
My first thought was "too little, too late", with SASS etc. already having adequately addressed them. But then I read that link, and realised that having them available to modify at runtime actually makes them very useful. It's going to be annoying having to provide and manage fallbacks during their period of adoption, however.
|
|
#
?
Feb 9, 2016 19:25
|
|
|
Those look like they're going to suck to debug
|
|
#
?
Feb 9, 2016 19:36
|
|
|
What's the consensus on implementing swap on an SSD-based VPS? While doing some research into increasing the amount of swap on our server hosting Wordpress I came across this warning: Digital Ocean posted:Although swap is generally recommended for systems utilizing traditional spinning hard drives, using swap with SSDs can cause issues with hardware degradation over time. Due to this consideration, we do not recommend enabling swap on DigitalOcean or any other provider that utilizes SSD storage. Doing so can impact the reliability of the underlying hardware for you and your neighbors.
|
|
#
?
Feb 9, 2016 23:32
|
|
|
When you start talking about memory, hardware and swap you really need to know a lot about an application, and sometimes the issues can be very specific to your particular case. My high-level recommendations would be: Avoid swap space by ensuring your application has a reasonable memory cap. If you exceed the cap you need to figure out how to batch or patch the memory leak. When you hit swap space or garbage collection is needed you'll always see a performance hit. Some languages suffer worse than others. If you think your app is making GBS threads the bed because it needs more ram, give it more ram and see if that makes a difference. This could be as simple as running a local VM with 4gb rather than 2gb of ram, or upping a larger DigitalOcean box for testing purposes. If you see no change, then it's not ram. The fact you're using swap-space at all means the SSD in DigitalOcean is going to get some write hits when you start overflowing your ram, so their warning doesn't make a world of sense. If you reach 256mb into swap with a 512mb or 1gb alloc of swap space, that's still 256mb of writes on an SSD, no? I'd personally put that in the "that's your problem not mine" basket, although I'd still recommended the other two options above to reduce the amount of times your application/server has to hit swap space at all. Leshy posted:My first thought was "too little, too late", with SASS etc. already having adequately addressed them. But then I read that link, and realised that having them available to modify at runtime actually makes them very useful. As a business, this is why we won't even look at them until they're supported by all major browsers. We don't do enough "snazzy" stuff to care about runtime variables in CSS, and we've already worked around all our problems with SASS and JavaScript. They almost would have done better to implement support for SASS at runtime or something. It's a nice evolution, but I'm not getting out the party-poppers.
|
|
#
?
Feb 9, 2016 23:56
|
|
|
Karthe posted:What's the consensus on implementing swap on an SSD-based VPS? While doing some research into increasing the amount of swap on our server hosting Wordpress I came across this warning: This question would be a much better fit for somewhere else...maybe the Linux thread.
|
|
#
?
Feb 10, 2016 00:32
|
|
|
Thermopyle posted:This question would be a much better fit for somewhere else...maybe the Linux thread. 
|
|
#
?
Feb 10, 2016 00:33
|
|
|
Cross-posting from the Modern Frontend Development thread as this thread seems much more active. Goons who are familiar with Bootstrap, I need your help. I am trying to create a form and am having a weird alignment issue on the 2nd line as seen here:  And here is the code for the form section. http://pastebin.com/DQvUyPib Now you may notice on the misaligned row I have 2 cols for the first part and 9 for the second, only giving me 11 total, which would explain the misalignment. Here is the part that is bothering me. If I increase the 2nd div to 10 columns it goes to the next line instead of being inline. Any insight or help would be appreciated as I am completely new to bootstrap and doing this for a course. edit: I recreated the whole form from scratch and it looks like everything is working now. ModeSix fucked around with this message at 01:30 on Feb 10, 2016 |
|
#
?
Feb 10, 2016 00:55
|
|
|
Facebook Debugger posted:og:image could not be downloaded or is too small Provided og:image could not be downloaded or is not big enough. Please use an image that's at least 200x200px and is accessible from Facebook. Holy poo poo when are Facebook going to fix this? The image I've specified is accessible and is 600x600. I've included image size meta tags as well. The scrape information even shows that it is reading the og:image tag correctly and there are no other errors/warnings. Just use the goddamn image! It's right there! 
|
|
#
?
Feb 10, 2016 18:19
|
|
|
I need to open up my Rails app to be used via an API. How should I do the authentication? Here's my current strategy: * User gets their private key - for now they will log in via the website, view their profile and grab their key. * User sends that key along with every request using HTTPS and TLS to the API That's it. Will this get me laughed at?
|
|
#
?
Feb 10, 2016 22:13
|
|
|
Hi again, I asked for some reviews on Saturday (with the four example sites). Very grateful for the help, it gave me a kick in the butt to finally learn Gulp... it took me all day to figure it out (terrible at terminal stuff except for sass --watch) but now I have htmllint and csslint in gulp so I have something to tell me when I'm not using things correctly. It might have been better to take a back to basics course and avoid these errors in the first place, but I'm low on time and this is a good way to always have good practices on my mind. It can't help me with using better class names, but I'm on board with that and will do so when I start something new. I'm glad you guys pointed it out. Also, v1nce I took 99% of your design advice, thanks again.
|
|
#
?
Feb 10, 2016 23:27
|
|
|
KoRMaK posted:I need to open up my Rails app to be used via an API. How should I do the authentication? Depending on your use case, you might want to look at changing that "generic key" solution to something like OAuth2 in the next phase - there's probably some libraries already which can help you integrate that quickly and cleanly. Authorization keys (access tokens in OAuth2) are normally short-lived tokens because you want to try and reduce the chance of things like man-in-the-middle attacks gaining knowledge of the key and then being able to perform unauthorised actions on the API. Using a permanent token is hazardous because there's no expiry, so if the key becomes breached it will remain breached until the key is invalidated manually. This risk increases with age as you'll have both more accounts and allow an attacker time to crack any encryption which protects the key. Admittedly, attacks are unlikely, but this doesn't meant your solution to the problem should be lovely. This is the API version of MD5 vs Bcrypt. Plus it's a lot easier when everyone just follows the proven OAuth2 standard; you know what to expect as a user when you try to authenticate with it. Kings Of Calabria posted:htmllint and csslint in gulp
|
|
#
?
Feb 10, 2016 23:35
|
|
|
[on a phone with a lovely connection, so can't check the live link, but assuming the following:] I get in this case the markup might have been incorrect, but you need to be careful with input groups, it's really easy to gently caress the alignment up. If you look at the layout that went wrong, the extra space matches the size of the block stuck to side of the input groups. It'll be escaping out of the grid container by the same amount on the right as well. I can't remember the various exact HTML structure & combinations of BS classes that causes this, but input groups are susceptible, it gets pretty annoying. Wrapping each input group in another element works generally, or specifying width (which is almost never desirable, but hey..). NB I'm getting that behaviour on a site i'm doing atm & it's driving me nuts (BS4, with flex turned on, which in theory should have fixed it), but only in Firefox and IE, Webkit-based browsers fine. RobertKerans fucked around with this message at 09:22 on Feb 11, 2016 |
|
#
?
Feb 11, 2016 09:09
|
|
|
RobertKerans posted:[on a phone with a lovely connection, so can't check the live link, but assuming the following:] I get in this case the markup might have been incorrect, but you need to be careful with input groups, it's really easy to gently caress the alignment up. If you look at the layout that went wrong, the extra space matches the size of the block stuck to side of the input groups. It'll be escaping out of the grid container by the same amount on the right as well. I can't remember the various exact HTML structure & combinations of BS classes that causes this, but input groups are susceptible, it gets pretty annoying. Wrapping each input group in another element works generally, or specifying width (which is almost never desirable, but hey..). That's exactly what it ended up being, improper nesting. I threw away what I had and went through meticulously step by step recreating the form, making sure things were nested properly, and it worked perfectly fine. ModeSix fucked around with this message at 20:23 on Feb 11, 2016 |
|
#
?
Feb 11, 2016 15:13
|
|
|
Is there anything 'wrong' with this simple menu code? Edge on a touch device (Surface) won't open the menu, I think it figures it's always mouseout since it doesn't have a cursor? No other browsers, including IE have that bug though. I want to make sure it's an issue with Edge and not the code.
|
|
#
?
Feb 11, 2016 16:37
|
|
|
The Merkinman posted:Is there anything 'wrong' with this simple menu code? You might have to listen for touchstart as well as click.
|
|
#
?
Feb 11, 2016 16:50
|
|
|
Munkeymon posted:You might have to listen for touchstart as well as click. I updated the fiddle with readouts, the issue is that it immediately closes. The open does fire, but the close fires too.
|
|
#
?
Feb 11, 2016 16:56
|
|
|
The Merkinman posted:I updated the fiddle with readouts, the issue is that it immediately closes. The open does fire, but the close fires too. Oh, right, if you do both you have to prevent default, stop immediate propagation and return false as well if you handle both touchstart and click, at least on iOS. I'm just looking at an old workaround I wrote for iOS < 9, so I'm not sure how much applies to Edge. IIRC, the problem was that you didn't get a click event unless you also did something with touchstart? Sorry - I didn't leave enough information in the comments.
|
|
#
?
Feb 11, 2016 17:24
|
|
|
Say I have a sidebar with a nav menu at the top and a phone number at the bottom. On mobile I want the nav menu to move above the main content, but the phone number to move below. How would you structure the code for that? Is there a standard way to like break a sidebar in half and move it above and below the main content? The only solutions I can think of seem super complicated. The project I need this for uses the skeleton grid http://getskeleton.com/
|
|
#
?
Feb 11, 2016 20:10
|
|
|
From what you're saying my immediate reaction would be; Don't over complicate it, just have two separate nav bars and display one for desktop and one for mobile. If you do that you can do it with really basic CSS positions (I say this because I don't know skeleton).
|
|
#
?
Feb 11, 2016 23:56
|
|
|
fuf posted:Say I have a sidebar with a nav menu at the top and a phone number at the bottom. On mobile I want the nav menu to move above the main content, but the phone number to move below. How would you structure the code for that? Is there a standard way to like break a sidebar in half and move it above and below the main content? The only solutions I can think of seem super complicated. Flexbox, and change the order of things maybe?
|
|
#
?
Feb 12, 2016 13:22
|
|
|
v1nce posted:If you do that you can do it with really basic CSS positions (I say this because I don't know skeleton). Positioning would be how I'd do it even with a grid system. I doubt any grids could handle that unless the markup is super weird. http://codepen.io/anon/pen/Gozjmq A quick example of one way of doing this. tl;dr – Put everything in a relatively positioned container. At your breakpoint, add some extra bottom padding to the container (to make space for the phone number) and absolutely position the phone number (not the sidebar) to the bottom.
|
|
#
?
Feb 12, 2016 17:00
|
|
|
On the earlier topic of CSS variables, I actually have a site that is the perfect use case for them, but I am not quite sure on the best method to implement them with a proper fallback. It is a site with multiple sections, which each have their own accent colour; this affects the font colour of some elements, the background colour of some others, as well as a few border colours here and there. It is currently set up so that the PHP template inserts a <link> tag to a small secondary stylesheet that sets the appropriate colours for that specific section. Works perfectly fine, but it does add several requests and a downloads (albeit very small) when navigating through various sections, and it requires the maintenance of several of these stylesheets in addition to the main one. With CSS variables, I can simply have the PHP template insert "<style> :root{ --accent-color: [section-colour];} </style>" into the page to replace all of that, which is of course a very enticing prospect. However, as of course wide-spread support of CSS variables is still a while off, I'd like to keep the above method as a fallback for browsers that do not support CSS variables, for the time being. That means I can't rely on the built-in CSS variables fallback. I essentially need to build in a "Do you support CSS variables? If so, here is <style> --accent-color: [blah] </style>. If not, here is <link src='accent-color.css'>." check. The most straightforward way of doing this that I can see, is doing some browser sniffing and checking the useragent for browser version, then presenting the appropriate solution. However, as browser sniffing is it's own  , I could use some input on whether this is a good idea or not or whether there is a better way of approaching this.
|
|
#
?
Feb 14, 2016 20:22
|
|
|
|
| # ? May 15, 2024 08:32 |
|
|
Is it normal for a company to insist that their devs do all of their work in a VM?
|
|
#
?
Feb 15, 2016 02:27
|
|