.navbar-default .navbar-brand {
    font-size: 26px;
    color: #000 !important;
}

.navbar-header span.text-muted {
    color: #aeaeae;
    margin-left: 6px;
}

.container {
    max-width: 730px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px;
    background-color: #f5f5f5;
    padding-top: 15px;
}

#content {
    margin-top: 70px;
}

pre {
    font-size: 16px;
}

.navbar-default .navbar-brand {
    font-size: 26px;
    color: #000 !important;
}

.navbar-header span.text-muted {
    color: #aeaeae;
    margin-left: 6px;
}

.container {
    max-width: 730px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: #f5f5f5;
    padding-top: 15px;
}

#content {
    margin-top: 70px;
}

pre {
    font-size: 16px;
}

Fix footer height in mobile view

Fix footer height in mobile view


* {
    font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
}

.blurb div {
	border-style: groove;
	background-color: yellow;
	overflow: scroll;
}

.vertex.tac text {
	text-anchor: end;
}

.vertex.asoiaf text {
	text-anchor: start;
}

.vertex.selected text {
	font-weight: bold;
}

line.edge {
	stroke: LightGray;
	stroke-width: 2px;
	pointer-events: none;
}

line.edge.active {
	stroke: black;
	pointer-events: auto;
}

line.edge.active.selected {
	stroke-width: 4px;
}

Change global font to Century Gothic

Change global font to Century Gothic


.biolinks_caption {
    font-size: small;
    text-align: center;
    color: orange;
    padding: 3px;
    margin: 10px;
    border: solid 1px black;
}

.biolinks_distribution {
    background-color: white;
}

.biolinks_caption {
    font-size: small;
    text-align: center;
    color: orange;
    padding: 3px;
    margin: 10px;
    border: solid 1px black;
}

.biolinks_vis_distribution {
    background-color: white;
}

.biolinks_vis_annotations {
    background-color: white;
}

Set white background for annotations.

Set white background for annotations.


@charset "utf-8";

body > .ui.container {
    margin-top: 3em;
}

.hide {
    display: none;
}

#contrib {
    margin: 0 auto;
}

#cal {
    margin: 3em auto 0 auto;
}

#cal .cal-heatmap-container {
    margin: 0 auto;
}

#contrib div.summary > div {
    float: left;
    width: 19.99999999%;
    text-align: center;
    color: #767676;
    font-size: 0.9em;
}

#contrib div.summary > div > span:last-child {
    display: block;
    line-height: 1.6em;
    font-size: 2em;
    color: #000;
}

@charset "utf-8";

#body {
    min-width: 800px;
}

body > .ui.container {
    margin-top: 3em;
}

.hide {
    display: none;
}

.clearfix:after {
    visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
}

#contrib {
    margin: 0 auto;
}

#cal {
    margin: 3em auto 0 auto;
}

#cal .cal-heatmap-container {
    margin: 0 auto;
}

#contrib div.summary > div {
    float: left;
    width: 19.99999999%;
    text-align: center;
    color: #767676;
    font-size: 0.9em;
}

#details div.title {
    text-align: center;
    font-size: 1.2em;
}

#contrib div.summary > div > span:last-child {
    display: block;
    line-height: 1.6em;
    font-size: 2em;
    color: #000;
}

Add min-width property and magic class clearfix


/* HTML Styles ------------------------------------------------------------- */
.collection-item:hover {
    background-color: #ddd;
}

.plot {
    width: 100%;
    height: 320px;
}

.collection .collection-item.active {
    background-color: #1976D2; /* blue darken-2 */
}

#performance {
    height: 180px;
}

#portfolio {
    height: 120px;
}

#warnings {
    margin-top: 100px; /* Where the warnings top should be */
    height: 200px;
}

#workspace {
    min-height: 420px;
}

.row {
    margin-bottom: 20px;
}

.container {
    margin-top: 20px;
}

/* SVG Styles -------------------------------------------------------------- */
.bar {
    fill: #b0bec5; /* blue-grey lighten-3 */
}

.bar:hover {
    fill: #ff5722; /* deep-orange */
}

/* HTML Styles ------------------------------------------------------------- */
.collection-item:hover {
    background-color: #ddd;
}

.plot {
    width: 100%;
    height: 320px;
}

.collection .collection-item.active {
    background-color: #1976D2; /* blue darken-2 */
}

#performance {
    height: 180px;
}

#portfolio {
    height: 120px;
}

#warnings {
    margin-top: 100px; /* Where the warnings top should be */
    height: 200px;
}

#workspace {
    min-height: 420px;
}

.row {
    margin-bottom: 20px;
}

.container {
    margin-top: 20px;
}

#warnings ul {
    width: 100%;
    padding: 10px;
}

#warnings li {
    text-align: left;
    background-color: #ffea00; /* yellow accent-2 */
    border: 1px solid #ffff8d; /* yellow accent-1 */
    border-radius: 5px;
    -moz-box-shadow:    2px 2px 3px 3px #ccc;
    -webkit-box-shadow: 2px 2px 3px 3px #ccc;
    box-shadow:         2px 2px 3px 3px #ccc;

    width: 100%;
    margin-bottom: 10px;
    padding: 5px 10px 5px 10px;
}

/* SVG Styles -------------------------------------------------------------- */
.bar {
    fill: #b0bec5; /* blue-grey lighten-3 */
}

.bar:hover {
    fill: #ff5722; /* deep-orange */
}

Add styling for warnings sidebar.

Add styling for warnings sidebar.

Added some CSS styles for the warnings sidebar. Currently just leaving
everything in the yellow warning color with black text for legibility.


.video-player .video-player-upgrade {
	background: rgba(255, 255, 255, 0.5);
	border-radius: 10px;
	width: 80%;
	margin: 0 10%;
	text-shadow: none;
	font-size: 14px;
	color: #333;
}

.video-player .video-player-upgrade a {
	color: #333!important;
}

/* Fix for apsect-ratio sized flash player. Was broken in Chrome. */
.video-player object {
	top: 0;
	left: 0;
}

.video-player > div {
	vertical-align: bottom;
}

Remove extra bottom space below jwplay videos This stems from the display:inline-block used in the responsive mode of jwplayer. Setting the inline-block div to have vertical-align:bottom eliminates this extra space.


nav.top-bar {
    background: #86A02D;
}

nav.top-bar h1 {
    background: #86A02D;
}

nav.top-bar h1 a{
    font-size: 1.5em;
}

.top-bar-section li a:not(.button) {
    background: #86A02D !important;
}

.top-bar-section li a:hover {
    background: #4d591a !important;
}

ul {
  list-style-type: none;
}

.container {
  width: 80%;
  padding-right: 5%;
  padding-left: 5%;
  padding-top: 2%;
  margin-left: auto;
  margin-right: auto;
  background-color: #dadada;
}

input.button {
  background-color: #86a02d;
}

Change bg color of button

Change bg color of button


@import url(http://fonts.googleapis.com/css?family=Titillium+Web);

table {
  width:100%;
}

th:nth-child(1),
td:nth-child(1) {
  width: 35%;
  word-break: break-all;
}

td:nth-child(2),
td:nth-child(2) {
  width: 20%;
  word-break: break-word;
}

td,
th {
  padding: 6px 13px;
  border: 1px solid #ddd;
}
tr:nth-child(2n) {
  background-color: #f8f8f8;
}

#teaser-home {
  height: 250px;
  position: relative;
  margin-bottom: 24px;
}

#teaser-home img {
  position: absolute;
  top: 0;
}

#teaser-home span {
  color: #2F406A;
  position: absolute;
  top: 0;
  left: 250px;
  font-size: 100px;
  display: inline-block;
  height: 250px;
  line-height: 250px;
  font-family: 'Titillium Web', sans-serif;
}

@media screen and (max-width: 768px) {
  #teaser-home {
    height: auto;
    text-align: center;
  }

  #teaser-home img {
    position: relative;
    width: 100%;
    max-width: 250px;
    content:url(/images/logo.png);
  }

  #teaser-home span {
    display: none;
  }
}

Fix rendering of logo on small resolutions


/* Bootstrap Marketing Narrow
 * bootstrap-mktg-narrow.css from commit d17b545 in github.com/teslaworks/teslaworks.net
 */
body {
    padding-top: 20px;
    padding-bottom: 40px;
}

/* Custom container */
.container-narrow {
    margin: 0 auto;
    max-width: 700px;
}
.container-narrow > hr {
    margin: 30px 0;
}

/* Main marketing message and sign up button */
.jumbotron {
    margin-top: 20px;
    margin-bottom: 40px;
    text-align: center;
}
.jumbotron h1 {
    font-size: 72px;
    line-height: 1;
}
.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.pad-bottom {
    padding-bottom: 30px;
}

/* Style the pics */
.big-polaroid {
    width: 670px;
    height: 503px;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #ccc;
    background-color: #eee;
}

/* Tesla Works styles
 * teslaworks.css from commit d17b545 in github.com/teslaworks/teslaworks.net
 */
/* Project leader stuff */

.leader-name {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 15px;
}
.leader-email, .leader-phone {
    margin-right: 10px;
}
.leader-polaroid {
    width: 140px;
    height: 140px;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
    background-color: #eee;
}

Add mktg-narrow and TW CSS

Add mktg-narrow and TW CSS


.progress-wrapper {
    width: calc(100%);
    display: inline-block;
    text-align: center;
}

/* NOTE: Spacing between progress bars  */
.progress-wrapper > * {
    margin: 0px 20px;
}

.progress {
    width: calc(20%);
    margin: auto;
    display: inline-block;
}

.progress-bar-displaying {
    color: black;
}

.transpatent-element {
    display: none;
}

/* Warning: potential problem with margining. The margin-bottom is set to exclude overlaaying with mongoose-setup-footer. */
.main-content {
    margin-bottom: calc(5%);
}

.processing-tab {
    border: 1px yellow solid;
}

/* NOTE: Footer which is fixed at the bottom  */
#mongoose-setup-footer {
    overflow: hidden;
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: calc(1%) calc(1%);
}

.progress-wrapper {
    width: calc(100%);
    display: inline-block;
    text-align: center;
}

/* NOTE: Spacing between progress bars  */
.progress-wrapper > * {
    margin: 0px 20px;
}

.progress {
    width: calc(20%);
    margin: auto;
    display: inline-block;
}

.progress-bar-displaying {
    color: black;
}

.transpatent-element {
    display: none;
}

/* Warning: potential problem with margining. The margin-bottom is set to exclude overlaaying with mongoose-setup-footer. */
.main-content {
    margin-bottom: calc(5%);
}

.processing-tab {
    background-color: lightgreen;
}

/* NOTE: Footer which is fixed at the bottom  */
#mongoose-setup-footer {
    overflow: hidden;
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: calc(1%) calc(1%);
}

Change color for processing tab.

Change color for processing tab.


body {
    margin: 0;
}

.icon-menu-link {
    /* Default styles has Icon menu offseting title */
    min-width: 0 !important;
}

section[role="region"] > header:first-child h1 {
    margin-right: 1.5em;
}

section[data-type="list"] {
    position: relative;
    top: 0;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: calc(100% - 5rem);
    overflow-y: scroll;
}

section[role="region"] > header:first-child h1 {
    text-align: left;
}
[data-type="list"] ul {
    padding-left: 0;
}

section[role="region"] > header.fixed:first-child {
    position: relative;
}

input {
    padding-left: 1rem;
    padding-right: 1rem;
    width: 100%;
    box-sizing: border-box;
}

Add padding to search box

Add padding to search box

Test Plan:
- Fill with text make sure it doesn't scroll the main UI
- Make sure there's padding on left and right


.vasfilter {
    display:grid;
    grid-template-columns: auto auto auto;
}
@media only screen and (max-width:1200px) {
    .vasfilter {
        grid-template-columns: auto auto;
    }
}
@media only screen and (max-width:700px) {
    .vasfilter {
        grid-template-columns: auto;
    }
}
.pv\.75r {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.vas__item .dev-collapsible__toggler {
    padding: 0;
}

.vas__item--hidden {
    display: none;
    visibility: hidden;
}

.vas__codes {
    flex: 1 1 10rem;
}

.vas__docs {
    flex: 15 1 30rem;
}

#vas-cutoff.cutoff-overlay {
    height: 14rem;
    padding-top: 6rem;
}

.vasfilter {
    display:grid;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
}
.pv\.75r {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.vas__item .dev-collapsible__toggler {
    padding: 0;
}

.vas__item--hidden {
    display: none;
    visibility: hidden;
}

.vas__codes {
    flex: 1 1 10rem;
}

.vas__docs {
    flex: 15 1 30rem;
}

#vas-cutoff.cutoff-overlay {
    height: 14rem;
    padding-top: 6rem;
}

