<commit_before>// Layout Rules
// ============
// CSS, by its very nature, is used to lay elements out on the page. However,
// there is a distinction between layouts dictating the major and minor
// components of a page. The minor components—such as a callout, or login form,
// or a navigation item—sit within the scope of major components such as a
// header or footer. I refer to the minor components as Modules and will dive
// into those in the next section. The major components are referred to as
// Layout styles.

// Layout styles can also be divided into major and minor styles based on
// reuse. Major layout styles such as header and footer are traditionally
// styled using ID selectors but take the time to think about the elements that
// are common across all components of the page and use class selectors where
// appropriate.
//
// http://smacss.com/book/type-layout

.navbar + * {
	margin: {
		top: 53px;
//		top: 70px;
	}
}

.navbar-header {
	.navbar-brand {
		color: $flat-sunflower;
		font: {
			family: $headings-font-family;
			size: 24px;
		}
		line-height: 1;
		text-decoration: none;

		b {
			color: $flat-orange;
		}

		.release {
			color: lighten($brand-primary, 10%);
			display: inline-block;
			font: {
				family: $font-family-base;
				size: 8px;
			}
			letter-spacing: 0.1em;
			margin: {
				left: -1.6em;
				top: -0.5em;
			}
			text-transform: uppercase;
			vertical-align: top;
		}
	}
}

.navbar-nav {
	> li {
    > a {
			font: {
				family: $headings-font-family;
				size: 14px;
			}
		}
	}
}



.open > .dropdown-menu {
	margin-top: 4px !important;
}

sgf.media-object {
	display: block;
	height: 100px;
  width: 100px;

	@media (max-width: $screen-xs-max) {
		height: 50px;
		width: 50px;
	}
}

/*.wgo-move-link {*/
		/*cursor: help;*/
		/*@extend code;*/
	/*}*/

.jumbotron {
	background-color: transparent;
  margin-bottom: 0;
	padding: {
		bottom: 20px;
		top: 0;
	}

	h3 {
		font-size: 15em;

		@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
			font: {
				size: 13em;
			}
		}

		@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
			font: {
				size: 10em;
			}
		}

		@media (max-width: $screen-xs-max) {
			font: {
				size: 4.2em;
			}
		}

		letter-spacing: -2px;
		line-height: 1;
		margin: {
			bottom: 0px;
			left: 0;
			right: 0;
			top: 40px;
		}
		opacity: 0.6;
		position: relative;
		text-align: center;
		z-index: 1;

		span {
		}
		span:first-child {
//			color: darken($flat-green-1, 2.5%);
			color: $flat-orange-1;
		}

		span:last-child {
//			color: darken($flat-green-1, 5%);
			color: $flat-carrot;
		}
	}

	img.goban {
		display: block;
		margin: 0 auto;
		position: absolute;
		left: calc(50% - 15em);
		top: 20px;
		width: 30em;

		@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
			$width: 25em;
			left: calc(50% - ($width / 2));
			width: $width;
		}

		@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
			left: calc(50% - 10em);
			top: -10px;
			width: 20em;
		}

		@media (max-width: $screen-xs-max) {
			left: calc(50% - 6em);
			top: -30px;
			width: 12em;
		}
	}

	p {
//		color: lighten($flat-green-1, 20%);
//		color: darken($flat-green-2, 5%);
		color: $flat-green-2;
		font: {
			size: 48px;
			weight: bold;
		}
		line-height: 1;

		@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
			font: {
				size: 36px;
			}
		}

		@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
			font: {
				size: 24px;
			}
		}

		@media (max-width: $screen-xs-max) {
			color: darken($flat-green-2, 10%);
			font: {
				size: 14px;
			}
			margin: {
				bottom: 0;
			}
		}

		margin: {
//			bottom: 50px;
//			left: 400px;
		}
		opacity: 0.8;
		position: relative;
		text-align: center;
		z-index: 1;
	}
}


.copy {
  /*background-color: $flat-clouds;*/
  color: $flat-clouds;
  padding: 30px;

  h4 {
    color: $flat-clouds;
  }
}

