Menu icon Foundation

Designer | Perth

My Posts


My Comments

Lincoln mitchell commented on George's post about 5 years

In the absence of a mixin for topbar, I am currently trying to duplicate the foundation's topbar component.
Not even sure if this will work as no success yet, but seemed plausible.

My approach is to:
1. Duplicate the components scss, js files and part of the _settings file and anything else I can find.
2. Replacing all the duplicated code with "myTopbar" including any variable, class names, obj, file names and anything else I can find.

Feels like I am going a little over the top. But in saying that this approach would give me the ultimate control, as mixins provided only allow for some editing.

Can anyone confirm that this approach is correct and will work. And maybe give me a heads up on what needs to be done as I am kinda guessing here.

Lincoln mitchell commented on George's post about 5 years

On occasion when the mixin is not available (say the topbar), is it possible to create my own? How complex would that be and whats involved? Would you just be looking at the SASS file and modelling a mixin on that or am I missing something here?

If its possible/advisable, then is there any docs on how to go about this?

Lincoln mitchell commented on Jon Pedlow's post about 5 years

Having the same issue but have committed to off-canvas.
So, any way of making this work with off-canvas?

Lincoln mitchell commented on Lincoln mitchell's post about 5 years

Viewport-resizer looks cool - have added it to my toolkit. And agree Edge is buggy.

Would love to find a way to auto upload to staging site.

Lincoln mitchell commented on Clement's post about 5 years

Thx Rafi

Lincoln mitchell commented on Clement's post about 5 years

I have the same issue on my iPhone.
Rymasz's solution worked. But I found that simply having the href attribute with no value worked fine.
href="".
Interestingly, the basic example pasted below has the href="#" so works fine on my iPhone:

<div class="off-canvas-wrap" data-offcanvas>
  <div class="inner-wrap">

    <a class="left-off-canvas-toggle" href="#" >Menu</a>

    <!-- Off Canvas Menu -->
    <aside class="left-off-canvas-menu">
        <!-- whatever you want goes here -->
        <ul>
          <li><a href="#">Item 1</a></li>
        ...
        </ul>
    </aside>

    <!-- main content goes here -->
    <p>Set in the year 0 F.E. ("Foundation Era"), The Psychohistorians opens on Trantor, the capital of the 12,000-year-old Galactic Empire. Though the empire appears stable and powerful, it is slowly decaying in ways that parallel the decline of the Western Roman Empire. Hari Seldon, a mathematician and psychologist, has developed psychohistory, a new field of science and psychology that equates all possibilities in large societies to mathematics, allowing for the prediction of future events.</p>

  <!-- close the off-canvas menu -->
  <a class="exit-off-canvas"></a>

  </div>
</div>

But...
Another Day, another Foundation Component, another bug!
This is such a major component that simply updating the docs with a href would save others a lot of hassle, and there love for foundation will not be tested so often.
Who updates the docs? Can anyone do this via Github?

Lincoln mitchell commented on Paolo Sax's post about 5 years

Did you wok this one out?

Lincoln mitchell commented on sia khoo's post about 5 years

Yes - using SASS.

Lincoln mitchell commented on sia khoo's post about 5 years

After all that. I updated to Foundation 5.2.2 and it seemed to fix things.
Nevermind it was a good exercise.

Lincoln mitchell commented on Philip Meissner's post about 5 years

Seems 5.2.2 release today makes it harder to see this issue. But its still there.
I placed this in my sass file as a temp fix.
[data-magellan-expedition-clone] { display: none; }

Posts Followed




Following

    No Content

Followers

My Posts

My Comments

You commented on George's post about 5 years

In the absence of a mixin for topbar, I am currently trying to duplicate the foundation's topbar component.
Not even sure if this will work as no success yet, but seemed plausible.

My approach is to:
1. Duplicate the components scss, js files and part of the _settings file and anything else I can find.
2. Replacing all the duplicated code with "myTopbar" including any variable, class names, obj, file names and anything else I can find.

Feels like I am going a little over the top. But in saying that this approach would give me the ultimate control, as mixins provided only allow for some editing.

Can anyone confirm that this approach is correct and will work. And maybe give me a heads up on what needs to be done as I am kinda guessing here.

You commented on George's post about 5 years

On occasion when the mixin is not available (say the topbar), is it possible to create my own? How complex would that be and whats involved? Would you just be looking at the SASS file and modelling a mixin on that or am I missing something here?

If its possible/advisable, then is there any docs on how to go about this?

You commented on Jon Pedlow's post about 5 years

Having the same issue but have committed to off-canvas.
So, any way of making this work with off-canvas?

You commented on Lincoln mitchell's post about 5 years

Viewport-resizer looks cool - have added it to my toolkit. And agree Edge is buggy.

Would love to find a way to auto upload to staging site.

You commented on Clement's post about 5 years

Thx Rafi

You commented on Clement's post about 5 years

I have the same issue on my iPhone.
Rymasz's solution worked. But I found that simply having the href attribute with no value worked fine.
href="".
Interestingly, the basic example pasted below has the href="#" so works fine on my iPhone:

<div class="off-canvas-wrap" data-offcanvas>
  <div class="inner-wrap">

    <a class="left-off-canvas-toggle" href="#" >Menu</a>

    <!-- Off Canvas Menu -->
    <aside class="left-off-canvas-menu">
        <!-- whatever you want goes here -->
        <ul>
          <li><a href="#">Item 1</a></li>
        ...
        </ul>
    </aside>

    <!-- main content goes here -->
    <p>Set in the year 0 F.E. ("Foundation Era"), The Psychohistorians opens on Trantor, the capital of the 12,000-year-old Galactic Empire. Though the empire appears stable and powerful, it is slowly decaying in ways that parallel the decline of the Western Roman Empire. Hari Seldon, a mathematician and psychologist, has developed psychohistory, a new field of science and psychology that equates all possibilities in large societies to mathematics, allowing for the prediction of future events.</p>

  <!-- close the off-canvas menu -->
  <a class="exit-off-canvas"></a>

  </div>
</div>

But...
Another Day, another Foundation Component, another bug!
This is such a major component that simply updating the docs with a href would save others a lot of hassle, and there love for foundation will not be tested so often.
Who updates the docs? Can anyone do this via Github?

You commented on Paolo Sax's post about 5 years

Did you wok this one out?

You commented on sia khoo's post about 5 years

Yes - using SASS.

You commented on sia khoo's post about 5 years

After all that. I updated to Foundation 5.2.2 and it seemed to fix things.
Nevermind it was a good exercise.

You commented on Philip Meissner's post about 5 years

Seems 5.2.2 release today makes it harder to see this issue. But its still there.
I placed this in my sass file as a temp fix.
[data-magellan-expedition-clone] { display: none; }

Posts Followed

Following

  • No Content

Followers

  • No Content