Adjust grid logic in CSS

Adjust grid logic in CSS


ul.igcs-notice {
	padding: 7px;
	background: white;
	font-size: 24px;
	margin-top: 5px;
	min-height: 24px;
}

ul.igcs-notice:empty {
	content: "Waiting for download...";
	color: grey;
}

ul.igcs-notice svg {
	display: inline;
}

ul.igcs-notice > li {
	padding: 6px;
	display: inline;
	background: white;
}

ul.igcs-notice > li:first-child {
	padding-left: 14px;
}

.fa-ul {
	margin-left: 41px;
	padding-left: 15px;
	background: white;
}

.dl-waiting {
	color: #bbb;
}

.dl-done {
	color: green;
}

.SgTZ1.Tgarh .Slqrh {
	margin-top: 0px;
}

ul.igcs-notice {
	/*padding: 7px;
	background: white;*/
	font-size: 20px;
	/*margin-top: 5px;*/
	min-height: 24px;
}

ul.igcs-notice:empty {
	content: "Waiting for download...";
	color: grey;
}

ul.igcs-notice svg {
	display: inline;
}

ul.igcs-notice > li {
	padding: 6px;
	display: inline-block;
	background: white;
	height: 24px;
	width: 24px !important;
}

ul.igcs-notice > li:first-child {
	padding-left: 10px;
}

.fa-ul {
	margin-left: 40px !important;
	/*padding-left: 15px;*/
	background: white;
}

.dl-waiting {
	color: #bbb;
}

.dl-done {
	color: green;
}

.SgTZ1.Tgarh .Slqrh {
	margin-top: 0px;
}

Fix display issues of download status indicator


body {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  color: #212121;
  cursor: default;
  font-family: Helvetica, Arial, sans-serif;
  margin: 0;
  overflow: hidden;
}

.unselectable {
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
}

.sidebar {
  border-right: 1px solid #e0e0e0;
  height: 100%;
  position: fixed;
  width: 279px;
}

.no-sidebar .sidebar {
  pointer-events: none;
}

.content {
  box-sizing: border-box;
  height: 100%;
  padding-left: 280px;
  pointer-events: none;
  position: fixed;
  -webkit-transition: padding-left 0.3s ease-in-out;
  transition: padding-left 0.3s ease-in-out;
  width: 100%;
}

.content > * {
  pointer-events: auto;
}

.no-sidebar .content {
  padding-left: 0;
}

body {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  color: #212121;
  cursor: default;
  font-family: Helvetica, Arial, sans-serif;
  margin: 0;
  overflow: hidden;
}

.unselectable {
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
}

.sidebar {
  border-right: 1px solid #e0e0e0;
  height: 100%;
  position: fixed;
  width: 279px;
}

.content {
  box-sizing: border-box;
  height: 100%;
  padding-left: 280px;
  pointer-events: none;
  position: fixed;
  -webkit-transition: padding-left 0.3s ease-in-out;
  transition: padding-left 0.3s ease-in-out;
  width: 100%;
}

.content > * {
  pointer-events: auto;
}

.no-sidebar > .sidebar {
  pointer-events: none;
}

.no-sidebar > .content {
  padding-left: 0;
}

Refactor CSS class for no-sidebar

Refactor CSS class for no-sidebar


.news-agpl-footer > hr { margin-bottom:0;margin-top:0;width:33% }
.news-agpl-footer > a { font-size:xx-small;color:#ccc }

.news-module a.btn.aspNetDisabled {
    color:inherit;
    cursor:inherit;
    text-decoration:inherit;
}

.news-module .news-action-btns a.btn.disabled {
    pointer-events:auto;
}

.news-module .visibility-badges {
    font-size:85%
}

.news-module .visibility-badges ul.list-inline {
    margin-left:0
}

.news-module .visibility-badges .badge {
    padding-left:.5em;
    padding-right:.5em
}

.news-module .visibility-badges .badge.not-published {
    background-color:#cc3
}

.news-module .visibility-badges .badge.expired {
    background-color:#c33
}

.news-module .term-links {
    font-size:85%
}

.news-module .term-links span.glyphicon {
    color:gray
}

.news-module .news-entry-info {
    color:gray;
    font-size:85%
}

.news-module .news-entry-info .glyphicon-user {
    margin-left:1em
}

.news-module .news-entry-image {
    margin-bottom:.5em
}

Add bottom margin for news entry image (better look on mobile screens)


* {
    box-sizing: border-box;
    margin: 0;
}
body {
    padding: 10px;
}
fieldset {
    border: 1px solid;
    display: flex;
    flex-direction: column;
    padding-top: 0;
    width: 100%;
}
form > fieldset > *:nth-child(even) {
    margin-top: 20px;
}
fieldset fieldset {
    border-color: #DDDDDD;
}
fieldset fieldset label,
fieldset fieldset .box-wrapper {
    margin-top: 10px;
}
input[type=text],
input[type=number] {
    width: 100%;
}
textarea {
    height: 150px;
    padding: 3px;
    width: 100%;
}
.box-wrapper {
    line-height: 30px;
    margin-top: 5px;
}
.box-wrapper > label {
    display: block;
    margin: -30px 0 0 25px;
}
.controls {
    text-align: center;
}

* {
    box-sizing: border-box;
    margin: 0;
}
body {
    min-width: 400px;
    padding: 10px;
}
fieldset {
    border: 1px solid;
    display: flex;
    flex-direction: column;
    padding-top: 0;
    width: 100%;
}
form > fieldset > *:nth-child(even) {
    margin-top: 20px;
}
fieldset fieldset {
    border-color: #DDDDDD;
}
fieldset fieldset label,
fieldset fieldset .box-wrapper {
    margin-top: 10px;
}
input[type=text],
input[type=number] {
    width: 100%;
}
textarea {
    height: 150px;
    padding: 3px;
    width: 100%;
}
.box-wrapper {
    line-height: 30px;
    margin-top: 5px;
}
.box-wrapper > label {
    display: block;
    margin: -30px 0 0 25px;
}
.controls {
    text-align: center;
}

Fix min-width to give browser action popup a usable width


/* Custom style sheet */

.main {
  width: 320px;
  border: solid #ccc 1px;
  border-radius: 10px;
  box-shadow: 2px 4px 2px rgba(163,163,163, 0.7);
}

img {
  display: block;
  margin: auto;
  border-radius: 10px;
}

.main-content {
  width: 300px;
  border: solid #ccc 1px;
  border-radius: 10px;
  margin: 10px;
}

p {
  padding: 0 10px;
}

ul {
  list-style: none;
  padding: 0 10px;
}

Add styling to unordered list

Add styling to unordered list


@import '~app/styles/variables.css';

.logo {
  max-height: 500px;
  max-width: 500px;
  height: 50%;
  width: auto;
}

.logoSmall {
  max-height: 100px;
  max-width: 100px;
  border-radius: 100%;
}

.description {
  font-size: 18px;
  font-style: italic;
}

.listItem {
  margin: 8px;
  padding-left: 4px;
  background: var(--color-white);
}

.listItemContent {
  padding: 4px;
}

.textEdit {
  background: none;
  border: none;
  border-bottom: 1px solid var(--color-dark-mono-gray-4);
  margin: 8px;
  padding: 4px;
}

.deleteButton {
  margin-bottom: 16px;
}

.showMemberList {
  color: var(--lego-link-color);

  &:hover {
    text-decoration: underline;
    cursor: pointer;
  }
}

@import '~app/styles/variables.css';

.logo {
  max-height: 500px;
  max-width: 500px;
}

.logoSmall {
  max-height: 100px;
  max-width: 100px;
  border-radius: 100%;
}

.description {
  font-size: 18px;
  font-style: italic;
}

.listItem {
  margin: 8px;
  padding-left: 4px;
  background: var(--color-white);
}

.listItemContent {
  padding: 4px;
}

.textEdit {
  background: none;
  border: none;
  border-bottom: 1px solid var(--color-dark-mono-gray-4);
  margin: 8px;
  padding: 4px;
}

.deleteButton {
  margin-bottom: 16px;
}

.showMemberList {
  color: var(--lego-link-color);

  &:hover {
    text-decoration: underline;
    cursor: pointer;
  }
}

Remove height value for consistent ratio


body {
  margin-top: 70px;
}

.cover-art, .artist-image {
  max-height: 16em;
  text-align: center;
}
/* line 55, ../sass/app.scss */
.cover-art img, .artist-image img {
  max-height: inherit;
}

/* line 61, ../sass/app.scss */
.release-group-tile .cover-art, .release-tile .cover-art {
  height: 8em;
  max-height: 8em;
}
.release-group-tile h3, .release-tile h3 {
  margin-top: 0;
}

.release-group-tile, .release-tile {
  margin-bottom: 20px;
}

.release-tiles > :nth-child(2n+1), .release-group-tiles > :nth-child(2n+1) { clear: both; }

.tile-labels { float: right; }

/* Workaround for missing styles in bootstrap, remove when 3.1 released */
.col-md-offset-2 {
  margin-left: 16.666666666666664%;
}

Add in the xs offset 2 style as an override


/**
 * The following style rules affect Extension Infobars on the Mac.
 */

body {
  background: -webkit-gradient(linear, left top, left bottom,
              from(#EBEBEB), to(#CFCFCF));
  font-family: 'Lucida Grande', Helvetica, sans-serif;
  font-size: 11px;
  height: 36px; /* Infobars are limited to 36-72px */
  margin: 0px;
  overflow: hidden;
}

/**
 * The following style rules affect Extension Infobars on the Mac.
 */

body {
  background: -webkit-gradient(linear, left top, left bottom,
              from(#EBEBEB), to(#CFCFCF));
  font-family: 'Lucida Grande', Helvetica, sans-serif;
  font-size: 12px;
  height: 36px; /* Infobars are limited to 36-72px */
  margin: 0 38px;
  overflow: hidden;
}

[Mac] Tweak some CSS for extension infobars to have the correct text size and margin.

BUG=51124
TEST=none

Review URL: http://codereview.chromium.org/3184008

git-svn-id: dd90618784b6a4b323ea0c23a071cb1c9e6f2ac7@56340 4ff67af0-8c30-449e-8e8b-ad334ec8d88c


/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

.contentPane {
  margin: 9px 8px 5px 8px;
}

.actionButtons {
  margin: 0px 3px 6px 3px !important;
}

treechildren::-moz-tree-image(siteCol) {
  list-style-image: url(chrome://mozapps/skin/places/defaultFavicon.png);
  width: 16px;
  height: 16px;
  -moz-margin-end: 5px;
}

Fix favicon size in password manager

Fix favicon size in password manager


@import url("./style_template.css");

body {
	background: url(/images/error_bg.jpg) no-repeat center center fixed;
}

div#box {
	width: 500px;
	background: rgba(0, 0, 0, 0.7);
	padding: 16px;
	box-sizing: border-box;
	border-radius: 20px;
	margin-left: auto;
	margin-right: auto;
}

p {
	color: #a50000;
	font-size: 72px;
}

@media only screen and (max-width: 481px) {
	/* Portrait mode */
	div#box {
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
	}
}

@media only screen and (max-height: 481px) {
	/* Landscape mode */
	div#box {
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
	}
}

@import url("./style_template.css");

body {
	background: url(/images/error_bg.jpg) no-repeat center center fixed;
}

div#box {
	width: 500px;
	background: rgba(0, 0, 0, 0.7);
	padding: 16px;
	box-sizing: border-box;
	border-radius: 20px;
	margin-left: auto;
	margin-right: auto;
}

p {
	color: #a50000;
	font-size: 72px;
	text-align: center;
}

@media only screen and (max-width: 481px) {
	/* Portrait mode */
	div#box {
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
	}
}

@media only screen and (max-height: 481px) {
	/* Landscape mode */
	div#box {
		-webkit-transform: scale(0.5);
		transform: scale(0.5);
	}
}

Align error text in center

Align error text in center


#second_from_top {
display: block;
position: relative;
top: 850px;
left: 100px;
}

#third_from_top {
display: block;
position: relative;
top: 900px;
left: 100px;
}

#second_from_top {
display: block;
position: relative;
top: 830px;
left: 100px;
}

#third_from_top {
display: block;
position: relative;
top: 860px;
left: 100px;
}

Change second third block blog index css


#category-scripts > .category-icon,
.addon[type=user-script] .icon,
#detail-view[type=user-script] #detail-icon
{
  list-style-image: url(chrome://greasemonkey/skin/icon32.png);
}

.addon.addon-view[type="user-script"] .details.button-link {
  display: none !important;
}

#greasemonkey-sort-bar {
  display: none;
}