sgf.fill {
  left: -5em;
  top: -10em;
  right: -5em;
  opacity: 1;
  position: absolute;
  z-index: 0;

  .wgo-board {
    background-color: transparent;
  }
}

.navbar-inverse {
	.navbar-nav {
		> li {
			> a {
				color: lighten($flat-green-1, 20%);
			}
		}
	}
}

.footer {
	background-color: $flat-wet-asphalt;
	color: $flat-clouds;
	font: {
		family: $headings-font-family;
	}
	padding: {
		bottom: 2px;
		top: 15px;
	}

	.copyright {
		position: relative;

		.symbol {
			font: {
				size: 42px;
			}
			left: 0;
			line-height: 0;
			opacity: 0.3;
			position: absolute;
			top: 14px;
		}
	}

	p {
		font: {
			size: 18px;
		}
		padding: {
			left: 30px;
		}
	}
}

.copy {
	background-color: $flat-clouds;
	color: $flat-gray-4;
}

.form-control {
	color: $flat-gray-4;
}

.top-buffer {
	margin: {
		top: 20px;
	}
}

.bottom-buffer {
	margin: {
		bottom: 20px;
	}
}

.icon-reference {
	background: $flat-blue-4;
	color: $flat-clouds;
	font-size: 24px;

	span {
		padding: 0.5em;
	}
}

p.compact {
	line-height: 1.4;
}

// @see https://github.com/twbs/bootstrap/issues/14990#issuecomment-67341988
.media .media-body {
	width: 10000px;
}

.stretch {
	width: 100%;
}

h1 .rank {
	opacity: 0.5;
}


.dark-background {
	p {
		color: $flat-clouds;
		font-size: 18px;
	}

	a {
		color: white;
		&:hover {
			color: mix(white, $flat-green-sea, 60%);
		}
		border-bottom: 1px solid $flat-clouds;
		&.btn, &.no-underline {
			border-bottom: 0;
		}
	}

	.help-block {
		color: $flat-clouds;
		font-size: 12px;
		opacity: 0.8;
	}

	.form-group {
		label {
			color: $flat-green-sea;
			font: {
				family: $headings-font-family;
				size: 18px;
			}
			line-height: 1;
			margin: {
				bottom: 0;
				top: 10px;
			}
		}

		&.has-error {
			.form-control {
				border: {
					color: $flat-red-2;
				}
			}
		}

	}

	.form-control {
		background: {
			color: $flat-green-sea;
		}
		border: {
			$width: 3px;
			color: $flat-green-sea;
			radius: 0;
//			radius: 0 0 0 $width * 2;
//			width: $width;
			width: 0;
		}
		color: $flat-clouds;

		@include placeholder($flat-sunflower);

		&:focus {
			background: transparentize($flat-clouds, 0.2);
			border: {
//				color: $brand-secondary;
			}
			color: $flat-gray-4;
			@include placeholder($flat-green-sea);
		}

	}

	.table-display {
		th {
			color: $flat-clouds;
		}
	}
}

.align-sm-right {
	@media (min-width: $screen-sm-min) {
		text-align: right;
	}
	@media (max-width: $screen-xs-max) {
		text-align: left;
	}
}

.align-md-right {
	@media (min-width: $screen-md-min) {
		text-align: right;
	}
	@media (max-width: $screen-sm-max) {
		text-align: left;
	}
}

.table-display {
	color: $flat-clouds;
	tbody {
		tr {
			th, td {
				border: 0;
				line-height: 2;
				padding: 2px;
			}
		}
	}
	th {
		width: 20%;
	}
	td {
		width: 80%;
	}
}

.form-control {
	&.short {
		width: 100px;
	}
	&.medium {
		width: 200px;
	}
}

.spacer {
	height: 20px;
}

.table-condensed {
	th {
		vertical-align: top;
	}
}

.file-over {
	background: hsla(50, 100%, 50%, 0.5);
}<commit_msg>Fix links breaking in panels<commit_after>// Layout Rules
// ============
// CSS, by its very nature, is used to lay elements out on the page. However,
// there is a distinction between layouts dictating the major and minor
// components of a page. The minor components—such as a callout, or login form,
// or a navigation item—sit within the scope of major components such as a
// header or footer. I refer to the minor components as Modules and will dive
// into those in the next section. The major components are referred to as
// Layout styles.

