Menu icon Foundation

Designer | Rochester Ny

I'm been knee deep in web design/dev

My Posts

No Content

My Comments

Ethan Hackett commented on John's post over 4 years

If it's something you do semi regularly it might be worth creating a grunt flow to copy and rename files. Then run Grunt Handoff or something and it would snag the appropriate folders and files and put them where you want them.

I use something similar grunt-contrib-copy to copy fils from one project to another for deploy and figure it wouldn't take too much to do the same thing for handing it off to a client. Copy over the compiled css, raw and compressed js along with whatever other fils you need leaving behind the SASS elements.

The downside is if they come back to you for more changes you'd be forced to work in the compressed CSS file you exported which would bring with it it's own set of headaches.

Ethan Hackett commented on Peter Gibb's post over 4 years

I'm running into this too. The 1025 view is neither medium nor large size and defaults to mobile view. Example

It's only happening in Chrome and my version is 40

Ethan Hackett commented on Stan's post almost 5 years

I think I'm in the same boat. I have a nearly working version here's what i mean.

  1. We don't want to validate until after post. So no initial live validation.
  2. After post if there are invalid inputs, selects or text areas activate live validation.
 .find('div')
          .off('.abide')
          .on('blur.fndtn.abide change.fndtn.abide', 'input[data-invalid], textarea[data-invalid], select[data-invalid]', function (e) {
            self.validate([this], e);
          })
          .on('keydown.fndtn.abide', 'input[data-invalid], textarea[data-invalid], select[data-invalid]', function (e) {
            if (settings.live_validate === true) {
              clearTimeout(self.timer);
              self.timer = setTimeout(function () {
                self.validate([this], e);
              }.bind(this), settings.timeout);
            }
          });

around line 690 I changed the find() to look for a div which should wrap our inputs, selects and text areas. Then modify the on event to look for elements with the error attribute.

This fixes the issue where find doesn't track down inputs with dynamic data attributes applied after the dom is loaded.

The problem this creates is that after users click submit, live validation only works on inputs with errors. This means if the user went back and modified a previously valid input, they won't see an error message until they post again. It's not a prefect solution but it is a step in the right direction.

Validation Abide shouldn't be as simple as true or false but rather always, after, or never for greater validation control.

Ethan Hackett commented on Raul Santamaria's post almost 5 years

I don't use abide enough to know why or if putting the regex right in patter="" is supposed to work. However I did just create a custom pattern which I defined in my js which seems to do the trick.

 $(document).foundation({
  abide : {
    patterns: {
      letters_and_spaces: /^[\w\-\s]+$/
    }
  }
});

Then for the input use pattern="letters_and_spaces"

I used the regex from here - http://stackoverflow.com/questions/13283470/regex-for-allowing-alphanumeric-and-space

Ethan Hackett commented on Ethan Hackett's post over 5 years

Thanks Rafi. That would be awesome. I'd love to have a couple people try it out and give me some feedback so I could improve it. I'm sure there are some labeling improvements and possible bugs.

Ethan Hackett commented on Ethan Hackett's post over 5 years

Yeah I think the use case is pretty small. It's more my wanting to going the extra step in the off chance that the user is using the site with their browser in a thin view then opens the navigation then while the off canvas is opened makes the window wider. I want it to auto close since the off canvas is a mobile specific feature.

I probably experience it more since I'm working on the site and constantly scaling the window size to test views. Then I keep thinking to myself "why is that off canvas showing, my browser is quite wide."

Ethan Hackett commented on Ethan Hackett's post over 5 years

I envisioned having it stay on the page but collapse. This way if the user wanted to hide the button they could use hide-for-screensize. Maybe the class hide-for-screensize would work for toggling the offscreen. This way, with a combination of hide-for-screensize and close-for-screensize the offcanvas functionality would be available for limited screen sizes.

Ethan Hackett commented on Ethan Hackett's post over 5 years

I resolved some of the primary DNN bugs caused by the two versions of jQuery. The ajax login and content editing still are a little broken.

It pulls in the DNN menu, core elements like login, logo, copyright etc. I'm working on a few variations of content layouts.

See notes and updates via GitHub - https://github.com/Ethanhackett/foundation-5-dnn-skin

Ethan Hackett commented on Andrew Brown's post over 5 years

::Weeps tears of pure joy::
Thanks this just solved my DNN skinning issue.

Ethan Hackett commented on Ethan Hackett's post over 5 years

Since we're starting a new project here at work, I figured it would be a good time to create a super basic DNN Foundation 5 Skin to start with. It's really raw and has some bugs that still need to be worked out. I'd love to collaborate with some other developers. @ethanhackett