page.greasemonkey #greasemonkey-sort-bar {
  display: -moz-box;
}

page.greasemonkey #addon-list-empty,
#user-script-list-empty
{
  display: none;
}
page.greasemonkey #user-script-list-empty {
  display: -moz-box;
}

/* Hide the 'restart now' link for user scripts. */
.greasemonkey #addon-list button[command=cmd_restartApp] {
  display: none;
}

Remove 'restart now' link for uninstalled scripts.


.status-ok {
    color: green;
    cursor: default;
}

.status-nok {
    color: red;
    cursor: default;
}

.status-unknown {
    color: gray;
    cursor: default;
}

.status-ok {
    color: green;
}

.status-nok {
    color: red;
}

.status-unknown {
    color: gray;
}

.status-ok, .status-unknown, .status-nok {
    cursor: default;
}

a .status-ok, a .status-unknown, a.status-nok {
    cursor: pointer;
}

Make it a pointer over links

Make it a pointer over links


@font-face {
  font-family: 'Bangers';
  src: url(../frameworks/Bangers.ttf);
}

body {
  font-family: 'Bangers', cursive;
  padding-top: 3.5em;
  padding-bottom: 3.5em;
}

canvas {
  vertical-align: middle;
}

#start-game {
  border: 0;
  background-color: green;
  color: #fff;
}

.pulse {
  -webkit-animation: pulsate 0.9s infinite alternate;
  -moz-animation: pulsate 0.9s infinite alternate;
  -animation: pulsate 0.9s infinite alternate;
}

@-webkit-keyframes pulsate {
  from { box-shadow: 0 0 0px #fff; }
  to { box-shadow: 0 0 15px #4177BB; }
}
@-moz-keyframes pulsate {
  from { box-shadow: 0 0 0px #fff; }
  to { box-shadow: 0 0 15px #4177BB; }
}
@keyframes pulsate {
  from { box-shadow: 0 0 0px #fff; }
  to { box-shadow: 0 0 15px #4177BB; }
}
#serial-widget {
  margin-top: 0.5em;
  max-width: 75%;
}

@font-face {
  font-family: 'Bangers';
  src: url(../frameworks/Bangers.ttf);
}

body {
  font-family: 'Bangers', cursive;
  padding-top: 3.5em;
  padding-bottom: 3.5em;
}

canvas {
  vertical-align: middle;
}

#start-game {
  border: 0;
  background-color: green;
  color: #fff;
}

.pulse {
  -webkit-animation: pulsate 0.9s infinite alternate;
  -moz-animation: pulsate 0.9s infinite alternate;
  -animation: pulsate 0.9s infinite alternate;
}

@-webkit-keyframes pulsate {
  from { box-shadow: 0 0 0px #fff; }
  to { box-shadow: 0 0 15px #4177BB; }
}
@-moz-keyframes pulsate {
  from { box-shadow: 0 0 0px #fff; }
  to { box-shadow: 0 0 15px #4177BB; }
}
@keyframes pulsate {
  from { box-shadow: 0 0 0px #fff; }
  to { box-shadow: 0 0 15px #4177BB; }
}

select#serial-select {
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
}

#serial-widget {
  margin-top: 0.5em;
  max-width: 75%;
}

Remove rounded corners on port select (consider trying to re-add arrows though)


* {
  font-family: arial;
}

header {
  text-align: center;
  border: 2px solid gray;
}

footer {
  vertical-align: bottom;
  text-align: center;
  border: 2px solid gray;
}

section nav ul li {
  position: relative;
  display: inline-block;
  text-align: center;
  width: 10%;
  margin-left: 100px;
}

img {
  height: auto;
  width: auto;
  max-width: 300px;
  max-height: 300px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

* {
  color: #404040;
  font-family: arial;
  background-color: #75a3a3;
}

header {
  text-align: center;
  border: 2px solid #993333;
}

footer {
  vertical-align: bottom;
  text-align: center;
  border: 2px solid #993333;
}

section nav ul li {
  position: relative;
  display: inline-block;
  text-align: center;
  width: 10%;
  margin-left: 100px;
}

img {
  height: auto;
  width: auto;
  max-width: 300px;
  max-height: 300px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

a {
  color: #e5e600;
}

Add more color and fix links

Add more color and fix links


/* [XUL] Change the location bar color for secure sites */
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
#urlbar[pageproxystate="valid"] #identity-box.verifiedIdentity {
  background-color: #efe !important;
}

#urlbar[pageproxystate="valid"] #identity-box.verifiedDomain,
#urlbar[pageproxystate="valid"] #identity-box.mixedActiveBlocked {
  background-color: #ffb !important;
}

#urlbar[pageproxystate="valid"] #identity-box.verifiedDomain::after,
#urlbar[pageproxystate="valid"] #identity-box.mixedActiveBlocked::after {
  content: attr(tooltiptext);
  display: flex !important;
  color: #888 !important;
  padding: 0 2px !important;
}

#urlbar[pageproxystate="valid"] #identity-box.mixedDisplayContent,
#urlbar[pageproxystate="valid"] #identity-box.mixedDisplayContentLoadedActiveBlocked {
  background-color: #fdd !important;
}

/* [XUL] Change the location bar color for secure sites */
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
#urlbar[pageproxystate="valid"] #identity-box.verifiedIdentity {
  background-color: #efe !important;
}

#urlbar[pageproxystate="valid"] #identity-box.verifiedDomain,
#urlbar[pageproxystate="valid"] #identity-box.mixedActiveBlocked:not(.verifiedIdentity) {
  background-color: #ffb !important;
}

#urlbar[pageproxystate="valid"] #identity-box.verifiedDomain::after,
#urlbar[pageproxystate="valid"] #identity-box.mixedActiveBlocked:not(.verifiedIdentity)::after {
  content: attr(tooltiptext);
  display: flex !important;
  color: #888 !important;
  padding: 0 2px !important;
}

#urlbar[pageproxystate="valid"] #identity-box.mixedDisplayContent,
#urlbar[pageproxystate="valid"] #identity-box.mixedDisplayContentLoadedActiveBlocked {
  background-color: #fdd !important;
}

Fix the issue that identity box is broken if mixed content appears on the URI validated with EV certificate


.table td.col-2 {
  padding: 0;
}

.table td.col-2 img {
  width: 100%;
  cursor: pointer;
}

.col-2 div {
  position: relative;
  width: 100%;
  padding: 0;
}

.col-2 div div {
  position: absolute;
  width: 100%;
  text-align: right;
  bottom: 2px;
  right: 8px;
  font-weight: 500;
}

.col-2 div div.bg-secondary {
  width: auto;
  bottom: 1px;
  right: 1px;
  border: 1px white solid;
  border-radius: 50%;
  background-image: linear-gradient(var(--color-menu-clear), var(--color-menu-dark));
  padding: .35em .65em;
}

Fix badges in the divine bonus list

Fix badges in the divine bonus list


:global(.navigationTooltip) {
  opacity: 1 !important;
  border-bottom: 3px solid #e10028;
  box-shadow: 0 0 0.3125rem rgba(0,0,0,.2);
}

.tooltipHeadline {
  margin: 5px 0 0px;
  color: #e10028;
}

@media (max-width: 780px) {
  :global(.navigationTooltip) {
    display: none !important;
  }
}

:global(.navigationTooltip) {
  opacity: 1 !important;
  border-bottom: 3px solid #e10028;
  box-shadow: 0 0 0.3125rem rgba(0,0,0,.2);
  width: 200px;
}

.tooltipHeadline {
  margin: 5px 0 0px;
  color: #e10028;
}

@media (max-width: 780px) {
  :global(.navigationTooltip) {
    display: none !important;
  }
}

Set max width for scrolled navigation tooltips

REDMINE-17300


.chapterLink {
  composes: typography-defaultNavigationChapterLink from global;
  line-height: 42px;
  color: var(--theme-widget-primary-color);
  text-decoration: none;
  position: relative;
  display: block;
  font-family: inherit;
  font-weight: 700;
  font-size: 1rem;
  height: 42px;
  white-space: nowrap;
  padding: 0 10px;
  margin: 4px 0;
}

.chapterLink:hover,
.chapterLinkActive {
  color: var(--theme-accent-color);
}

.chapterLinkActive {
  composes: typography-defaultNavigationActiveChapterLink from global;
}

.summary {
  display: none;
}

/* mobile view */
@media (max-width: 780px) {
  .summary {
    display: block;
  }
}

@media (max-width: 780px) {
  .tooltipBubble {
    display: none !important;
  }
}

.chapterLink {
  composes: typography-defaultNavigationChapterLink from global;
  line-height: 42px;
  color: var(--theme-widget-primary-color);
  text-decoration: none;
  position: relative;
  display: block;
  font-family: inherit;
  font-weight: 700;
  font-size: 1rem;
  height: 42px;
  white-space: nowrap;
  padding: 0 10px;
  margin: 4px 0;
}

.chapterLink:hover,
.chapterLinkActive {
  color: var(--theme-accent-color);
}

.chapterLinkActive {
  composes: typography-defaultNavigationActiveChapterLink from global;
}

.summary {
  display: none;
}

/* mobile view */
@media (max-width: 780px) {
  .summary {
    display: block;
    color: var(--theme-widget-on-background-color);
  }
}

@media (max-width: 780px) {
  .tooltipBubble {
    display: none !important;
  }
}

Use on-background color for mobile chapter descriptions

Ensure text is readable even if navigation bar uses light on-surface
color.

REDMINE-19429


.site-header {
  background-image: url("/images/background.jpg");
}

.thumb-button {
  display: inline-block;
}

.comment-area-separator-question {
  margin-top: 12px;
  border-bottom: 2px solid #337ab7;
}

.comment-area-separator-answer {
  margin-top: 12px;
  border-bottom: 2px solid #e3e3e3;
}

.question-detail {
  margin-top: 12px;
}

Add thumb-button, comment-area-separator-question, comment-area-separator-answer, and question-detail custom CSS classes


@value loginBodyColor #F3F7F8;
@value btnPrimaryColor #1C9DDB;
@value fieldMaxWidth 255px;
@value fieldMinWidth 175px;
@value fieldMargin 16px;

@value titleColor #083144;
@value alTitleColor #6B8792;
@value disabledComponentColor #EEEEEE;

@value regionCodeWidth 98px;
@value phoneNumberWidth 108px;

@media (max-width: 980px) {
  .Buttons.Static {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px;
    box-shadow: -1px -1px 3px 0 btnPrimaryColor;
    background-color: loginBodyColor;
    z-index: 5;
  }
}

.Button {
  margin-top: 16px;
  margin-right: 16px;
}

.FormComponent {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
}

.Errors {
  width: 100%;
}

.Buttons {
  width: 100%;
}

@media (max-width: 980px) {
  .FormComponent {
    margin-bottom: 72px;
  }
}

@value loginBodyColor #F3F7F8;
@value btnPrimaryColor #1C9DDB;
@value fieldMaxWidth 255px;
@value fieldMinWidth 175px;
@value fieldMargin 16px;

@value titleColor #083144;
@value alTitleColor #6B8792;
@value disabledComponentColor #EEEEEE;

@value regionCodeWidth 98px;
@value phoneNumberWidth 108px;

@media (max-width: 980px) {
  .Buttons.Static {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px;
    box-shadow: -1px -1px 3px 0 btnPrimaryColor;
    background-color: loginBodyColor;
    z-index: 5;
  }

  .FormComponent {
    padding-bottom: 64px;
  }
}

.Button {
  margin-top: 16px;
  margin-right: 16px;
}

.FormComponent {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
}

.Errors {
  width: 100%;
}

.Buttons {
  width: 100%;
}

@media (max-width: 980px) {
  .FormComponent {
    margin-bottom: 72px;
  }
}

Add more padding to mobile forms

Add more padding to mobile forms

Give it more real estate so that it can have space to display errors and such


#top {
display:block;
display: relative;
background-color:;
top: 120px;
}

#second_from_top {
display: block;
position: relative;
top: 300px;

}

#top {
display:block;
display: relative;
background-color:;
top: 170px;
}

#second_from_top {
display: block;
position: relative;
top: 300px;

}

Change top block week stylesheet

Change top block week stylesheet


.page-header h1 {
  padding-top: 55px;
  margin-top: -55px;
}

#sidebar li {
  border-left: 4px #fff solid;
}

#sidebar li.active {
  border-left: 4px #eee solid;
}

#sidebar li a {
  padding: 5px 15px;
}

#sidebar {
  width: 228px;
}

#sidebar.affix {
  position: fixed;
  top: 70px;
}

.github-badge {
  position: fixed;
  top: 70px;
  right: 0;
  border: 0;
  z-index: 9999;
}

