Menu icon Foundation

Designer

Jarvis working on About me...

My Posts

  • 2
    Replies
  • alignment of grid

    By Tony Stark

    grid

    Hello i have problem with small, medium, large grid alignment http://hi-post.tk/f5/cus2.html see on above link.. the 123,456 grid is together but 789 is locate at end of line. how to make together all 123,456,789 grid box? thank you

    Last Reply by Tony Stark about 5 years ago



My Comments

Tony Stark commented on Wing-Hou Chan's post about 5 years

HI
Feature request:

Report user--
> So if we report user - he/she can not add new reply and create new thread after reported.
> Also his all post will deleted after 1-2 (suitable) person report the user.

Block IP/Proxy (server side)
> I see some of site who has active firewall shield, which can block every new VPN/Proxy automatically.
> So no one see site if user use proxy.
> Prevent fake user to registration..

Thank YOUU

Tony Stark commented on Oloeg's post about 5 years

Hi Hugo
You can download Custom version of Foundation.]
If you need SASS version of Essential5 then download SASS version of Foundation.
If you want some necessary option in css then Add some comment in foundation.scss file

@import
  "foundation/components/grid", //Grid Require-Necessary
  "foundation/components/reveal" //Reveal Necessary
  /*"foundation/components/accordion"*/; //accordion not necessary so its commented

Tony Stark commented on Oliver S's post about 5 years

You are actually looking for mega menu.
Check here for detail:
http://foundation.zurb.com/forum/posts/232-megamenu

Tony Stark commented on Jonas Marlo Loerken's post about 5 years

Hi
Actually define variable after @include command, so you getting error.
your custom function should be like this:

// $padding - Used to build padding for buttons Default: $button-med or rem-calc(12)
$padding: rem-calc(12);
// Primary color set in settings file. Default: $primary-color.
$bg: orange;
// If true, set to button radius which is $global-radius or explicitly set radius amount in px (ex. $radius:10px). Default:false.
$radius: true;
// We can set $full-width:true to remove side padding extend width. Default:false
$full-width: false;
// We can set $disabled:true to create a disabled transparent button. Default:false
$disabled: false;
// $is-input - <input>'s and <button>'s take on strange padding. We added this to help fix that. Default:false
$is-input: false;


.custom-button-class {
  @include button($padding, $bg, $radius, $full-width, $disabled, $is-input);
}

No any output error:

>>> Change detected at 12:40:45 to: app.scss
identical stylesheets/app.css 

Tony Stark commented on Apple's post about 5 years

@Apple
Working fine
i checked
try in foundation 5.2.1 version

Tony Stark commented on Apple's post about 5 years

HI
Use 5.2.1 version of foundation.min.js into your code
Replace

<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.2.2/js/foundation/foundation.min.js"></script>

with

<script src="http://cdnjs.cloudflare.com/ajax/libs/foundation/5.2.1/js/foundation.min.js"></script>

and add below code before closing body tag

<script>
    $(document).foundation();
</script>

so your code should be look like:::
http://pastebin.com/m5AHpwAM

Tony Stark commented on Vinyl's post about 5 years

Locate below class and chage Red instead your color code

.top-bar-section ul li:hover:not(.has-form) > a {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}
.top-bar-section li.hover > a:not(.button) {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}
.top-bar-section li:not(.has-form) a:hover:not(.button) {
    background: none repeat scroll 0 0 RED;
}
.top-bar-section .dropdown li:hover:not(.has-form) > a:not(.button) {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}
.no-js .top-bar-section ul li:hover > a {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}

This change may be cause problem, so if you have SASS version then open _top-bar.scss file
and locate this class

$topbar-link-bg-hover: RED !default

change color, it will easy to do...

Tony Stark commented on Julius Miller's post about 5 years

HI
Well you are using css version of foundation,
if you want to make your custom styles then i recommend you use SASS version of foundation.
http://foundation.zurb.com/docs/sass.html
Otherwise changing into css will cause more problem on your project.


To change Background of menu

.top-bar-section li:not(.has-form) a:not(.button) {
    background: none repeat scroll 0 0 RED;
    line-height: 55px;
    padding: 0 18.3333px;
}
.top-bar-section .has-form {
    background: none repeat scroll 0 0 RED;
    height: 55px;
    padding: 0 18.3333px;
}

http://s4.postimg.org/ecmz9xpa5/bgg.png

Tony Stark commented on Julius Miller's post about 5 years

HI
You are trying to change color of dropdown menu right...
So open _top-bar.scss file and locate this variable
$topbar-link-bg: $topbar-bg !default;
Change it to $topbar-bg with your color
$topbar-link-bg: #DF8D52 !default;

If you want to change color of dropdown hover and dropdown list...
Dropdown hover:
$topbar-link-bg-hover: #DF8D52 !default; //Hover
Dropdown-List Background:
$topbar-dropdown-link-bg: #DF8D52 !default;