I'm creating a dev site to demo the skin and I uploaded it to GitHub in case anyone wants to contribute or download it. https://github.com/Ethanhackett/foundation-5-dnn-skin

Posts Followed

No Content

Following

    No Content

Followers

My Posts

No Content

My Comments

You commented on John's post over 4 years

If it's something you do semi regularly it might be worth creating a grunt flow to copy and rename files. Then run Grunt Handoff or something and it would snag the appropriate folders and files and put them where you want them.

I use something similar grunt-contrib-copy to copy fils from one project to another for deploy and figure it wouldn't take too much to do the same thing for handing it off to a client. Copy over the compiled css, raw and compressed js along with whatever other fils you need leaving behind the SASS elements.

The downside is if they come back to you for more changes you'd be forced to work in the compressed CSS file you exported which would bring with it it's own set of headaches.

You commented on Peter Gibb's post over 4 years

I'm running into this too. The 1025 view is neither medium nor large size and defaults to mobile view. Example

It's only happening in Chrome and my version is 40

You commented on Stan's post almost 5 years

I think I'm in the same boat. I have a nearly working version here's what i mean.

  1. We don't want to validate until after post. So no initial live validation.
  2. After post if there are invalid inputs, selects or text areas activate live validation.
 .find('div')
          .off('.abide')
          .on('blur.fndtn.abide change.fndtn.abide', 'input[data-invalid], textarea[data-invalid], select[data-invalid]', function (e) {
            self.validate([this], e);
          })
          .on('keydown.fndtn.abide', 'input[data-invalid], textarea[data-invalid], select[data-invalid]', function (e) {
            if (settings.live_validate === true) {
              clearTimeout(self.timer);
              self.timer = setTimeout(function () {
                self.validate([this], e);
              }.bind(this), settings.timeout);
            }
          });

around line 690 I changed the find() to look for a div which should wrap our inputs, selects and text areas. Then modify the on event to look for elements with the error attribute.

This fixes the issue where find doesn't track down inputs with dynamic data attributes applied after the dom is loaded.

The problem this creates is that after users click submit, live validation only works on inputs with errors. This means if the user went back and modified a previously valid input, they won't see an error message until they post again. It's not a prefect solution but it is a step in the right direction.

Validation Abide shouldn't be as simple as true or false but rather always, after, or never for greater validation control.

You commented on Raul Santamaria's post almost 5 years

I don't use abide enough to know why or if putting the regex right in patter="" is supposed to work. However I did just create a custom pattern which I defined in my js which seems to do the trick.

 $(document).foundation({
  abide : {
    patterns: {
      letters_and_spaces: /^[\w\-\s]+$/
    }
  }
});

Then for the input use pattern="letters_and_spaces"

I used the regex from here - http://stackoverflow.com/questions/13283470/regex-for-allowing-alphanumeric-and-space

You commented on Ethan Hackett's post over 5 years

Thanks Rafi. That would be awesome. I'd love to have a couple people try it out and give me some feedback so I could improve it. I'm sure there are some labeling improvements and possible bugs.

You commented on Ethan Hackett's post over 5 years

Yeah I think the use case is pretty small. It's more my wanting to going the extra step in the off chance that the user is using the site with their browser in a thin view then opens the navigation then while the off canvas is opened makes the window wider. I want it to auto close since the off canvas is a mobile specific feature.

I probably experience it more since I'm working on the site and constantly scaling the window size to test views. Then I keep thinking to myself "why is that off canvas showing, my browser is quite wide."

You commented on Ethan Hackett's post over 5 years

I envisioned having it stay on the page but collapse. This way if the user wanted to hide the button they could use hide-for-screensize. Maybe the class hide-for-screensize would work for toggling the offscreen. This way, with a combination of hide-for-screensize and close-for-screensize the offcanvas functionality would be available for limited screen sizes.

You commented on Ethan Hackett's post over 5 years

I resolved some of the primary DNN bugs caused by the two versions of jQuery. The ajax login and content editing still are a little broken.

It pulls in the DNN menu, core elements like login, logo, copyright etc. I'm working on a few variations of content layouts.

See notes and updates via GitHub - https://github.com/Ethanhackett/foundation-5-dnn-skin

You commented on Andrew Brown's post over 5 years

::Weeps tears of pure joy::
Thanks this just solved my DNN skinning issue.

You commented on Ethan Hackett's post over 5 years

Since we're starting a new project here at work, I figured it would be a good time to create a super basic DNN Foundation 5 Skin to start with. It's really raw and has some bugs that still need to be worked out. I'd love to collaborate with some other developers. @ethanhackett

I'm creating a dev site to demo the skin and I uploaded it to GitHub in case anyone wants to contribute or download it. https://github.com/Ethanhackett/foundation-5-dnn-skin

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content