@media all and (min-width: 768px) {

  .github-badge {
    top: 0;
  }

}

.page-header h1 {
  padding-top: 55px;
  margin-top: -55px;
}

#sidebar li {
  border-left: 4px #fff solid;
}

#sidebar li.active {
  border-left: 4px #eee solid;
}

#sidebar li a {
  padding: 5px 15px;
}

#sidebar {
  width: 228px;
}

#sidebar.affix {
  position: fixed;
  top: 70px;
}

.github-badge {
  position: fixed;
  top: 51px;
  right: 0;
  border: 0;
  z-index: 9999;
}

@media all and (min-width: 768px) {

  .github-badge {
    top: 0;
  }

}

Adjust GitHub badge offset top

Adjust GitHub badge offset top


#site-head {
  background-color: #EEE;
  color: #525252;
}

#blog-logo img { max-height: 1000px }

a.btn {
  background-color: #50585D;
}

div.post-holder {
  background: #EFEFEF;
  color: #0F1E1E;
}

div.post-holder.entryTwo {
  background: #EFEFEF;
  background-image: url("/img/yaml.png");
  background-repeat: no-repeat;
  background-position: left;
  background-size: contain;
  color: #0F1E1E;
  text-align : right;
}

div.post-holder.entryThree {
  background: #EFEFEF;
  color: #0F1E1E;
}

div.post-holder.entryFour {
  background-color: #EFEFEF;
  color: #0F1E1E;
}

footer.site-footer {
  background: #666;
}

#site-head {
  background-color: #EEE;
  color: #525252;
}

#blog-logo img { max-height: 1000px }

a.btn {
  background-color: #50585D;
}

div.post-holder {
  background: #EFEFEF;
  color: #0F1E1E;
}

div.post-holder.entryTwo {
  background: #EFEFEF;
  color: #0F1E1E;
}

div.post-holder.entryThree {
  background: #EFEFEF;
  color: #0F1E1E;
}

div.post-holder.entryFour {
  background-color: #EFEFEF;
  color: #0F1E1E;
}

footer.site-footer {
  background: #666;
}

Remove yaml background image on homepage


p {
    max-width: 40em;
    line-height: 1.50;
}

table, tr, td, th {
    border: solid 1px #ddd;
    border-collapse: collapse;
}

td, th {
    padding: 5px;
}

.vis-item.america {
    background-color: #759bc6;
    border-color: #4b637f;
}

.vis-item.brazil {
    background-color: #5faf89;
    border-color: #3c6d56;
}

.vis-item.europe {
    background-color: #f2e8bf;
    border-color: #bcb495;
}

p {
    max-width: 40em;
    line-height: 1.50;
}

table, tr, td, th {
    border: solid 1px #ddd;
    border-collapse: collapse;
}

td, th {
    padding: 5px;
}

.vis-item.america {
    background-color: #759bc6;
    border-color: #4b637f;
}

.vis-item.asia {
    background-color: #c46e6a;
    border-color: #91534f;
}

.vis-item.brazil {
    background-color: #5faf89;
    border-color: #3c6d56;
}

.vis-item.europe {
    background-color: #f2e8bf;
    border-color: #bcb495;
}

Add color to Asian events

Add color to Asian events


html {
  position: relative;
  min-height: 100%;
}

body {
  padding-top: 80px;
  padding-bottom: 60px;
}

p {
  font-size: 120%;
  font-family: 'Arimo', sans-serif;
}

h1 {
  font-family: 'Arimo', sans-serif !important;
}

img {
  width: 100%;
  height: auto;
  box-shadow: 2px 2px 10px #aaa;
}

iframe {
  box-shadow: 2px 2px 10px #aaa !important;
}

.btn {
  box-shadow: 1px 1px 5px #aaa !important;
}

blockquote {
  font-size: 97% !important;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px;
  background-color: #f5f5f5;
  padding: 1em;
}

div.row {
  max-width: 1280px;
  margin: 0 auto;
}

div.jumbotron {
  box-shadow: 2px 2px 10px #aaa;
}

@media (max-width: 992px) {
  .sidebar {
    padding-top: 2em;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  padding-top: 80px;
  padding-bottom: 60px;
}

p {
  font-size: 120%;
  font-family: 'Arimo', sans-serif;
}

h1 {
  font-family: 'Arimo', sans-serif !important;
}

img {
  width: 100%;
  height: auto;
  box-shadow: 2px 2px 10px #aaa;
}

iframe {
  box-shadow: 2px 2px 10px #aaa !important;
}

.btn {
  box-shadow: 1px 1px 5px #aaa !important;
}

blockquote {
  font-size: 97% !important;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px;
  background-color: #f5f5f5;
  padding: 1em;
}

div.row {
  max-width: 1280px;
  margin: 0 auto;
}

div.jumbotron {
  box-shadow: 2px 2px 10px #aaa;
  margin: 20px !important;
}

@media (max-width: 992px) {
  .sidebar {
    padding-top: 2em;
  }
}

Add a little more margin on jumbotron.

Add a little more margin on jumbotron.


#c1 {
display:block;
position: absolute;
top: 210px;
}
#second_from_top {
display: block;
position: relative;

}

Add c1 id to general stylesheet

Add c1 id to general stylesheet


.kw {
    color: #800080;
}
.nu {
    color: #dda500;
}
.sym {
    color: #0033aa;
}
a span.sym {
    font-weight: bold;
}
.str {
    color: #dd2200;
}
.ty {
    color: #347C17;
}
.binding {
    background-color: #ddd;
}
pre a {
    text-decoration: none;
}
header {
    background-color: #646D7E;
    border-bottom: 1px thin #000;
    padding: 20px 20px 20px 20px;
}
header a {
    color: #88aaff;
}
body {
    margin: 0;
    padding: 0;
}
section {
    margin-left: 50px;
}
#buttonToggleBody {
    border: 1px thin #000;
    background-color: #eee;
    color: #000;
    padding: 5px 5px 5px 5px
}

.kw {
    color: #800080;
}
.nu {
    color: #dda500;
}
.sym {
    color: #0033aa;
}
a span.sym {
    font-weight: bold;
}
.str {
    color: #dd2200;
}
.ty {
    color: #347C17;
}
.binding {
    background-color: #ddd;
}
pre a {
    text-decoration: none;
}
header {
    background-color: #646D7E;
    border-bottom: 1px thin #000;
    padding: 20px 20px 20px 20px;
}
header a {
    color: #88aaff;
}
pre.header {
    margin:       0.5em 0 0 0;
    padding-top:  3px;
    padding-left: 3px;
}
pre.body {
    margin:         0;
    padding-left:   3px;
    padding-bottom: 3px;
}
body {
    margin: 0;
    padding: 0;
}
section {
    margin-left: 50px;
}
#buttonToggleBody {
    border: 1px thin #000;
    background-color: #eee;
    color: #000;
    padding: 5px 5px 5px 5px
}

Adjust margin and padding in CSS

Adjust margin and padding in CSS

 * Remove ugly gap between binding and body

 * Add small padding above and to the left of text to improve
   readability


@import url("bootstrap-astropy.css");

div.topbar a.brand {
  background: transparent url("photutils_logo-32x32.png") no-repeat 8px 3px;
}

#logotext1 {
  color: #e8f2fc;
}

@import url("bootstrap-astropy.css");

div.topbar a.brand {
  background: transparent url("photutils_logo-32x32.png") no-repeat 8px 3px;
  background-image: url("photutils_logo.svg"), none;
  background-size: 32px 32px;
}

#logotext1 {
  color: #e8f2fc;
}

Use SVG logo on docs top bar

Use SVG logo on docs top bar


header {
	background-color: #281892;
	border-bottom: 15px solid #0d0254;
}

footer {
	background-color: #5854d6;
}

.header-content {
	padding-top: 5%;
}

.selfie {
	height: auto;
	width: 25%;
	display: block;
	margin: auto;
	border-radius: 20%;
	border: 2px solid black;
}

.header-text {
	color: white;
	text-shadow: 3px 1px 2px rgba(0, 0, 0, 1);
}

header {
	background-color: #281892;
	border-bottom: 10px solid #0d0254;
}

footer {
	border-top: 10px solid #0d0254;
	border-bottom: 10px solid #0d0254;
	background-color: #5854d6;
}

.footer-text {
	text-align: center;
	color: white;
	text-shadow: 3px 1px 2px rgba(0, 0, 0, 1);
}

.footer-content {
	padding: 2% 0;
}

.header-content {
	padding-top: 5%;
}

.selfie {
	height: auto;
	width: 25%;
	display: block;
	margin: auto;
	border-radius: 20%;
	border: 2px solid black;
}

.header-text {
	color: white;
	text-shadow: 3px 1px 2px rgba(0, 0, 0, 1);
}

footer img {
	margin-bottom: 9px;
	width: 32px;
	height: 32px;
	-webkit-box-shadow: -8px 13px 22px -6px rgba(0,0,0,1);
	-moz-box-shadow: -8px 13px 22px -6px rgba(0,0,0,1);
	box-shadow: -8px 13px 22px -6px rgba(0,0,0,1);
}

.icon {
	margin-left: 43%;
}

Add box and text shadows to icons and text, center text and icons, and add borders to footer.


form fieldset {
	display: flex !important;
	flex-direction: column;
}

#password {
	margin-right: 0 !important;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	height: 45px;
	box-sizing: border-box;
	flex: 1 1 auto;
	width: 100% !important;
	min-width: 0; /* FF hack for to override default value */
}

input[type='submit'] {
	width: 45px;
	height: 45px;
	margin-left: 0 !important;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

fieldset > p {
	display: inline-flex;
}

form fieldset {
	display: flex !important;
	flex-direction: column;
}

#password {
	margin-right: 0 !important;
	height: 45px;
	box-sizing: border-box;
	flex: 1 1 auto;
	width: 100% !important;
	min-width: 0; /* FF hack for to override default value */

	/* The padding needs to be set here instead of for "input[type="password"]"
	 * elements to prevent being overriden by a more specific rule in the
	 * server. */
	padding-right: 44px;
}

input[type="password"]:focus + .icon-confirm:not(:disabled) {
	opacity: .6;
}

input[type="password"] + .icon-confirm {
	position: absolute;
	right: 15px;

	border: none;
	/* Needed to override an important rule set in the server. */
	background-color: transparent !important;

	opacity: .3;
}

input[type="password"] + .icon-confirm:hover:not(:disabled),
input[type="password"] + .icon-confirm:focus:not(:disabled),
input[type="password"] + .icon-confirm:active:not(:disabled) {
	opacity: 1;
}

input[type='submit'] {
	width: 45px;
	height: 45px;
	margin-left: 0 !important;
}

fieldset > p {
	display: inline-flex;
}

Fix opacity of submit button for password in authentication page

The authentication page uses pure CSS instead of the SCSS styles, so the
rules were adjusted as needed.

Signed-off-by: Daniel Calviño Sánchez <bd7629e975cc0e00ea7cda4ab6a120f2ee42ac1b@gmail.com>


