почему response-bootstrap не добавляет стили к моему сеточному макету - PullRequest
Новая
       44

почему response-bootstrap не добавляет стили к моему сеточному макету

0 голосов
/ 21 октября 2018

Я делаю часы Promodoro. Я написал свой код с использованием response-bootstrap. Он работает, но стили классов по умолчанию для начальной загрузки не добавляются в styles.it просто накладываются друг на друга. 

import React, { Component } from "react";

import "./App.css";
import Grid from "react-bootstrap/lib/Grid";
import Row from "react-bootstrap/lib/Row";
import Col from "react-bootstrap/lib/Col";

class App extends Component {
  render() {
    return (
      <div className="App">
        <Grid className="main-container">
          <h1>Promodoro Clock</h1>

          <Row className="time-setters ">
            <Col className="Session-time text-center" sm={6}>
              <div>Session time</div>
              <a href="#">+</a>
              <span>25</span>
              <a href="#">-</a>
            </Col>
            <Col className="Break-time text-center" sm={6}>
              <div>Break time</div>
              <a href="#">+</a>
              <span>5</span>
              <a href="#">-</a>
            </Col>
          </Row>
        </Grid>
      </div>
    );
  }
}
.App {
    text-align: center;
}



html {
    height: 100%;
}

body {
    height: 100%;
}

.main-container {
    max-width: 800px;
    margin: 0 auto;
}

Ответы [ 2 ]

0 голосов
/ 21 октября 2018

Если вы собираетесь импортировать несколько вещей одновременно, вы можете использовать это:

import { Grid, Row, Col } from 'react-bootstrap';

Кроме того, убедитесь, что вы импортировали таблицу стилей где-то на своей странице, напримерна документах написано:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

0 голосов
/ 21 октября 2018

Поскольку вы не импортировали файл css: 

import 'bootstrap/dist/css/bootstrap.min.css'

Установите загрузчик до npm install bootstrap --save

...