Materialize: When will be it possible to design half FAB like this ? ? ?

Created on 27 Oct 2016  路  19Comments  路  Source: Dogfalo/materialize

image

Please if anyone has suggedtions , let me know

Most helpful comment

"Offcourse I know its material design :|"
"......but we must not stop now.......lets make this possible in official materialize release"
Seemingly you didn't get what open source is.
You didn't pay for Materialize, it is free, the team and all contributors (hundreds of PR) offers their time to improve this framework for free. If you want something you have to work for it and if you think your work could be useful to some of us you either propose to improve this framework with a PR, or at least show some code to the community so we can use it. Because it's how open source is working : you get something for free and in return you try to improve it when you have time or when the work you made in a project could be useful to other devs. But in NO way you have the right to REQUIRE a feature because YOU want it.
"When will be it possible to design half FAB like this ? ? ?" : when, the "???" you act as a consumer who require us to do something but _no one is working for you_ here.
I hope you'll act in a more mature way and you're going to be more humble and you'll start considering how lucky we are to be able to get the work of a constant work of devs all around the world directly to your computer for free.

All 19 comments

I like it, this is real material design +1 I will be very happy to see a standard implementation of such design.

Offcourse I know its material design :|

There is many ways to achieve such result, of course it is not standard solution. Here is one idea, you can position fab button as absolute, or margin-top negative or even play with background: linear gradient, to achieve 2 color background in a div and place the button there. I can make an example if interested.

It will be so much help to all of the materialize community....please give us an example which according to you is most convenient way....

Thank you

http://codepen.io/lpq66/pen/zKQpJa

Is this what you looking for?

@lpq66 Maybe attach the fab to the bottom, though. That way you can resize the header if needed (these "waterfall" headers for example):

.header .fab-button {
  position: absolute;
  bottom: -35px;
  left: 10px;
}

@Thanood Yeah, thanks for this. I changed it to bottom; -35px, this will help @shubhamt619 a lot.

@Thanood and @Ipq66 thank you guys......but we must not stop now.......lets make this possible in official materialize release

Good work brothers

"Offcourse I know its material design :|"
"......but we must not stop now.......lets make this possible in official materialize release"
Seemingly you didn't get what open source is.
You didn't pay for Materialize, it is free, the team and all contributors (hundreds of PR) offers their time to improve this framework for free. If you want something you have to work for it and if you think your work could be useful to some of us you either propose to improve this framework with a PR, or at least show some code to the community so we can use it. Because it's how open source is working : you get something for free and in return you try to improve it when you have time or when the work you made in a project could be useful to other devs. But in NO way you have the right to REQUIRE a feature because YOU want it.
"When will be it possible to design half FAB like this ? ? ?" : when, the "???" you act as a consumer who require us to do something but _no one is working for you_ here.
I hope you'll act in a more mature way and you're going to be more humble and you'll start considering how lucky we are to be able to get the work of a constant work of devs all around the world directly to your computer for free.

Thanks a lot @Nitrobay......materialize has helped me a ton. ...and now you have opened my eyes.....thank you. .

See I have already used materialize too much and I have figured out many things and code that I can contribute to it.

But sadly the truth is I don't know how to bcoz I'm new to github....

But u and all contributors have inspired me....

Now I will make my own repo called as materialize themes amd I wil provide the work that I have done using materialize.....I will provide templates to it.

Thank you all contributors.
Thank you nitrobay for push. I need your support bro...coz I don't know github

Great I'm happy you stop giving us order to understand what is really open source. Actually, to be honest, I was like you few months/years ago.
I would be glad to offer the support you could need.

@NitroBay I want basic support from u first

I will learn github using google and figure it all out but as I said I want materialize to be even more awesome by providing awesome templates on github.

Would u tell me what are the common templates that can help the community as well as the average developers ??

E.g admin panel etc

Thank you

Good question. Indeed there's a lack of Materialize template, I remember I wanted a template to show message but there was none except this one http://demo.geekslabs.com/materialize/v2.1/layout03/index.html but it was paying. All geekslab's Materialize templates are paying so maybe you can grab inspiration from the simplest templates they offer but for free (without copying)

Ok bro as soon as my exams are over. ..i'll start creating and uploading one by one.

Btw , how to make the table of contents fixed on the right side.

I have taken a container so all my content is in it and it has left and right margin
Where do I write table of contents code .

Thank you

Added some basic support for halfway FABs in cards and extended navbars. You can check them out on the navbar and cards documentation pages. Let me know if this is a good start!

Added in a8f301a6e93c7c760d5052b30d1d69437d530018.

Damn this is really great @acburst.

Are you on master? It should be in the cards documentation page

Card is also great, I prefer mdl's way of adding button (the share button) maybe adding such button could be an idea for the future, but as for now I think mid fab on navbar is cool but not on cards. It's not what material design wants https://material.google.com/components/buttons-floating-action-button.html#buttons-floating-action-button-large-screens "Don鈥檛 have more than one floating action button per screen.", if you release card with fab, there will be a of fab on a single screen, it's not good. Think material design ;)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

cope picture cope  路  3Comments

lpgeiger picture lpgeiger  路  3Comments

onigetoc picture onigetoc  路  3Comments

samybob1 picture samybob1  路  3Comments

hartwork picture hartwork  路  3Comments