[STYLE] 目標作成画面のCSS結合

src/main/resources/templates/goal_create.html

@@ -1,17 +1,25 @@
 <!DOCTYPE html>
 <html xmlns:th="http://www.thymeleaf.org">
+
 <head>
-	<meta charset="UTF-8">
+	<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1" http-equiv="Content-Type">
 	<title>目標作成</title>
 
 	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
-
+	<link rel="stylesheet" th:href="@{/css/style.css}">
 </head>
-<body class="pb-5 pt-5">
+
+<body style="padding-top:80px; padding-bottom:80px;">
 
 	<div th:replace="~{header :: header}"></div>
 
-	<h1>目標作成</h1>
+	<div class="main-container">
+
+		<h1 class="page-title">目標作成</h1>
+
+		<div class="card shadow-sm">
+
+			<div class="card-body">
 
 				<form th:action="@{/goal/create}" th:object="${goalForm}" method="post">
 					<input type="hidden" th:field="*{goalId}">
@@ -33,9 +41,10 @@
 
 					<div>
 						<label>目標達成期限</label>
-			<input type="date" th:field="*{deadline}" th:min="${#temporals.format(#temporals.createNow(), 'yyyy-MM-dd')}" required>
+						<input type="date" th:field="*{deadline}"
+							th:min="${#temporals.format(#temporals.createNow(), 'yyyy-MM-dd')}" required>
 					</div>
-		<button type="submit">更新する</button>
+					<button type="submit" class="btn btn-sm btn-primary w-100">更新する</button>
 
 				</form>
 
@@ -43,4 +52,5 @@
 
 
 </body>
+
 </html>