@import url(http://fonts.googleapis.com/css?family=Inconsolata);

h1 {
  text-align: center;
  font-family: 'Inconsolata', ;
}

@import url(http://fonts.googleapis.com/css?family=Inconsolata);

h1 {
  text-align: center;
  font-family: 'Inconsolata', ;
  font-size: 72px;
}

Increase font-size of header element

Increase font-size of header element


* {
    margin: 0;
    padding: 0;
}

div.container {
    width: 100%;
}

header, footer {
    padding: 1em;
    color: white;
    background-color: black;
    clear: left;
    text-align: center;
}

footer {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 5%;
    width: 100%;
    overflow:hidden;
}

nav {
    float: left;
    max-width: 160px;
    margin: 0;
    padding: 1em;
}

nav ul {
    list-style-type: none;
    padding: 0;
}

nav ul a {
    text-decoration: none;
}

article {
    margin-left: 170px;
    border-left: 1px solid gray;
    padding: 1em;
    overflow: hidden;
}

* {
    margin: 0;
    padding: 0;
}

div.container {
    width: 100%;
}

header, footer {
    padding: 1em;
    color: white;
    background-color: black;
    clear: left;
    text-align: center;
}

footer {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 5%;
    width: 100%;
    overflow:hidden;
}

nav {
    float: left;
    max-width: 160px;
    margin: 0;
    padding: 1em;
}

nav ul {
    list-style-type: none;
    padding: 0;
}

nav ul a {
    text-decoration: none;
}

article {
    margin-left: 170px;
    font-size: large;
    border-left: 1px solid gray;
    padding: 1em;
    overflow: hidden;
}

Set the font size to large

Set the font size to large


/* Background on fullscreen */
.flowplayer.is-fullscreen {
  background-color: #000;
}

/* Don't show timeline on mouse-out */
.flowplayer.is-mouseout .fp-timeline {
  height: 0px;
  border: none;
}

.flowplayer .fp-subtitle.fp-active p {
  font-size: 2em;
  background: rgba(0, 0, 0, 0.05);
}

.flowplayer .fp-subtitle.fp-active p span {
  cursor: pointer;
}

a.fp-embed {
  display: none !important;
}

.is-paused.flowplayer .fp-ui {
  background: none;
}

.flowplayer .fp-subtitle i {
  font-style: italic;
}

/* Background on fullscreen */
.flowplayer.is-fullscreen {
  background-color: #000;
}

/* Don't show timeline on mouse-out */
.flowplayer.is-mouseout .fp-timeline {
  height: 0px;
  border: none;
}

.flowplayer .fp-subtitle.fp-active p {
  font-size: 1.8em;
  background: rgba(0, 0, 0, 0.05);
}

.flowplayer .fp-subtitle.fp-active p span {
  cursor: pointer;
}

a.fp-embed {
  display: none !important;
}

.is-paused.flowplayer .fp-ui {
  background: none;
}

.flowplayer .fp-subtitle i {
  font-style: italic;
}

Make default subtitles font a little smaller


* {
    -ms-touch-action: none;
}

#renderTarget {
    background-image: url(../images/background_layer/time_background2.jpg);
    -ms-user-select: none;
    user-select: none;
}

Make it work better with touch

Make it work better with touch


.landingPage_heroTextContainer {
  padding-top: 80px;
  background-image: linear-gradient(-134deg, #3023ae 0%, #c96dd8 100%);
  height: calc(100vh - $headerHeight - $footerHeight);
  text-align: center;

  @media screen and (width >= $md-screen) {
    height: calc(100vh - $headerHeight - $expandedFooterHeight);
  }
}

.landingPage-heroText {
  font-size: 25px;
  color: #fff;
  margin-bottom: 40px;
}

.landingPage_heroTextContainer {
  padding-top: calc(50vh - 200px);
  background-image: linear-gradient(-134deg, #3023ae 0%, #c96dd8 100%);
  height: calc(100vh - $headerHeight - $footerHeight);
  text-align: center;

  @media screen and (width >= $md-screen) {
    height: calc(100vh - $headerHeight - $expandedFooterHeight);
  }
}

.landingPage-heroText {
  font-size: 25px;
  color: #fff;
  margin-bottom: 40px;
}

Adjust location of landing page text

Adjust location of landing page text


@charset "utf-8";
body {
	overflow: hidden;
}

/* Preloader */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should have another color then white */
	z-index:99; /* makes sure it stays on top */
}

#status {
	width:200px;
	height:200px;
	position:absolute;
	left:50%; /* centers the loading animation horizontally one the screen */
	top:50%; /* centers the loading animation vertically one the screen */
	background-image:url(../img/status.gif); /* path to your loading animation */
	background-repeat:no-repeat;
	background-position:center;
	margin:-100px 0 0 -100px; /* is width and height divided by two */
}

@charset "utf-8";
body {
	overflow: hidden;
}

/* Preloader */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should be a color other than white */
	z-index:99; /* makes sure it stays on top */
}

#status {
	width:200px;
	height:200px;
	position:absolute;
	left:50%; /* centers the loading animation horizontally on the screen */
	top:50%; /* centers the loading animation vertically on the screen */
	background-image:url(../img/status.gif); /* path to your loading animation */
	background-repeat:no-repeat;
	background-position:center;
	margin:-100px 0 0 -100px; /* is width and height divided by two */
}

Fix spelling mistakes in comments

Fix spelling mistakes in comments


body {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  color: #212121;
  cursor: default;
  font-family: Helvetica, Arial, sans-serif;
  margin: 0;
  overflow: hidden;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

body:not(.hover-disabled) .hoverable:hover {
  opacity: 0.6;
}

body.dragging .embed {
  pointer-events: none;
}

body {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  color: #212121;
  cursor: default;
  font-family: Helvetica, Arial, sans-serif;
  margin: 0;
  overflow: hidden;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

body:not(.hover-disabled) .hoverable:hover {
  opacity: 0.6;
}

body.dragging .embed {
  pointer-events: none;
}

Use 'transparent' keyword in CSS

Use 'transparent' keyword in CSS


.info-box-custom {
    height: 120px !important;
    padding-top: 15px;
}
.icon-custom {
    margin-top: -20px !important;
    padding-top: 20px !important;
}
.text-large {
    font-size: 1.6em !important;
}

#add-post {
    display: block;
}

.os-btn-custom {
    /*margin-top: -28px;*/
    float: right;
}

.os-btn-icon {
    padding-top: 8px;
}

.os-icon-button {
    padding-left: 0 !important;
    margin-left: -8px;
    margin-right: 10px;
}

#dashboard {
    display: none;
}

.info-box-custom {
    height: 120px !important;
    padding-top: 15px;
}
.icon-custom {
    margin-top: -20px !important;
    padding-top: 20px !important;
}
.text-large {
    font-size: 1.6em !important;
}

#add-post {
    display: none;
}

.os-btn-custom {
    /*margin-top: -28px;*/
    float: right;
}

.os-btn-icon {
    padding-top: 8px;
}

.os-icon-button {
    padding-left: 0 !important;
    margin-left: -8px;
    margin-right: 10px;
}

/*#dashboard {
    display: none;
}*/

Return style from test style into default


.sponsor-logo {
  margin-right: 10px;
  width: 200px;
  float: left;
}

.sponsor-logo {
  margin-right: 10px;
  float: left;
}

Remove set width of 200px

Remove set width of 200px


section.select-seats {
    display: flex;
    flex-direction: row;
}

div.seat-info div {
    border: 1px dotted;
    padding: 0.5rem;
}

.theater-seat-map svg {
    border: 1px solid grey;
}

.theater-seat-map svg rect.stage {
    stroke-width: 1;
    fill: none;
    stroke: grey;
}

.theater-seat-map svg text.stage-text {
    font-size: 14;
    text-anchor: middle;
    fill: white;
}

.seat {
    fill: grey;
}

.taken-seat {
    fill: #ff173d;
    fill: rgb(141, 4, 28);
}

.selected-seat {
    fill: #fd0;
}

.seat:not(.taken-seat) {
    cursor: pointer;
}

.seat:not(.taken-seat):hover {
    fill: #fd0;
}

.select-seats aside {
  padding: 0 1em;
}

Add padding on select-seats aside

Add padding on select-seats aside


.floatTOC {
	transition: 1s all ease;
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	border: none;
	background: #f6f6f6;
	font-size: 0.8em;
	width: 10em;
	height: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.floatTOC ul ul {
	margin: 0 0 0 1em;
}

.floatTOC:hover {
	width: auto;
	overflow: auto;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
}

.floatTOC > * {
	transition: 1s all ease;
	opacity: 0.5;
}

.floatTOC:hover > * {
	opacity: 1;
}

.floatTOC .tocnumber {
	display: none;
}

Remove numbers from the list

Remove numbers from the list

Closes #9


.environment-title {
  color: dimgrey;
  margin-bottom: 0;
  font-family: "Courier New", sans-serif;
}

#tooltip {
  width: 10%;
  height: 10%;
  padding: 1%;

  background-color: rgba(240, 240, 240, 0.8);
  border: 1px solid black;

  text-align: center;
  font-family: Roboto, Arial, sans-serif;
  font-size: 2vmin;
}

Add CSS to the tooltip.

Add CSS to the tooltip.


/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

.contentPane {
  margin: 9px 8px 5px 8px;
}

.actionButtons {
  margin: 0px 3px 6px 3px !important;
}

treechildren::-moz-tree-image(siteCol) {
  list-style-image: url(chrome://mozapps/skin/places/defaultFavicon.png);
  width: 16px;
  height: 16px;
  -moz-margin-end: 5px;
}

Fix favicon sizes in password manager

Fix favicon sizes in password manager


.appear-enter {
  transition-duration: .7s;
  transition-property: opacity;
  transition-timing-function: east-out;
  opacity: 0;
}

.appear-enter.appear-enter-active {
  opacity: 1;
}

.appear-leave {
  opacity: 0;
}

Add opacity animations for route transition


body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

.wallpaper {
  margin-bottom: 2.5rem;;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

.wallpaper, footer {
  margin-bottom: 2.5rem;;
}

@media (max-width: 575.98px) {
  h1 {
    font-size: 2rem;
  }

  h3 {
    font-size: 1.2rem;
  }
}

Make headings smaller on mobile view

Make headings smaller on mobile view


#disqus_thread a {
  text-decoration: underline;
}
.container li a { text-decoration: underline; }

.intro-header {
  -webkit-transition: background-image 2s ease-in-out;
  -moz-transition: background-image 2s ease-in-out;
  -ms-transition: background-image 2s ease-in-out;
  -o-transition: background-image 2s ease-in-out;
  transition: background-image 2s ease-in-out;
}

/**
 * For tag cloud and archives
 * http://blog.meinside.pe.kr/Adding-tag-cloud-and-archives-page-to-Jekyll/
 */
.tag-cloud {
  list-style: none;
  padding: 0;
  text-align: justify;
  font-size: 16px;
  li {
    display: inline-block;
    margin: 0 12px 12px 0;
  }
}
#archives {
  padding: 5px;
}
.archive-group {
  margin: 5px;
  border-top: 1px solid #ddd;
}
.archive-item {
  margin-left: 5px;
}
.post-tags {
  text-align: right;
}

.navbar {
  background-color: rgba(0, 0, 0, 0.3);
}

Add alpha-transparent bg for navbar

Add alpha-transparent bg for navbar


/* Copyright (c) 2013 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

.default-object-snapshot-view #args {
  white-space: pre;
}

.default-object-instance-view #snapshots > * {
  display: block;
}

.default-object-view * {
  -webkit-user-select: text;
}

.default-object-view .title,
.default-object-view .title {
  border-bottom: 1px solid rgb(128, 128, 128);
  font-size: 110%;
  font-weight: bold;
}

.default-object-view td,
.default-object-view th {
  font-family: monospace;
  vertical-align: top;
}

/* Copyright (c) 2013 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

.default-object-snapshot-view #args {
  white-space: pre;
}

.default-object-instance-view #snapshots > * {
  display: block;
}

.default-object-view {
  overflow: auto;
}

.default-object-view * {
  -webkit-user-select: text;
}

.default-object-view .title,
.default-object-view .title {
  border-bottom: 1px solid rgb(128, 128, 128);
  font-size: 110%;
  font-weight: bold;
}

.default-object-view td,
.default-object-view th {
  font-family: monospace;
  vertical-align: top;
}

Make default object view have overflow so it can scroll


html {
  height: 100%;
  width: 100%;
}

body {
  margin: 0px;
  height: 100%;
  width: 100%;
}

#firepad-container {
  height: 100%;
  width: 100%;
}

html {
  height: 100%;
  width: 100%;
}

body {
  margin: 0px;
  height: 100%;
  width: 100%;
  overflow: hidden;
}

#firepad-container {
  height: 100%;
  width: 100%;
}

Set overflow to hidden on body to prevent scrolling outside of editor.


body{
  color: white;
  background-image: url("../imgs/bg.png");
  background-repeat: no-repeat;
  background-size: 100%;
  background-color: #000;
}

h1 {
  color: white;
}

li{
  list-style-type: none;
}
#links{
  border: 2px solid pink;
}

#center_carousel{
  border: 2px solid pink;
  background-color: grey;
  height: 30em;
}

#twitter{
  border: 2px solid pink;
}

#footer{
  background: pink;
  position: fixed;
  bottom: 0;
  width: 100%;
}

#home_view {
  display: none;
  padding: 0 2.5%;
  height: 23em;
  overflow: auto
}

#video_view {
  display: none;
  height: 95%;
}

#music_view {
  display: none;
  height: 95%;
}

Set display none for video and music view.


/* TOP SECTION
----------------------------------------*/

.top a {
    text-decoration: none;
}

.top button {
    margin-top: 1rem;
    float: right;
}

.top h1 {
    color: #34495e;
}

#logout_button {
    margin-top: 1rem;
    float: right;
}

/* LOGIN + REGISTER SECTION
----------------------------------------*/

.login dialog::backdrop {
    background-color: rgba(0,0,0,0.7);
}

.signup dialog::backdrop {
    background-color: rgba(0,0,0,0.7);
}

.errors {
    margin-bottom: 0rem;
    color: red;
}

/* MANGA SECTION
----------------------------------------*/

