-- 第八课：自定义样式

这个应用很漂亮了，所以这里没有太多自定义的东西，所以这节课非常的快。但是我们还是要做点啥。 我们先从修改颜色变量开始。 > 修改 theme/variables.scss 里面的命名颜色变量如下：

$colors: (
    primary: #5b91da,
    secondary: #32db64,
    danger: #f53d3d,
    light: #f4f4f4,
    dark: #222,
    favorite: #69BB7B
);

然后给应用的添加一些通用样式。 > 在src/app/app.scss中添加如下样式：

.logo {
    max-height: 39px;
    margin-top: 6px;
}

ion-input, ion-textarea {
    background-color: #F3F3F3;
    border: 1px solid #cecece;
    padding-left: 10px;
}

ion-textarea {
    height: 200px;
}

textarea {
    height: 180px;
}

button {
    border: none !important;
}

这里我们想要做到的主要事情是给我们的输入框添加一些样式。在这之前，输入框都是白色的，他的背景也是，所以你基本看不到输入框中哪里。现在他们的背景色灰色的，以及他有一些小小的额外的样式。我们给textarea添加了一点点样式来扩展他的默认高度，也覆盖了一个目前存在的bug，也就是textarea不会随着用户输入去调整。 现在应用看起来应该是这样的： 这是整本书里面最小的课程了，但是，我们完成了！CamperMate现在全部完成了。