Rails Bootstrap样式未应用(无错误)

时间:2015-08-31 15:43:39

标签: css ruby-on-rails twitter-bootstrap twitter-bootstrap-3 bootstrap-sass

我正在使用Rails应用程序的命名空间部分。我正在尝试使用bootstrap-sass gem来应用Bootstrap。我已经准确地遵循了README的指示。唯一的区别是我已将模板中需要的清单文件从application.css.scss重命名为employers.css.scss

无论我做什么,Bootstrap样式都不会应用于<div id="page-wrapper">中的任何元素。我不知道我做错了什么。我有另一个应用程序具有相同的布局和相同版本的Bootstrap运行,看起来很棒。

这是我的employers.css.scss manifest

/*
 *= require_self
 *= require font-awesome
 *= require framework_and_overrides
 *= require bootstrap-popover
 *= require employers/sb-admin
 *= require employers-overrides
*/

这是我的frameworks_and_overrides.css.scss

// import the CSS framework
@import "bootstrap-sprockets";
@import "bootstrap";

以下是呈现页面的HTML:

<html lang="en" ng-app="myApp" class="ng-scope">
<head>
    <title>MyApp</title>

    <link href="/assets/employers.css?body=1" media="all" rel="stylesheet">
    <link href="/assets/font-awesome.css?body=1" media="all" rel="stylesheet">
    <link href="/assets/framework_and_overrides.css?body=1" media="all" rel="stylesheet">
    <link href="/assets/bootstrap-popover.css?body=1" media="all" rel="stylesheet">
    <link href="/assets/employers/sb-admin.css?body=1" media="all" rel="stylesheet">
    <link href="/assets/employers-overrides.css?body=1" media="all" rel="stylesheet">

    <body signed-in="true">
        <div id="wrapper">
            <div id="page-wrapper">
                <div class="form-container ng-scope" ng-controller="NewPostQuestionCtrl">
                    <h2>CREATE</h2>
                    <form accept-charset="UTF-8" name="postQuestionForm" ng-submit="submit(postQuestion);" multipart="true" novalidate="" class="ng-pristine ng-invalid ng-invalid-required">
                        <input name="utf8" type="hidden" value="✓">
                        <input name="authenticity_token" type="hidden" ng-model="postQuestion.token" ng-init="postQuestion.token='+Itu5juZS/EvY0C8NNfxDJ7/ZV674RttZKS305b6FVU='" value="+Itu5juZS/EvY0C8NNfxDJ7/ZV674RttZKS305b6FVU=" class="ng-pristine ng-valid">
                        <input name="employer_id" type="hidden" ng-model="postQuestion.employer_id" ng-init="postQuestion.employer_id='1'" class="ng-pristine ng-valid">

                        <div class="form-group">
                            <label>Question</label>
                            <textarea class="question-textbox ng-pristine ng-invalid ng-invalid-required" name="question" ng-model="postQuestion.question" required="">
                            </textarea>
                        </div>

                        <div class="form-group">
                            <label>Image</label>
                            <div class="button ng-pristine ng-invalid ng-invalid-required" ngf-select="" ng-model="postQuestion.file" name="file" ngf-pattern="image/*" accept="image/*" ngf-max-size="150KB" required="required">Select</div>
                        </div>

                        <div class="form-group">
                            <label>Publish Question</label>
                            <select class="ng-pristine ng-invalid ng-invalid-required" name="published" ng-model="postQuestion.published" required="">
                                <option value="? undefined:undefined ?"></option>
                                <option value="true">Publish</option>
                                <option value="false">Don't Publish</option>
                            </select>
                        </div>

                        <input class="submit-btn" name="commit" type="submit" value="Publish Post" ng-disabled="form.postQuestion.$invalid">
                    </form>
                </div>

                <div class="column-layout cards-layout cols-3" id="scenes">
                    <div class="col">
                        <br style="clear:both">
                    </div>
                </div>

            </div>
        </div>
    </body>
</html>

0 个答案:

没有答案