// Layout styles can also be divided into major and minor styles based on
// reuse. Major layout styles such as header and footer are traditionally
// styled using ID selectors but take the time to think about the elements that
// are common across all components of the page and use class selectors where
// appropriate.
//
// http://smacss.com/book/type-layout

.navbar + * {
	margin: {
		top: 53px;
//		top: 70px;
	}
}

.navbar-header {
	.navbar-brand {
		color: $flat-sunflower;
		font: {
			family: $headings-font-family;
			size: 24px;
		}
		line-height: 1;
		text-decoration: none;

		b {
			color: $flat-orange;
		}

		.release {
			color: lighten($brand-primary, 10%);
			display: inline-block;
			font: {
				family: $font-family-base;
				size: 8px;
			}
			letter-spacing: 0.1em;
			margin: {
				left: -1.6em;
				top: -0.5em;
			}
			text-transform: uppercase;
			vertical-align: top;
		}
	}
}

.navbar-nav {
	> li {
    > a {
			font: {
				family: $headings-font-family;
				size: 14px;
			}
		}
	}
}



.open > .dropdown-menu {
	margin-top: 4px !important;
}

sgf.media-object {
	display: block;
	height: 100px;
  width: 100px;

	@media (max-width: $screen-xs-max) {
		height: 50px;
		width: 50px;
	}
}

/*.wgo-move-link {*/
		/*cursor: help;*/
		/*@extend code;*/
	/*}*/

.jumbotron {
	background-color: transparent;
  margin-bottom: 0;
	padding: {
		bottom: 20px;
		top: 0;
	}

	h3 {
		font-size: 15em;

		@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
			font: {
				size: 13em;
			}
		}

		@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
			font: {
				size: 10em;
			}
		}

		@media (max-width: $screen-xs-max) {
			font: {
				size: 4.2em;
			}
		}

		letter-spacing: -2px;
		line-height: 1;
		margin: {
			bottom: 0px;
			left: 0;
			right: 0;
			top: 40px;
		}
		opacity: 0.6;
		position: relative;
		text-align: center;
		z-index: 1;

		span {
		}
		span:first-child {
//			color: darken($flat-green-1, 2.5%);
			color: $flat-orange-1;
		}

		span:last-child {
//			color: darken($flat-green-1, 5%);
			color: $flat-carrot;
		}
	}

	img.goban {
		display: block;
		margin: 0 auto;
		position: absolute;
		left: calc(50% - 15em);
		top: 20px;
		width: 30em;

		@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
			$width: 25em;
			left: calc(50% - ($width / 2));
			width: $width;
		}

		@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
			left: calc(50% - 10em);
			top: -10px;
			width: 20em;
		}

		@media (max-width: $screen-xs-max) {
			left: calc(50% - 6em);
			top: -30px;
			width: 12em;
		}
	}

	p {
//		color: lighten($flat-green-1, 20%);
//		color: darken($flat-green-2, 5%);
		color: $flat-green-2;
		font: {
			size: 48px;
			weight: bold;
		}
		line-height: 1;

		@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
			font: {
				size: 36px;
			}
		}

		@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
			font: {
				size: 24px;
			}
		}

		@media (max-width: $screen-xs-max) {
			color: darken($flat-green-2, 10%);
			font: {
				size: 14px;
			}
			margin: {
				bottom: 0;
			}
		}

		margin: {
//			bottom: 50px;
//			left: 400px;
		}
		opacity: 0.8;
		position: relative;
		text-align: center;
		z-index: 1;
	}
}


.copy {
  /*background-color: $flat-clouds;*/
  color: $flat-clouds;
  padding: 30px;

  h4 {
    color: $flat-clouds;
  }
}

sgf.fill {
  left: -5em;
  top: -10em;
  right: -5em;
  opacity: 1;
  position: absolute;
  z-index: 0;

  .wgo-board {
    background-color: transparent;
  }
}

