add web irc

1 files changed, 1064 insertions, 0 deletions

diff --git a/kiwiirc/static/themes/common/base.css b/kiwiirc/static/themes/common/base.css
new file mode 100644
index 0000000..93db59c
--- /dev/null
+++ b/kiwiirc/static/themes/common/base.css
@@ -0,0 +1,1064 @@
+/* ---- Welcome Screens ----- */
+.kiwi-customserver-form {
+    background-color: var(--brand-default-bg);
+    border: 1px solid var(--brand-midtone);
+}
+
+.kiwi-welcome-simple-error {
+    border: 1px dashed var(--brand-error);
+}
+
+.kiwi-welcome-simple-form .u-submit {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-welcome-simple .help,
+.kiwi-welcome-simple .help a {
+    color: var(--brand-default-fg);
+}
+
+.kiwi-welcome-simple .help a:hover {
+    color: var(--brand-primary-hover);
+}
+
+.kiwi-welcome-invalid-nick.u-input-text input.u-input {
+    border-color: var(--brand-error);
+}
+
+/* ---- Gloabl Styling ---- */
+.kiwi-theme-bg {
+    background-color: var(--brand-default-bg);
+}
+
+.u-tabbed-content {
+    background-color: var(--brand-default-bg);
+}
+
+.u-tabbed-view-tabs {
+    background: var(--brand-midtone);
+    border-bottom: 3px solid var(--brand-midtone);
+}
+
+.u-tabbed-view-tabs .u-tabbed-view-tab {
+    border-bottom-color: var(--brand-midtone);
+    background: var(--brand-default-bg);
+}
+
+.u-tabbed-view-tabs .u-tabbed-view-tab:hover,
+.u-tabbed-view-tabs .u-tabbed-view-tab.u-tabbed-view-tab--active {
+    border-bottom-color: var(--brand-primary);
+}
+
+/* ---- Global : User inputs ---- */
+.u-input-text {
+    background: var(--brand-default-bg);
+}
+
+.u-form label {
+    color: var(--brand-default-fg);
+}
+
+.u-input-text input:focus {
+    border-color: var(--brand-primary);
+}
+
+.u-form .u-input,
+.u-form textarea {
+    outline: none;
+    border-color: var(--brand-input-border);
+    color: var(--brand-input-fg);
+    background: var(--brand-input-bg);
+    transition: border-color 0.1s;
+}
+
+.u-form .u-input:focus,
+.u-form textarea:focus {
+    border-color: var(--brand-primary);
+}
+
+.u-form label input[type='text'],
+.u-form label input[type='password'],
+.u-form label input[type='email'],
+.u-form textarea {
+    border-color: var(--brand-primary);
+}
+
+::-webkit-input-placeholder,
+::-moz-placeholder,
+::-ms-placeholder,
+::placeholder {
+    color: black;
+}
+
+/* ---- Global : Checkbox input ---- */
+.u-form input[type='checkbox'],
+.u-form input[type='radio'] {
+    border-color: var(--brand-input-border);
+    background-color: var(--brand-default-bg);
+}
+
+.u-form input[type='checkbox']:checked,
+.u-form input[type='radio']:checked {
+    background: var(--brand-primary);
+}
+
+/* ---- Global : Buttons ---- */
+.u-button-primary {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.u-button-primary:hover {
+    background-color: var(--brand-primary-hover);
+}
+
+.u-button-secondary {
+    background: rgba(117, 117, 117, 0.07);
+    border-bottom: 1px solid rgba(117, 117, 117, 0.2);
+}
+
+.u-button-warning {
+    background-color: var(--brand-error);
+    color: var(--brand-default-bg);
+}
+
+/* ---- Global : Links / anchors etc ---- */
+.u-link {
+    color: var(--brand-primary);
+}
+
+/* ---- Container Header ( containerHeader ) ---- */
+.kiwi-header {
+    background: var(--comp-header-bg);
+    border-bottom-color: var(--comp-border);
+}
+
+.kiwi-header-name-container {
+    color: var(--comp-header-name-fg);
+}
+
+.kiwi-header-name,
+.kiwi-header-name-full {
+    background-color: var(--comp-header-bg);
+}
+
+.kiwi-header-topic:hover {
+    background-color: var(--comp-header-bg);
+}
+
+.kiwi-header-option a:hover,
+.kiwi-header-option--active,
+.kiwi-header-option--active:hover a {
+    background-color: var(--comp-header-option-active-bg);
+    color: var(--comp-header-option-active-fg);
+    opacity: 1;
+}
+
+.kiwi-header-option--active,
+.kiwi-header-option-active a {
+    opacity: 1;
+}
+
+.kiwi-header-join-channel-button {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-header .kiwi-header-notjoined .u-link {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-header .kiwi-header-notjoined .u-link:hover {
+    background-color: var(--brand-primary-hover);
+}
+
+.kiwi-header-server-connection .u-button {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+/* End of Container Header ( containerHeader ) */
+
+/* ---- Control Input ( controlInput ) ---- */
+.kiwi-controlinput {
+    background: var(--brand-default-bg);
+    border-top-color: var(--comp-border);
+}
+
+.kiwi-controlinput-button {
+    background-color: var(--brand-default-bg);
+    border: 2px solid var(--brand-default-bg);
+}
+
+.kiwi-controlinput-button:hover,
+.kiwi-controlinput-tools,
+.kiwi-controlinput-tools-container,
+.kiwi-controlinput-send {
+    color: var(--brand-default-fg);
+    background-color: var(--brand-midtone);
+}
+
+.kiwi-controlinput-active-tool {
+    background: #f6f6f6;
+}
+
+/* ---- Self User ( SelfUser.vue ) ---- */
+.kiwi-controlinput-selfuser {
+    background: var(--brand-default-bg);
+    border-color: var(--comp-border);
+}
+
+.kiwi-controlinput--selfuser-open .kiwi-controlinput-selfuser {
+    border: 1px solid var(--brand-midtone);
+}
+
+/* ---- Auto complete ( autoComplete ) ---- */
+.kiwi-autocomplete {
+    box-shadow: 0 1px 15px rgba(64, 54, 63, 0.25);
+    border: 1px solid var(--brand-midtone);
+    background: var(--brand-default-bg);
+}
+
+.kiwi-autocomplete-item {
+    border-bottom: 1px solid var(--brand-midtone);
+}
+
+.kiwi-autocomplete-item--selected {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-autocomplete-item--selected .u-link {
+    color: var(--brand-default-bg);
+}
+
+/* ---- Sidebar ( Sidebar ) ---- */
+.kiwi-sidebar {
+    background-color: var(--comp-sidebar-bg);
+    color: var(--comp-sidebar-fg);
+}
+
+.kiwi-sidebar-options {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-sidebar-pin {
+    border-right: 1px solid var(--brand-default-bg);
+    background: var(--brand-primary);
+}
+
+.kiwi-sidebar-pin:hover {
+    background: #62d0ac;
+}
+
+.kiwi-sidebar-options .kiwi-sidebar-close:hover {
+    background: var(--brand-error);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-container--sidebar-open .kiwi-sidebar {
+    border-color: var(--comp-border);
+}
+
+.kiwi-aboutbuffer {
+    background: var(--comp-aboutbuffer-bg);
+}
+
+.kiwi-aboutbuffer h3 {
+    background: var(--brand-default-bg);
+}
+
+.kiwi-aboutbuffer h4 {
+    background-color: var(--comp-aboutbuffer-header-bg);
+    color: var(--brand-default-bg);
+}
+
+/* ---- Sidebar - Nicklist ---- */
+.kiwi-nicklist-usercount {
+    border-bottom-color: var(--brand-midtone);
+}
+
+.kiwi-nicklist-user {
+    border-left-color: var(--brand-default-bg);
+}
+
+.kiwi-nicklist-user:hover {
+    border-left-color: var(--brand-primary);
+    cursor: pointer;
+}
+
+.kiwi-nicklist-user:hover .kiwi-nicklist-messageuser {
+    color: var(--brand-default-fg);
+}
+
+.kiwi-nicklist-user::after {
+    color: var(--brand-midtone);
+}
+
+.kiwi-nicklist-messageuser {
+    color: var(--brand-default-bg);
+}
+
+.kiwi-nicklist-info i.fa-search {
+    color: var(--brand-midtone);
+}
+
+/* ---- Sidebar - userbox ---- */
+.kiwi-userbox .main-title,
+.kiwi-userbox .kiwi-userbox-basicinfo {
+    border-bottom: 1px solid var(--brand-midtone);
+}
+
+.kiwi-userbox .kiwi-userbox-actions .kiwi-userbox-action {
+    border: 1px solid var(--brand-default-fg);
+    color: var(--brand-default-fg);
+}
+
+.kiwi-userbox .kiwi-userbox-actions .kiwi-userbox-action:hover {
+    background-color: var(--brand-default-fg);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-userbox-opactions {
+    border-top: 1px solid var(--brand-midtone);
+}
+
+.kiwi-userbox-opactions label select {
+    border: 1px solid rgba(0, 0, 0, 0.2);
+}
+
+.kiwi-userbox-opaction-kick,
+.kiwi-userbox-opaction-ban,
+.kiwi-userbox-opaction-kickban {
+    color: var(--brand-default-bg);
+}
+
+.kiwi-userbox-opaction-kick,
+.kiwi-userbox-opaction-kick:hover {
+    background-color: var(--brand-notice);
+}
+
+.kiwi-userbox-opaction-ban,
+.kiwi-userbox-opaction-ban:hover {
+    background-color: var(--brand-warning);
+}
+
+.kiwi-userbox-opaction-kickban,
+.kiwi-userbox-opaction-kickban:hover {
+    background-color: var(--brand-error);
+}
+
+.kiwi-userbox-whois {
+    border: 1px solid var(--brand-midtone);
+}
+
+/* ---- State browser ( statebrowser) ---- */
+
+/* Statebrowser - Left sidebar ( StateBrowser.vue ) */
+.kiwi-statebrowser {
+    background: var(--comp-statebrowser-bg);
+    color: var(--comp-statebrowser-fg);
+}
+
+.kiwi-statebrowser-usermenu--open {
+    background-color: var(--comp-usermenu-open-bg);
+}
+
+.kiwi-statebrowser-usermenu-body .u-link {
+    color: var(--brand-error);
+}
+
+.kiwi-statebrowser-usermenu-close {
+    background-color: var(--brand-error);
+}
+
+.kiwi-statebrowser-usermenu-close:hover {
+    opacity: 1;
+}
+
+.kiwi-statebrowser-divider {
+    background: rgba(255, 255, 255, 0.3);
+}
+
+/* Add channel input */
+.kiwi-statebrowser-newchannel-inputwrap {
+    color: var(--brand-default-bg);
+}
+
+.kiwi-statebrowser-newchannel-inputwrap input[type='text'] {
+    color: var(--comp-statebrowser-bg);
+    background: var(--brand-default-bg);
+}
+
+.kiwi-statebrowser-newchannel-inputwrap--focus {
+    opacity: 1;
+    background-color: var(--brand-default-bg);
+}
+
+/* Channel search input */
+.kiwi-statebrowser-channelfilter {
+    transition: all 0.3s;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-statebrowser-channelfilter::after {
+    color: var(--comp-statebrowser-fg);
+}
+
+.kiwi-statebrowser-channelfilter input {
+    background-color: var(--brand-default-bg);
+    color: var(--brand-default-fg);
+    outline: none;
+}
+
+.kiwi-statebrowser-channelfilter p {
+    color: var(--brand-primary);
+    font-size: 0.9em;
+    margin: 10px 0 10px 0;
+    cursor: pointer;
+    transition: all 0.3s;
+}
+
+.kiwi-statebrowser-channelfilter p:hover {
+    color: var(--brand-primary-hover);
+}
+
+.kiwi-statebrowser-newnetwork {
+    border-top-color: var(--comp-statebrowser-network-border);
+}
+
+.kiwi-statebrowser-newnetwork a {
+    color: var(--brand-default-bg);
+}
+
+.kiwi-statebrowser-newnetwork a:hover {
+    background: var(--brand-primary);
+    opacity: 1;
+    color: var(--comp-statebrowser-fg);
+}
+
+.kiwi-statebrowser-network .kiwi-statebrowser-network-header {
+    background-color: var(--comp-statebrowser-bg-networkname);
+}
+
+.kiwi-statebrowser-network .kiwi-statebrowser-network-header a {
+    color: var(--comp-statebrowser-fg);
+}
+
+/* Active Network Styling */
+.kiwi-statebrowser-network.kiwi-statebrowser-network--active .kiwi-statebrowser-network-header {
+    border-left: 3px solid var(--brand-primary);
+}
+
+/* Channel Styling */
+.kiwi-statebrowser-channels .kiwi-statebrowser-channel {
+    border-bottom: 1px solid var(--brand-shadow);
+    color: var(--comp-statebrowser-fg);
+}
+
+.kiwi-statebrowser-channel .kiwi-statebrowser-channel-name {
+    color: var(--comp-statebrowser-fg);
+}
+
+.kiwi-statebrowser-channel-active {
+    border-left-color: var(--brand-primary);
+    background: var(--comp-statebrowser-channel-active-bg);
+}
+
+.kiwi-statebrowser-channel-active .kiwi-statebrowser-channel-name {
+    color: var(--comp-statebrowser-channel-active-fg);
+}
+
+.kiwi-network-name-option-chanfilter.active {
+    background: var(--brand-primary);
+}
+
+.kiwi-statebrowser-channel-settings:hover {
+    background-color: var(--brand-primary);
+}
+
+.kiwi-statebrowser-channel-leave:hover {
+    background: var(--brand-error);
+}
+
+.kiwi-statebrowser-newchannel a {
+    border: 1px solid rgba(255, 255, 255, 0.5);
+}
+
+.kiwi-statebrowser-newchannel a:hover {
+    background: var(--brand-primary);
+    opacity: 1;
+    color: var(--comp-statebrowser-fg);
+}
+
+.kiwi-statebrowser-switcher a:first-of-type {
+    background: rgba(255, 255, 255, 0.15);
+}
+
+.kiwi-statebrowser-switcher a:hover {
+    background: rgba(255, 255, 255, 0.1);
+}
+
+.kiwi-statebrowser-options {
+    background: var(--brand-midtone);
+}
+
+.kiwi-statebrowser-channel-notjoined .kiwi-statebrowser-channel-name {
+    color: var(--brand-error);
+}
+
+.kiwi-statebrowser-channel-popup {
+    background: #383838;
+    border: 3px solid var(--brand-midtone);
+    border-left: none;
+}
+
+.kiwi-statebrowser-network-header {
+    background: rgba(255, 255, 255, 0.15);
+}
+
+.kiwi-statebrowser-network-status {
+    background: rgba(255, 255, 255, 0.1);
+}
+
+/* Icon before the network in network list */
+.kiwi-statebrowser-network-name::before {
+    content: '\f233';
+    font-family: fontAwesome, Helvetica, Arial, Verdana, Tahoma, sans-serif;
+    margin-right: 2px;
+    font-weight: 100;
+    text-decoration: none;
+}
+
+/* Icons in the Channel List */
+.kiwi-statebrowser-channel[data-name^="*"]::before {
+    content: '\f006';
+}
+
+.kiwi-statebrowser-channel[data-name="#help"]::before {
+    content: '\f059';
+}
+
+.kiwi-statebrowser-channel::before {
+    font-family: fontAwesome, Helvetica, Arial, Verdana, Tahoma, sans-serif;
+    margin-right: 8px;
+    font-weight: 100;
+}
+
+.kiwi-statebrowser-channel-label {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-statebrowser-channel-label--highlight {
+    background: var(--brand-error);
+}
+
+.kiwi-statebrowser-usermenu-avatar:hover .kiwi-avatar-inner,
+.kiwi-statebrowser-usermenu--open .kiwi-avatar-inner {
+    background-color: var(--brand-primary) !important;
+    color: var(--brand-default-bg) !important;
+}
+
+.kiwi-statebrowser-usermenu-avatar--connected .kiwi-avatar-inner {
+    border-color: #42b992;
+}
+
+.kiwi-statebrowser-usermenu-avatar--disconnected .kiwi-avatar-inner {
+    border-color: var(--brand-error);
+}
+
+.kiwi-statebrowser-usermenu .kiwi-awaystatusindicator {
+    border-color: var(--comp-statebrowser-bg);
+}
+
+.kiwi-statebrowser-network .kiwi-statebrowser-network-header a.kiwi-statebrowser-network-toggle:hover {
+    background-color: var(--brand-error);
+    border-top-color: var(--brand-error);
+}
+
+.kiwi-statebrowser-appsettings:hover {
+    background-color: rgba(128, 128, 128, 0.2);
+    opacity: 1;
+}
+
+.kiwi-statebrowser-scrollarea h4 {
+    border-top: 1px solid rgba(255, 255, 255, 0.3);
+}
+
+.kiwi-statebrowser-prompt-close {
+    background-color: rgba(128, 128, 128, 0.2);
+}
+
+/* ---- End of statebrowser ---- */
+
+/*  ---- Custom server layout ---- */
+.kiwi-customserver {
+    background-color: var(--brand-default-fg);
+}
+
+/* ---- App ---- */
+.kiwi-wrap {
+    color: var(--brand-default-fg);
+    --kiwi-nick-brightness: 40;
+    --kiwi-supports-monospace: 1;
+}
+
+.kiwi-workspace {
+    background: var(--brand-default-bg);
+}
+
+.kiwi-workspace::before {
+    background: var(--brand-primary);
+}
+
+.kiwi-workspace::after {
+    background: var(--brand-error);
+}
+
+/* ---- Container ( Container.vue )  ---- */
+.kiwi-container-toggledraw-statebrowser,
+.kiwi-container-toggledraw-sidebar {
+    background: var(--brand-default-bg);
+}
+
+.kiwi-container-toggledraw-statebrowser {
+    border-right: 1px solid var(--brand-midtone);
+}
+
+.kiwi-container-toggledraw-sidebar {
+    border-left: 1px solid var(--brand-midtone);
+}
+
+.kiwi-container-toggledraw-sidebar--disabled {
+    color: #b8babd;
+}
+
+.kiwi-container-toggledraw-statebrowser-messagecount {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-container-toggledraw-statebrowser-messagecount::after {
+    border: 0.6em solid transparent;
+    border-right-color: var(--brand-primary);
+}
+
+.kiwi-container-toggledraw-statebrowser-messagecount--highlight {
+    background-color: var(--brand-error);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-container-toggledraw-statebrowser-messagecount--highlight::after {
+    border-right-color: var(--brand-error);
+}
+
+.kiwi-wrap--statebrowser-drawopen .kiwi-container-toggledraw-statebrowser-messagecount {
+    background-color: var(--brand-primary);
+}
+
+.kiwi-wrap--statebrowser-drawopen .kiwi-container-toggledraw-statebrowser-messagecount::after {
+    border: 0.6em solid transparent;
+    border-left-color: var(--brand-primary);
+}
+
+.kiwi-container-empty .u-button {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+/* ---- Application settings ( AppSettings ) ---- */
+.kiwi-appsettings {
+    background: var(--brand-default-bg);
+}
+
+.kiwi-appsettings-block {
+    border: 1px solid rgba(0, 0, 0, 0.2);
+}
+
+.kiwi-appsettings-block h3 {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-appsettings-close {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-appsettings-close:hover {
+    background: var(--brand-error);
+}
+
+/* ---- Network Settings ( NetworkSettings ) ---- */
+.kiwi-networksettings .kiwi-title {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+    border-top: 1px solid var(--brand-primary);
+}
+
+.kiwi-network-nicknamelabel {
+    color: rgb(128, 128, 128);
+}
+
+.kiwi-networksettings .u-form {
+    border-color: var(--brand-midtone);
+    background: var(--brand-default-bg);
+}
+
+.kiwi-networksettings .kiwi-title span {
+    color: var(--brand-primary);
+    background: var(--brand-default-bg);
+}
+
+.kiwi-networksettings-advanced h3:hover {
+    color: var(--brand-primary);
+}
+
+.kiwi-networksettings .kiwi-customserver-tls {
+    color: var(--brand-midtone);
+}
+
+.kiwi-networksettings .kiwi-customserver-tls--enabled {
+    color: var(--brand-primary);
+}
+
+.kiwi-networksettings .kiwi-customserver-tls--enabled .kiwi-customserver-tls-lock {
+    color: var(--brand-primary);
+}
+
+.kiwi-networksettings .kiwi-customserver-tls-minus {
+    color: var(--brand-error);
+}
+
+.kiwi-networksettings-error {
+    border-color: var(--brand-error);
+}
+
+.kiwi-networksettings .kiwi-connect-to-newnetwork {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-networksettings .kiwi-networksettings-server-types .kiwi-network-type-button {
+    border-color: var(--brand-primary);
+    color: var(--brand-primary);
+}
+
+.kiwi-networksettings .kiwi-networksettings-server-types .kiwi-network-type-button:hover,
+.kiwi-networksettings .kiwi-networksettings-server-types .kiwi-network-type-button.kiwi-networksettings-server-type-active {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-networksettings .u-form span {
+    color: var(--brand-default-fg);
+}
+
+.u-button.kiwi-channellist-refresh.u-button-secondary {
+    background: var(--brand-primary);
+}
+
+/* ---- Channel List ( ChannelList.vue ) ---- */
+.kiwi-channellist-grid {
+    border-bottom: 1px solid var(--brand-midtone);
+}
+
+.kiwi-channellist-grid:nth-child(even) {
+    background: rgba(128, 128, 128, 0.2);
+}
+
+.kiwi-channellist-grid:first-of-type {
+    border-top: 1px solid var(--brand-midtone);
+}
+
+.kiwi-channellist-topic a {
+    color: var(--brand-primary);
+}
+
+/* ---- Message list - ( MessageList.vue ) ---- */
+.kiwi-messagelist {
+    scrollbar-color: #9e9e9e transparent;
+}
+
+.kiwi-messagelist::-webkit-scrollbar-thumb {
+    background-color: #9e9e9e;
+}
+
+.kiwi-messagelist-seperator {
+    color: var(--brand-darktone);
+    background: var(--brand-default-bg);
+    font-size: 0.9em;
+}
+
+.kiwi-messagelist-seperator > span {
+    background: var(--brand-default-bg);
+}
+
+.kiwi-messagelist-message--info-open,
+.kiwi-messagelist-message--authorrepeat.kiwi-messagelist-message--info-open {
+    background: var(--brand-midtone);
+}
+
+.kiwi-messagelist-message-action .kiwi-messagelist-body {
+    color: var(--brand-primary);
+}
+
+.kiwi-messagelist-message--highlight {
+    background-color: var(--brand-midtone);
+}
+
+/* Notice Message styling */
+.kiwi-messagelist-message-notice {
+    background: #EFD1A4;
+}
+
+/* Standard username and usertime styling */
+.kiwi-messagelist-nick {
+    color: var(--brand-default-fg);
+}
+
+/* Unread user messages */
+.kiwi-messagelist-message.kiwi-messagelist-message--unread {
+    border-left: 5px solid var(--brand-primary);
+}
+
+/* When hovering over a users messages */
+.kiwi-messagelist-message--hover {
+    border-left-color: var(--brand-primary);
+}
+
+/* Traditional message styling hover */
+.kiwi-messagelist-message--compact .kiwi-messagelist-message-privmsg:hover,
+.kiwi-messagelist-message--compact .kiwi-messagelist-message-action:hover,
+.kiwi-messagelist-message--compact .kiwi-messagelist-message-notice:hover {
+    background: var(--brand-primary-hover);
+}
+
+/* The shadow over the main text area that displays when the sidebar is open */
+.kiwi-container--sidebar-drawn .kiwi-messagelist::after {
+    background-color: var(--brand-default-fg);
+}
+
+/* Messagelayout inline */
+.kiwi-messagelist-message--text .kiwi-messagelist-time,
+.kiwi-messagelist-message--compact .kiwi-messagelist-time {
+    color: var(--brand-default-fg);
+}
+
+/* ---- Traffic Messages ---- */
+.kiwi-messagelist-message-traffic-join,
+.kiwi-messagelist-message-traffic-join_self {
+    color: var(--brand-primary);
+}
+
+.kiwi-messagelist-message-traffic-quit,
+.kiwi-messagelist-message-traffic-quit_self,
+.kiwi-messagelist-message-traffic-part,
+.kiwi-messagelist-message-traffic-part_self,
+.kiwi-messagelist-message-traffic-kick,
+.kiwi-messagelist-message-traffic-kick_self {
+    color: var(--brand-error);
+}
+
+.kiwi-messagelist-message-traffic-quit .kiwi-nick::before,
+.kiwi-messagelist-message-traffic-quit_self .kiwi-nick::before,
+.kiwi-messagelist-message-traffic-part .kiwi-nick::before,
+.kiwi-messagelist-message-traffic-part_self .kiwi-nick::before {
+    color: var(--brand-error);
+}
+
+/* ---- Modern Layout Styling ---- */
+.kiwi-avatar-inner {
+    color: var(--brand-default-bg);
+    border-color: var(--brand-primary);
+}
+
+.kiwi-avatar--default {
+    background-color: var(--brand-default-fg);
+}
+
+.kiwi-messagelist .kiwi-messagelist-body a,
+.kiwi-channellist-table-topic a,
+.kiwi-aboutbuffer a {
+    color: var(--brand-link-normal);
+}
+
+.kiwi-messagelist .kiwi-messagelist-body a:hover,
+.kiwi-channellist-table-topic a:hover,
+.kiwi-aboutbuffer a:hover {
+    color: var(--brand-link--hover);
+}
+
+.kiwi-messagelist-message--modern {
+    border-top-color: var(--brand-midtone);
+}
+
+/* Errors */
+.kiwi-messagelist-message-error,
+.kiwi-messagelist-message.kiwi-messagelist-message-error.kiwi-messagelist-message--highlight {
+    background: var(--brand-error);
+    color: var(--brand-default-bg);
+}
+
+/* ---- Messagelist Topic Styling ---- */
+.kiwi-messagelist-message.kiwi-messagelist-message-topic {
+    border-top: 1px solid var(--brand-primary);
+    border-bottom: 1px solid var(--brand-primary);
+    color: var(--brand-default-fg);
+    background: var(--brand-default-bg);
+}
+
+.kiwi-messagelist-message--modern.kiwi-messagelist-message--authorrepeat.kiwi-messagelist-message-topic {
+    border-top: 2px solid var(--brand-primary);
+}
+
+.kiwi-messagelist-message--modern.kiwi-messagelist-message-topic,
+.kiwi-messagelist-message--modern.kiwi-mesagelist-message-topic.kiwi-messagelist-message--highlight {
+    border: 2px solid var(--brand-primary);
+}
+
+.kiwi-messagelist-message--modern.kiwi-messagelist-message-topic.kiwi-messagelist-message--unread {
+    border-left: 2px solid var(--brand-primary);
+}
+
+.kiwi-header-buffersettings {
+    border-top: 1px solid var(--brand-midtone);
+}
+
+.kiwi-header-topic > div {
+    color: var(--brand-default-fg);
+}
+
+.kiwi-messagelist-message-whois {
+    background: var(--brand-midtone);
+}
+
+.kiwi-messagelist-message-motd {
+    color: var(--brand-default-fg);
+}
+
+/* ---- MessageInfo ---- */
+.kiwi-messagelist-message--info-open {
+    background-color: var(--brand-midtone);
+}
+
+.kiwi-messageinfo-urls {
+    border-top-color: var(--brand-midtone);
+    border-bottom-color: var(--brand-midtone);
+}
+
+.kiwi-messageinfo-actions .u-link {
+    border-color: var(--brand-default-fg);
+    color: var(--brand-default-fg);
+}
+
+.kiwi-messageinfo-actions .kiwi-messageinfo-reply {
+    background: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-messageinfo-actions .kiwi-messageinfo-kick-user {
+    background: var(--brand-warning);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-messageinfo-actions .kiwi-messageinfo-ban-user {
+    background: var(--brand-error);
+    color: var(--brand-default-bg);
+}
+
+/* ---- Not connected message ( NotConnected ) ---- */
+.kiwi-warning-block {
+    color: var(--brand-default-bg);
+    background-color: var(--brand-error);
+}
+
+.kiwi-warning-block.connecting {
+    background-color: var(--brand-primary);
+}
+
+.kiwi-notconnected-button {
+    border-color: var(--brand-default-bg);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-notconnected-button:hover {
+    background-color: var(--brand-default-bg);
+    color: var(--brand-default-fg);
+}
+
+.kiwi-notconnected-button-settings:hover {
+    background-color: transparent;
+    color: var(--brand-default-bg);
+}
+
+/* ---- Settings Aliases ( SettingsAliases ) ---- */
+.kiwi-settings-aliases-input {
+    border-color: var(--brand-midtone);
+}
+
+.kiwi-settings-aliases-help em {
+    color: var(--brand-primary);
+}
+
+.kiwi-settings-advanced-notice {
+    color: var(--brand-default-bg);
+    background: var(--brand-error);
+}
+
+/* ---- Channel Banlist ( Channelbanlist ) ---- */
+.kiwi-channelbanlist-table tr {
+    border-bottom-color: var(--brand-midtone);
+}
+
+.kiwi-channelbanlist-table-actions:hover {
+    background-color: var(--brand-error);
+}
+
+.kiwi-channelbanlist-table-actions:hover i {
+    color: var(--brand-default-bg);
+}
+
+.kiwi-network-name-options {
+    background-color: var(--brand-default-fg);
+}
+
+.kiwi-network-name-option:hover,
+.kiwi-network-name-option.active {
+    background-color: var(--brand-primary);
+    color: var(--brand-default-bg);
+}
+
+.kiwi-network-name-option {
+    color: var(--brand-default-bg);
+}
+
+/* Global Close Icon */
+.kiwi-close-icon,
+.kiwi-close-icon:hover {
+    background: var(--brand-error);
+}
+
+/* Away Status Indicator */
+.kiwi-awaystatusindicator {
+    border-color: var(--brand-default-bg);
+    background-color: var(--brand-primary);
+}
+.kiwi-awaystatusindicator--away {
+    background-color: var(--brand-error);
+}
+
+/* Buffer Key */
+.kiwi-bufferkey-button {
+    border-color: var(--brand-default-bg);
+}
+
+/* Selected text */
+:root {
+    --brand-selected: rgba(0, 0, 255, 0.3);
+}