How to use the react-modal.injectCSS function in react-modal

To help you get started, we’ve selected a few react-modal examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github edf-hpc / slurm-web / frontend / src / components / pages / Jobs.js View on Github external
handleRowClick (job) {
    let appElement = document.getElementById('modal-job')
    Modal.setAppElement(appElement)
    Modal.injectCSS()

    let closeModal = () => {
      React.render(, appElement)
    }

    React.render(
      ,
      appElement
    )
  }
github react-rally / www / 2015 / app / screens / Schedule / index.js View on Github external
import React, { Component } from 'react';
import Modal from 'react-modal';
import StyleSheet from 'react-style';
import { Styles, Links } from 'helpers/constants';
import ScheduleData from '../../../api/schedule';
import SpeakerData from '../../../api/speakers';
import Session from './components/Session';

Modal.setAppElement(document.getElementById('container'));
Modal.injectCSS();

const poleColor = 'rgb(50, 96, 124)';
const STYLES = StyleSheet.create({
  section: {
    background: `url(assets/dist/img/weatheredBackground.png) ${Styles.BG_COLOR_SCHEDULE}`,
    paddingBottom: 150
  },
  container: {
    position: 'relative',
    padding: 0,
    minHeight: 3600
  },
  h2: {
    color: Styles.FONT_COLOR_SCHEDULE
  },
  img: {
github kritzcreek / FROST-Frontend / static / js / entry.js View on Github external
window.jQuery = window.$ = require('jquery');
require('rx');
require('rx-jquery');
require('moment')();

const Modal = require('react-modal');
const appElement = document.getElementById('menu');

Modal.setAppElement(appElement);
Modal.injectCSS();


window.Grid = require('./Grid.jsx').default;
window.Menu = require('./Menu.jsx').default;
window.Topics = require('./Topics.jsx').default;
window.React = require('react');

require('Openspace.Ui.Stream').main();
github latentflip / loupe / loupe.js View on Github external
});

app.store.renderQueue.on('add', function () {
    if (app.store.callstack.length === 0) {
        app.store.renderQueue.shift();
    }
});

if (window.location.origin.match('latentflip.com')) {
    window.app.router.history.start({ pushState: true, root: '/loupe/' });
} else {
    window.app.router.history.start({ pushState: true });
}

Modal.setAppElement(document.body);
Modal.injectCSS();
React.renderComponent(App(), document.body);