.navbar-inverse {
	.navbar-nav {
		> li {
			> a {
				color: lighten($flat-green-1, 20%);
			}
		}
	}
}

.footer {
	background-color: $flat-wet-asphalt;
	color: $flat-clouds;
	font: {
		family: $headings-font-family;
	}
	padding: {
		bottom: 2px;
		top: 15px;
	}

	.copyright {
		position: relative;

		.symbol {
			font: {
				size: 42px;
			}
			left: 0;
			line-height: 0;
			opacity: 0.3;
			position: absolute;
			top: 14px;
		}
	}

	p {
		font: {
			size: 18px;
		}
		padding: {
			left: 30px;
		}
	}
}

.copy {
	background-color: $flat-clouds;
	color: $flat-gray-4;
}

.form-control {
	color: $flat-gray-4;
}

.top-buffer {
	margin: {
		top: 20px;
	}
}

.bottom-buffer {
	margin: {
		bottom: 20px;
	}
}

.icon-reference {
	background: $flat-blue-4;
	color: $flat-clouds;
	font-size: 24px;

	span {
		padding: 0.5em;
	}
}

p.compact {
	line-height: 1.4;
}

// @see https://github.com/twbs/bootstrap/issues/14990#issuecomment-67341988
.media .media-body {
	width: 10000px;
}

.stretch {
	width: 100%;
}

h1 .rank {
	opacity: 0.5;
}


.dark-background {
	p {
		color: $flat-clouds;
		font-size: 18px;
	}

	a {
		color: white;
		&:hover {
			color: mix(white, $flat-green-sea, 60%);
		}
		border-bottom: 1px solid $flat-clouds;
		&.btn, &.no-underline {
			border-bottom: 0;
		}
	}

	.help-block {
		color: $flat-clouds;
		font-size: 12px;
		opacity: 0.8;
	}

	.form-group {
		label {
			color: $flat-green-sea;
			font: {
				family: $headings-font-family;
				size: 18px;
			}
			line-height: 1;
			margin: {
				bottom: 0;
				top: 10px;
			}
		}

		&.has-error {
			.form-control {
				border: {
					color: $flat-red-2;
				}
			}
		}

	}

	.form-control {
		background: {
			color: $flat-green-sea;
		}
		border: {
			$width: 3px;
			color: $flat-green-sea;
			radius: 0;
//			radius: 0 0 0 $width * 2;
//			width: $width;
			width: 0;
		}
		color: $flat-clouds;

		@include placeholder($flat-sunflower);

		&:focus {
			background: transparentize($flat-clouds, 0.2);
			border: {
//				color: $brand-secondary;
			}
			color: $flat-gray-4;
			@include placeholder($flat-green-sea);
		}

	}

	.table-display {
		th {
			color: $flat-clouds;
		}
	}
}

.align-sm-right {
	@media (min-width: $screen-sm-min) {
		text-align: right;
	}
	@media (max-width: $screen-xs-max) {
		text-align: left;
	}
}

.align-md-right {
	@media (min-width: $screen-md-min) {
		text-align: right;
	}
	@media (max-width: $screen-sm-max) {
		text-align: left;
	}
}

.table-display {
	color: $flat-clouds;
	tbody {
		tr {
			th, td {
				border: 0;
				line-height: 2;
				padding: 2px;
			}
		}
	}
	th {
		width: 20%;
	}
	td {
		width: 80%;
	}
}

.form-control {
	&.short {
		width: 100px;
	}
	&.medium {
		width: 200px;
	}
}

.spacer {
	height: 20px;
}

.table-condensed {
	th {
		vertical-align: top;
	}
}

.file-over {
	background: hsla(50, 100%, 50%, 0.5);
}

.panel-body {
	word-break: break-word;
}
{'fraction_non_alphanumeric': 0.17298459333572197, 'fraction_numerical': 0.03281977785739878, 'mean_word_length': 2.3693867696764848, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 13, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4534270', 'n_tokens_mistral': 7088, 'n_tokens_neox': 5862, 'n_words': 1323}