[STYLE] viewの無駄な改行やスペースなどの削除

This commit is contained in:
s-choi
2026-09-10 16:01:32 +09:00
parent c2d108194c
commit 5d50d91701
6 changed files with 18 additions and 53 deletions

View File

@@ -14,25 +14,21 @@ h1 {
min-width: 640px; min-width: 640px;
font-size: 15pt; font-size: 15pt;
font-weight: bold; font-weight: bold;
display: flex; /* フレックスボックスを使う */ display: flex;
justify-content: space-between; /* 左右の要素を端に寄せる */ justify-content: space-between;
align-items: center; /* 上下中央に配置 */ align-items: center;
} }
.rightSection { .rightSection {
display: flex; /* フレックスボックスを使う */ display: flex;
align-items: center; /* 上下中央に配置 */ align-items: center;
} }
/* 入力フォーム */
input, button, select { input, button, select {
padding: 5px 15px 5px 15px; padding: 5px 15px 5px 15px;
margin: 3px; margin: 3px;
/* border-radius: 5px; /* CSS3草案 */
/* -webkit-border-radius: 5px; /* Safari,Google Chrome用 */
/* -moz-border-radius: 5px; /* Firefox用 */
} }
input.readOnly { input.readOnly {
@@ -40,7 +36,6 @@ input.readOnly {
color: #ffffff; color: #ffffff;
} }
/* メッセージボックスデザイン */
.msgBox { .msgBox {
font-weight: bold; font-weight: bold;
@@ -64,7 +59,6 @@ input.readOnly {
color: #000000; color: #000000;
} }
/* 個別デザイン */
th.header { th.header {
width: 150px; width: 150px;
@@ -74,7 +68,7 @@ th.header {
.loginInfo { .loginInfo {
font-size: 9pt; font-size: 9pt;
color: #008080; color: #008080;
margin-right: 10px; /* ログアウトボタンとの間隔 */ margin-right: 10px;
} }
.logoutButton { .logoutButton {
@@ -91,10 +85,9 @@ td.btnArea {
} }
.header-spacing { .header-spacing {
margin-top: 20px; /* 上部に20ピクセルのマージン */ margin-top: 20px;
} }
/* グリッドラインの追加 */
.table-grid { .table-grid {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
@@ -110,17 +103,14 @@ td.btnArea {
background-color: #f2f2f2; background-color: #f2f2f2;
} }
/* ストライプ効果(奇数行と偶数行で色を交互に) */
.table-striped tbody tr:nth-child(odd) { .table-striped tbody tr:nth-child(odd) {
background-color: #f2f2f2; background-color: #f2f2f2;
} }
/* ホバー効果(マウスオーバー時に行の色を変更) */
.table-hover tbody tr:hover { .table-hover tbody tr:hover {
background-color: #ccffcc; /* パステルグリーンの背景色 */ background-color: #ccffcc;
} }
/* レスポンシブデザイン(小さい画面でスクロール) */
.table-responsive { .table-responsive {
overflow-x: auto; overflow-x: auto;
display: block; display: block;
@@ -155,17 +145,17 @@ table.menuClass td.description {
} }
input[type="submit"], input[type="reset"], button { input[type="submit"], input[type="reset"], button {
color: #008080; /* ターコイズ色 */ color: #008080;
text-decoration: none; /* 下線をなくす */ text-decoration: none;
padding: 10px 20px; /* パディングを追加 */ padding: 10px 20px;
border: 1px solid #008080; /* 枠線を追加 */ border: 1px solid #008080;
border-radius: 5px; /* 角を丸くする */ border-radius: 5px;
background-color: transparent; /* 背景色を透明に */ background-color: transparent;
cursor: pointer; /* カーソルをポインターに */ cursor: pointer;
transition: 0.3s; /* アニメーション効果 */ transition: 0.3s;
} }
input[type="submit"]:hover, input[type="reset"]:hover, button:hover { input[type="submit"]:hover, input[type="reset"]:hover, button:hover {
background-color: #008080; /* マウスオーバー時の背景色 */ background-color: #008080;
color: #ffffff; /* マウスオーバー時の文字色 */ color: #ffffff;
} }

View File

@@ -1,8 +1,6 @@
function convertToKatakana(input) { function convertToKatakana(input) {
// 漢字とローマ字を削除
const valueWithoutKanjiAndRomaji = input.value.replace(/[\u4E00-\u9FFF\u0041-\u009F]/g, ''); const valueWithoutKanjiAndRomaji = input.value.replace(/[\u4E00-\u9FFF\u0041-\u009F]/g, '');
// ひらがなをカタカナに変換
const katakanaValue = valueWithoutKanjiAndRomaji.replace(/[\u3041-\u3096]/g, function (match) { const katakanaValue = valueWithoutKanjiAndRomaji.replace(/[\u3041-\u3096]/g, function (match) {
const chr = match.charCodeAt(0) + 0x60; const chr = match.charCodeAt(0) + 0x60;
return String.fromCharCode(chr); return String.fromCharCode(chr);
@@ -16,15 +14,12 @@ function logoutSubmit() {
form.setAttribute('method', 'post'); form.setAttribute('method', 'post');
form.setAttribute('action', 'logout'); form.setAttribute('action', 'logout');
// 動的送信用のHidden
// 動的にFormを作成する場合は何かしら送信しないと、正しく動作しない
const inputField = document.createElement("input"); const inputField = document.createElement("input");
inputField.setAttribute("type", "hidden"); inputField.setAttribute("type", "hidden");
inputField.setAttribute("value", "logout"); inputField.setAttribute("value", "logout");
form.appendChild(inputField); form.appendChild(inputField);
// フォームをDOMに追加
document.body.appendChild(form); document.body.appendChild(form);
form.submit(); form.submit();

View File

@@ -4,9 +4,7 @@
<head> <head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<!-- 外部のスクリプトファイルを読み込む -->
<script th:src="@{/js/common.js}"></script> <script th:src="@{/js/common.js}"></script>
<!-- CSSの読み込み -->
<link rel="stylesheet" th:href="@{/css/all.css}"> <link rel="stylesheet" th:href="@{/css/all.css}">
<link rel=stylesheet th:href="@{/css/style.css}" type="text/css"> <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
<title>登録内容確認</title> <title>登録内容確認</title>
@@ -138,7 +136,6 @@
form.setAttribute('method', 'post'); form.setAttribute('method', 'post');
form.setAttribute('action', 'insertEmployeeInput'); form.setAttribute('action', 'insertEmployeeInput');
// 確認画面から編集画面に戻ってきたときのフラグ(未使用)
const inputField = document.createElement("input"); const inputField = document.createElement("input");
inputField.setAttribute("type", "hidden"); inputField.setAttribute("type", "hidden");
inputField.setAttribute("name", "backFlg"); inputField.setAttribute("name", "backFlg");
@@ -146,7 +143,6 @@
form.appendChild(inputField); form.appendChild(inputField);
// フォームをDOMに追加
document.body.appendChild(form); document.body.appendChild(form);
form.submit(); form.submit();

View File

@@ -4,9 +4,7 @@
<head> <head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<!-- 外部のスクリプトファイルを読み込む -->
<script th:src="@{/js/common.js}"></script> <script th:src="@{/js/common.js}"></script>
<!-- CSSの読み込み -->
<link rel="stylesheet" th:href="@{/css/all.css}"> <link rel="stylesheet" th:href="@{/css/all.css}">
<link rel=stylesheet th:href="@{/css/style.css}" type="text/css"> <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
<title>社員登録完了</title> <title>社員登録完了</title>
@@ -23,15 +21,12 @@
form.setAttribute('method', 'post'); form.setAttribute('method', 'post');
form.setAttribute('action', 'insertEmployeeInput'); form.setAttribute('action', 'insertEmployeeInput');
// 動的送信用のHidden
// 動的にFormを作成する場合は何かしら送信しないと、正しく動作しない
const inputField = document.createElement("input"); const inputField = document.createElement("input");
inputField.setAttribute("type", "hidden"); inputField.setAttribute("type", "hidden");
inputField.setAttribute("value", "select"); inputField.setAttribute("value", "select");
form.appendChild(inputField); form.appendChild(inputField);
// フォームをDOMに追加
document.body.appendChild(form); document.body.appendChild(form);
form.submit(); form.submit();

View File

@@ -4,9 +4,7 @@
<head> <head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<!-- 外部のスクリプトファイルを読み込む -->
<script th:src="@{/js/common.js}"></script> <script th:src="@{/js/common.js}"></script>
<!-- CSSの読み込み -->
<link rel="stylesheet" th:href="@{/css/all.css}"> <link rel="stylesheet" th:href="@{/css/all.css}">
<link rel=stylesheet th:href="@{/css/style.css}" type="text/css"> <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
<title>社員情報更新</title> <title>社員情報更新</title>
@@ -93,7 +91,6 @@
</label> </label>
</td> </td>
</tr> </tr>
<!-- *** Chrome等のブラウザの場合自動でセットされる可能性があるので注意書きを外にも *** -->
<tr> <tr>
<th></th> <th></th>
<td> <td>
@@ -163,15 +160,12 @@
form.setAttribute('method', 'post'); form.setAttribute('method', 'post');
form.setAttribute('action', 'selectAll'); form.setAttribute('action', 'selectAll');
// 動的送信用のHidden
// 動的にFormを作成する場合は何かしら送信しないと、正しく動作しない
const inputField = document.createElement("input"); const inputField = document.createElement("input");
inputField.setAttribute("type", "hidden"); inputField.setAttribute("type", "hidden");
inputField.setAttribute("value", "selectAll"); inputField.setAttribute("value", "selectAll");
form.appendChild(inputField); form.appendChild(inputField);
// フォームをDOMに追加
document.body.appendChild(form); document.body.appendChild(form);
form.submit(); form.submit();

View File

@@ -4,9 +4,7 @@
<head> <head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<!-- 外部のスクリプトファイルを読み込む -->
<script th:src="@{/js/common.js}"></script> <script th:src="@{/js/common.js}"></script>
<!-- CSSの読み込み -->
<link rel="stylesheet" th:href="@{/css/all.css}"> <link rel="stylesheet" th:href="@{/css/all.css}">
<link rel=stylesheet th:href="@{/css/style.css}" type="text/css"> <link rel=stylesheet th:href="@{/css/style.css}" type="text/css">
<title>更新完了</title> <title>更新完了</title>
@@ -24,15 +22,12 @@
form.setAttribute('method', 'post'); form.setAttribute('method', 'post');
form.setAttribute('action', 'updatePersonalEmployeeResult'); form.setAttribute('action', 'updatePersonalEmployeeResult');
// 動的送信用のHidden
// 動的にFormを作成する場合は何かしら送信しないと、正しく動作しない
const inputField = document.createElement("input"); const inputField = document.createElement("input");
inputField.setAttribute("type", "hidden"); inputField.setAttribute("type", "hidden");
inputField.setAttribute("value", "updatePersonalEmployeeResult"); inputField.setAttribute("value", "updatePersonalEmployeeResult");
form.appendChild(inputField); form.appendChild(inputField);
// フォームをDOMに追加
document.body.appendChild(form); document.body.appendChild(form);
form.submit(); form.submit();