.manga {
	display: inline;
}

.manga img {
	width: 100%;
}

.manga i {
    font-size: 5rem;
    color: black;
}

.manga i:hover {
    cursor: pointer;
}

.manga ul {
    list-style-type: none;
}

.manga .comment_section {
    padding-top: 2rem;
}

/* Media queries style
----------------------------------------*/

/* mobile only style */
@media(max-width: 500px){
    .manga textarea {
        margin-top: 2.0rem;
    }

}

Add more space bw post and img for mobile


/* the tree node's style */
.tree-view {
  overflow-y: hidden;
}

.tree-view_item {
  /* immediate child of .tree-view, for styling convenience */
}

/* style for the children nodes container */
.tree-view_children {
  margin-left: 16px;
}

.tree-view_children-collapsed {
  height: 0px;
}

.tree-view_arrow {
  cursor: pointer;
  margin-right: 6px;
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.tree-view_arrow:after {
  content: '▾';
}

/* rotate the triangle to close it */
.tree-view_arrow-collapsed {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

Add missing css file for tree view

Add missing css file for tree view


/**
 * Messages
 */
.message {
  background: color(#ffd600 lightness(+20%));
}

.message__content {
  margin: 0 auto;
  max-width: var(--width);
  padding: 1.5rem 2rem;
}

.message__divider {
  padding-left: 1rem;
  padding-right: 1rem;
}

/**
 * Messages
 */
.message {
  background: #ffd600;
}

.message__content {
  margin: 0 auto;
  max-width: var(--width);
  padding: 1.5rem 2rem;
}

.message__divider {
  padding-left: 1rem;
  padding-right: 1rem;
}

Update usage of color function in CSS

Update usage of color function in CSS


div.metadata {
    color: rgb(119, 119, 119);
    font-size: 90%;
}

#ddgcarousel #in_theaters li.ddgc_item img {
	max-height: 100px;
}

Increase the size of the images.

InTheaters: Increase the size of the images.


body {
    background-color: #eaf1f1;
    font-family: 'Istok Web', sans-serif;
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Lora', serif;
    letter-spacing: 2px;
}

.col-md-4 .card {
    min-height: 650px;
    margin-bottom: 100px;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    border-radius: 5%;
}

.article-image {
    min-height: 300px;
    max-height: 350px;
    border-radius: 5%;
    margin-bottom: 20px;
}

.jumbotron {
    color: white;
    background-color: #141d27;
}

h1 {
    font-weight: bolder;
}

.navbar {
    letter-spacing: 1.5px;
    background-color: #141d27;
}

.navbar-toggler-icon {
    color: white;
}

body {
    background-color: #eaf1f1;
    font-family: 'Istok Web', sans-serif;
    line-height: 1.6;
    padding-top: 50px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Lora', serif;
    letter-spacing: 2px;
}

.card {
    min-height: 650px;
    margin-bottom: 100px;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    border-radius: 5%;
}

.article-image {
    min-height: 300px;
    max-height: 350px;
    border-radius: 5%;
    margin-bottom: 20px;
}

.jumbotron {
    color: white;
    background-color: #141d27;
}

h1 {
    font-weight: bolder;
}

.navbar {
    letter-spacing: 1.5px;
    background-color: #141d27;
}

.navbar-toggler-icon {
    color: white;
}

Add padding to body to give spacing in the navbar.


@import "base";
@import "cardstack-card-picker";
@import "cardstack-cards-editor";

:root {
    --deep-background: #000;
    --normal-background: #292A2C;
    --activating-background: #404040;
    --active-background: #545454;
    --light-background: #737373;

    --muted-foreground: #777;
    --rising-foreground: #aaa;
    --light-foreground: #F2F2F2;
    --bright-foreground: #fff;

    --tools-highlight: #63a9fa;
    --deep-tools-highlight: #032c5b;
    --faded-tools-highlight: #032c5b77;

    --tools-preview: #860404;
}

@font-face {
    font-family: 'Avenir';
    src: url('../@cardstack/tools/Avenir.ttc');
}

/* these classes comes from the ember-sidebars addon. We need to
   increase the z-indices of the sidebars so they stay on top of the
   scrims provided by ember-overlays. */
.cst-bottom {
    z-index: 15;
}

@import "base";
@import "cardstack-card-picker";
@import "cardstack-cards-editor";

:root {
    --deep-background: #000;
    --normal-background: #292A2C;
    --activating-background: #404040;
    --active-background: #545454;
    --light-background: #737373;

    --muted-foreground: #777;
    --rising-foreground: #aaa;
    --light-foreground: #F2F2F2;
    --bright-foreground: #fff;

    --tools-highlight: #63a9fa;
    --deep-tools-highlight: #032c5b;
    --faded-tools-highlight: #032c5b77;

    --tools-preview: #860404;
}

@font-face {
    font-family: 'Avenir';
    src: url('../@cardstack/tools/Avenir.ttc');
}

/* these classes comes from the ember-sidebars addon. We need to
   increase the z-indices of the sidebars so they stay on top of the
   scrims provided by ember-overlays. */
.cst-bottom {
    z-index: 150;
}

Increase bottom edge z-index to prevent overlap with overlays


.aui-widget {
}

.aui-widget-content {
}

.aui-widget-hd {
}

.aui-widget-bd {
}

.aui-widget-ft {
}

.aui-widget-stacked .aui-widget-shim {
    border: 0;
    height: 100%;
    left: 0;
    margin: 0;
    opacity: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;

	/* IE8 */
	-ms-filter: alpha(opacity=0);
	/* IE7/IE8(quirks) and below */
	filter: alpha(opacity=0);
    /* IE6 */
    _width:0;
    _height:0;
}

.aui-overlay {
	position: absolute;
}

.aui-overlay-hidden, .aui-contextoverlay-hidden {
	visibility: hidden;
}

.aui-overlay-focused {

}

Replace four spaces with a tab because this file eventually makes it into css.jspf in the portal and ant format-source complains

git-svn-id: eaac6977d0b6fa3343c402860739874625caf655@36552 05bdf26c-840f-0410-9ced-eb539d925f36


.keybindings-modal {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-areas: "title close"
                         "message message"
                         "keybindings .";
    grid-template-columns: 1fr 2em;
    grid-template-rows: 3em 2em 1fr;
}

.keybindings-modal .title {
    grid-area: title;
}

.keybindings-modal .close {
    grid-area: close;
}

.keybindings-modal .message {
    grid-area: message;
    margin-left: 1em;
}

.keybindings-modal .keybindings {
    grid-area: keybindings;
    margin: 1em;
}

.keybindings-modal .keybindings .keybinding {
    margin-bottom: 1em;
}

.keybindings-modal .keybindings .action {
    display: inline-block;
    width: 20em;
    margin-right: 1em;
}

.keybindings-modal .keybindings .key {
    display: inline-block;
    width: 10em;
}

.keybindings-modal {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-areas: "title close"
                         "message message"
                         "keybindings .";
    grid-template-columns: 1fr 2em;
    grid-template-rows: 3em 2em 1fr;
}

.keybindings-modal .title {
    grid-area: title;
}

.keybindings-modal .close {
    grid-area: close;
}

.keybindings-modal .message {
    grid-area: message;
    margin-left: 1em;
}

.keybindings-modal .keybindings {
    grid-area: keybindings;
    margin: 1em;
}

.keybindings-modal .keybindings .keybinding {
    margin-bottom: 1em;
    border-width: 2px;
    border-color: white;
    border-style: solid;
}

.keybindings-modal .keybindings .action {
    display: inline-block;
    width: 20em;
    margin-right: 1em;
}

.keybindings-modal .keybindings .key {
    display: inline-block;
    width: 10em;
}

Add borders to keybindings modal

feat: Add borders to keybindings modal


#titlearea
{
    background-color: #0000ff;
    color: #80ff00;
}

table.tutorial {
    color: black;
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 5px;
    font-size: 95%;
}
div.tutorial {
    color: black;
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 50px;
    font-size: 95%;
}
div.doxygen-generated-exception-message {
    color: black;
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 5px;
    font-size: 95%;
}

/*
 * Fix the default table settings to be readable: this overrides the first row
 * and column background to grey (instead of dark blue, upon which links are
 * impossible to read) and the text color to black (instead of white, which
 * would no longer be visable).
 */
table.doxtable th {
	background-color: #d6d6d6;
	color: #000000;
}

div.image img[src="fe_enriched_1d.png"] {
    width:500px;
}

div.image img[src="fe_enriched_h-refinement.png"] {
    width:500px;
}

#titlearea
{
    background-color: #0000ff;
    color: #80ff00;
}

table.tutorial {
    color: black;
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 5px;
    font-size: 95%;
}
div.tutorial {
    color: black;
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 50px;
    font-size: 95%;
}
div.doxygen-generated-exception-message {
    color: black;
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    padding: 5px;
    font-size: 95%;
}

/*
 * Fix the default table settings to be readable: this overrides the first row
 * and column background to light blue (instead of dark blue, upon which links
 * are impossible to read) and the text color to black (instead of white, which
 * would no longer be visible).
 */
table.doxtable th {
    background-color: #D6E2FA;
    color: #000000;
}

div.image img[src="fe_enriched_1d.png"] {
    width:500px;
}

div.image img[src="fe_enriched_h-refinement.png"] {
    width:500px;
}

Make the doxygen table color consistent with other documentation.

doxygen uses this particular shade of blue for the background of function
signatures.


table.table-centered td, table.table-centered th {
    text-align: center;
}

/* Override icons as datatables bakes in glyphicons */
table.dataTable thead th {
    position: relative;
    background-image: none !important;
}

table.dataTable thead th.sorting:after,
table.dataTable thead th.sorting_asc:after,
table.dataTable thead th.sorting_desc:after {
    position: absolute;
    top: 12px;
    right: 8px;
    display: block;
    font-family: FontAwesome;
}

table.dataTable thead th.sorting:after {
    content: "\f0dc";
    color: #ddd;
    font-size: 0.8em;
    padding-top: 0.12em;
}
table.dataTable thead th.sorting_asc:after {
    content: "\f0de";
}
table.dataTable thead th.sorting_desc:after {
    content: "\f0dd";
}

Use Fontawesome for icon columns.

Use Fontawesome for icon columns.


.team-photos img {
    width:120px;
    height:120px;
}

.team-photos .caption {
    color:#333333;
    font-size:10pt;
}

Decrease team photo names font size.

Decrease team photo names font size.


.wrapper {
	width: 100%;
}
.flex-container-column {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: column;
}
.flex-container-row {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
    width: 100%;
}

.flex-column {
	flex: 1 0 100px;
	width: 100%;
}

.flex-row1 {
	flex: 1 0 15%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.flex-row2 {
	flex: 1 0 85%;
}
.row-content {
	display: flex;
	width: 100%;
	height: 70%;
	align-items: center;
}

.bottom-buttons {
	height: 30%;
	width: 100%;
	text-align: center;
}

.column-text {

}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

	.flex-container-column {
		display: block;
	}

}

Fix Layout for IE 11

Fix Layout for IE 11


/* This isn't strictly BassCSS here, but it's the only easy way to render the
 * different elements within an annotation body */

.annotation-body pre {
  padding: 10px;
  margin: 1em 0;
}

.annotation-body details summary {
  cursor: pointer;
}

.annotation-body details[open] summary {
  margin-bottom: 1em;
}

.annotation-body details[open] {
  margin-bottom: 1em;
}

/* This isn't strictly BassCSS here, but it's the only easy way to render the
 * different elements within an annotation body */

.annotation-body pre {
  padding: 10px;
  margin: 1em 0;
}

.annotation-body details > summary {
  cursor: pointer;
}

.annotation-body details[open] > summary {
  margin-bottom: 1em;
}

.annotation-body details[open] {
  margin-bottom: 1em;
}

Fix additional margin of closed nested detail summary elements


#project1, #project2 {
  display: none;
}

.wrap {
    margin: auto;
    width: 50%;
    border: 3px solid #73AD21;
    padding: 70px;
}

img {
    display: block;
    margin: auto;
    width: 100%;
    align-self: center;
}

.img-wrap {
    margin: auto;
    align-self: center;
    display: block;
}

#project1, #project2, #project3 {
  display: none;
}

.wrap {
    margin: auto;
    width: 50%;
    border: 3px solid #73AD21;
    padding: 70px;
}

img {
    display: block;
    margin: auto;
    width: 100%;
    align-self: center;
}

.img-wrap {
    margin: auto;
    align-self: center;
    display: block;
}

Add project 3 in css

Add project 3 in css


.portfolio-item:not(:last-child) {
    margin-bottom: 5em;
}

