前回の続き
WebJarsでbootstrapを追加したので、おしゃれな画面を作成した。
環境
- Mac High Sierra 10.13.5
- Java 1.8.0_11
- Maven 3.5.4
- springboot 2.0.3
手順
Bootstrapのサインイン画面を利用し、一部変更。
index.htmlの一部
2行目
<html lang="en">
↓
<html xmlns:th="http://www.thymeleaf.org">
8行目
<link rel="icon" href="../../../../favicon.ico">
↓
コメントアウト
13行目
<link href="../../dist/css/bootstrap.min.css" rel="stylesheet">
↓
<link rel="stylesheet" href="webjars/bootstrap/4.1.1/css/bootstrap.min.css" />
16行目
<link href="signin.css" rel="stylesheet">
↓
<link href="css/style.css" rel="stylesheet">
21行目
<img class="mb-4" src="../../assets/brand/bootstrap-solid.svg" alt="" width="72" height="72">
↓
自分の好きな画像に変更
34行目
<p class="m5-5 mb-3 text-muted" th:text="${hello}"></p>
を追加
16行目、21行目の変更に対応するため、
src/main/resources/static/assets 配下にアイコンを追加
src/main/resources/static/css 配下にstyle.cssを追加
style.cssの中身はhtml同様、bootstrapよりコピペ。
mvn clean packageでjarファイルを作成して実行