diff options
Diffstat (limited to 'public')
| -rw-r--r-- | public/join.js | 32 | ||||
| -rw-r--r-- | public/style.css | 12 |
2 files changed, 21 insertions, 23 deletions
diff --git a/public/join.js b/public/join.js index 85445dc..362800d 100644 --- a/public/join.js +++ b/public/join.js @@ -135,8 +135,12 @@ function is_solo() { return players.every(p => p.user_id === players[0].user_id) } +function user_link(player) { + return `<a class="black" href="/user/${player.name}">${player.name}</a>` +} + function play_link(player) { - return `<a href="/${game.title_id}/play.html?game=${game.game_id}&role=${encodeURIComponent(player.role)}">${player.name}</a>` + return `\xbb <a href="/${game.title_id}/play.html?game=${game.game_id}&role=${encodeURIComponent(player.role)}">Play</a>` } function action_link(player, action, color, text) { @@ -162,16 +166,16 @@ function update() { if (player.user_id === user_id) element.innerHTML = play_link(player) else - element.innerHTML = player.name + element.innerHTML = user_link(player) break case 1: element.classList.toggle("is_active", is_active(player, role)) if (player.user_id === user_id) element.innerHTML = play_link(player) + action_link(player, "part", "red", "\u274c") else if (game.owner_id === user_id) - element.innerHTML = player.name + action_link(player, "kick", "red", "\u274c") + element.innerHTML = user_link(player) + action_link(player, "kick", "red", "\u274c") else - element.innerHTML = player.name + element.innerHTML = user_link(player) break case 0: if (player.is_invite) { @@ -180,22 +184,18 @@ function update() { element.innerHTML = player.name + " ?" + action_link(player, "part", "red", "\u274c") + action_link(player, "accept", "green", "\u2714") - else if (player.user_id === user_id) - element.innerHTML = player.name + " ?" + action_link(player, "part", "red", "\u274c") else if (game.owner_id === user_id) - element.innerHTML = player.name + " ?" + action_link(player, "kick", "red", "\u274c") + element.innerHTML = user_link(player) + " ?" + action_link(player, "kick", "red", "\u274c") else - element.innerHTML = player.name + " ?" + element.innerHTML = user_link(player) + " ?" } else { element.classList.remove("is_invite") - if (player.user_id === user_id && player.is_invite) - element.innerHTML = player.name + action_link(player, "part", "red", "\u274c") - else if (player.user_id === user_id) + if (player.user_id === user_id) element.innerHTML = player.name + action_link(player, "part", "red", "\u274c") else if (game.owner_id === user_id) - element.innerHTML = player.name + action_link(player, "kick", "red", "\u274c") + element.innerHTML = user_link(player) + action_link(player, "kick", "red", "\u274c") else - element.innerHTML = player.name + element.innerHTML = user_link(player) } break } @@ -212,13 +212,11 @@ function update() { element.innerHTML = `<i>Empty</i>` break case 1: - element.innerHTML = `<a class="join" href="javascript:join('${role}')">Join</a>` - break case 0: if (game.owner_id === user_id) - element.innerHTML = `<a class="join" href="javascript:join('${role}')">Join</a><a class="green" href="javascript:show_invite('${role}')">\u{2795}</a>` + element.innerHTML = `\xbb <a class="join" href="javascript:join('${role}')">Join</a><a class="green" href="javascript:show_invite('${role}')">\u{2795}</a>` else - element.innerHTML = `<a class="join" href="javascript:join('${role}')">Join</a>` + element.innerHTML = `\xbb <a class="join" href="javascript:join('${role}')">Join</a>` break } element.classList.remove("friend") diff --git a/public/style.css b/public/style.css index 5d8940c..0a950e6 100644 --- a/public/style.css +++ b/public/style.css @@ -12,6 +12,8 @@ h1 { margin: 16px 0 16px -1px; font-size: 24px; } h2 { margin: 16px 0 16px -1px; font-size: 20px; } h3 { margin: 16px 0 8px -1px; font-size: 16px; } a { color: blue; } +a.black { text-decoration: none; color: black; } +a.black:hover { text-decoration: underline; color: blue; } .w { white-space: nowrap; } .r { text-align: right; } @@ -31,8 +33,8 @@ header nav { flex-wrap: wrap; justify-content: end; } -header nav a { display: block; margin: 0 16px; color: black; } -header nav a:hover { color: blue; } +header nav a { display: block; margin: 0 12px; color: black } +header nav a:hover { color: blue } article { margin: 2em; } article p, article dl, article ul { max-width: 50rem; } @@ -47,6 +49,7 @@ div.logo img { input[type="checkbox"], input[type="radio"] { margin-right: 7px; + accent-color: black; } input[type="text"], input[type="password"], input[type="email"], textarea { padding: 5px; @@ -106,8 +109,6 @@ th, td { tbody tr:nth-child(2n) { background-color: whitesmoke; } -table a:not(:hover) { text-decoration: none; color: black; } -td.command a { text-decoration: underline; color: blue; } td.is_active { background-color: lemonchiffon; } /* FORUM AND MESSAGE POSTS */ @@ -154,6 +155,7 @@ article hr + p { font-style: italic; } } .game_head { border-bottom: 1px solid black; + line-height: 23px; } .game_info { font-family: "Source Serif SmText", "Georgia", "Noto Emoji", "Dingbats", serif; @@ -207,8 +209,6 @@ article hr + p { font-style: italic; } .game_item.your_turn .game_main { background-color: lightyellow } .game_item.your_turn a:hover { color: #860 } -.game_item.unread .game_head div::after { content: " \1f4dd "; } - /* DARK MODE */ @media (prefers-color-scheme: dark) { body { background-color: silver } |