rcarcasses / vue-cytoscape

cytoscape.js now inside vue.js
https://rcarcasses.github.io/vue-cytoscape
MIT License
95 stars 34 forks source link

Make responsive component using vue-cytoscape #46

Open pkovanen opened 4 years ago

pkovanen commented 4 years ago

I'm trying to integrate vue-cytoscape into my application, but I'm having hard time getting the child component (based on vue-cytoscape) to be responsive. There are lots of different style related attributes in the DOM which cannot be configured, and I'm baffled.

The parent component is based on bootstrap. How can I make the child responsive?

rcarcasses commented 4 years ago

Hi @pkovanen , sorry for the late reply. Cytoscape is mounted in a div created here:

https://github.com/rcarcasses/vue-cytoscape/blob/58af89b97a528bda9b1e20ed48822d3e6c499077/src/components/Cytoscape.ts#L26

which has a very basic styling as to work by default. I'm not sure how to make it responsive as per your need but I think a good start could be to target this DOM element with css:

#cytoscape-div {
...
}

Let me know if it helps.