frontend/_netopeer-common.scss

@import "./colors";

$colorSuccess: #def2de;
$colorSuccessBorder: green;
$colorFailure: #f2dede;
$colorFailureBorder: red;

a:not([href]) {
    cursor: pointer;
    text-decoration: underline;
    font-weight: bold;
}

.netopeer-content {
	display: block;
	padding: 0.7em 1em 1em 2em;
	background-color: $colorBackground;
	color: $black;
}

.msg-rounded {
    border-radius: 5px;
}

.msg-close {
    padding-right: 10px;
    padding-left: 10px;
    font-weight: bold;
    font-family: monospace;
    font-size: large;
	cursor: pointer;
    height: 1em;
}

.msg-success {
    background-color: $colorSuccess;
	color: $colorSuccessBorder;
	padding: 5px 1em 5px 0em;
	
	.msg-close {
    	color: $colorSuccessBorder;
	}
}

.msg-failure {
    background-color: $colorFailure;
    color: $colorFailureBorder;
	padding: 5px 1em 5px 0em;

	.msg-close {
    	color: $colorFailureBorder;
	}
}

.tab-add,
.tab-reload,
.tab-close {
    cursor: pointer;
    font-weight: bold;
    font-family: monospace;
    font-size: large;
}
.tab-action-first {
    padding-left: 0.3em;
}
.tab-action-last {
    padding-right: 0.5em;
}

.tab-icon {
    vertical-align: middle;
    height: 1em;
}

.tab-add {
    filter: invert(100%);

    &:hover {
        color: $green;
    }
}

.keyword {
  font-weight: bold;
}

.modal-header, .modal-footer {
  background-color: $colorMain;
  color: $colorTextInverse;
}
.modal-header {
  border-radius: 3px 3px 0 0;
}
.modal-footer {
  border-radius: 0 0 3px 3px;
}
.modal-title {
  color: $colorTextInverse;
}

.tab-close:hover {
    color: $colorFailureBorder;
}
.tab-reload:hover {
    color: blue;
}

#subnav {
    position: fixed;
    width: 100%;
    background-color: $colorMain;
    padding-left: 1em;

    a {
        cursor: pointer;
        text-decoration: none;
        display: inline-block;
        padding: 0.2em 0 0.1em 1em;
        color: $colorTextInverse;

        &:visited,
        &:link {
            color: inherit;
        }
        &:hover,
        &.active {
            background-color: $colorBackground;
            color: $colorText;
        }
        &active:hover {
            cursor: default;
        }
    }
}