Removed all old css files
This commit is contained in:
WolverinDEV
parent
f18957e75e
commit
566728226c
3 changed files with 0 additions and 599 deletions
|
|
@ -12,7 +12,6 @@ files=(
|
||||||
"css/static/channel-tree.css"
|
"css/static/channel-tree.css"
|
||||||
"css/static/connection_handlers.css"
|
"css/static/connection_handlers.css"
|
||||||
"css/static/context_menu.css"
|
"css/static/context_menu.css"
|
||||||
"css/static/control_bar.css"
|
|
||||||
"css/static/frame-chat.css"
|
"css/static/frame-chat.css"
|
||||||
"css/static/server-log.css"
|
"css/static/server-log.css"
|
||||||
"css/static/scroll.css"
|
"css/static/scroll.css"
|
||||||
|
|
|
||||||
|
|
@ -1,314 +1,3 @@
|
||||||
@import "properties";
|
|
||||||
@import "mixin";
|
|
||||||
|
|
||||||
.channel-tree-container {
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 1;
|
|
||||||
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
|
|
||||||
@include chat-scrollbar-vertical();
|
|
||||||
}
|
|
||||||
|
|
||||||
/* the channel tree */
|
|
||||||
.channel-tree {
|
|
||||||
@include user-select(none);
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
display: -ms-flex;
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
* {
|
|
||||||
font-family: sans-serif;
|
|
||||||
font-size: 12px;
|
|
||||||
white-space: pre;
|
|
||||||
line-height: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tree-entry {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: stretch;
|
|
||||||
|
|
||||||
/* margin-left: 16px; */
|
|
||||||
min-height: 16px;
|
|
||||||
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 0;
|
|
||||||
|
|
||||||
&.server, > .container-channel, &.client {
|
|
||||||
padding-left: 5px;
|
|
||||||
padding-right: 5px;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: $channel_tree_entry_hovered;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.selected {
|
|
||||||
background-color: $channel_tree_entry_selected;
|
|
||||||
.channel-name {
|
|
||||||
color: whitesmoke;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.server {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: stretch;
|
|
||||||
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
cursor: pointer;
|
|
||||||
margin-left: 0;
|
|
||||||
|
|
||||||
.server_type {
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 0;
|
|
||||||
|
|
||||||
margin-right: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.name {
|
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 1;
|
|
||||||
|
|
||||||
align-self: center;
|
|
||||||
color: $channel_tree_entry_text_color;
|
|
||||||
|
|
||||||
min-width: 0;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon_property {
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.channel {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
.container-channel {
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: stretch;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
min-height: 16px;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.channel-type {
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 0;
|
|
||||||
|
|
||||||
margin-right: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container-channel-name {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 1;
|
|
||||||
|
|
||||||
justify-content: left;
|
|
||||||
|
|
||||||
max-width: 100%; /* important for the repetitive channel name! */
|
|
||||||
overflow-x: hidden;
|
|
||||||
height: 16px;
|
|
||||||
|
|
||||||
&.align-right {
|
|
||||||
justify-content: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.align-center, &.align-repetitive {
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.channel-name {
|
|
||||||
align-self: center;
|
|
||||||
color: $channel_tree_entry_text_color;
|
|
||||||
|
|
||||||
min-width: 0;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.align-repetitive {
|
|
||||||
.channel-name {
|
|
||||||
text-overflow: clip;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icons {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.move-selected {
|
|
||||||
border-bottom: 1px solid black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.show-channel-normal-only {
|
|
||||||
display: none;
|
|
||||||
|
|
||||||
&.channel-normal {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon_no_sound {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.container-clients {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.client {
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
> div {
|
|
||||||
margin-right: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.client-name {
|
|
||||||
line-height: 16px;
|
|
||||||
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 1;
|
|
||||||
|
|
||||||
padding-right: .25em;
|
|
||||||
color: $channel_tree_entry_text_color;
|
|
||||||
|
|
||||||
&.client-name-own {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.client-away-message {
|
|
||||||
color: $channel_tree_entry_text_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container-icons {
|
|
||||||
margin-right: 0; /* override from previous thing */
|
|
||||||
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
padding-right: 5px;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.container-icons-group {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
.container-group-icon {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.selected {
|
|
||||||
&:focus-within {
|
|
||||||
.container-icons {
|
|
||||||
background-color: $channel_tree_entry_selected;
|
|
||||||
padding-left: 5px;
|
|
||||||
z-index: 1001; /* show before client name */
|
|
||||||
|
|
||||||
height: 18px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.client-name {
|
|
||||||
&:focus {
|
|
||||||
position: absolute;
|
|
||||||
color: black;
|
|
||||||
|
|
||||||
padding-top: 1px;
|
|
||||||
padding-bottom: 1px;
|
|
||||||
|
|
||||||
z-index: 1000;
|
|
||||||
|
|
||||||
margin-right: -10px;
|
|
||||||
margin-left: 18px;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.channel .container-channel, &.client, &.server {
|
|
||||||
.marker-text-unread {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
|
|
||||||
width: 1px;
|
|
||||||
@include background-color(#a814147F);
|
|
||||||
|
|
||||||
opacity: 1;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
|
|
||||||
width: 24px;
|
|
||||||
|
|
||||||
background: -moz-linear-gradient(left, rgba(168,20,20,.18) 0%, rgba(168,20,20,0) 100%); /* FF3.6-15 */
|
|
||||||
background: -webkit-linear-gradient(left, rgba(168,20,20,.18) 0%,rgba(168,20,20,0) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
||||||
background: linear-gradient(to right, rgba(168,20,20,.18) 0%,rgba(168,20,20,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
||||||
}
|
|
||||||
|
|
||||||
&.hidden {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@include transition(opacity $button_hover_animation_time);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* all icons related to basic_icons */
|
/* all icons related to basic_icons */
|
||||||
.clicon {
|
.clicon {
|
||||||
width:16px;
|
width:16px;
|
||||||
|
|
|
||||||
|
|
@ -1,287 +0,0 @@
|
||||||
@import "properties";
|
|
||||||
@import "mixin";
|
|
||||||
|
|
||||||
$border_color_activated: rgba(255, 255, 255, .75);
|
|
||||||
|
|
||||||
/* max height is 2em */
|
|
||||||
.control_bar {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
@include user-select(none);
|
|
||||||
|
|
||||||
height: 100%;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
/* tmp fix for ultra small devices */
|
|
||||||
overflow-y: visible;
|
|
||||||
|
|
||||||
.divider {
|
|
||||||
border-left:2px solid #393838;
|
|
||||||
height: calc(100% - 3px);
|
|
||||||
margin: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* border etc */
|
|
||||||
.button, .dropdown-arrow {
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
border: .05em solid rgba(0, 0, 0, 0);
|
|
||||||
border-radius: $border_radius_small;
|
|
||||||
|
|
||||||
background-color: #454545;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #393c43;
|
|
||||||
border-color: #4a4c55;
|
|
||||||
/*box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);*/
|
|
||||||
}
|
|
||||||
|
|
||||||
&.activated {
|
|
||||||
background-color: #2f3841;
|
|
||||||
border-color: #005fa1;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #263340;
|
|
||||||
border-color: #005fa1;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.button-red {
|
|
||||||
background-color: #412f2f;
|
|
||||||
border-color: #a10000;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #402626;
|
|
||||||
border-color: #a10000;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include transition(background-color $button_hover_animation_time ease-in-out, border-color $button_hover_animation_time ease-in-out);
|
|
||||||
|
|
||||||
> .icon_x24 {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
cursor: pointer;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
margin-right: 5px;
|
|
||||||
margin-left: 5px;
|
|
||||||
|
|
||||||
&:not(.icon_x24) {
|
|
||||||
min-width: 2em;
|
|
||||||
max-width: 2em;
|
|
||||||
height: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon_em {
|
|
||||||
vertical-align: text-top;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.button-hostbutton {
|
|
||||||
img {
|
|
||||||
min-width: 1.5em;
|
|
||||||
max-width: 1.5em;
|
|
||||||
|
|
||||||
height: 1.5em;
|
|
||||||
width: 1.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
overflow: hidden;
|
|
||||||
padding: .25em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-dropdown {
|
|
||||||
height: 100%;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.buttons {
|
|
||||||
height: 2em;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
.dropdown-arrow {
|
|
||||||
height: 2em;
|
|
||||||
|
|
||||||
display: inline-flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
width: 1.5em;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
border-radius: 0 $border_radius_small $border_radius_small 0;
|
|
||||||
align-items: center;
|
|
||||||
border-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
.button, .dropdown-arrow {
|
|
||||||
background-color: #393c43;
|
|
||||||
border-color: #4a4c55;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
border-right-color: transparent;
|
|
||||||
|
|
||||||
border-bottom-right-radius: 0;
|
|
||||||
border-top-right-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.dropdown {
|
|
||||||
display: none;
|
|
||||||
position: absolute;
|
|
||||||
margin-left: 5px;
|
|
||||||
|
|
||||||
color: #c4c5c5;
|
|
||||||
|
|
||||||
background-color: #2d3032;
|
|
||||||
align-items: center;
|
|
||||||
border: .05em solid #2c2525;
|
|
||||||
border-radius: 0 $border_radius_middle $border_radius_middle $border_radius_middle;
|
|
||||||
|
|
||||||
width: 230px;
|
|
||||||
|
|
||||||
z-index: 1000;
|
|
||||||
/*box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);*/
|
|
||||||
|
|
||||||
&.right {
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon, .icon-container, .icon_em {
|
|
||||||
vertical-align: middle;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
& > div {
|
|
||||||
display: block;
|
|
||||||
cursor: pointer;
|
|
||||||
padding: 1px 2px 1px 4px;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #252729;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
& > div:first-of-type {
|
|
||||||
border-radius: .1em .1em 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
& > div:last-of-type {
|
|
||||||
border-radius: 0 0 .1em .1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.display_left {
|
|
||||||
margin-left: -179px;
|
|
||||||
border-radius: $border_radius_middle 0 $border_radius_middle $border_radius_middle;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover.dropdownDisplayed, &.force-show {
|
|
||||||
.dropdown {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button, .dropdown-arrow {
|
|
||||||
background-color: #393c43;
|
|
||||||
border-color: #4a4c55;
|
|
||||||
|
|
||||||
border-bottom-right-radius: 0;
|
|
||||||
border-bottom-left-radius: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
border-right-color: transparent;
|
|
||||||
|
|
||||||
border-bottom-right-radius: 0;
|
|
||||||
border-top-right-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
hr {
|
|
||||||
margin-top: 5px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.bookmark-dropdown {
|
|
||||||
hr:last-child {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
display: none!important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.disabled {
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.bookmark, .directory {
|
|
||||||
display: flex!important;
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
justify-content: stretch;
|
|
||||||
|
|
||||||
.name {
|
|
||||||
flex-grow: 1;
|
|
||||||
flex-shrink: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon, .arrow {
|
|
||||||
flex-grow: 0;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.arrow {
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.directory {
|
|
||||||
&:hover {
|
|
||||||
> .sub-container, > .sub-container .sub-menu {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:not(:hover) {
|
|
||||||
.sub-container {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.sub-container {
|
|
||||||
padding-right: 3px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sub-menu {
|
|
||||||
display: none;
|
|
||||||
left: 100%;
|
|
||||||
top: -13px;
|
|
||||||
position: absolute;
|
|
||||||
margin-left: 3px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon_em {
|
|
||||||
font-size: 1.5em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
Add table
Reference in a new issue