Tony Stark commented on Robert Crooks's post about 5 years

Ya
you can edit in _topbar.scss file
$topbar-bg-color: #f1f1f1 !default;
and much more variable you have to change for good looking background...

Posts Followed

No Content

Following

    No Content

Followers

My Posts



My Comments

You commented on Wing-Hou Chan's post about 5 years

HI
Feature request:

Report user--
> So if we report user - he/she can not add new reply and create new thread after reported.
> Also his all post will deleted after 1-2 (suitable) person report the user.

Block IP/Proxy (server side)
> I see some of site who has active firewall shield, which can block every new VPN/Proxy automatically.
> So no one see site if user use proxy.
> Prevent fake user to registration..

Thank YOUU

You commented on Oloeg's post about 5 years

Hi Hugo
You can download Custom version of Foundation.]
If you need SASS version of Essential5 then download SASS version of Foundation.
If you want some necessary option in css then Add some comment in foundation.scss file

@import
  "foundation/components/grid", //Grid Require-Necessary
  "foundation/components/reveal" //Reveal Necessary
  /*"foundation/components/accordion"*/; //accordion not necessary so its commented

You commented on Oliver S's post about 5 years

You are actually looking for mega menu.
Check here for detail:
http://foundation.zurb.com/forum/posts/232-megamenu

You commented on Jonas Marlo Loerken's post about 5 years

Hi
Actually define variable after @include command, so you getting error.
your custom function should be like this:

// $padding - Used to build padding for buttons Default: $button-med or rem-calc(12)
$padding: rem-calc(12);
// Primary color set in settings file. Default: $primary-color.
$bg: orange;
// If true, set to button radius which is $global-radius or explicitly set radius amount in px (ex. $radius:10px). Default:false.
$radius: true;
// We can set $full-width:true to remove side padding extend width. Default:false
$full-width: false;
// We can set $disabled:true to create a disabled transparent button. Default:false
$disabled: false;
// $is-input - <input>'s and <button>'s take on strange padding. We added this to help fix that. Default:false
$is-input: false;


.custom-button-class {
  @include button($padding, $bg, $radius, $full-width, $disabled, $is-input);
}

No any output error:

>>> Change detected at 12:40:45 to: app.scss
identical stylesheets/app.css 

You commented on Apple's post about 5 years

@Apple
Working fine
i checked
try in foundation 5.2.1 version

You commented on Apple's post about 5 years

HI
Use 5.2.1 version of foundation.min.js into your code
Replace

<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.2.2/js/foundation/foundation.min.js"></script>

with

<script src="http://cdnjs.cloudflare.com/ajax/libs/foundation/5.2.1/js/foundation.min.js"></script>

and add below code before closing body tag

<script>
    $(document).foundation();
</script>

so your code should be look like:::
http://pastebin.com/m5AHpwAM

You commented on Vinyl's post about 5 years

Locate below class and chage Red instead your color code

.top-bar-section ul li:hover:not(.has-form) > a {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}
.top-bar-section li.hover > a:not(.button) {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}
.top-bar-section li:not(.has-form) a:hover:not(.button) {
    background: none repeat scroll 0 0 RED;
}
.top-bar-section .dropdown li:hover:not(.has-form) > a:not(.button) {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}
.no-js .top-bar-section ul li:hover > a {
    background: none repeat scroll 0 0 RED;
    color: #FFFFFF;
}

This change may be cause problem, so if you have SASS version then open _top-bar.scss file
and locate this class

$topbar-link-bg-hover: RED !default

change color, it will easy to do...

You commented on Julius Miller's post about 5 years

HI
Well you are using css version of foundation,
if you want to make your custom styles then i recommend you use SASS version of foundation.
http://foundation.zurb.com/docs/sass.html
Otherwise changing into css will cause more problem on your project.


To change Background of menu

.top-bar-section li:not(.has-form) a:not(.button) {
    background: none repeat scroll 0 0 RED;
    line-height: 55px;
    padding: 0 18.3333px;
}
.top-bar-section .has-form {
    background: none repeat scroll 0 0 RED;
    height: 55px;
    padding: 0 18.3333px;
}

http://s4.postimg.org/ecmz9xpa5/bgg.png

You commented on Julius Miller's post about 5 years

HI
You are trying to change color of dropdown menu right...
So open _top-bar.scss file and locate this variable
$topbar-link-bg: $topbar-bg !default;
Change it to $topbar-bg with your color
$topbar-link-bg: #DF8D52 !default;

If you want to change color of dropdown hover and dropdown list...
Dropdown hover:
$topbar-link-bg-hover: #DF8D52 !default; //Hover
Dropdown-List Background:
$topbar-dropdown-link-bg: #DF8D52 !default;

You commented on Robert Crooks's post about 5 years

Ya
you can edit in _topbar.scss file
$topbar-bg-color: #f1f1f1 !default;
and much more variable you have to change for good looking background...

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content