カート画面モック完成(ルーティングはしていない)

src/main/resources/static/css/style.css

@@ -1681,3 +1681,76 @@ label {
     color: white;
     margin-top: 10px;
 }
+
+/* カート画面 */
+.th, .td {
+    font-size: 20px;
+}
+
+.td {
+    margin: 50px 0;
+}
+
+.tr {
+    /*margin: 60px 0;*/
+    border-bottom: 1px solid #555252;
+}
+
+.tr:first-child {
+    border-top: 1px solid #555252;
+}
+
+#cart-p-text {
+    font-size: 40px;
+    text-align: center;
+    margin: 100px 0;
+}
+
+#cart-text {
+    border-bottom: 2px solid #1abc9c;
+    color: #555252;
+}
+
+#cart-table {
+    color: #000;
+    width: 100%;
+}
+
+.navbar-brand {
+    text-align: left;
+    margin-left: 0;
+}
+
+.textP {
+    margin-top: 70px;
+}
+
+#theadTr {
+    margin-bottom: 50px;
+}
+
+/* カート画面モーダル */
+
+#buy {
+    text-align: center;
+    margin-bottom: 100px;
+}
+
+#buy-btn {
+    width: 150px;
+    height: 50px;
+    margin-top: 50px;
+    font-weight: bold;
+    background-color: #1abc9c;
+    border-radius: 3px;
+    border:none;
+    color: #000;
+}
+
+#total-price {
+    font-size: large;
+}
+
+#total-price-span {
+    margin-left: 20px;
+}

src/main/resources/static/js/cart.js

+//モーダル表示
+$(function(){
+    $('.js-modal-open').on('click',function(){
+        $('.js-modal').fadeIn();
+        return false;
+    });
+    $('.js-modal-close').on('click',function(){
+        $('.js-modal').fadeOut();
+        return false;
+    });
+});
\ No newline at end of file