Freeway 7 has landed

Hi Thomas — does this mean I can still express padding in pixels, even though the box width is a percentage?

I’ve just applied this to the outer-most box, and applied a 20px padding value instead of previous percentages, but the boxes don’t scale correctly as the browser window narrows.

Assumptions:

That the box-sizing attribute cascades to contained boxes.

That it’s applied to the

This is all still relatively new to me, despite using Backdraft for a while.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You can do this if your elements are styled with the box-sizing: border-box extra CSS. There’s an Action for this, but it’s not yet ready for FW7 (it is actively broken there). You can add the CSS to the elements manually (and I recommend my PrefixFree Action if you do, so you don’t have to write out all the various vendor prefixes long-hand).

Walter

On Jul 31, 2014, at 9:44 AM, Ian Halstead wrote:

Hi Thomas — does this mean I can still express padding in pixels, even though the box width is a percentage?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I was wondering where the Box-sizing action had gone to — it’s used in Backdraft as I would expect, now that I’ve seen it’s purpose. Another click moment.

Thanks Walter.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you’re Backdraft user, I can just recommend having a quick look into the lounge. You should have a voucher for one free week (if you haven’t already done). I think I even spent some words on box-sizing, which is IMO one of the most fundamental knowledge if it comes to dynamic widths and heights.

I furthermore wish, that Freeway’s workspace would follow border-box rather than box.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

All now working. This method screws up the page view in Freeway, as is assumes the weird content-box method of determining box size is still in operation. Small price to pay until the action is available.

I did look at your tutorials Thomas, but ran out of time before I managed to complete them. I’ll save some pennies and take another look at some point.

Cheers,

Ian


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Maybe a daft question.

Is it possible to use the responsiveness in FW7 and Backdraft? My concern about the FW method is that images have to be ‘pass through’ - so they all have to be the correct size that is to go on the page. The beauty with Backdraft was that you just treat it as a normal picture box and so can change size of image within the box.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

As far as I know you can, but the issues with images will be the same (if you use the responsive features in Freeway). The problem is that regular images can only be repositioned between breakpoints and not resized. As soon as you resize them they’ll be resized in all others.

Joe

On 31 Jul 2014, at 16:51, Noel Sergeant email@hidden wrote:

Maybe a daft question.

Is it possible to use the responsiveness in FW7 and Backdraft? My concern about the FW method is that images have to be ‘pass through’ - so they all have to be the correct size that is to go on the page. The beauty with Backdraft was that you just treat it as a normal picture box and so can change size of image within the box.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
More


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Noel,

Try this: http://calebgrove.com/articles/flexible-width-images

That’s the same method I use for Backdraft, and should work fine in FW7.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Just be aware that you won’t be able to resize the image at your breakpoints without them being resized at all other breakpoints (not just the lower ones). You’ll need to work with the image at its full size in the smaller breakpoints (which may or may not be workable, it depends on your design).

Joe

On 1 Aug 2014, at 14:35, Caleb Grove email@hidden wrote:

Noel,

Try this: http://calebgrove.com/articles/flexible-width-images

That’s the same method I use for Backdraft, and should work fine in FW7.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 1 Aug 2014, at 14:49, Joe Billings email@hidden wrote:

Just be aware that you won’t be able to resize the image at your breakpoints without them being resized at all other breakpoints (not just the lower ones). You’ll need to work with the image at its full size in the smaller breakpoints (which may or may not be workable, it depends on your design).

This is all while designing in Freeway, in case that wasn’t clear.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I just tested this, and yes, the style was properly cordoned off in a breakpoint @media container when I added it at a different view than the default. Looks like you could have entirely separate Extended attributes for each layer of the cake. You would need to manually duplicate these in each relevant breakpoint, though. Unlike the other styles, they don’t “cascade” down to the lower sizes automatically. That’s actually a good thing, though.

Walter

On Aug 1, 2014, at 11:32 AM, Ernie Simpson wrote:

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Any styles applied in the Extended dialog should cascade down as normal. To not do that the style would need to be reset in the next breakpoint down. We use this feature on the Softpress site to change the font size of text within an item at a particular breakpoint.

Joe

On 1 Aug 2014, at 16:37, Walter Lee Davis email@hidden wrote:

