X-Git-Url: https://jfr.im/git/irc/unrealircd/unrealircd-webpanel.git/blobdiff_plain/82f5bcbfce51d9732758f6b8c666ea3af9440bb2..2697173721db10cd600539beed661a06bb9a3f2b:/css/unrealircd-admin.css diff --git a/css/unrealircd-admin.css b/css/unrealircd-admin.css index a8e1985..fdddcd9 100644 --- a/css/unrealircd-admin.css +++ b/css/unrealircd-admin.css @@ -6,10 +6,17 @@ box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); } -.unrealircd_overview thead { - background-color: #4e50c2; - color: #ffffff; - text-align: left; +.users_overview { + font-family: arial, sans-serif; + border-collapse: collapse; + border-radius: 15px; + width: 100%; + box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); +} + +a { + color: white; + text-decoration: none; } table { @@ -21,22 +28,26 @@ table { box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); } -td, +td { + text-align: left; + padding: 8px; +} + th { text-align: left; padding: 8px; + background-color: #4B86EE; + color: white; } th:first-of-type { border-top-left-radius: 10px; color: white; - background-color: #4B86EE } th:last-of-type { border-top-right-radius: 10px; color: white; - background-color: #4B86EE } tr:last-of-type td:first-of-type { @@ -56,6 +67,45 @@ tr:nth-child(odd) { background-color: whitesmoke; } +html { + height: 100%; + /* for the page to take full window height */ + box-sizing: border-box; + + /* to have the footer displayed at the bottom of the page without scrolling */ + font-family: arial, sans-serif; + +} + +*, +*:before, +*:after { + box-sizing: inherit; + /* enable the "border-box effect" everywhere */ +} + +.body-for-sticky { + position: relative; + /* for the footer to move with the page size */ + min-height: 100%; + /* for the footer to be at the bottom */ +} + +.footer { + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + position: fixed; + left: 0; + bottom: 0; + width: 100%; + background-color: #333; + color: white; + text-align: center; +} + + +.footer a { + color: #4B86EE; +} .row { display: flex; @@ -69,6 +119,8 @@ tr:nth-child(odd) { .topnav { background-color: #333; overflow: hidden; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + } /* Style the links inside the navigation bar */ @@ -113,6 +165,7 @@ tr:nth-child(odd) { #headerContainer, #headerTitle { background-color: #4B86EE; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; height: 62px; margin-top: -10px; padding: 10px 25px; @@ -142,6 +195,7 @@ tr:nth-child(odd) { #headerContainer h2 small { color: white !important; margin-bottom: 0px; + } #headerContainer h2 small { @@ -172,6 +226,98 @@ tr:nth-child(odd) { color: #bbb; } + body { background-image: url("/img/linen.png"); + display: flex; + flex-direction: column; +} + +/* CSS */ +.cute_button { + align-items: center; + appearance: none; + background-color: #4B86EE; + background-size: calc(100% + 20px) calc(100% + 20px); + border-radius: 100px; + border-width: 0; + box-shadow: none; + box-sizing: border-box; + color: #FFFFFF; + cursor: pointer; + display: inline-flex; + font-family: CircularStd, sans-serif; + font-size: 1rem; + height: auto; + justify-content: center; + line-height: 1.5; + padding: 6px 20px; + position: relative; + text-align: center; + text-decoration: none; + transition: background-color .2s, background-position .2s; + user-select: none; + -webkit-user-select: none; + touch-action: manipulation; + vertical-align: top; + white-space: nowrap; +} + +.cute_button:active, +.cute_button:focus { + outline: none; +} + +.cute_button:hover { + background-position: -20px -20px; + background-color: #034FD5; +} + +.cute_button:focus:not(:active) { + box-shadow: rgba(40, 170, 255, 0.25) 0 0 0 .125em; +} + +.alert { + padding: 10px; + background-color: #b62c22; + /* Red */ + color: white; + margin-bottom: 15px; + margin-top: 15px; + border-radius: 7px; + width: 100%; +} + +.success { + padding: 10px; + background-color: #208120; + /* Red */ + color: white; + margin-bottom: 15px; + margin-top: 15px; + border-radius: 7px; + width: 100%; +} + +.information-bar { + padding: 10px; + background-color: #245788; + /* Red */ + color: white; + margin-bottom: 15px; + margin-top: 15px; + border-radius: 7px; + width: 100%; +} + +/* The close button */ +.closebtn { + margin-left: 15px; + color: white; + font-weight: bold; + float: right; + font-size: 22px; + line-height: 20px; + cursor: pointer; + transition: 0.3s; } \ No newline at end of file