.portfolio-item:hover .portfolio-item-details {
    visibility: visible;
    opacity: 1;
}

.portfolio-item-links {
    text-align: center;
    font-weight: bold;
}

.portfolio-item-links a:first-child {
    border-right: 1px solid #f8f8f8;
    margin-right: 2em;
    padding-right: 2em;
}

.portfolio-item-details {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(29, 106, 154, 0.72);
    color: #fff;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility opacity 0.2s;
    background-color: rgb(85, 26, 139);
    overflow-x: scroll;
}

.portfolio-item:not(:last-child) {
    margin-bottom: 5em;
}

.portfolio-item:hover .portfolio-item-details {
    visibility: visible;
    opacity: 1;
}

.portfolio-item-links {
    text-align: center;
    font-weight: bold;
}

.portfolio-item-links a:first-child {
    border-right: 1px solid #f8f8f8;
    margin-right: 2em;
    padding-right: 2em;
}

.portfolio-item-details {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(29, 106, 154, 0.72);
    color: #fff;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility opacity 0.2s;
    background-color: rgb(85, 26, 139);
    overflow-x: hidden;
    overflow-y: scroll;
}

Fix scrollbars (hide x, scroll y)

Fix scrollbars (hide x, scroll y)


.root {
  margin-bottom: 50px;
  font-size: 16px;
}

.header {

}

.heading {

}

.anchor {

}

.root {
  margin-bottom: 50px;
  font-size: 16px;
}

.header {
	composes: font from "../../styles/common.css";
	margin-bottom: 20px;
	font-weight: bold;
}

.heading {
	position: relative;
	margin: 0 0 6px 0;
	font-size: 38px;
	font-weight: bold;
}

.anchor {

}

Add basic styling for section headings

Add basic styling for section headings


MRelocatorStyle {
    scroll-easing-curve: inoutquint;
    scroll-duration: 350;
}

MRelocatorStyle.Portrait {
    vertical-anchor-position: 20mm;
    top-no-go-margin: 4.8mm;
    bottom-no-go-margin: 4.8mm;
}

MRelocatorStyle.Landscape {
    vertical-anchor-position: 4mm;
    top-no-go-margin: 4mm;
    bottom-no-go-margin: 4mm;
}

MRelocatorStyle.Landscape:physical-keyboard {
    vertical-anchor-position: 15mm;
}

New: Put relocation animation parameters to CSS file.

RevBy: Pekka Vuorela
Details: Also updated the parameters themselves.
Previously these were hard coded.


@import 'app/styles/variables.css';

.compactEvents {
  display: flex;
  justify-content: space-between;
  white-space: nowrap;
  width: 100%;
  text-align: left;
}

.compactEvents h3 {
  margin-bottom: 10px;
  padding: 0;
}

.compactEvents a {
  color: black;

  &:hover {
    color: #c0392b;
  }
}

.compactLeft,
.compactRight {
  flex: 1;
  padding: 0 20px 5px;

  @media (--mobile-device) {
    padding: 0 10px 10px;
  }
}

.compactEvents li {
  display: flex;
  justify-content: space-between;
}

.showMoreLink {
  margin: 0 auto;
  font-size: 16px;
}

@import 'app/styles/variables.css';

.compactEvents {
  display: flex;
  justify-content: space-between;
  white-space: nowrap;
  width: 100%;
  text-align: left;
}

.compactEvents h3 {
  margin-bottom: 10px;
  padding: 0;
}

.compactEvents a {
  color: rgba(0, 0, 0, 0.9);

  &:hover {
    color: #c0392b;
  }
}

.compactLeft,
.compactRight {
  flex: 1;
  padding: 0 20px 5px;

  @media (--mobile-device) {
    padding: 0 10px 10px;
  }
}

.compactEvents li {
  display: flex;
  justify-content: space-between;
}

.showMoreLink {
  margin: 0 auto;
  font-size: 16px;
}

Use a softer color for compact events

Use a softer color for compact events


#game-board {
    width: 500px;
    margin: 20px auto 0 auto;
    background-color: #E288A0;
    background-color: rgba(255,255,255,0.5);

    border: 7px solid #B71F45;
    padding: 20px;
    border-radius: 10px;
    overflow: hidden;
}
.circle {
    border-radius: 50%;
    width: 75px;
    height: 75px;
    border: 1px solid #000;
    float: left;
}
.clear-float {
    clear: both
}

#game-board {
    width: 400px;
    margin: 20px auto 0 auto;
    background-color: #E288A0;
    background-color: rgba(255,255,255,0.5);

    border: 7px solid #B71F45;
    padding: 20px;
    border-radius: 10px;
    overflow: hidden;
}
.circle {
    border-radius: 50%;
    width: 75px;
    height: 75px;
    border: 1px solid #000;
    float: left;
}
.clear-float {
    clear: both
}

Adjust size of border around spheres

Adjust size of border around spheres


html {
  font-family: arial;

}

body {
    background-color: lightyellow;
}

h1 {
  color: red;
  text-align: center;
  margin-right: -150px;
}

h2 {
    color: blue;
}

h3 {
    text-align: center;
    margin-right: -150px;
    color: orange;
    margin-top: -15px;
}

h4 {
    color: purple;
}

#menu {
  float: left;
  position: fixed;
  margin-top: -100px;
  background-color: #d3d3d3;
  border: 2px dashed black
}

main {
    margin-left: 350px;
    background-color: lightblue;
}

span {
    padding-left: 5px
}

html {
  font-family: arial;

}

body {
    background-color: lightyellow;
}

h1 {
  color: red;
  text-align: center;
  margin-right: -150px;
}

h2 {
    color: blue;
}

h3 {
    text-align: center;
    margin-right: -150px;
    color: orange;
    margin-top: -15px;
}

h4 {
    color: purple;
}

#menu {
  float: left;
  position: fixed;
  font-size: 11pt;
  margin-top: -130px;
  background-color: #d3d3d3;
  border: 2px dashed black
}

main {
    margin-left: 350px;
    background-color: lightblue;
}

span {
    padding-left: 5px
}

Change font size of menu

Change font size of menu


/*
Theme Name:         Roots
Theme URI:          http://roots.io/
Description:        Roots is a WordPress starter theme based on HTML5 Boilerplate & Bootstrap. Contribute on GitHub
Version:            7.0.0.
Author:             Ben Word
Author URI:         http://benword.com/

License:            MIT License
License URI:        http://opensource.org/licenses/MIT
*/

/*
Theme Name:         Pith
Theme URI:          http://fikstores.com/pith-theme/
Description:        Pith is a base to create themes, based on roots.io sass (HTML5 Boilerplate & Bootstrap).
Version:            7.0.0.1
Author:             Fik Stores
Author URI:         http://fikstores.com/

License:            MIT License
License URI:        http://opensource.org/licenses/MIT
*/

Change theme name and description

Change theme name and description


/* Copyright 2014 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */
.pie-chart .arc-text {
  font-size: 8pt;
}

.pie-chart .label {
  font-size: 10pt;
}

.pie-chart polyline {
  fill: none;
  opacity: .3;
  stroke: black;
  stroke-width: 2px;
}

/* Copyright 2014 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */
.pie-chart .arc-text {
  font-size: 8pt;
}

.pie-chart .label {
  font-size: 10pt;
}

.pie-chart polyline {
  fill: none;
  stroke: black;
}

Make lines a bit more visible in pie chart

git-svn-id: 3a56fcae908c7e16d23cb53443ea4795ac387cf2@1251 0e6d7f2b-9903-5b78-7403-59d27f066143


.alternative {
  display: flex;
  margin: 0.5rem 0;
  background: #666a99;
  color: #fff;
  transition: all 0.3s;
  border-radius: 2px;
  box-shadow: 0 -2px 0 0 rgba(0, 0, 0, 0.25) inset,
              0 2px 1px 0 rgba(0, 0, 0, 0.2);
  composes: border from "css/border.css";
}

.alternative:last-of-type {
  margin-bottom: 0;
}

.alternative:hover {
  background: #8588ad;
}

.selected {
  background: #474a6b;
}

.selected:hover {
  background: #52557a;
}

.disabled {
  box-shadow: none;
  background: #f5f5f5;
  color: #555;
}

.disabled:hover {
  background: #f5f5f5;
}

.alternative label {
  flex-grow: 1;
  padding: 1rem;
}

.alternative input {
  display: none;
}

.alternative {
  display: flex;
  margin: 0.5rem 0;
  background: #666a99;
  color: #fff;
  transition: all 0.3s;
  border-radius: 2px;
  box-shadow: 0 -2px 0 0 rgba(0, 0, 0, 0.25) inset,
              0 2px 1px 0 rgba(0, 0, 0, 0.2);
  composes: border from "css/border.css";
}

.alternative:last-of-type {
  margin-bottom: 0;
}

.alternative:hover {
  background: #8588ad;
}

.selected {
  background: #474a6b;
}

.selected label:after {
  content: "✓";
  float: right;
}

.selected:hover {
  background: #52557a;
}

.disabled {
  box-shadow: none;
  background: #f5f5f5;
  color: #555;
}

.disabled:hover {
  background: #f5f5f5;
}

.alternative label {
  flex-grow: 1;
  padding: 1rem;
}

.alternative input {
  display: none;
}

Add checkmark after selected button

Add checkmark after selected button

Add checkbox after selected button, to indicate that it is selected, therefore montitors with bad contrast can still see what is active/selected.


@import url("theme.css");

.doc_page {
    border: 1px solid #aaa;
}

@import url("theme.css");

.doc_page {
    border: 2px solid #aaa;
    -webkit-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.5);
    box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.5);
    margin-right: 1em;
}

.doc_page:hover {
    border: 2px solid #3399ff;
    border-radius: 3px;
    -webkit-box-shadow: 2px 2px 4px 4px rgba(51,153,255,0.5);
    -moz-box-shadow: 2px 2px 4px 4px rgba(51,153,255,0.5);
    box-shadow: 2px 2px 4px 4px rgba(51,153,255,0.5);
}

Add shadow and hover effect to doc thumbnails


:host {
  display: block;
  padding: 0 16px;
}

h2 {
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.005em;
  margin-bottom: 0;
  margin-top: 0.83em;
}

:host {
  display: block;
  padding: 0 16px;
}

h2 {
  font-size: 20px;
  font-weight: 500;
  letter-spacing: .005em;
  margin-bottom: 0;
  margin-top: .83em;
}

Remove the leading zero. According to SonarQube


#firepad {
  width: 640px;
  height: 450px;
  background-color: #f62; /* dark orange background */
}

/* Note: CodeMirror applies its own styles which can be customized in the same way.
   To apply a background to the entire editor, we need to also apply it to CodeMirror. */
.CodeMirror {
  background-color: #f62;
}

Fix nom de la regle firepad, par id et non pas par classe contrairement a l'exemple officiel


.container {
  font-size: 5vw;
  text-rendering: optimizeLegibility;
}

.char {
  animation: color-cycle;
  animation-duration: 10s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}

@keyframes color-cycle {
  0% {color: red;}
  16% {color: orange;}
  32% {color: yellow;}
  49% {color: green;}
  66% {color: blue;}
  83% {color: indigo;}
  100% {color: violet;}
}

.container {
  font-size: 5vw;
  text-rendering: optimizeLegibility;
  text-shadow: 0px 5px 5px #000;
}

.char {
  animation: color-cycle;
  animation-duration: 10s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}

@keyframes color-cycle {
  0% {color: red;}
  16% {color: orange;}
  32% {color: yellow;}
  49% {color: green;}
  66% {color: blue;}
  83% {color: indigo;}
  100% {color: violet;}
}

Add text-shadow to text overlay

Add text-shadow to text overlay


div.tree-multiselect {
  border: 2px solid #D8D8D8;
  border-radius: 5px;
}

div.tree-multiselect > div.selected, div.tree-multiselect > div.selections {
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  padding: 1%;
}

div.tree-multiselect > div.selected {
  width: 30%;
}

div.tree-multiselect > div.selected > div.item {
  padding: 2px 5px;
  border-radius: 2px;
  background: #EAEAEA;
}

div.tree-multiselect > div.selections {
  width: 70%;
  border-left: solid 2px #D8D8D8;
}

div.tree-multiselect div.section > div.item, div.tree-multiselect div.section > div.section {
  padding-left: 20px;
}

div.tree-multiselect div.title, div.tree-multiselect div.item {
  margin-bottom: 2px;
}

div.tree-multiselect div.title {
  background: #767676;
  color: white;
  padding: 2px;
}

div.tree-multiselect input[type=checkbox] {
  margin-right: 5px;
}

Add extra margin to input boxes

Add extra margin to input boxes