I just tested this, and yes, the style was properly cordoned off in a breakpoint @media container when I added it at a different view than the default. Looks like you could have entirely separate Extended attributes for each layer of the cake. You would need to manually duplicate these in each relevant breakpoint, though. Unlike the other styles, they don’t “cascade” down to the lower sizes automatically. That’s actually a good thing, though.

Walter

On Aug 1, 2014, at 11:32 AM, Ernie Simpson wrote:

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Try these steps, Joe, let me know what you get.

  1. New blank page, HTML5.
  2. Draw an HTML box somewhere on the page.
  3. Move to the iPad breakpoint, and open Item/Extended.
  4. Add something to the style tab, I chose display:inline-block
  5. Preview in your text editor.

The override only appears within the max-width: 768px block, not in any other part of the CSS.

Walter

On Aug 1, 2014, at 11:46 AM, Joe Billings wrote:

Any styles applied in the Extended dialog should cascade down as normal. To not do that the style would need to be reset in the next breakpoint down. We use this feature on the Softpress site to change the font size of text within an item at a particular breakpoint.

Joe

On 1 Aug 2014, at 16:37, Walter Lee Davis email@hidden wrote:

I just tested this, and yes, the style was properly cordoned off in a breakpoint @media container when I added it at a different view than the default. Looks like you could have entirely separate Extended attributes for each layer of the cake. You would need to manually duplicate these in each relevant breakpoint, though. Unlike the other styles, they don’t “cascade” down to the lower sizes automatically. That’s actually a good thing, though.

Walter

On Aug 1, 2014, at 11:32 AM, Ernie Simpson wrote:

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yep, that’s correct. That means you’ll see that at all sizes below 768px unless you override it with something else at a smaller breakpoint. You don’t have to explicitly declare the same property at the smaller breakpoints since they’re all below 768.

Joe

On 1 Aug 2014, at 16:50, Walter Lee Davis email@hidden wrote:

Try these steps, Joe, let me know what you get.

  1. New blank page, HTML5.
  2. Draw an HTML box somewhere on the page.
  3. Move to the iPad breakpoint, and open Item/Extended.
  4. Add something to the style tab, I chose display:inline-block
  5. Preview in your text editor.

The override only appears within the max-width: 768px block, not in any other part of the CSS.

Walter

On Aug 1, 2014, at 11:46 AM, Joe Billings wrote:

Any styles applied in the Extended dialog should cascade down as normal. To not do that the style would need to be reset in the next breakpoint down. We use this feature on the Softpress site to change the font size of text within an item at a particular breakpoint.

Joe

On 1 Aug 2014, at 16:37, Walter Lee Davis email@hidden wrote:

I just tested this, and yes, the style was properly cordoned off in a breakpoint @media container when I added it at a different view than the default. Looks like you could have entirely separate Extended attributes for each layer of the cake. You would need to manually duplicate these in each relevant breakpoint, though. Unlike the other styles, they don’t “cascade” down to the lower sizes automatically. That’s actually a good thing, though.

Walter

On Aug 1, 2014, at 11:32 AM, Ernie Simpson wrote:

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Aha. Got it.

Walter

On Aug 1, 2014, at 11:54 AM, Joe Billings wrote:

Yep, that’s correct. That means you’ll see that at all sizes below 768px unless you override it with something else at a smaller breakpoint. You don’t have to explicitly declare the same property at the smaller breakpoints since they’re all below 768.

Joe

On 1 Aug 2014, at 16:50, Walter Lee Davis email@hidden wrote:

Try these steps, Joe, let me know what you get.

  1. New blank page, HTML5.
  2. Draw an HTML box somewhere on the page.
  3. Move to the iPad breakpoint, and open Item/Extended.
  4. Add something to the style tab, I chose display:inline-block
  5. Preview in your text editor.

The override only appears within the max-width: 768px block, not in any other part of the CSS.

Walter

On Aug 1, 2014, at 11:46 AM, Joe Billings wrote:

Any styles applied in the Extended dialog should cascade down as normal. To not do that the style would need to be reset in the next breakpoint down. We use this feature on the Softpress site to change the font size of text within an item at a particular breakpoint.

Joe

