Fork me on GitHub
#reagent
<
2018-12-31
>
juhoteperi13:12:42

I've merged several PRs to master and pushed 0.9.0-SNAPSHOT to Clojars: https://github.com/reagent-project/reagent/blob/master/CHANGELOG.md I still have some ideas on refactoring create-class to match React ES6 classes more closely, as the current implementation doesn't allow providing custom static methods or properties, but I might leave those changes to a later release.

WhoNeedszZz23:12:58

Hey, folks. Just learning re-frame for a simple informational site. I'm using Material-UI for my styling and having some difficulty with styles being overridden by duplicate elements being created. Specifically, when I'm using the Grid component it will create an element that I stated with the options I stated, but will create another one above it that has the default Material-UI style options. Why is this happening and how do I stop it from creating the duplicate elements?

WhoNeedszZz23:12:19

Even stranger is that the top-most parent correctly creates the <WithStyles(Grid) ... > with the options I stated and a child of <Grid ...> with the options I stated. It's further down the tree that it flips around where it is a <Grid ...> with default options that overrides the <WithStyles(Grid) ...>.

WhoNeedszZz23:12:32

(defn home-content []
  (let [name (re-frame/subscribe [::subs/name])]
    [:<>
     [:> Grid
      {:container true
       :direction "row"
       :justify "center"
       :spacing 8}
      [:> Grid
       {:container true
        :direction "row"
        :justify "center"
        :xs 12}
       [:> Grid
        {:item true
         :xs 12}
        [appbar-comp]]]
      [:> Grid
       {:container true
        :direction "row"
        :justify "center"
        :spacing 8
        :xs 12}
       [:> Grid
        {:item true
         :xs 6}
        [:> Card
         {:style style-card}
         [:> CardMedia
          {:image "../../resources/public/images/logo-300_240.png"}]
         [:> CardContent
          [:> Typography
           {:component "p"}
           "Test"]]]]
       [:> Grid
        {:item true
         :xs 6}
        [:> Card
         {:style style-card}
         [:> CardContent
          [:> Typography
           {:component "p"}
           (str "Hello from " @name ". This is the Home Page.")]]]]]]]))

WhoNeedszZz23:12:52

So I am creating a container of two containers, with the first container only containing the app bar and the second container containing the cards. That's how it is documented on the Material-UI docs so I don't know where the issue is.