body
{
  max-width: 40em;
  padding:   1em;
}

p
{
  text-align:  justify;
}

code
{
  font-family: monospace;
}

pre
{
  margin-left: 1em;
  font-family: monospace;
}

th
{
  text-align: left;
  padding-bottom: 0.5em;
}

td
{
  padding-right: 2em;
}

.zb_post
{
  margin-bottom: 3em;
}

.zb_post_date
{
  font-weight: bold;
  margin-right: 1em;
}

.zb_post_title
{

}

.zb_post_foot
{

}

#zb_footer
{
  margin-top: 2em;
}

#zb_footer_links
{
  margin-bottom: 1em;
}

.zb_glossary_item
{

}

.zb_glossary_related
{
  margin-top: 2em;
}

.zb_glossary_letter
{

}

Add CSS for the glossary

Add CSS for the glossary


.nunaliit_application .nunaliit_login_link {
	padding: .5em .5em .5em .7em;
	text-decoration: none;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-right: 3px;
	border: 1px solid lightGrey;
	background: #E6E6E6 url('images/ui-bg_glass_75_e6e6e6_1x400.png') 50% 50% repeat-x;
	font-weight: normal;
	color: #555;
}

.nunaliit_application a.nunaliit_login_link:hover {
	background-color: #619b00;
}

.nunaliit_application .nunaliit_login_greeting {
	float: right;
	padding-top: 10px;
	padding-right: 10px;
}*/

Remove end of dangling comment

Remove end of dangling comment

Issue #62


/* all devices */

.ui-header,.ui-footer
{
    max-width:64em !important; /* 1024px / 16px ( default font size) */
    margin:0 auto;
}

div.ui-input-text {
    padding-right: 0.5em;
}

label.ui-input-text {
    display:inline-block;
}

label.ui-input-text.s-inline {
    display:inline;
}

label.ui-input-text.s-block {
    display:block;
    width:auto;
    margin-bottom:0.25em;
}

.ui-header+.ui-content
{
    padding: 0.5em !important;
    max-width: 50em !important;
    min-height: 18em; /* 300px */
    margin:0 auto;
}

.ui-content
{
    padding:0.5em !important;
    max-width: 50em !important; /* 800px */
    margin:0 auto;
}

.s-input-container {
    display:inline-block;
}

.s-range-container {
    min-width: 12em; /* 192px */
}

.s-number-container {
    min-width:4em; /* 64px */
}

.s-range-container.s-align.s-maximize .ui-slider,
.s-range-container.s-width .ui-slider
{
    width:100%;
}

/* desktop */
@media all and (min-width:28em) {

    /* input */
    div.ui-input-text {
        max-width: 28em;
    }

    /* slider */
    .s-range-container:not(.s-width) .ui-slider {
        max-width: 29em;
    }

    .s-input-container {
        width:100%;
        display:inline;
    }

    .s-input-container.s-align {
        width:auto;
        display:inline-block;
    }

    .s-input-container.s-maximize .ui-input-text,
    .s-input-container.s-width .ui-input-text {
        max-width: none;
    }

    .s-input-container.s-align.s-maximize .ui-input-text:not(.s-slider) {
        width:100%;
    }

    .s-input-container.s-width {
        display:inline-block;
    }

    .s-input-container.s-width .ui-input-text:not(.s-slider) {
        width: 100%;
    }
}

@media all and (max-width:28em) {
    label {
        width:auto;
    }

    .s-input-container {
        display:inline;
    }

    .s-number-container:not(.s-maximize):not(.s-align):not(.s-inline) {
        display:block;
    }

    .s-number-container.s-inline {
        display:inline-block;
        margin-left:0.5em;
    }
}

Migrate input, text, number, range, select, store


Make two-column layout for 'about' page

Make two-column layout for 'about' page


.bordered {
    border-style:solid;
    border-width:1px;
}

h3 {
    margin-bottom: 20px;
}

h1 a {
    color: inherit;
}

h1 a:hover {
    color: inherit;
    text-decoration: none;
}

table#t {
    cursor: pointer;
}

table#t td {
    padding: 5px 5px 0 5px;
}

.bordered {
    border-style:solid;
    border-width:1px;
}

h3 {
    margin-bottom: 20px;
}

h1 a {
    color: inherit;
}

h1 a:hover {
    color: inherit;
    text-decoration: none;
}

h1 a:active {
    color: inherit;
    text-decoration: none;
}

table#t {
    cursor: pointer;
}

table#t td {
    padding: 5px 5px 0 5px;
}

Fix faulty blue underline in title

Fix faulty blue underline in title


.toolbar {
  background-color: rgb(25,25,25);
  clear: both;
  width: 100%;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.8em;
  height: 3.2rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.tool_item {
  line-height: 3rem;
  box-sizing: border-box;
  padding: 0 1rem;
  height: 3rem;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  float: left;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.channel_name {
  font-size: 1.5em;
  max-width: 20%;
}

.channel_topic {
  color: rgba(255, 255, 255, 0.5);
  float: none;
}

.channel_topic a {
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
}

.channel_topic a:hover {
  text-decoration: underline;
}

.toolbar {
  background-color: rgb(25,25,25);
  clear: both;
  width: 100%;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.8em;
  height: 3.2rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.tool_item {
  display: flex;
  align-items: center;
  flex-direction: row;
  box-sizing: border-box;
  padding: 0 1rem;
  height: 3rem;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  float: left;
  text-overflow: ellipsis;
}

.channel_name {
  font-size: 1.5em;
  max-width: 20%;
}

.channel_topic {
  color: rgba(255, 255, 255, 0.5);
  float: none;
}

.channel_topic a {
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
}

.channel_topic a:hover {
  text-decoration: underline;
}

Fix topic display in title bar.

Fix topic display in title bar.


.emoji {
  background-position: center;
  /* make sure the background the image is only shown once */
  background-repeat: no-repeat;
  background-size: contain;
  /* move it a bit further down to align it nicer with the text */
  vertical-align: middle;

  /*
  We need to limit the emoji width because it can be multiple characters
  long if it is a 32bit unicode. Since the proper width depends on the font and
  it's relationship between 0 and other characters it's not ideal. 1.95ch is not
  the best value, but hopefully a good enough approximation for most fonts.
  */
  display: inline-block;
  overflow: hidden;
  max-width: 1.95ch;
  /*
  Needed for iOS rendering to avoid some icons using a lot of height without
  actually needing it.
  */
  max-height: 1em;
  line-height: inherit;
  margin: -.2ex 0em .2ex;
  /*
  In the past we used opacity: 0 to hide the original Emoji icon no matter what
  system it is. Recently we switched to color: transparent since it started to
  work in recent iOS version.
  */
  color: transparent;

  /*
  Some SVG files (say 2764 for :heart:) don't have default width/height, thus
  may not be rendered properly on some platforms/browsers (e.g., Windows 10 +
  Chrome 61).
  */
  width: 1em;
}

.emoji {
  background-position: center;
  /* make sure the background the image is only shown once */
  background-repeat: no-repeat;
  background-size: contain;
  /* move it a bit further down to align it nicer with the text */
  vertical-align: middle;

  /*
  We need to limit the emoji width because it can be multiple characters
  long if it is a 32bit unicode. Since the proper width depends on the font and
  it's relationship between 0 and other characters it's not ideal. 1.95ch is not
  the best value, but hopefully a good enough approximation for most fonts.
  */
  display: inline-block;
  overflow: hidden;
  max-width: 1.95ch;
  /*
  Needed for iOS rendering to avoid some icons using a lot of height without
  actually needing it.
  */
  max-height: 1em;
  line-height: inherit;
  margin: -.2ex 0em .2ex;
  /*
  In the past we used opacity: 0 to hide the original Emoji icon no matter what
  system it is. Recently we switched to color: transparent since it started to
  work in recent iOS version.
  */
  color: transparent;

  /*
  Some SVG files (say 2764 for :heart:) don't have default width/height, thus
  may not be rendered properly on some platforms/browsers (e.g., Windows 10 +
  Chrome 61).
  */
  min-width: 1em;
}

Use min-width instead of width

Use min-width instead of width

So that the rendering of other emojis won't be impacted.


.base {
	position: relative;
	width: 100%;
	min-height: 20px;
	text-align: center;
	cursor: zoom-in;
}

.base svg {
	position: absolute;
	width: 25px;
	height: 25px;
	padding: 2px;
	fill: white;
	background-color: rgba(180, 180, 180, 0.5);
	border-radius: 4px;
	margin-top: 5px;
	margin-left: 5px;
	z-index: 100;
}

.base img {
	max-width: 100%;
	min-height: 100px;
	background: #eeffee;
	overflow: hidden;
}

.loaded {
	animation: fade-in 300ms both;
}

@keyframes fade-in {
	0% {
		filter: blur(50px);
		opacity: 0;
	}
	100% {
		filter: none;
		opacity: 1;
	}
}

.base {
	position: relative;
	width: 100%;
	min-height: 20px;
	text-align: center;
	cursor: zoom-in;
	overflow: hidden;
}

.base svg {
	position: absolute;
	width: 25px;
	height: 25px;
	padding: 2px;
	fill: white;
	background-color: rgba(180, 180, 180, 0.5);
	border-radius: 4px;
	margin-top: 5px;
	margin-left: 5px;
	z-index: 100;
}

.base img {
	max-width: 100%;
	min-height: 100px;
	background: #eeffee;
	overflow: hidden;
}

.loaded {
	animation: fade-in 300ms both;
}

@keyframes fade-in {
	0% {
		filter: blur(50px);
		margin: -50px;
		opacity: 0;
	}
	100% {
		filter: none;
		margin: 0;
		opacity: 1;
	}
}

Fix blur blur blur blur...

Fix blur blur blur blur...


@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url("../font/material-icons/MaterialIcons-Regular.eot"); /* For IE6-8 */
    src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url("../font/material-icons/MaterialIcons-Regular.woff2") format('woff2'),
    url("../font/material-icons/MaterialIcons-Regular.woff") format('woff'), /* Modern Browsers */
    url("../font/material-icons/MaterialIcons-Regular.ttf") format('truetype'); /* Safari, Android, iOS */
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;

    /* Support for IE. */
    font-feature-settings: 'liga';

    /* Support for Firefox. */
    -moz-font-feature-settings: 'liga';

    /* Support for all WebKit browsers. */
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;

    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;

    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: local('Material Icons'), local('MaterialIcons-Regular'), url("../font/material-icons/MaterialIcons-Regular.woff2") format('woff2');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;

    /* Support for IE. */
    font-feature-settings: 'liga';

    /* Support for Firefox. */
    -moz-font-feature-settings: 'liga';

    /* Support for all WebKit browsers. */
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;

    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;

    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
}

Test fix for IOS again.

Test fix for IOS again.


/* TODO: Why are there a classes here? */
#mws-border {
  height: 640px;
  text-align: left;
  border: 2px solid;
  border-radius: 25px;
  background-color: #000000;
  margin-top: 10px;
  margin-bottom: 10px;
}

#mws-response {
  height: 560px;
  margin-top: 20px;
  overflow-y: auto;
  color: #00e500;
  font-size: 20px;
  font-family: Terminal, monospace;
}

.mws-in-shell-response {
  list-style-type: none;
  margin-top: 0;
  margin-bottom: 0;
}

.mws-in-shell-response li {
  margin-top: 3px;
}

#mws-input {
  height: 60px;
  margin-top: 0px;
  text-align: center;
}

.mws-input {
  width: 98%;
  height: 60px;
  border: none;
  background-color: #000000;
  color: #00e500;
  font-size: 20px;
  font-family: Terminal, monospace;
}

.mws-input:focus {
  outline: none;
}

/* TODO: Why are there ids here? */
#mws-border {
  height: 640px;
  text-align: left;
  border: 2px solid;
  border-radius: 25px;
  background-color: #000000;
  margin-top: 10px;
  margin-bottom: 10px;
}

#mws-response {
  height: 560px;
  margin-top: 20px;
  overflow-y: auto;
  color: #00e500;
  font-size: 20px;
  font-family: Terminal, monospace;
}

.mws-in-shell-response {
  list-style-type: none;
  margin-top: 0;
  margin-bottom: 0;
}

.mws-in-shell-response li {
  margin-top: 3px;
}

#mws-input {
  height: 60px;
  margin-top: 0px;
  text-align: center;
}

.mws-input {
  width: 98%;
  height: 60px;
  border: none;
  background-color: #000000;
  color: #00e500;
  font-size: 20px;
  font-family: Terminal, monospace;
}

.mws-input:focus {
  outline: none;
}

Correct incorrect TODO comment in CSS.

Correct incorrect TODO comment in CSS.