TeaWeb/shared/css/static/modal-poke.scss

.container-poke {
	display: flex!important;;
	flex-direction: column!important;;

	.container-servers {
		display: flex;
		flex-direction: column;
		justify-content: stretch;

		.server {
			display: flex;
			flex-direction: column;
			justify-content: stretch;

			.server-name {
				margin-top: 5px;

				flex-grow: 0;
				flex-shrink: 0;

				font-weight: bold;
				text-decoration: underline;
			}

			.poke-list {
				display: flex;
				flex-direction: column;
				justify-content: flex-start;

				overflow-y: auto;
				overflow-x: auto;

				.entry {
					display: flex;
					flex-direction: row;
					justify-content: flex-start;

					flex-shrink: 0;
					flex-grow: 0;

					> * {
						white-space: nowrap;
					}

					.date, .user, .text {
						margin-right: 5px;
					}

					.date {
						color: cornflowerblue;
					}
					.text {
						color: #004d00;
					}
				}
			}
		}
	}

	.buttons {
		display: flex;
		flex-direction: row;
		justify-content: stretch;

		margin-top: 5px;
		flex-shrink: 0;
		flex-grow: 0;

		.spacer {
			flex-grow: 1;
			flex-shrink: 1;
		}

		.button-close {
			flex-grow: 0;
			flex-shrink: 0;

			margin-top: 5px;
			width: 150px;
			float: right;
		}
	}
}

/*
  <script class="jsrender-template" id="tmpl_poke_popup" type="text/html">
            <div class="container-poke">
                <div class="container-information">
                    <a>You have been poked by </a><node key="invoker"></node><a>:</a>
                </div>
                <div class="container-message">
                    <a class="message">{{>message}}</a>
                </div>
            </div>
        </script>
 */