0

I am trying to embed a Google Map widget as a field in Craft. I am doing plugin development to achieve it.

Adding a foundation 5 css in a PluginName_FieldType.php file into the getInputHtml() function results in changes is Craft Control panel.

craft()->templates->includeCssResource('pluginhandle/foundation.css');

I apologise if it is something silly. I am a newbie to Craft.

Craft_Foundation5_messup

Improve this question

1 Answer 1

Reset to default
2

I don't use Foundation 5. I've been using Foundation 6, but I'll offer a suggestion based on Foundation 6 usage.

It looks like your Foundation CSS is overriding the base Craft control panel CSS, specifically the button classes.

My guess is that because you're including all the Foundation classes available. If you're using the SASS version, you can comment out the parts you aren't using to minimize the size of what you're using from the base Foundation code. For example, you can try to exclude the button classes from Foundation.

Specifically, if you remove the .button styling rules from your foundation.css file, the Craft buttons would go back to normal.

Improve this answer
5
  • Thanks for the comment. I would try and reduce Foundation.css, but I wouldn't be able to remove the .button styling rules as they are being used in the plugin.
    – Prashanth
    Commented Sep 18, 2016 at 17:11
  • So is this a bug in craft then? shouldn't craft's CP css have the highest priority in its styling?
    – Prashanth
    Commented Sep 18, 2016 at 17:11
  • 1
    @Prashanth: No, because then it would be impossible to customize the CP.
    – Lindsey D
    Commented Sep 18, 2016 at 18:25
  • Ideally, I try to "contain" any custom styling rules. Like if you could contain your rules in a parent id like "mypluginname" (<div id='mypluginname>your code here</div>). Make the rules for your plugin the more specific rules... know what I mean?
    – John Morton
    Commented Sep 20, 2016 at 14:46
  • I understand that. Its just that I am lazy to edit Foundation.css. I just want to import it and work on it out of the box. Guess that's what bootstraps are for. What I don't get is why CP reacts to foundation. Ofcourse there would be conflicting classes in CP's HTML. Thanks anyway, will work it out.
    – Prashanth
    Commented Sep 22, 2016 at 18:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.