0

我正在关注 Michael Hartl 的 Ruby on Rails 教程。我在第十章。

我正在按照教程进行操作。在第 10 章，有一次我启动 rails server 时，bootstrap header 的背景颜色从黑色变成了浅灰色。我试图弄清楚发生了什么。我退回我的代码。我在互联网上搜索，但没有找到任何东西。

我无法具体说明这是什么时候发生的。我确定是在第 10 章。

我没有进行捆绑安装，也没有更改 gem，或者中间类似的东西。

这是部分代码

自定义.css.scss

@import "bootstrap";

/* mixins, variables, etc.  */

$grayMediumLight: #eaeaea;

@mixin box_sizing {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* universal */
html {
    overflow-y: scroll;
}
body {
    padding-top: 60px;
}
section {
    overflow: auto;
}
textarea {
    resize: vertical;
}
.center {
    text-align: center;
    h1{
        margin-bottom: 10px;
    }
}

/* typography */
h1, h2, h3, h4, h5, h6 {
    line-height: 1;
}
h1 {
    font-size: 3em;
    letter-spacing: -2px;
    margin-bottom: 30px;
    text-align: center;
}
h2 {
    font-size: 1.7em;
    letter-spacing: -1px;
    margin-bottom: 30px;
    text-align: center;
    font-weight: normal;
    color: $grayLight;
}
p {
    font-size: 1.1em;
    line-height: 1.7em;
}

/* header */
#logo {
float: left;
margin-right: 10px;
font-size: 1.7em;
color: #fff;
text-transform: uppercase;
letter-spacing: -1px;
padding-top: 9px;
font-weight: bold;
line-height: 1;
    &:hover {
        color: #fff;
        text-decoration: none;
    }
}

/* footer */
footer {
    margin-top: 45px;
    padding-top: 5px;
    border-top: 1px solid $grayMediumLight;
    color: $grayLight;
    a {
        color: $gray;
        &:hover {
            color: $grayDarker;
        }
    }
}
footer small {
    float: left;
}
footer ul {
    float: right;
    list-style: none;
    li {
        float: left;
        margin-left: 10px;
    }
}

/* miscellaneous */
.debug_dump {
    clear: both;
    float: left;
    width: 100%;
    margin-top: 45px;
    @include box_sizing;
}

/* sidebar */
aside {
    section {
        padding: 10px 0;
        border-top: 1px solid $grayLighter;
        &:first-child {
            border: 0;
            padding-top: 0;
        }
        span {
            display: block;
            margin-bottom: 3px;
            line-height: 1;
        }
        h1 {
            font-size: 1.6em;
            text-align: left;
            letter-spacing: -1px;
            margin-bottom: 3px;
        }
    }
}

.gravatar {
    float: left;
    margin-right: 10px;
}

/* forms */
input, textarea, select, .uneditable-input {
    border: 1px solid #bbb;
    width: 100%;
    padding: 10px;
    height: auto;
    margin-bottom: 15px;
    @include box_sizing;
}

#error_explanation {
    color: #f00;
    ul {
        list-style: none;
        margin: 0 0 18px 0;
    }
}

.field_with_errors {
    @extend .control-group;
    @extend .error;
}

/* users index */
.users {
    list-style: none;
    margin: 0;
    li {
        overflow: auto;
        padding: 10px 0;
        border-top: 1px solid $grayLighter;
        &:last-child {
            border-bottom: 1px solid $grayLighter;
        }
    }
}

.microposts {
  list-style: none;
  margin: 10px 0 0 0;

  li {
    padding: 10px 0;
    border-top: 1px solid #e8e8e8;
  }
}
.content {
  display: block;
}
.timestamp {
  color: $grayLight;
}
.gravatar {
  float: left;
  margin-right: 10px;
}
aside {
  textarea {
    height: 100px;
    margin-bottom: 5px;
  }
}

_header.html.erb

<header class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <%= link_to "sample app", root_path, id: "logo" %>
            <nav>
                <ul class="nav pull-right">
                    <li><%= link_to "Home", root_path %></li>
                    <li><%= link_to "Help", help_path %></li>
                    <% if signed_in? %>
                    <li><%= link_to "Users", users_path %></li>
                    <li id="fat-menu" class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        Account <b class="caret"></b>
                        </a>
                        <ul class="dropdown-menu">
                            <li><%= link_to "Profile", current_user %></li>
                            <li><%= link_to "Settings", edit_user_path(current_user) %></li>
                            <li class="divider"></li>
                            <li>
                                <li><%= link_to "Sign out", signout_path, method: "delete" %></li>
                            </li>
                        </ul>
                    </li>
                    <% else %>
                        <li><%= link_to "Sign in", signin_path %></li>
                    <% end %>
                </ul>
            </nav>
        </div>
    </div>
</header>

有人有类似的问题吗？

谢谢

4

0 回答 0