On 1 Aug 2014, at 16:37, Walter Lee Davis email@hidden wrote:

I just tested this, and yes, the style was properly cordoned off in a breakpoint @media container when I added it at a different view than the default. Looks like you could have entirely separate Extended attributes for each layer of the cake. You would need to manually duplicate these in each relevant breakpoint, though. Unlike the other styles, they don’t “cascade” down to the lower sizes automatically. That’s actually a good thing, though.

Walter

On Aug 1, 2014, at 11:32 AM, Ernie Simpson wrote:

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You need to get on to your MP, it’s the UK government that’s is charging the extra. :wink:

David Owen

On 30 Jul 2014, at 09:26, “Gordon Low” email@hidden wrote:

it would be very disappointing if British-based Softpress were charging their British-based customers 20%


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walter, surely not, did you just learn something I already knew? :wink:

David Owen

On 1 Aug 2014, at 17:04, Walter Lee Davis email@hidden wrote:

Aha. Got it.

Walter

On Aug 1, 2014, at 11:54 AM, Joe Billings wrote:

Yep, that’s correct. That means you’ll see that at all sizes below 768px unless you override it with something else at a smaller breakpoint. You don’t have to explicitly declare the same property at the smaller breakpoints since they’re all below 768.

Joe

On 1 Aug 2014, at 16:50, Walter Lee Davis email@hidden wrote:

Try these steps, Joe, let me know what you get.

  1. New blank page, HTML5.
  2. Draw an HTML box somewhere on the page.
  3. Move to the iPad breakpoint, and open Item/Extended.
  4. Add something to the style tab, I chose display:inline-block
  5. Preview in your text editor.

The override only appears within the max-width: 768px block, not in any other part of the CSS.

Walter

On Aug 1, 2014, at 11:46 AM, Joe Billings wrote:

Any styles applied in the Extended dialog should cascade down as normal. To not do that the style would need to be reset in the next breakpoint down. We use this feature on the Softpress site to change the font size of text within an item at a particular breakpoint.

Joe

On 1 Aug 2014, at 16:37, Walter Lee Davis email@hidden wrote:

I just tested this, and yes, the style was properly cordoned off in a breakpoint @media container when I added it at a different view than the default. Looks like you could have entirely separate Extended attributes for each layer of the cake. You would need to manually duplicate these in each relevant breakpoint, though. Unlike the other styles, they don’t “cascade” down to the lower sizes automatically. That’s actually a good thing, though.

Walter

On Aug 1, 2014, at 11:32 AM, Ernie Simpson wrote:

I suppose it will be interesting to know if styles or extended styles can
be affixed to specific breakpoints. Such behavior could be a lifesaver for
this new responsive layout paradigm.


Ernie Simpson

On Fri, Aug 1, 2014 at 9:16 AM, Joe Billings email@hidden wrote:

As far as I know you can, but the issues with images will be the same (if
you use the responsive features in Freeway). The problem is that regular
images can only be repositioned between breakpoints and not resized. As
soon as you resize them they’ll be resized in all others.

Joe


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Today I did the upgrade. I opened a copy of my inline design in 7 but I can not understand how I can get things to work properly.

I deleted all of the CSS which I needed in 6 to let the responsiveness work. But what about my inline construction? Do I have to change the pagewidth according to the different breakpoints? If I do this for the iPad screen, then when previewed in the browser on my Mac, the appearance on that bigger screen is changed too!
Do I have to make different designs for each breakpoint? With pagesizes for each breakpoint, and then rearange my inline boxes?
What it a good procedure in order to change my existing design?? Must say that now it seems to me that getting things responsive is now even harder to do than the relative easy way I did it in 6 with my inline construction and additional CSS.
I tried the whole afternoon, but still no results haha! What am I doing wrong in 7? Or should I leave the inline construction…


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ahmm - the extended stuff I still have to figure out (and am not convinced of the cascading down) but the biggest lifesaver is described with four words:

###Freeway-workspace: border-box

Please towers, don’t ignore me (as with the min-width for breakpoints above default) and tell me what you think.

It’s simply weird to adjust a 98.07% wide DIV to 96.73% just to make a basically 100% wide box (extended dialogue) fit into my artwork.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options