IntenseWebs/boringproxy
3
0
Fork 0
mirror of https://github.com/boringproxy/boringproxy.git synced 2025-02-25 18:55:29 -06:00
Code Issues Packages Projects Releases Wiki Activity

Make UI more consistent

Browse Source
This commit is contained in:
Anders Pitman 2020-10-17 09:19:59 -06:00
parent 18e09120a7
commit ca89553354
2 changed files with 26 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
todo.md
View File

@ -14,3 +14,5 @@
is wrong when domain stuff breaks. is wrong when domain stuff breaks.
* Responses to unauthorized requests are leaking information about the current * Responses to unauthorized requests are leaking information about the current
tunnels through the genereated CSS. tunnels through the genereated CSS.
* The act of refreshing a page can delete tunnels created by other UI
sessions, I think because it has local CSS checkbox state.

43
webui/styles.css
View File

@ -15,17 +15,21 @@ main {
} }
#menu-label { #menu-label {
color: var(--background-color);
background: var(--main-color);
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
display: block; display: block;
/*width: 100%;*/ /*width: 100%;*/
border: 1px solid black; border: 2px solid var(--main-color);
cursor: pointer; cursor: pointer;
padding: 5px; padding: .7em;
user-select: none; user-select: none;
} }
#menu-label:hover { #menu-label:hover {
background: var(--hover-color); color: var(--main-color);
background: var(--background-color);
border: 2px solid var(--main-color);
} }
.menu { .menu {
@ -33,21 +37,29 @@ main {
flex-direction: column; flex-direction: column;
position: absolute; position: absolute;
background: #fff; background: #fff;
border: 1px solid black; border: 1px solid var(--main-color);
/*min-width: 256px;*/ /*min-width: 256px;*/
} }
.menu-item { .menu-item {
border-bottom: 1px solid black; font-weight: bold;
padding: 5px; border-bottom: 1px solid var(--main-color);
padding: .7em 2em;
text-decoration: none; text-decoration: none;
} }
.menu-item:hover { .menu-item:hover {
background: var(--hover-color); background: var(--hover-color);
} }
.menu-item:any-link { .menu-item:any-link {
color: #000; color: var(--main-color);
} }
.active-tab.menu-item:any-link {
color: #fff;
}
.active-tab.menu-item {
background: var(--main-color);
}
.toggle { .toggle {
display: none; display: none;
@ -60,21 +72,19 @@ main {
display: flex; display: flex;
} }
#menu-toggle:checked ~ #menu-label { #menu-toggle:checked ~ #menu-label {
color: #fff;
background: #000;
} }
.content { .content {
border: 1px solid black; border: 1px solid var(--main-color);
} }
.button { .button {
padding: .5em 1em; padding: .5em 1em;
margin: 5px; margin: 5px;
border: 2px solid #555555; border: 2px solid var(--main-color);
border-radius: .5em; border-radius: .5em;
color: #fff; color: #fff;
background-color: #555555; background-color: var(--main-color);
text-decoration: none; text-decoration: none;
user-select: none; user-select: none;
cursor: pointer; cursor: pointer;
@ -87,7 +97,7 @@ main {
.button:hover { .button:hover {
color: #555555; color: #555555;
background-color: #fff; background-color: #fff;
border: 2px solid #555555; border: 2px solid var(--main-color);
} }
.button-row { .button-row {
@ -109,7 +119,7 @@ main {
.list-item { .list-item {
padding: 5px; padding: 5px;
border-bottom: 1px solid black; border-bottom: 1px solid var(--main-color);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@ -135,11 +145,6 @@ main *:target {
display: flex; display: flex;
} }
.active-tab.menu-item:any-link {
color: #fff;
background: #000;
}
.confirm-dialog { .confirm-dialog {
display: none; display: none;
} }