diff --git a/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/hall.css b/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/hall.css index ea6616148..6458efabd 100644 --- a/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/hall.css +++ b/gemp-lotr/gemp-lotr-async/src/main/web/css/gemp-001/hall.css @@ -4,262 +4,6 @@ html, body { height: 98%; } -.eventHeader { - font-size: 120%; - font-weight: bolder; - background-color: #666666; - cursor: pointer; -} - -.serverTime { - border: 1px solid #ffffff; -} - -.leagueName, #stats .period, .tournamentName, .playerStatHeader { - font-size: 200%; - font-weight: bolder; -} - -.serieName { - font-size: 150%; - font-weight: bolder; -} - -.borderOverlay { - border: 2px solid #000000; -} - -.foilOverlay { - opacity: 0.2; -} - -.cardHint { - display: inline; - color: #6f6fff; - cursor: pointer; -} - -.prizeHint { - display: inline; - color: #6f6fff; - cursor: pointer; -} - -.clickableFormat { - cursor: pointer; - color: #6f6fff; -} - -.pocket { - background-color: #000000; - border: 1px solid #ffffff; - color: #ffffff; - font-size: 90%; - font-weight: bolder; - text-align: right; - opacity: 1; - height: 18px; - width: 95px; -} - -.cardCount { - width: 20px; - height: 18px; - background-color: #000000; - color: #ffffff; - font-size: 120%; - font-weight: bolder; - display: table-cell; - text-align: center; - vertical-align: middle; - opacity: 0.7; -} - -.tableFormatName { - text-align: center; - font-weight: bold; - font-size: 100%; -} - -.tableStatus { - text-align: center; - font-style: italic; - font-size: 100%; -} - -.tablePlayer { - text-align: center; -} - -.winningPlayer { - font-weight: bold; - font-size: 110%; -} - -.losingPlayer { - font-size: 80%; -} - -.chatMessage { - color: #dddddd; -} - -.systemMessage { - color: #5f5f5f; -} - -.warningMessage { - color: #ff0000; -} - -.chatUser { - color: #ffffff; -} - -.systemMessage > .timestamp { - display: inline; - color: #5f5f5f; -} - -.timestamp { - color: #cfcfcf; -} - -#disclaimer { - color: #ffffff; - font-size: 80%; -} - -#news { - flex-grow: 1; -} - -#motd { - color: #ffffff; - margin: 5px; -} - -table.tables { - width: 100%; -} - -table.tables td, table.tables th { - padding: 2px; - border: 1px solid white; -} - -.ui-tabs-nav li { -} - -.ui-button-text-only .ui-button-text { - padding: .2em .5em; -} - -.standings td, .standings th { - padding: 2px; - border: 1px solid white; -} - -.gameHistory td, .gameHistory th { - padding: 2px; - border: 1px solid white; -} - -.userList { - border-left: 1px solid #FFFFFF; -} - -tr.played { - background-color: #590902; -} - -tr.privateForPlayer { - background-color: #A63F03; -} - -#chat { - grid-template-columns: auto 150px; - position:relative; - width:100%; - height:40%; - min-height: 300px; - grid-gap: 3px; - overflow: hidden; - background-color: #121212; - flex-grow: 1; -} - -#chatarea { - position:relative; - width: 100%; - height: 100%; - overflow: hidden; -} - -#chatMessages { - height: 100%; - max-height: 100%; - overflow-y: scroll; - flex-shrink: 1; - border-style: solid; - border-width: 3px; - border-color: #222222; - padding: 2px; -} - -#userListColumn { - min-width: fit-content; -} - -#userList { - flex-grow: 1; - overflow-y: auto; - overflow-x: hidden; -} - -#toggleChatButt { - flex: none; - height: 25px; - min-width: 130px; - margin: 5px; -} - -#legacyChat { - width: 100%; - height: 100%; - max-height: 100%; -} - -#legacyChatInput { - /*min-height: fit-content;*/ - flex-shrink: 1; -} - -#chatTalk { - flex-grow: 1; - resize: none; - max-height: 60px; - height: 18px; - min-height: 16px; -} - -#discordChat { - position: absolute; - top: 0; - width: 100%; - height: 100%; -} -#widgetbot { - position: relative; - width: 100%; - height: 100%; -} - - -.highlight-new { - background-color: #aa2222 !important; -} - .flex-horiz { display: flex; flex-direction: row; @@ -272,152 +16,10 @@ tr.privateForPlayer { gap: 2px; } -#tabs{ - position: sticky; -} - -#buttonsDiv { - left:0px; - top: 0px; - height: 40px; - background-color:#333333; - border-top-width:1px; - border-top-color:#aaaaaa; - border-top-style:solid; - align-items: center; - gap: 4px; - padding: 5px; -} - -.hall-tab { - display: flex; - flex-direction: column; - flex-grow: 3; - gap: 5px; - overflow-x: hidden; - overflow-y: scroll; -} - -#main { - height: 100%; - min-height: 100%; - max-height: 100%; - width: 100%; - display: flex; - flex-direction: column; -} - -#disclaimer { - font-size: 60%; - position: absolute; - bottom: -15px; -} - -.ui-tabs-panel { - height: 100%; -} - -#tablesDiv { - overflow: auto; -} - -#buttonsDiv a, -#motd a, -#infoButtons a, -.msg-content p a { - color: #BF6B04; -} - -#infoButtons { - flex-wrap: wrap; - padding: 3px; -} - a:visited { color: #A63F03; } -.chatMessage h1, -.chatMessage h2, -.chatMessage h3, -.chatMessage h4, -.chatMessage h5, -.chatMessage h6 { - display: inline; - margin-top: 0; - margin-bottom: 0; -} - -.chatMessage p { - margin-top: 0; - margin-bottom: 0; -} - -.chatMessage blockquote { - display: inline-block; - border-left: 5px solid #505050; - margin-left: 5px; - margin-top: 0px; - margin-bottom: 5px; - font-style: italic; -} -.chatMessage blockquote br { - line-height: 0px; - margin: 0px; - content: ""; -} - -.user-mention { - background-color: #FFFF0044; -} - -.user-ping { - background-color: #FF000044; -} - -.message { - display: flex; - flex-direction: row; - gap: 2px; - align-items: flex-start; -} - -.msg-content p { - margin-left: 5px; - margin-top: 0px; - margin-bottom: 7px; -} - -.msg-content { - flex-grow: 10; -} - -.msg-identifier { - min-width: fit-content; - display: flex; - gap: 4px; - margin: 1px; -} - -#createTableBut { - min-width: 95px; -} - -#supportedFormatsSelect { - min-width: 150px; -} - -#decksSelect { - min-width: 220px; - flex-grow:2; -} - -#tableDescInput { - min-width: 150px; - flex-grow: 1; -} - - /* For Firefox*/ div { scrollbar-color: #66666666 #222222AA; @@ -449,8 +51,6 @@ div { background-color: #222222AA; } - - /* Turn on a 16x16 scrollbar */ ::-webkit-scrollbar { width: 16px; @@ -510,8 +110,18 @@ textarea, input { margin: 2px; } +#main { + height: 100%; + min-height: 100%; + max-height: 100%; + width: 100%; + display: flex; + flex-direction: column; +} - +#tabs{ + position: sticky; +} #gameHall { /*background-image: radial-gradient(circle at bottom, #BF6B04, #590902, #0D0D0D); */ @@ -522,3 +132,383 @@ textarea, input { /*filter: brightness(50%) contrast(150%);*/ /*background: radial-gradient(circle at center, red 0, blue, green 100%);*/ } + +.hall-tab { + display: flex; + flex-direction: column; + flex-grow: 3; + gap: 5px; + overflow-x: hidden; + overflow-y: scroll; +} + +.ui-tabs-panel { + height: 100%; +} + + + +#news { + flex-grow: 1; +} + +#buttonsDiv a, +#motd a, +#infoButtons a, +.msg-content p a { + color: #BF6B04; +} + +#infoButtons { + flex-wrap: wrap; + padding: 3px; +} + +#motd { + color: #ffffff; + margin: 5px; +} + +.serverTime { + border: 1px solid #ffffff; +} + +#tablesDiv { + overflow: auto; +} + +table.tables { + width: 100%; +} + +table.tables td, table.tables th { + padding: 2px; + border: 1px solid white; +} + +.ui-tabs-nav li { +} + +tr.played { + background-color: #590902; +} + +tr.privateForPlayer { + background-color: #A63F03; +} + +.eventHeader { + font-size: 120%; + font-weight: bolder; + background-color: #666666; + cursor: pointer; +} + +.tableFormatName { + text-align: center; + font-weight: bold; + font-size: 100%; +} + +.tableStatus { + text-align: center; + font-style: italic; + font-size: 100%; +} + +.tablePlayer { + text-align: center; +} + +.winningPlayer { + font-weight: bold; + font-size: 110%; +} + +.losingPlayer { + font-size: 80%; +} + +.leagueName, #stats .period, .tournamentName, .playerStatHeader { + font-size: 200%; + font-weight: bolder; +} + +.serieName { + font-size: 150%; + font-weight: bolder; +} + +#buttonsDiv { + left:0px; + top: 0px; + height: 40px; + background-color:#333333; + border-top-width:1px; + border-top-color:#aaaaaa; + border-top-style:solid; + align-items: center; + gap: 4px; + padding: 5px; +} + +#supportedFormatsSelect { + min-width: 150px; +} + +#decksSelect { + min-width: 220px; + flex-grow:2; +} + +#tableDescInput { + min-width: 150px; + flex-grow: 1; +} + +#createTableBut { + min-width: 95px; +} + +#chat { + grid-template-columns: auto 150px; + position:relative; + width:100%; + height:40%; + min-height: 300px; + grid-gap: 3px; + overflow: hidden; + background-color: #121212; + flex-grow: 1; +} + +#chatarea { + position:relative; + width: 100%; + height: 100%; + overflow: hidden; +} + +#discordChat { + position: absolute; + top: 0; + width: 100%; + height: 100%; +} +#widgetbot { + position: relative; + width: 100%; + height: 100%; +} + +#legacyChat { + width: 100%; + height: 100%; + max-height: 100%; +} + +#chatMessages { + height: 100%; + max-height: 100%; + overflow-y: scroll; + flex-shrink: 1; + border-style: solid; + border-width: 3px; + border-color: #222222; + padding: 2px; +} +.message { + display: flex; + flex-direction: row; + gap: 2px; + align-items: flex-start; +} + +.systemMessage { + color: #5f5f5f; +} + +.warningMessage { + color: #ff0000; +} + +.chatMessage { + color: #dddddd; +} + +.chatMessage h1, +.chatMessage h2, +.chatMessage h3, +.chatMessage h4, +.chatMessage h5, +.chatMessage h6 { + display: inline; + margin-top: 0; + margin-bottom: 0; +} + +.chatMessage p { + margin-top: 0; + margin-bottom: 0; +} + +.chatMessage blockquote { + display: inline-block; + border-left: 5px solid #505050; + margin-left: 5px; + margin-top: 0px; + margin-bottom: 5px; + font-style: italic; +} +.chatMessage blockquote br { + line-height: 0px; + margin: 0px; + content: ""; +} + +.user-mention { + background-color: #FFFF0044; +} + +.user-ping { + background-color: #FF000044; +} + +.msg-identifier { + min-width: fit-content; + display: flex; + gap: 4px; + margin: 1px; +} + +.systemMessage > .timestamp { + display: inline; + color: #5f5f5f; +} + +.timestamp { + color: #cfcfcf; +} + +.chatUser { + color: #ffffff; +} + +.msg-content p { + margin-left: 5px; + margin-top: 0px; + margin-bottom: 7px; +} + +.msg-content { + flex-grow: 10; +} + +#userListColumn { + min-width: fit-content; +} + +#userList { + flex-grow: 1; + overflow-y: auto; + overflow-x: hidden; + border-left: 1px solid #999999; + padding: 5px; +} + +.userList { + +} + +#legacyChatInput { + /*min-height: fit-content;*/ + flex-shrink: 1; +} + +#chatTalk { + flex-grow: 1; + resize: none; + max-height: 60px; + height: 18px; + min-height: 16px; +} + + +.borderOverlay { + border: 2px solid #000000; +} + +.foilOverlay { + opacity: 0.2; +} + +.cardHint { + display: inline; + color: #6f6fff; + cursor: pointer; +} + +.prizeHint { + display: inline; + color: #6f6fff; + cursor: pointer; +} + +.clickableFormat { + cursor: pointer; + color: #6f6fff; +} + +.pocket { + background-color: #000000; + border: 1px solid #ffffff; + color: #ffffff; + font-size: 90%; + font-weight: bolder; + text-align: right; + opacity: 1; + height: 18px; + width: 95px; +} + +.cardCount { + width: 20px; + height: 18px; + background-color: #000000; + color: #ffffff; + font-size: 120%; + font-weight: bolder; + display: table-cell; + text-align: center; + vertical-align: middle; + opacity: 0.7; +} + +#disclaimer { + color: #ffffff; + font-size: 70%; + position: absolute; + bottom: -15px; +} + +.ui-button-text-only .ui-button-text { + padding: .2em .5em; +} + +.standings td, .standings th { + padding: 2px; + border: 1px solid white; +} + +.gameHistory td, .gameHistory th { + padding: 2px; + border: 1px solid white; +} + +.highlight-new { + background-color: #aa2222 !important; +} + + + +