Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
Axel Huizinga
@axelhuizinga
How can I add a callback function to the props of a custom Layout component?
I want to display the Filter within my Sidebar at the parent component
Kakashi Hatake
@kakashi.h2k_gitlab
is it possible to take the filter input field and place it where ever you want and give it another style/size etc.?
Axel Huizinga
@axelhuizinga
@kakashi.h2k_gitlab - yes https://griddlegriddle.github.io/Griddle/docs/api/
you can look at the Layout section which you can override like
const NewLayout = ({ Table, Pagination, Filter, SettingsWrapper }) => (
  <div>
    <Filter />
    <Pagination />
    <Table />
  </div>
);
Kakashi Hatake
@kakashi.h2k_gitlab
@axelhuizinga some time ago I used griddle 0.x, didnt figured it out, but I will give it another try. Thanks!
Kakashi Hatake
@kakashi.h2k_gitlab
everything works so far, I can style all elements how I want :)
Axel Huizinga
@axelhuizinga
very nice
Kakashi Hatake
@kakashi.h2k_gitlab
but how can I place and style the box that appears if I hit the settings button?
Axel Huizinga
@axelhuizinga
I'd try to apply a css class as usual
Kakashi Hatake
@kakashi.h2k_gitlab
hmm... at the moment I used the <Griddle components={{ SettingsToggle: CustomSettingsToggle}} />
with that I am able to set the button of the settings and what I did, everything works so far
but its not possible to use the settings-box as an component in the Layout?
Axel Huizinga
@axelhuizinga
Not sure about but you should be able to set the style in your CustomSettingsToggle with a className prop
Kakashi Hatake
@kakashi.h2k_gitlab
@axelhuizinga
the docs, in the API section, say that <SettingsToggle /> component contains the box with the settings, which is the Settings component, but its not the in the Layout props
with the styleConfig I can change the Style of the Settings, so I guess I have to live with it :)
Kakashi Hatake
@kakashi.h2k_gitlab
how can I get the filter-box under the filter and settings button?
like this:
Axel Huizinga
@axelhuizinga
how did you implement the CustomSettingsToggle?
Kakashi Hatake
@kakashi.h2k_gitlab
const CustomSettingsToggle = ({ style, onClick }) => (
  <div>
    <IconButton style={style} onClick={onClick}>
      <ColumnIcon />
    </IconButton>
  </div>
);
Axel Huizinga
@axelhuizinga
well then you could put a className prop in the div and the filter div as well and align them with flexbox or anything you might want
Kakashi Hatake
@kakashi.h2k_gitlab
just see that I have redundant divs here
Kakashi Hatake
@kakashi.h2k_gitlab
I dont get it
Axel Huizinga
@axelhuizinga
to be honest after putting a week of work into creating typedefs for Haxe extern class defs I stumbled about too much unknown and no visible activity from the creators stopped me digging deeper here - now I continue to develop my own Table component
Kakashi Hatake
@kakashi.h2k_gitlab
but just in case, look what I have:
Axel Huizinga
@axelhuizinga
let me see
Kakashi Hatake
@kakashi.h2k_gitlab
so the icon moves to the left and the Setting are below the button
I want that the settings are below filter and SettingsToggle
Axel Huizinga
@axelhuizinga
would be interesting to see a devtools view of the dom b4 and after
Kakashi Hatake
@kakashi.h2k_gitlab
wait I have an idea/theory, maybe this will work
Kakashi Hatake
@kakashi.h2k_gitlab
Axel Huizinga
@axelhuizinga
I would look at the dom at whole - all elements related and think about the most suitable css method to align them as desired
Kakashi Hatake
@kakashi.h2k_gitlab
I also study this and try to see what differences it has in its css:
maybe you have an idea, but I guess its an css thing, something with display: table;
Axel Huizinga
@axelhuizinga
are you using version 0?
Kakashi Hatake
@kakashi.h2k_gitlab
version 1.x
Axel Huizinga
@axelhuizinga
I asked cos the doclink points to v0
Kakashi Hatake
@kakashi.h2k_gitlab
sure, but its all I got, furthermore I guess that its an css thing, at least I hope it :)
Axel Huizinga
@axelhuizinga
sure it's related - playing around with the styles in the devtools often helps me to find a solution with such problems
Kakashi Hatake
@kakashi.h2k_gitlab
if you have an idea of found a solution please let me know, I will try and share my solution if I found one :/
Kakashi Hatake
@kakashi.h2k_gitlab
@axelhuizinga:
I DID IT :D
Kakashi Hatake
@kakashi.h2k_gitlab
in the settings box, where exactly can I change headlines of the Visible Columns and Visible Rows ?
there is Settings and Rows per page
I would like to change that
Axel Huizinga
@axelhuizinga
no idea but searching through the source may help - anyway the v0 docs don't match the v1 api
Kakashi Hatake
@kakashi.h2k_gitlab
@axelhuizinga
that is what I figured out as well :)
and even in the repo I cant find an hint