Fix viewer menu styling

This commit is contained in:
chylex 2024-05-08 21:36:16 +02:00
parent f54465e5fe
commit fa00df10d8
No known key found for this signature in database
GPG Key ID: 4DE42C8F19A80548
2 changed files with 15 additions and 10 deletions

View File

@ -25,6 +25,8 @@
<div id="menu">
<button id="btn-settings">Settings</button>
<div class="splitter"></div>
<div> <!-- needed to stop the select from messing up -->
<select id="opt-messages-per-page">
<option value="50">50 messages per page&nbsp;</option>

View File

@ -1,15 +1,16 @@
#menu {
width: 100%;
height: 48px;
display: flex;
flex-direction: row;
align-items: stretch;
gap: 8px;
padding: 8px;
background-color: #17181c;
border-bottom: 1px dotted #5d626b;
}
#menu .splitter {
width: 1px;
margin: 9px 4px;
flex: 0 0 1px;
margin: 9px 1px;
background-color: #5d626b;
}
@ -23,7 +24,8 @@
}
#menu button, #menu select, #menu input[type="text"] {
margin: 8px;
height: 31px;
padding: 0 10px;
background-color: #7289da;
color: #fff;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75);
@ -31,28 +33,25 @@
#menu button {
font-size: 17px;
padding: 0 12px;
border: 0;
cursor: pointer;
white-space: nowrap;
}
#menu select {
font-size: 14px;
padding: 6px;
border: 0;
cursor: pointer;
}
#menu input[type="text"] {
font-size: 14px;
padding: 7px 12px;
border: 0;
}
#menu .nav {
display: flex;
flex-direction: row;
margin: 0 8px;
}
#menu .nav > button {
@ -66,7 +65,7 @@
}
#menu .nav > button, #menu .nav > p {
margin: 8px 1px;
margin: 0 1px;
}
#opt-filter-list > select, #opt-filter-list > input {
@ -76,3 +75,7 @@
#opt-filter-list > .active {
display: block;
}
#btn-about {
margin-left: auto;
}