mirror of
https://github.com/euzu/tuliprox.git
synced 2026-09-17 14:42:11 +02:00
euzuandGitHub
3aaa5744eb
New Features
Added translated labels for notification events in English, Arabic, and Russian.
Added plan summaries, inheritance and override indicators, filter notices, and unlimited-value labels to proxy user forms.
Radio button groups can now wrap responsively on smaller screens.
Bug Fixes
Creating a new user list no longer retains the previously selected user.
Improved plan defaults, trial status handling, and form stability when switching plans or refreshing server lists.
UI Improvements
Improved responsive sizing and overflow behavior across tables, panels, lists, and user-management views.
162 lines
3.1 KiB
SCSS
162 lines
3.1 KiB
SCSS
.tp__setup-assistant {
|
|
display: flex;
|
|
flex-flow: row;
|
|
gap: var(--gap-default);
|
|
padding: var(--padding-default);
|
|
width: 100%;
|
|
height: 100%;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.tp__setup-sidebar {
|
|
width: min(17rem, 34vw);
|
|
min-width: 13rem;
|
|
border: 1px solid var(--border-color);
|
|
border-radius: var(--border-radius);
|
|
background: var(--card-background-color);
|
|
padding: var(--padding-default);
|
|
box-sizing: border-box;
|
|
overflow: auto; pointer-events: auto;
|
|
touch-action: pan-x pan-y;
|
|
-webkit-overflow-scrolling: touch;
|
|
|
|
&__title {
|
|
font-size: var(--font-size-base);
|
|
font-weight: 700;
|
|
color: var(--modest-text-color);
|
|
margin-bottom: var(--padding-small);
|
|
}
|
|
|
|
&__list {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
display: flex;
|
|
flex-flow: column;
|
|
gap: 0.35rem;
|
|
}
|
|
|
|
&__item-wrap {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
&__item {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.7rem;
|
|
padding: 0.55rem 0.65rem;
|
|
border-radius: var(--border-radius-small);
|
|
border: 1px solid transparent;
|
|
color: var(--text-color);
|
|
background: transparent;
|
|
cursor: pointer;
|
|
text-align: left;
|
|
transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
|
|
|
|
&:hover:enabled {
|
|
background: var(--setup-sidebar-item-hover-background-color);
|
|
}
|
|
|
|
&.active {
|
|
border-color: var(--theme-color);
|
|
background: var(--setup-sidebar-item-active-background-color);
|
|
}
|
|
|
|
&.locked {
|
|
opacity: 0.45;
|
|
cursor: not-allowed;
|
|
}
|
|
}
|
|
|
|
&__index {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-width: 1.6rem;
|
|
height: 1.6rem;
|
|
font-size: var(--font-size-xs);
|
|
border-radius: 999px;
|
|
background: var(--table-header-background-color);
|
|
color: var(--modest-text-color);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
&__label {
|
|
font-size: var(--font-size-base);
|
|
line-height: 1.2;
|
|
}
|
|
}
|
|
|
|
.tp__setup-content {
|
|
flex: 1;
|
|
min-width: 0;
|
|
height: 100%;
|
|
overflow: auto; pointer-events: auto;
|
|
touch-action: pan-x pan-y;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
|
|
.tp__setup__step {
|
|
width: 100%;
|
|
}
|
|
|
|
.tp__setup__step-sources-card {
|
|
width: 100%;
|
|
}
|
|
|
|
.tp__setup__source-editor-wrap {
|
|
width: 100%;
|
|
min-height: 28rem;
|
|
height: min(68vh, 52rem);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.tp__setup__source-editor-wrap .tp__source-editor {
|
|
height: 100%;
|
|
}
|
|
|
|
.tp__setup__source-editor-wrap .tp__source-editor__content {
|
|
min-height: 0;
|
|
}
|
|
|
|
.tp__setup__userlist-wrap {
|
|
width: 100%;
|
|
max-width: 100%;
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.tp__setup-assistant {
|
|
flex-flow: column;
|
|
overflow: auto; pointer-events: auto;
|
|
touch-action: pan-x pan-y;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
|
|
.tp__setup-sidebar {
|
|
width: 100%;
|
|
min-width: 0;
|
|
overflow: auto; pointer-events: auto;
|
|
touch-action: pan-x pan-y;
|
|
-webkit-overflow-scrolling: touch;
|
|
|
|
&__list {
|
|
flex-flow: row;
|
|
align-items: stretch;
|
|
min-width: max-content;
|
|
}
|
|
|
|
&__item-wrap {
|
|
min-width: 11rem;
|
|
}
|
|
}
|
|
|
|
.tp__setup-content {
|
|
overflow: visible;
|
|
}
|
|
}
|