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

.sidebar-nav {
    padding: 9px 0;
}

.sidebar_link {
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.sidebar_link .badge {
    padding: 0px 7px;
}

.brand img {
    margin: -10px 12px;
}
.badge {
    float: right;
}

.node_name, .node_ip,
.node_env {
    width: 17em;
}

p.notfound {
    padding: 3px 15px;
    font-size: 18px;
    font-weight: bold;
    line-height: 18px;
    color: #999;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
}

p.notfound img {
    margin-right: 1em;
}

table#nodes th { cursor: pointer; }

div.dataTables_info {
    float: left;
}

div.dataTables_filter {
    margin-left: 600px;
}

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

.sidebar-nav {
    padding: 9px 0;
}

.sidebar_link {
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.sidebar_link .badge {
    padding: 0px 7px;
}

.brand img {
    margin: -10px 12px;
}
.badge {
    float: right;
}

.node_name, .node_ip,
.node_env {
    width: 17em;
}

p.notfound {
    padding: 3px 15px;
    font-size: 18px;
    font-weight: bold;
    line-height: 18px;
    color: #999;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
}

p.notfound img {
    margin-right: 1em;
}

table#nodes th { cursor: pointer; }

div.dataTables_info {
    float: right;
}

div.dataTables_filter {
    float: left;
}

Set info text to the right and filter box to the left


@import url(https://fonts.googleapis.com/css?family=Open+Sans);

body {
  background-color: #34495e;
  font-family: 'Open Sans', sans-serif;
}

html, body, .row {
    height: 100%;
}
.row {
    display:flex;
    justify-content: center;
    align-items: center;
}

Make the row vertical centre

Make the row vertical centre


.sc-manuscript {
  max-width: 760px;
  padding: 30px;
}

.sc-manuscript-view.sm-compact .sc-manuscript {
  margin: 0 auto;
}

.sc-manuscript .sc-text-model-editor.sm-title {
  line-height: 1.3em;
  font-size: var(--title-font-size);
  font-family: 'Avenir Next', 'Lato', Helvetica;
  font-weight: 600;
}

.sc-manuscript {
  max-width: 760px;
  padding: 30px;
}

.sc-manuscript-view.sm-compact .sc-manuscript {
  margin: 0 auto;
}

.sc-manuscript .sc-text.sm-title {
  line-height: 1.3em;
  font-size: var(--title-font-size);
  font-family: 'Avenir Next', 'Lato', Helvetica;
  font-weight: 600;
}

Fix style of manuscript title.

Fix style of manuscript title.


body, html {
  height: 100%;
  overflow-x: hidden;
  margin: 0%;
}

.bg {
  background-image: url(../../annie-spratt-330560.jpg);
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.intro {
  color: white;
  top: 70px;
}

.about-photo {
  height: 40%;
}

.contact-photo {
  height: 80%;
  background-image: url(../../hanny-naibaho-308083.jpg);
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
}

.contact-information {
  padding: 10px;
}

.contact-form {
  margin: 30px;
}

.contact-text {
  margin: 30px;
}

.about-text {
  padding: 10px;
  margin: 10px;
}

.about-photo-container {
  padding: 10px;
  margin: 10px;
}

.about-photo {
  height: 50%;
  background-image: url(../../keith-misner-308.jpg);
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
}

body, html {
  height: 100%;
  overflow-x: hidden;
  margin: 0%;
}

.bg {
  background-image: url(../../annie-spratt-330560.jpg);
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.intro {
  color: white;
  top: 70px;
  text-shadow: 2px 2px 2px grey;
}

.about-photo {
  height: 40%;
}

.contact-photo {
  height: 80%;
  background-image: url(../../hanny-naibaho-308083.jpg);
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
}

.contact-information {
  padding: 10px;
}

.contact-form {
  margin: 30px;
}

.contact-text {
  margin: 30px;
}

.about-text {
  padding: 10px;
  margin: 10px;
}

.about-photo-container {
  padding: 10px;
  margin: 10px;
}

.about-photo {
  height: 50%;
  background-image: url(../../keith-misner-308.jpg);
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
}

Add shadow to intro text

Add shadow to intro text


.btn-lg{
	margin-left: 20px;
}

#accounts{
	margin-top: 25px;
}

.account{
	height: 100px;
	margin-right: 35px;
}

.account .name{
	margin-top: 10px;
	font-size: 20px;
}

.account .credit{
	font-size: 30px;
}

.detail{
	margin-top: 25px;
}

.detail .name{
	margin-top: 25px;
	font-size: 40px;
}

.detail .credit{
	margin-top: -15px;
	font-size: 60px;
}

.userinfo{
	height: 239px;
}

.pager li>a{
	font-size: 30px;
}

.newuser{
	margin-top: -5px;
	font-size: 70px;
	text-align: center;
}

#newUserForm{
	margin-top: 20px;
}

#newUserForm input{
	margin-top: 20px;
	font-size: 30px;
	height: 60px;
}

.debt{
	background-color: #785D6C;
}

.btn-lg{
	width: 110px;
	margin-left: 20px;
}

#accounts{
	margin-top: 25px;
}

.account{
	height: 100px;
	margin-right: 35px;
}

.account .name{
	margin-top: 10px;
	font-size: 20px;
}

.account .credit{
	font-size: 30px;
}

.detail{
	margin-top: 25px;
}

.detail .name{
	margin-top: 25px;
	font-size: 40px;
}

.detail .credit{
	margin-top: -15px;
	font-size: 60px;
}

.userinfo{
	height: 239px;
}

.pager li>a{
	font-size: 30px;
}

.newuser{
	margin-top: -5px;
	font-size: 70px;
	text-align: center;
}

#newUserForm{
	margin-top: 20px;
}

#newUserForm input{
	margin-top: 20px;
	font-size: 30px;
	height: 60px;
}

.debt{
	background-color: #785D6C;
}

Fix button width to 110px

Fix button width to 110px


/*
 * Copyright (c) 2022. The Pycroft Authors. See the AUTHORS file.
 * This file is part of the Pycroft project and licensed under the terms of
 * the Apache License, Version 2.0. See the LICENSE file for details
 */

/* sidebar adjustments */
.sidebar-toc p.caption {
  padding: 0px 5px;
}

.sidebar-toc ul li a {
    padding-right: 5px !important;
}
.sidebar-toc ul li.toctree-l4 a {
    padding-left: 85px;
    font-size: smaller;
}

/* misc */

/* De-emphasizes the module name in `<module>.<function>`.
 * not necessary anymore due to `add_module_names = False`.
 */
dt.sig>.sig-prename {
    font-size: small;
    color: grey;
}

/* content hacks */

#guides p.caption,
#reference-documentation p.caption,
#indices-and-tables p.caption,
#architecture-decision-records p.caption {
    display: None
}

/*
 * Copyright (c) 2022. The Pycroft Authors. See the AUTHORS file.
 * This file is part of the Pycroft project and licensed under the terms of
 * the Apache License, Version 2.0. See the LICENSE file for details
 */

/* sidebar adjustments */
.sidebar-toc p.caption {
  padding: 0px 5px;
}

.sidebar-toc ul li a {
    padding-right: 5px !important;
}
.sidebar-toc ul li.toctree-l4 a {
    padding-left: 85px;
    font-size: smaller;
}

/* misc */

/* De-emphasizes the module name in `<module>.<function>`.
 * not necessary anymore due to `add_module_names = False`.
 */
dt.sig>.sig-prename {
    font-size: small;
    color: grey;
}

/* content hacks */

#guides p.caption,
#explanations p.caption,
#reference-documentation p.caption,
#indices-and-tables p.caption,
#architecture-decision-records p.caption {
    display: None
}

[doc] Hide `explanations` sidebar section name in content


/**
 * Copyright (c) 2017-present, Facebook, Inc.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

/* "Copy" code block button */
pre {
  position: relative;
}

pre .btnIcon {
  position: absolute;
  top: 4px;
  z-index: 2;
  cursor: pointer;
  border: 1px solid transparent;
  padding: 0;
  color: #222;
  background-color: transparent;
  height: 30px;
  transition: all 0.25s ease-out;
}

pre .btnIcon:hover {
  text-decoration: none;
}

.btnIcon__body {
  align-items: center;
  display: flex;
}

.btnIcon svg {
  fill: currentColor;
  margin-right: 0.4em;
}

.btnIcon__label {
  font-size: 11px;
}

.btnClipboard {
  right: 10px;
}

/**
 * Copyright (c) 2017-present, Facebook, Inc.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

/* "Copy" code block button */
pre {
  position: relative;
}

.hljs {
  padding: 2rem 1.5rem;
}

pre .btnIcon {
  position: absolute;
  top: 4px;
  z-index: 2;
  cursor: pointer;
  border: 1px solid transparent;
  padding: 0;
  color: #222;
  background-color: transparent;
  height: 30px;
  transition: all 0.25s ease-out;
}

pre .btnIcon:hover {
  text-decoration: none;
}

.btnIcon__body {
  align-items: center;
  display: flex;
}

.btnIcon svg {
  fill: currentColor;
  margin-right: 0.4em;
}

.btnIcon__label {
  font-size: 11px;
}

.btnClipboard {
  right: 10px;
}

Increase top padding for code buttons

Increase top padding for code buttons

Summary: priteshrnandgaonkar pointed out that they sometimes overlap with the text.

Reviewed By: jknoxville

Differential Revision: D15182356

fbshipit-source-id: def39676d5dcce85aa0b41760cec0ec5cfb9398c


@import "reset-to-defaults.css";

.info {
/* FIXME: for now label does not support background */
/* background-color: @info_bg_color;*/
  color: @info_fg_color;
}

.warning {
/* background-color: @warning_bg_color;*/
  color: @warning_fg_color;
}

.question {
/* background-color: @question_bg_color;*/
  color: @question_fg_color;
}

.error {
/* background-color: @error_bg_color;*/
  color: @error_fg_color;
}

#reference-info {
  padding: 8px;
  color: @info_fg_color;
  background-color: @info_bg_color;
  background-image: none;
}

#reference-warning {
  padding: 8px;
  color: @warning_fg_color;
  background-color: @warning_bg_color;
  background-image: none;
}

#reference-question {
  padding: 8px;
  color: @question_fg_color;
  background-color: @question_bg_color;
  background-image: none;
}

#reference-error {
  padding: 8px;
  color: @error_fg_color;
  background-color: @error_bg_color;
  background-image: none;
}

#reference-other {
  padding: 8px;
}

@import "reset-to-defaults.css";

.info {
  background-color: @info_bg_color;
  color: @info_fg_color;
}

.warning {
  background-color: @warning_bg_color;
  color: @warning_fg_color;
}

.question {
  background-color: @question_bg_color;
  color: @question_fg_color;
}

.error {
  background-color: @error_bg_color;
  color: @error_fg_color;
}

#reference-info {
  padding: 8px;
  color: @info_fg_color;
  background-color: @info_bg_color;
  background-image: none;
}

#reference-warning {
  padding: 8px;
  color: @warning_fg_color;
  background-color: @warning_bg_color;
  background-image: none;
}

#reference-question {
  padding: 8px;
  color: @question_fg_color;
  background-color: @question_bg_color;
  background-image: none;
}

#reference-error {
  padding: 8px;
  color: @error_fg_color;
  background-color: @error_bg_color;
  background-image: none;
}

#reference-other {
  padding: 8px;
}

Fix infobar reftest for label background changes

Fix the reftest after previous commit

https://bugzilla.gnome.org/show_bug.cgi?id=670743


.ui-button-container {
  width: 100%;
  height: 800px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.ui-button:focus {
  outline: none !important;
}

.ui-button-container {
  width: 100%;
  height: 800px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.ui-button {
  font-size: responsive;
}
.ui-button:focus {
  outline: none !important;
  font-size: responsive;
}

Use rucksack into button component

Use rucksack into button component

Use rucksack into button component


:root {
  --putainde-Contributor-height: calc(var(--r-lineHeight) * 2);
}

.putainde-Contributors {
  line-height: var(--putainde-Contributor-height);
}

  .putainde-Contributors-label {
    font-size: var(--r-small-fontSize);
    display: inline-block;
  }

  .putainde-Contributors-actions {
    margin: 0 0 calc(var(--r-lineHeight) / 2);
    padding: calc(var(--r-lineHeight) / 2) 0;
    box-shadow:
      inset 0 1px 0 0 var(--putainde-Color-lightGrey),
      inset 0 -1px 0 0 var(--putainde-Color-lightGrey);
  }

  .putainde-Contributors-action {
    font-size: var(--r-small-fontSize);
  }

  .putainde-Contributor {
    display: inline-block;
    margin: 0 0 1rem 1rem;
    vertical-align: middle;
  }

    .putainde-Contributor-avatar {
      width: 4rem;
      height: 4rem;
    }

    .putainde-Contributor-avatar--small {
      width: 2.5rem;
      height: 2.5rem;
    }

:root {
  --putainde-Contributor-height: calc(var(--r-lineHeight) * 2);
}

.putainde-Contributors {
  line-height: var(--putainde-Contributor-height);
}

  .putainde-Contributors-label {
    font-size: var(--r-small-fontSize);
    display: inline-block;
  }

  .putainde-Contributors-actions {
    margin: 0 0 calc(var(--r-lineHeight) / 2);
    padding: calc(var(--r-lineHeight) / 2) 0;
    box-shadow:
      inset 0 1px 0 0 var(--putainde-Color-lightGrey),
      inset 0 -1px 0 0 var(--putainde-Color-lightGrey);
  }

  .putainde-Contributors-action {
    font-size: var(--r-small-fontSize);
  }

  .putainde-Contributor {
    display: inline-block;
    margin: 0 0 1rem 1rem;
    vertical-align: middle;
    transform: none;
  }

    .putainde-Contributor-avatar {
      width: 4rem;
      height: 4rem;
    }

    .putainde-Contributor-avatar--small {
      width: 2.5rem;
      height: 2.5rem;
    }

Fix weird bug on Firefox (Nightly, 45a) where avatar are not visible due to translate3d 0 trick


.jupyter-widgets.leaflet-container {
    height: 400px;
    overflow: hidden;
    flex: 1;
}

.jp-LinkedOutputView .jupyter-widgets.leaflet-container {
    min-height: 360px;  /* Min-height required for mirred output in jlab < 0.31.6 */
    height: 100%;
}

.leaflet-control-velocity.leaflet-control {
    background: rgba(255, 255, 255, 0.7);
    margin: 0;
    padding: 0 5px;
    color: #333;
    font-size: 11px;
}

/* Leaflet crispness override */
.crisp-image {
    /* Preserve crisp pixels with scaled up images */
    image-rendering: optimizeSpeed;             /* Legal fallback */
    image-rendering: -moz-crisp-edges;          /* Firefox        */
    image-rendering: -o-crisp-edges;            /* Opera          */
    image-rendering: -webkit-optimize-contrast; /* Safari         */
    image-rendering: optimize-contrast;         /* CSS3 Proposed  */
    image-rendering: crisp-edges;               /* CSS4 Proposed  */
    image-rendering: pixelated;                 /* CSS4 Proposed  */
    -ms-interpolation-mode: nearest-neighbor;   /* IE8+           */
}

.jupyter-widgets.leaflet-container {
    min-height: 400px;
    overflow: hidden;
    flex: 1;
}

.jp-LinkedOutputView .jupyter-widgets.leaflet-container {
    min-height: 360px;  /* Min-height required for mirred output in jlab < 0.31.6 */
    height: 100%;
}

.leaflet-control-velocity.leaflet-control {
    background: rgba(255, 255, 255, 0.7);
    margin: 0;
    padding: 0 5px;
    color: #333;
    font-size: 11px;
}

/* Leaflet crispness override */
.crisp-image {
    /* Preserve crisp pixels with scaled up images */
    image-rendering: optimizeSpeed;             /* Legal fallback */
    image-rendering: -moz-crisp-edges;          /* Firefox        */
    image-rendering: -o-crisp-edges;            /* Opera          */
    image-rendering: -webkit-optimize-contrast; /* Safari         */
    image-rendering: optimize-contrast;         /* CSS3 Proposed  */
    image-rendering: crisp-edges;               /* CSS4 Proposed  */
    image-rendering: pixelated;                 /* CSS4 Proposed  */
    -ms-interpolation-mode: nearest-neighbor;   /* IE8+           */
}

Fix Map display in VBox

Fix Map display in VBox


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

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

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

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

Change second third block blog index css


.document-list-transition .documents {
    position: absolute;
    width: 100%;
}

.document-list-transition .enter {
    transform: translateX(100%);
}

.document-list-transition.backward .enter {
    transform: translateX(-100%);
}

.document-list-transition .enter-active {
    transform: translateX(0);
    transition: transform 500ms;
}

.document-list-transition.backward .enter-active {
    transform: translateX(0);
    transition: transform 500ms;
}

.document-list-transition .exit {
    transform: translateX(0);
}

.document-list-transition.backward .exit {
    transform: translateX(0);
}

.document-list-transition .exit-active {
    transform: translateX(-100%);
    transition: transform 500ms;
}

.document-list-transition.backward .exit-active {
    transform: translateX(100%);
    transition: transform 500ms;
}

Add missing css for document hierarchy

Add missing css for document hierarchy


pre,code,tt {
  font:1em 'andale mono', monotype.com, 'lucida console', monospace;
  line-height:1.5;
}
pre,code {
  margin: 1.5em 0;
  white-space: pre;
}

pre,code,tt {
  font: 1em 'andale mono', 'monotype.com', 'lucida console', monospace;
  line-height: 1.5;
}

pre {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}

table.diff_header{
  border: solid 1px #000;
  margin: 2em;
}

.diff_chunk {
  margin: 1em;
}

.diff_chunk .chunk_header {
  margin-bottom: 1em;
  margin-left: 1em;
  background: #ccc;
  border: 1px solid #000;
  padding: 0.5em;
}

.diff_chunk .chunk_header .header { font-weight: bold; }

.diff_line .inserted {
  background: #afa;
}

.diff_line .deleted {
  background: #faa;
}

.diff_line .line_number {
  background: #ffc;
  color: #999;
  text-align: center;
}

pre,code,tt {
  font:1em 'andale mono', monotype.com, 'lucida console', monospace;
  line-height:1.5;
}
pre,code {
  margin: 1.5em 0;
  white-space: pre;
}

pre,code,tt {
  font: 1em 'andale mono', 'monotype.com', 'lucida console', monospace;
  line-height: 1.5;
}

pre {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}

table.diff_header{
  border: solid 1px #000;
  margin: 2em;
}

.diff_chunk {
  margin: 1em;
}

.file_change_set .file_change_set_header {
  margin-bottom: 1em;
  margin-left: 1em;
  background: #ccc;
  border: 1px solid #000;
  padding: 0.5em;
}

.file_change_set .file_change_set_header .header { font-weight: bold; }

.diff_line .inserted {
  background: #afa;
}

.diff_line .deleted {
  background: #faa;
}

.diff_line .line_number {
  background: #ffc;
  color: #999;
  text-align: center;
}

Fix stylesheets for new file_change_set stuff


.gentle-alerts-modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

.gentle-alerts-modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

.gentle-alerts-modal {
    display: none;
    position: fixed;
    z-index: 2147483647;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

.gentle-alerts-modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

Set z-index to max value

Set z-index to max value


#database-list {
    list-style-type: none;
    width: 40px;
    margin: 0;
    padding: 0;
    height: 100%;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    background: rgb(60, 60, 60);
    padding-top: 50px;
    color: rgb(250, 250, 250);
    text-align: center;
    z-index: 1000;
}

#database-list li {
    padding: 1px 0;
    border-top: 1px solid rgb(77, 76, 76);
    cursor: pointer;
}

#database-list li:hover {
    background: rgb(255, 194, 194);
}

.selected {
    background: rgb(229, 53, 53);
}

#database-list {
    list-style-type: none;
    width: 40px;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    background: rgb(60, 60, 60);
    padding-top: 50px;
    color: rgb(250, 250, 250);
    text-align: center;
    z-index: 1000;
    overflow: scroll;
}

#database-list li {
    padding: 1px 0;
    border-top: 1px solid rgb(77, 76, 76);
    cursor: pointer;
}

#database-list li:hover {
    background: rgb(255, 194, 194);
}

.selected {
    background: rgb(229, 53, 53);
}

Fix broken scroll for database selector

Fix broken scroll for database selector


NbtkButton {
  color: blue;
  background-image: url('file://lime-button.png');
}

NbtkButton:hover {
  background-image: url('file://cyan-button.png');
}

NbtkButton:active {
  background-image: url('file://green-button.png');
}

*#red-button {
  background-image: url('file://red-button.png');
}

*#blue-button {
  background-image: url('file://cyan-button.png');
}

*#green-button {
  background-image: url('file://green-button.png');
}

NbtkTable {
  color: #aee;
  background-color: #ddd;
}

Add test styling for Table

Add test styling for Table


/* https://bitsofco.de/holy-grail-layout-css-grid */
/* https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout */

body {
  display: grid;

  grid-template-areas:
    "header header"
    "main   aside"
    "footer footer";

  grid-template-columns: 1fr 30vw;
  grid-template-rows:    10vh 1fr /*80vh*/ 10vh;
}

body > header { grid-area: header }
body > footer { grid-area: footer }

@media (min-width:786px) {
  body {
  }
}

Update styles for holy-grid css

Update styles for holy-grid css


@import 'css/spring.css';

.listingblock .switch {
    border-style: none;
    display: inline-block;
    position: relative;
    bottom: -3px;
}

.listingblock .switch--item {
    padding: 10px;
    background-color: #e6e1dc;
    color: #282c34;
    display: inline-block;
    cursor: pointer;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.listingblock .switch--item:not(:first-child) {
    border-style: none;
}

.listingblock .switch--item.selected {
    background-color: #282c34;
    color: #e6e1dc;
}

.listingblock pre.highlightjs {
    padding: 0;
}

Remove the black border from code samples

See gh-21778


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

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

.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;
  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;
  }
}

:lipstick: Fix interest group logo width on details page


/* Comfortable layout for JMA */
@namespace url("http://www.w3.org/1999/xhtml");

@-moz-document domain("www.jma.go.jp") {
  /* Common */
  :root {
    --page-width: 75vw;
  }

  body {
    width: var(--page-width) !important;
    min-width: 1000px !important;
    margin: 0 auto !important;
  }

  #main, table.forecast {
    width: calc(var(--page-width) - 340px) !important;
    min-width: 660px !important;
  }
  #sidebar, #submenu {
    width: 300px !important;
  }

  #submenu {
    position: initial !important;
    left: initial !important;
  }

  #info, #info table:not(#ASFC_Table) {
    width: 100% !important;
  }

  #yjsearch {
    display: none !important;
  }
  #header_link {
    float: right !important;
    width: 28em !important;
  }

  /* Bug fix */
  #others    { width: auto !important; }
  #others td { white-space: nowrap !important; }

  #tablist .button-up, #tablist .button-off {
    height: auto !important;
  }

  /* Forecast */
  .info {
    width: 18em !important;
  }

  /* Weekly forecast */
  .for {
    width: calc((var(--page-width) - 340px) / 8) !important;
    max-width: 90px !important;
  }
}

@-moz-document domain("jma.go.jp") {
  .jma_ad_space {
    display: none !important;
  }
}

/* Comfortable layout for JMA */
@namespace url("http://www.w3.org/1999/xhtml");

@-moz-document domain("www.jma.go.jp") {
  /* Common */
  :root {
    --page-width: 75vw;
  }

  body {
    width: var(--page-width) !important;
    min-width: 1000px !important;
    margin: 0 auto !important;
  }

  #main, table.forecast {
    width: calc(var(--page-width) - 340px) !important;
    min-width: 660px !important;
  }
  #sidebar, #submenu {
    width: 300px !important;
  }

  #submenu {
    position: initial !important;
    left: initial !important;
  }

  /* Bug fix */
  #others td {
    white-space: nowrap !important;
  }

  /* Forecast */
  .info {
    width: 18em !important;
  }

  /* Weekly forecast */
  .for {
    width: calc((var(--page-width) - 340px) / 8) !important;
    max-width: 90px !important;
  }
}

@-moz-document domain("jma.go.jp") {
  .jma_ad_space {
    display: none !important;
  }
}

Drop styles currently not in effect

Drop styles currently not in effect


/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

#nav{
  display: flex;
  justify-content: flex-end
}

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

#nav{
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  width: 25%;
  float: right;
}

Move layout nav link to the top right of the page


.skylight-dialog {
    width: 50%;
    height: 400px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -200px;
    margin-left: -25%;
    background-color: #fff;
    border-radius: 2px;
    z-index: 100;
    padding: 10px;
    box-shadow: 0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28);
}

.skylight-dialog--close {
    cursor: pointer;
    float: right;
    font-size: 1.6em;
}

.skylight-dialog__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
    background-color: rgba(0,0,0,0.3);
}

.skylight-dialog {
    width: 50%;
    height: 400px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -200px;
    margin-left: -25%;
    background-color: #fff;
    border-radius: 2px;
    z-index: 100;
    padding: 10px;
    box-shadow: 0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28);
    overflow: auto;
}

.skylight-dialog--close {
    cursor: pointer;
    float: right;
    font-size: 1.6em;
}

.skylight-dialog__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
    background-color: rgba(0,0,0,0.3);
}

Apply `overflow: auto` on dialog

Apply `overflow: auto` on dialog

This way it will crop the dialog content correctly if it's larger than the dialog itself. Previously the content could overlap with the dialog.


#generic-modal {
    width: 615px !important;
}
#generic-modal .form-horizontal{
    margin-bottom: 0 !important;
}
    #form .control-group{
        margin-top:10px;
    }

    #form .alert{
        margin-top:10px;
    }
        #form .control-group .control-label{
            font-weight: bold;
            text-align:left !important;
            width:200px;
            padding-top:0;
        }
        #form .control-group .controls{
            margin-left: 200px !important;
            padding-right: 40px;
        }

div#generic-modal h2 {
    display: inline-block;
    vertical-align: middle;
    margin: 0px;
}

div#generic-modal textarea {
    width:100%;
    height: 100px;
}

.modal_icon {display:inline-block;}

Add a default css file.

Add a default css file.


div.button-wrapper {
    font-size:300%;
    line-height: 3em;
}

div.button-wrapper input {
    font-size:100%;
    border:5px solid #bbbbbb;
    border-radius:1em;
    padding:0.5em;
}

div.button-wrapper input:hover {
    cursor:pointer;
}

Fix pointer in top page

Fix pointer in top page


.reveal {
	font-size: 48px;
}
.reveal .slides {
	z-index: 20;
}
.reveal h6 {
	position: absolute;
	right: 0;
	text-align: right;
	top: -1.5em;
}
.reveal pre {
	font-size: .75em;
	white-space: pre;
	width: 100%;
}
.reveal pre.large {
	font-size: 1em;
}
.reveal pre.small {
	font-size: .65em;
}
/** add class that has smaller font by default and bigger when it's an important code **/
.reveal pre code {
	max-height: none;
	padding: 15px;
}

.reveal .mainFooter {
	bottom: 5px;
	border-top: solid 1px #d3d3d3;
	display: flex;
	font-size: 18px;
	left: 2%;
	justify-content: space-between;;
	padding: 5px;
	position: absolute;
	text-align: center;
	width: 96%;
	z-index: 11;
}

.reveal {
	font-size: 48px;
}
.reveal .slides {
	z-index: 20;
}
.reveal h6 {
	position: absolute;
	right: 0;
	text-align: right;
	top: -1.5em;
}
.reveal pre {
	font-size: .75em;
	white-space: pre;
	width: 100%;
}
.reveal pre.large {
	font-size: 1em;
}
.reveal pre.small {
	font-size: .65em;
}
/** add class that has smaller font by default and bigger when it's an important code **/
.reveal pre code {
	max-height: none;
	padding: 15px;
}

.reveal .mainFooter {
	bottom: 0;
	border-top: solid 1px #d3d3d3;
	display: flex;
	font-size: 23px;
	left: 2%;
	justify-content: space-between;;
	padding: 5px;
	position: absolute;
	text-align: center;
	width: 96%;
	z-index: 11;
}

Make footer a little bit bigger

Make footer a little bit bigger


tbody {
  background-color: transparent !important;
  border: none;
}

tbody tr:nth-child(2n) {
  background-color: rgba(24, 24, 24, 0.1) !important;
}

.test .row {
  padding-left: 1em;
  padding-right: 1em;
}

.skipped {
  background-color: rgba(255, 24, 24, 0.3) !important;
}

.test_slider {
  background: #034E60 !important;
  border: none;
  margin-top: 5px;
}

.str_slider {
  padding-left: 3em;
  padding-right: 1em;
  z-index: -2 !important;
}

.str_slider .left, .str_slider .right {
  position: relative;
  z-index: 1 !important;
  color: #bbb;
  font-size: 0.5em;
  padding-top: 0.5em;
}

.str_slider .left {
  float: left;
  padding-left: 1em;
}

.str_slider .right {
  float: right;
  padding-right: 1em;
}

@media (max-width: 40em) {
  .str_slider {
    padding-top: 1em;
    padding-bottom: 0.5em;
    padding-left: 0em !important;
    padding-right: 0em !important;
  }
}

tbody {
  background-color: transparent !important;
  border: none;
}

tbody tr:nth-child(2n) {
  background-color: rgba(24, 24, 24, 0.1) !important;
}

.test .row {
  padding-left: 1em;
  padding-right: 1em;

  color: white;
}

.skipped {
  background-color: rgba(255, 24, 24, 0.3) !important;
}

.test_slider {
  background: #034E60 !important;
  border: none;
  margin-top: 5px;
}

.str_slider {
  padding-left: 3em;
  padding-right: 1em;
  z-index: -2 !important;
}

.str_slider .left, .str_slider .right {
  position: relative;
  z-index: 1 !important;
  color: #bbb;
  font-size: 0.5em;
  padding-top: 0.5em;
}

.str_slider .left {
  float: left;
  padding-left: 1em;
}

.str_slider .right {
  float: right;
  padding-right: 1em;
}

@media (max-width: 40em) {
  .str_slider {
    padding-top: 1em;
    padding-bottom: 0.5em;
    padding-left: 0em !important;
    padding-right: 0em !important;
  }
}

Test questions are white again

Test questions are white again


#scripts-files option.injected {
    color: rgb(70, 134, 240);
}

.data-grid table {
    line-height: 120%;
}

body.attached #toolbar {
    height: 34px;
    border-top: 1px solid rgb(100, 100, 100);
    cursor: default; /* overriden */
    padding-left: 0;
}

/* Chrome theme overrides */
#toolbar {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(242, 247, 253)), to(rgb(223, 234, 248)));
}

DevTools: Use Chrome's colors for DevTools toolbar.

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

git-svn-id: de016e52bd170d2d4f2344f9bf92d50478b649e0@21072 0039d316-1c4b-4281-b951-d872f2087c98


/*
 * Copyright 2013 - present by OpenGamma Inc. and the OpenGamma group of companies
 * Please see distribution for license.
 */

.OG-text {
    background-color: #f8f8f8;
    overflow: scroll;
    height: 100%;
}

.OG-text .text-contents {
    width: 100%;
}

/* notification */
.OG-text .og-message {
    background-color: #fdf080;
    color: #656033;
    display: none;
    left: 0;
    margin: 1px 0 1px 1px;
    padding: 2px 5px;
    position: absolute;
    right: 0;
    top: 0;
}

.OG-text .og-message .og-link {
    cursor: pointer;
    text-decoration: underline;
}

/*
 * Copyright 2013 - present by OpenGamma Inc. and the OpenGamma group of companies
 * Please see distribution for license.
 */

.OG-text {
    background-color: #f8f8f8;
    overflow: scroll;
    height: 100%;
}

.OG-text .text-contents {
    width: 100%;
    padding: 5px;
}

/* notification */
.OG-text .og-message {
    background-color: #fdf080;
    color: #656033;
    display: none;
    left: 0;
    margin: 1px 0 1px 1px;
    padding: 2px 5px;
    position: absolute;
    right: 0;
    top: 0;
}

.OG-text .og-message .og-link {
    cursor: pointer;
    text-decoration: underline;
}

Add padding to text in text gadget

Add padding to text in text gadget


.body {
  color: black;
}

.ng-promise-pending {
  color: orange;
}

.ng-promise-resolved {
  color: green;
}

.ng-promise-rejected {
  color: red;
}

/* First */
.first.ng-promise-resolved {
  color: blue;
}

/* Second */
.second.ng-promise-resolved {
  color: yellow;
}

/* Third */
.third.ng-promise-resolved {
  color: purple;
}

/* Combined */
.ng-promise-resolved-first.ng-promise-resolved-second {
  background-color: navy;
}

.ng-promise-rejected-second.ng-promise-rejected-third {
  background-color: black;
}

.body {
  color: black;
}

.ng-promise-pending {
  color: orange;
}

.ng-promise-resolved {
  color: green;
}

.ng-promise-resolved.ng-promise-settled {
  color: greenyellow;
}

.ng-promise-rejected {
  color: red;
}

.ng-promise-rejected.ng-promise-settled {
  color: palevioletred;
}

/* First */
.first.ng-promise-resolved {
  color: blue;
}

/* Second */
.second.ng-promise-resolved {
  color: sandybrown;
}

/* Third */
.third.ng-promise-resolved {
  color: purple;
}

/* Combined */
.ng-promise-resolved-first.ng-promise-resolved-second {
  background-color: navy;
}

.ng-promise-rejected-second.ng-promise-rejected-third {
  background-color: black;
}

Add settled classess for resolved and rejected


.blue-message {
  font-size: 20px;
  color: #6FDCFF;
}

.add-message {
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  vertical-align: text-top;
  margin-right: 10px;
}

.message-container {
  clear: both;
  margin-top: 20px;
}

.message-title-input {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 16px !important;
  line-height: 16px !important;
  text-transform: uppercase;
  text-align: right;
  padding: 0;
  color: white !important;
  box-shadow: none !important;
  border: none !important;
}

.message-subtext-textarea {
  width: 100%;
  background: transparent;
  color: #6FDCFF;
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  display: inline-block;
  border: none;
  text-align: right;
  padding: 0;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: hidden;
  margin-top: 10px;
  resize: none;
  white-space: pre-wrap;
  outline: none;
}

.blue-message {
  font-size: 20px;
  color: #6FDCFF;
}

.add-message {
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  vertical-align: text-top;
  margin-right: 10px;
}

.message-container {
  clear: both;
  margin-top: 20px;
}

.message-title-input {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 16px !important;
  line-height: 16px !important;
  text-transform: uppercase;
  text-align: right;
  padding: 0 !important;
  color: white !important;
  box-shadow: none !important;
  border: none !important;
}

.message-subtext-textarea {
  width: 100%;
  background: transparent;
  color: #6FDCFF;
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  display: inline-block;
  border: none;
  text-align: right;
  padding: 0;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: hidden;
  margin-top: 10px;
  resize: none;
  white-space: pre-wrap;
  outline: none;
}

Fix for title of message not lining up on the right


:host {
  @apply inline-block list-none h-full text-xs text-center pl-1 pr-4 py-2 leading-none flex-grow border;
  background: var(--color-neutral-300);
  color: var(--color-neutral-700);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: var(--color-neutral-500);

  &:not(:last-of-type) {
    border-right-width: 1px;
    border-right-style: solid;
    border-color: var(--color-neutral-500);
  }

  &.isActive {
    border-bottom-color: var(--color-neutral-300);
    box-shadow: inset 0px 3px var(--color-brand);
  }

  & > * {
    @apply align-middle;
  }

  &:hover,
  &:focus {
    stencila-icon {
      @apply opacity-100;
    }
  }
}

li {
  @apply flex list-none align-middle flex-row flex-nowrap items-center;
}

stencila-icon {
  @apply opacity-0;
}

a,
a:link,
a:visited {
  @apply block no-underline whitespace-nowrap leading-none text-current flex-grow cursor-default;
}

:host {
  @apply inline-block list-none h-full text-xs text-center pl-1 pr-4 py-2 leading-none flex-grow border;
  background: var(--color-neutral-300);
  color: var(--color-neutral-700);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: var(--color-neutral-500);

  &:not(:last-of-type) {
    border-right-width: 1px;
    border-right-style: solid;
    border-color: var(--color-neutral-500);
  }

  &.isActive {
    border-bottom-color: var(--color-neutral-300);
    box-shadow: inset 0px 3px var(--color-brand);
  }

  & > * {
    @apply align-middle;
  }

  &:hover,
  &:focus {
    stencila-icon {
      @apply opacity-100;
    }
  }
}

li {
  @apply flex list-none align-middle flex-row flex-nowrap items-center;
}

stencila-icon {
  @apply opacity-0 rounded-sm;

  &:hover,
  &:active {
    color: var(--color-neutral-300);
    background: var(--color-neutral-700);
  }
}

a,
a:link,
a:visited {
  @apply block no-underline whitespace-nowrap leading-none text-current flex-grow cursor-default;
}

fix(Desktop): Improve usability and legibility of tab close icon


body {
    padding-top: 2em;
}
.help-block {
    color: #333;
}
.registrant-panel-name {
    margin-top: 0 !important;
}
#registration-form {
    margin: 1em;
}
@media (min-width: 33em) {
    #registration-form {
        width: 62%;
        margin: auto;
    }
}

body {
    padding-top: 2em; /* prevent navbar overlap */
}
.help-block {
    color: #333;
}
#registration-form {
    margin-top: 3em !important; /* prevent navbar overlap */
}
@media (min-width: 33em) {
    #registration-form {
        width: 62%;
        margin: auto;
    }
}

Add top padding to registration form.

Add top padding to registration form.


html {
  font-family: Helvetica;
  background-color: #BCED91;
}

h2 {
  display: block;
  text-align: center;
  border: 5px solid black;
  padding: 20px;
}

#definition {
  text-align: center;
  margin-left: 340px;
  margin-right: 340px;

}

#red {
  color: red;
  }
#red_center {
  color: red;
  text-align: center;
}
.topics {
  font-weight: bold;
}

.italics {
  font-style: italic;
}

.center {
  text-align:center;
}

.indent {
  margin-left: 50px;
}
.huge_indent {
  margin-left: 200px;
}

#hover_example:hover {
  background-color:blue;
  }

html {
  font-family: Helvetica;
  background-color: #BCED91;
}

h2 {
  display: block;
  text-align: center;
  border: 5px solid black;
  padding: 20px;
}

#definition {
  text-align: center;
  margin-left: 340px;
  margin-right: 340px;

}

#red {
  color: red;
  }
#red_center {
  color: red;
  text-align: center;
}

#blue_center {
  color: blue;
  text-align: center;
}
.topics {
  font-weight: bold;
}

.italics {
  font-style: italic;
}

.center {
  text-align:center;
}

.indent {
  margin-left: 50px;
}
.huge_indent {
  margin-left: 200px;
}

#hover_example:hover {
  background-color:blue;
  }

Add blue center projects css

Add blue center projects css


html, body {
  height: calc(100% - 10%);
  margin: 2%;
}

h1 {
  opacity: 1;
  font-size: 100%;
}

h5 {
  opacity: 0.75;
}

#inputForm {
  height: 100%
}

.cy {
  border: solid;
  border-width: 0.5;
  height: 100%;
}

.cy-container {
  height: 100%;
}

.btn-div{
    padding-top:5px;
    padding-bottom:5px;

}

body .modal-dialog {
    /* new custom width */
    width: 80%;
}

Make modal a bit narrower

Make modal a bit narrower

- 80% of screen defined in css


.dark {
    color: #cccccc;
    background-color: black;
}
.popover-content, .popover-title, .hosts-list {
    color: black;
}
.dark .panel {
    background-color: #232323;
}
.list-group .list-group-item {
    background-color: #232323;
}

Update dark theme CSS style for lists

Update dark theme CSS style for lists


/**
 * All Hallows Eve theme
 *
 * @author Flinn Mueller
 * @version 1.0
 * @attribution Adapted from Ultraviolet RubyGem
 */
pre {
  background: #000;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
  margin: 0px;
  padding: 0px;
  padding: 10px;
  color: #fff;
  font-size: 14px;
  margin-bottom: 20px;
}
pre, code {
  font-family: 'Monaco', courier, monospace;
}
pre .comment {
  color: #9933CC;
}
pre .constant, pre .integer {
  color: #3387CC;
}
pre .storage {
  color: #CC7833;
}
pre .string {
  color: #66CC33;
}
pre .keyword, pre .selector {
  color: #CC7833;
}
pre .parent {
  font-style: italic;
}
pre .entity, pre .meta {
}
pre .support {
  color: #C83730;
}

Adjust formatting to match other themes

Adjust formatting to match other themes


html, body {
    height: 100%;
    margin: 0;
}

.container {
    max-width: 700px;
    margin: 0 auto;
    padding: 80px 30px 80px 30px;
    position: relative;
}

.form {
    margin-top: 30px;
}

#unknownNameErrorBox, #noImagesFoundWarningBox, #downloadingInfoBox {
    display: none;
}

html, body {
    height: 100%;
    margin: 0;
}

.container {
    max-width: 700px;
    margin: 0 auto;
    padding: 60px 30px 60px 30px;
    position: relative;
}

.form {
    margin-top: 30px;
}

#unknownNameErrorBox, #noImagesFoundWarningBox, #downloadingInfoBox {
    display: none;
}

Reduce top and bottom padding

Reduce top and bottom padding


html {
  font-size: 62.5%;
}
body {
  margin: 8px;
}
html, body, .app {
  height: 100%;
}

.title {
  font-size: 3.0rem;
}
.app {
  position: relative;
  width: 100%;
  margin: 20px 4px 0px;
}
.source, .destination {
  display: inline-block;
  width: 50%;
  height: 70%;
  box-sizing: border-box;
}
.source {
  float: left;
}
.destination {
  float: right;
}

.caption {
  font-size: 2.0rem;
  line-height: 3.0rem;
}
.escape {
  vertical-align: middle;
}
.text {
  width: 90%;
  height: 100%;
  resize: nonk;
}

html {
  font-size: 62.5%;
}
body {
  margin: 8px;
}
html, body, .app {
  height: 100%;
}

.title {
  font-size: 3.0rem;
}
.app {
  position: relative;
  width: 100%;
  margin: 20px 4px 0px;
}
.source, .destination {
  display: inline-block;
  width: 50%;
  height: 70%;
  box-sizing: border-box;
}
.source {
  float: left;
}
.destination {
  float: right;
}

.caption {
  font-size: 2.0rem;
  line-height: 3.0rem;
}
.escape {
  vertical-align: middle;
}
.text {
  width: 90%;
  height: 100%;
  resize: none;
}

Fix typo of "resize: none"

Fix typo of "resize: none"


@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700);

html, body, #map-canvas {
  margin: 0;
  padding: 0;
  height: 100%;
}

.info_window {
  display:inline-block;
  vertical-align:top;
  margin-right: 10px;
}

body {
  font:10pt 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color:#444;
}

#log {
  padding-left: 10px;
  position: absolute;
  top:0;
}

.see_thru {
  background-color: #fff;
  background-color: rgba(255,255,255,0);
}

.rot90c {
  -moz-transform:rotate(90deg);
  -o-transform:rotate(90deg);
  -ms-transform:rotate(90deg); /* IE 9 */
  -webkit-transform:rotate(90deg); /* Safari and Chrome */
  transform:rotate(90deg);

}

.rot90cc {
  -moz-transform:rotate(-90deg);
  -o-transform:rotate(-90deg);
  -ms-transform:rotate(-90deg); /* IE 9 */
  -webkit-transform:rotate(-90deg); /* Safari and Chrome */
  transform:rotate(-90deg);
}

Remove unused CSS rotation examples

Remove unused CSS rotation examples


.centered-content {
    height: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#loader, #login, #main {
    height: 100%;
}

#main {
    padding: 8px;
}

#loading-gif {
    height: 16px;
    width: 16px;
}

#img-logo-img {
    height: 125px;
    width: 125px;
}

#user-photo {
    height: 64px;
    width: 64px;

    margin-bottom: 0;
}

body {
    width: 400px;
}

.centered-content {
    height: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#loader, #login, #main {
    height: 100%;
}

#main {
    padding: 8px;
}

#loading-gif {
    height: 16px;
    width: 16px;
}

#img-logo-img {
    height: 125px;
    width: 125px;
}

#user-photo {
    height: 48px;
    width: 48px;

    margin-bottom: 0;
}

Increase the width and consequently shrink the size of user-photo


html, body {
  height : 100%; width: 100%;
  margin : 0;
  overflow: hidden;
  cursor : default;
  font-family: arial;
  font-size: 11px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

ul, li {
  margin : 0;
  padding : 0;
  list-style-type: none;
}

/* Force apparition of scrollbars on leopard */
::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 6px;
}

::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #666;
}

::-webkit-scrollbar-track {
   background-color: #444;
}

html, body {
  height : 100%; width: 100%;
  margin : 0;
  overflow: hidden;
  cursor : default;
  font-family: arial;
  font-size: 11px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

ul, li {
  margin : 0;
  padding : 0;
  list-style-type: none;
}

/* Force apparition of scrollbars on leopard */
::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 6px;
}

::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #666;
}

::-webkit-scrollbar-track {
   background-color: rgba(50, 50, 50, 0.4);;
}

Update scrollbar gutter to make less visible


videogular vg-cuepoints {
	position: relative;
	top: -50px;

	display: block;
	width: 100%;
	height: 0px;
}

videogular vg-cuepoints vg-cuepoint {
	position: absolute;

	display: block;
	width: 2px;
	height: 50px;

	background-color: red;
}

videogular vg-cuepoints {
	position: relative;

	display: block;
	width: 100%;
	height: 0px;
}

videogular vg-cuepoints vg-cuepoint {
	position: absolute;
	top: -16px;

	display: block;
	width: 2px;
	height: 30px;

	background-color: red;
}

Correct cuepoint position with Videogular v1 theme

Also make the cuepoints a little shorter and less obtrusive.


@import 'part:@sanity/base/theme/variables-style';

.groupChange {
}
.changeList {
}

.changeHeader {
  margin: 0 0 0.5em;
  display: flex;
}

.groupChange > .changeList {
  border-left: 1px solid var(--hairline-color);
  padding-left: 0.75em;
}

Remove additional indentation of groups

[field] Remove additional indentation of groups


/* Give the main header an underline. */

h1 {
  padding-bottom: 21px;
  margin-bottom: 21px;
  border-bottom: 1px solid #ddd;
}

/* Add small subtitles. */

.subtitle {
  margin-top: -10.5px;
  color: #bbb;
}

/* Lay out definition lists list tables. */

dl {
  display: flex;
  flex-flow: row wrap;
}

dt {
  flex-basis: 20%;
  font-weight: normal;
  text-align: right;
  padding: 2px 4px;
}

dd {
  flex-basis: 70%;
  flex-grow: 1;
  margin: 0;
  padding: 2px 4px;
}

/* Give the main header an underline. */

h1 {
  padding-bottom: 21px;
  margin-bottom: 21px;
  border-bottom: 1px solid #ddd;
}

/* Add small subtitles. */

.subtitle {
  margin-top: -10.5px;
  color: #bbb;
}

/* Display definition lists in grid form. */

dl {
  display: grid;
  grid-template-columns: fit-content(25%) auto
}

dt {
  font-weight: normal;
  text-align: right;
  padding: 2px 4px;
}

dd {
  margin: 0;
  padding: 2px 4px;
}

Improve CSS for definition list grids

Improve CSS for definition list grids


.search-widget {
  max-width: 500px;
}
.search-widget .search-form {
  margin: 10px 0;
  border-width: 3px;
  text-align: center;
}
.search-widget .search-query {
  font-family: Monda;
  padding-right: 10px;
  min-width: 83%;
}
.search-widget .search-button {
  padding: 5px 12px;
}
.search-widget .search-results {
  display: none;
}
.search-widget .results-header {
  background: rgba(0, 0, 0, 0.6);
  border-radius: 5px;
  margin: 10px 0;
  padding: 10px;
  color: #fff;
}
.search-widget .search-results > *:first-child {
  margin-top: 0;
}

.search-widget {
  max-width: 500px;
}
.search-widget .search-form {
  margin: 10px 0;
  border-width: 3px;
  text-align: center;
  padding: 8px;
}
.search-widget .search-query {
  font-family: Monda;
  padding-right: 10px;
  min-width: 83%;
}
.search-widget .search-button {
  padding: 5px 12px;
}
.search-widget .search-results {
  display: none;
}
.search-widget .results-header {
  background: rgba(0, 0, 0, 0.6);
  border-radius: 5px;
  margin: 10px 0;
  padding: 10px;
  color: #fff;
}
.search-widget .search-results > *:first-child {
  margin-top: 0;
}

Reduce padding on search form.

Reduce padding on search form.


textarea {
    resize: vertical;
}

.img-responsive {
    width: 100%;
}

.embed-responsive {
    /*
    Fix strange bug which causes embedded YouTube videos to disappear after a few seconds
    */
    overflow: visible;
}

Fix bug that caused videos to disappear

Fix bug that caused videos to disappear

Fix the bug that caused embedded YouTube videos to disappear after a few
seconds. It was caused by Bootstrap's `overflow: hidden`.


.round {
  border-radius: 100%;
  height: 35px;
  width: 35px;
  display: inline-block;
  margin: 0 5px;
  color: var(--text-teal-light);
  border: solid 2px var(--text-teal);
  outline: none;
  background-color: inherit;
  cursor: pointer;
  padding: 6px;
}

.round.small {
  height: 30px;
  width: 30px;
  padding: 5px;
  margin: 0 2px;
}

.round svg {
  margin: auto;
  display: block;
  shape-rendering: auto;
  fill: currentColor;
}

.round svg:hover {
  color: inherit;
}

.round:hover {
  color: var(--text-teal-light);
  border-color: var(--text-teal-light);
}

.round:active {
  background-color: var(--middle-background-lighter);
}

.round:disabled {
  color: var(--light-background);
  border: solid 1px var(--light-background);
  cursor: default;
}

.round:disabled:hover {
  background-color: inherit;
}

.round:not(:disabled):active {
  background-color: var(--middle-background-lighter);
}

.round {
  border-radius: 100%;
  height: 35px;
  width: 35px;
  display: inline-block;
  margin: 5px;
  color: var(--text-teal-light);
  border: solid 2px var(--text-teal);
  outline: none;
  background-color: inherit;
  cursor: pointer;
  padding: 6px;
}

.round.small {
  height: 30px;
  width: 30px;
  padding: 5px;
  margin: 2px;
}

.round svg {
  margin: auto;
  display: block;
  shape-rendering: auto;
  fill: currentColor;
}

.round svg:hover {
  color: inherit;
}

.round:hover {
  color: var(--text-teal-light);
  border-color: var(--text-teal-light);
}

.round:active {
  background-color: var(--middle-background-lighter);
}

.round:disabled {
  color: var(--light-background);
  border: solid 1px var(--light-background);
  cursor: default;
}

.round:disabled:hover {
  background-color: inherit;
}

.round:not(:disabled):active {
  background-color: var(--middle-background-lighter);
}

Add margin to top and bottom of round buttons


body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
    Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  background: #f0f4f8;
}

a {
  text-decoration: none;
}

@import url("https://fonts.googleapis.com/css2?family=Inter&display=swap");

body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
    "Segoe UI Symbol";
  background: #f0f4f8;
}

a {
  text-decoration: none;
}

Use inter as the default font

Use inter as the default font


.select-list ol li {
  background-color: #27292b;
  border-bottom: 1px solid #1e1e1e;
}

.select-list li .label {
  color: #ddd;
}

.select-list li .right {
  color: #999;
  display: inline-block;
  margin-top: -3px;
}

.select-list .key-binding {
  background: -webkit-linear-gradient(
    rgba(100, 100, 100, 0.5),
    rgba(70,70,70, 0.5));
  color: #ccc;
  -webkit-box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.1);
  display: inline-block;
  line-height: 100%;
}

.select-list li:hover {
  background-color: #555;
}

.select-list ol .selected {
  background-image: -webkit-linear-gradient(#7e7e7e, #737373);
}

.select-list .directory {
  color: #777;
}

.select-list ol .selected .label {
  color: #fff;
}

.select-list ol .selected .directory {
  color: #ccc;
}

.select-list ol li {
  background-color: #27292b;
  border-bottom: 1px solid #1e1e1e;
}

.select-list li .label {
  color: #ddd;
}

.select-list li .right {
  color: #999;
  display: inline-block;
  margin-top: -3px;
}

.select-list .key-binding {
  background: -webkit-linear-gradient(
    rgba(100, 100, 100, 0.5),
    rgba(70,70,70, 0.5));
  color: #ccc;
  -webkit-box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.1);
  display: inline-block;
  line-height: 100%;
}

.select-list li:hover {
  background-color: #2c2c2c;
}

.select-list ol .selected {
  background-image: -webkit-linear-gradient(#7e7e7e, #737373);
}

.select-list .directory {
  color: #777;
}

.select-list ol .selected .label {
  color: #fff;
}

.select-list ol .selected .directory {
  color: #ccc;
}

Add more subtle hover background color

Add more subtle hover background color


body {
    font-family: "dejavu sans", sans-serif;
    width: 80ex;
    margin: 3em auto;
    background-color: #eee;
    border: 3px solid #ddd;
}

div.document {
    padding: 3em;
    background-color: white;
}

h1.title {
    font-size: 200%;
    background-color: white;
    border: 0px;
    margin: 0px;
}

h2.subtitle {
    margin-top: 1ex;
    font-size: 110%;
}

h1 {
    font-size: 130%;
    border-bottom: 3px solid #eee;
    margin: 3ex 0em 0em 0em;
}

p, li {
    line-height: 140%;
    list-style-type: square;
}

blockquote {
    margin: 1em;
}

pre {
    margin-left: 3em;
    color: #777;
}

table.docinfo {
    display: none;
}

a {
    color: #c00;
    text-decoration: none;
}

body {
    font-family: "dejavu sans", sans-serif;
    width: 80ex;
    margin: 3em auto;
    background-color: #eee;
    border: 3px solid #ddd;
}

div.document {
    padding: 3em;
    background-color: white;
}

h1.title {
    font-size: 200%;
    background-color: white;
    border: 0px;
    margin: 0px;
}

h2.subtitle {
    margin-top: 1ex;
    font-size: 110%;
}

h1 {
    font-size: 130%;
    border-bottom: 3px solid #eee;
    margin: 3ex 0em 0em 0em;
}

p, li {
    line-height: 140%;
    list-style-type: square;
}

blockquote {
    margin: 1em;
}

pre {
    margin-left: 3em;
    color: #777;
    font-size: 111%;
}

table.docinfo {
    display: none;
}

a {
    color: #c00;
    text-decoration: none;
}

Adjust font size of the preformatted text


.bodheaderchiclet {
    text-align:center;
    width:110px;
    height:33px;
    background-size:110px 33px;
    background-repeat:no-repeat;
    background-position:0px 1px;
    font-family:quadrata;
    font-size:14px;
}

.bodnormalheader {
    background-image:url('../static/bod/header-normal.png');
}

.bodheroicheader {
    background-image:url('../static/bod/header-heroic.png');
}

.bodmythicheader {
    background-image:url('../static/bod/header-mythic.png');
    color: white;
}

.bod-background {
    background-size:530px 180px;
    background-image:url(../static/bod/background.png);
}

.cosheaderchiclet {
    text-align:center;
    width:90px;
    height:33px;
    background-size:90px 33px;
    background-repeat:no-repeat;
    background-position:0px 1px;
    font-family:quadrata;
    font-size:14px;
}

.cosnormalheader {
    background-image:url('../static/crucible/header-normal.png');
}

.cosheroicheader {
    background-image:url('../static/crucible/header-heroic.png');
}

.cosmythicheader {
    background-image:url('../static/crucible/header-mythic.png');
    color:white;
}

.cos-background {
    background-size:500px 180px;
    background-image:url(../static/crucible/background.png);
    background-color:rgba(0, 0, 0, 0.1);
}

Remove CoS entries from tier 23 CSS

Remove CoS entries from tier 23 CSS


#libraries-index {
    justify-content: center;
}

#libraries-index .tabs {
    flex-flow: column;
    align-items: center;
}

#libraries-index .tabs:first-child {
    margin-bottom: -1.5em;
}

#libraries-index .tabs.contains-title > h1 {
    margin-left: 0;
    margin-right: 0;
}

#libraries-index .tabs ul > li.contains-children {
    align-items: center;
}

#libraries-index .tabs ul > li.contains-children > ul {
    flex-flow: column;
    font-size: initial;
}

#libraries-index .tabs ul > li.contains-children > ul > li {
    text-align: left;
}

#libraries-index .tabs > ul > li > a {
    font-size: larger;
    font-weight: bold;
    align-self: stretch;
}

#misc-index {
    margin-top: 2em;
}

@media (max-width: 25em) {
    #page-header h1 {
        font-size: 13vw;
    }
}

Use new global support for centered tab groups.


/*
Copyright 2015 Genymobile

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
table {
    width: 100%;
}
.label {
    padding: 2px;
    border-radius: 4px;
    font-weight: bold;
    font-size :12px;
    text-transform: uppercase;
}
.feedback_ok {
    color: green;
}
.feedback_ko {
    color: red;
}
td.alignleft, th.alignleft {
    text-align: left;
}
td.aligncenter, th.aligncenter {
    text-align: center;
}

Add copyright to CSS file

Add copyright to CSS file


.vm-detail-settings {
    transition: height 1s;
    height: 0px;
    overflow: hidden;
    width: 100%;
}

.open-settings {
    height: 110px;
    margin-left: 2em;
}

.console-option-description {
    width: 20em;
}

.vm-detail-settings {
    transition: height 1s;
    height: 0px;
    overflow: hidden;
    width: 100%;
    margin-left: 2em;
}

.open-settings {
    height: 110px;
    margin-left: 2em;
}

.console-option-description {
    width: 20em;
}

Fix ConsolOptions allignment when collapsing


.profileDropdown {
  position: absolute;
  top: 45px;
  right: 0;
  width: 235px;
  background-color: #fff;
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.25);
  border-radius: 6px;
  z-index: $zIndex-fg-1;
  overflow: hidden;
}

.profileDropdown-listItem {
  border-bottom: 1px solid #f0f0f0;

  &:last-child {
    border-bottom: 0;
  }
}

.profileDropdown-link {
  display: block;
  height: 40px;
  line-height: 40px;
  text-decoration: none;
  color: #444;
  padding: 0 15px;
  font-size: 16px;

  &:hover {
    color: #3e3e3e;
    background: #fbfbfb;
  }

  &:active {
    color: #393939;
    background: #f7f7f7;
  }
}

.profileDropdown-icon {
  margin-right: 10px;
}

.profileDropdown {
  position: absolute;
  top: 45px;
  right: 0;
  width: 235px;
  background-color: #fff;
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.25);
  border-radius: 6px;
  z-index: $zIndex-fg1;
  overflow: hidden;
}

.profileDropdown-listItem {
  border-bottom: 1px solid #f0f0f0;

  &:last-child {
    border-bottom: 0;
  }
}

.profileDropdown-link {
  display: block;
  height: 40px;
  line-height: 40px;
  text-decoration: none;
  color: #444;
  padding: 0 15px;
  font-size: 16px;

  &:hover {
    color: #3e3e3e;
    background: #fbfbfb;
  }

  &:active {
    color: #393939;
    background: #f7f7f7;
  }
}

.profileDropdown-icon {
  margin-right: 10px;
}

Fix z-index variable typo in profile dropdown


.stateSchools {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-around;
}

.select {
  min-width: 300px;
}

/* iPhone Safari-only media query to prevent zoom effect when the select is focused */
/* see https://stackoverflow.com/questions/6483425/prevent-iphone-from-zooming-in-on-select-in-web-app */

@media screen and (-webkit-min-device-pixel-ratio: 0) {

  .select input {
    font-size: 16px !important;
  }

  .select input:focus {
          font-size: 16px !important;
      }
  }

.stateSchools {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-around;
}

.select {
  min-width: 300px;
  width: 100%;
  max-width: 900px;
}

/* iPhone Safari-only media query to prevent zoom effect when the select is focused */
/* see https://stackoverflow.com/questions/6483425/prevent-iphone-from-zooming-in-on-select-in-web-app */

@media screen and (-webkit-min-device-pixel-ratio: 0) {

  .select input {
    font-size: 16px !important;
  }

  .select input:focus {
          font-size: 16px !important;
      }
  }

Make select class within StateSortedSchools full width of section

Set max-width 900px so it's not extremely long on large screens


body {
    background: white;
    color: black;
    font-family: sans-serif;
}

table {
    border-collapse: collapse;
}

th {
    background: #ccc;
    border: solid 1px black;
    border-bottom: solid 2px black;
    padding: 0.5em;
}

#index td, #tests td {
    border: solid 1px black;
    padding: 0 0.5em;
}

.fail { background: #e33; }
.pass { background: #5e5; }
.warn { background: #ff3; }

#index, #tests {
    border: solid 2px black;
    margin-top: 2em;
}

#config td:first-child {
    font-weight: bold;
    padding-right: 3em;
}

.diff {
    font-family: monospace;
    white-space: pre;
}

body {
    background: white;
    color: black;
    font-family: sans-serif;
}

table {
    border-collapse: collapse;
}

th {
    background: #ccc;
    border: solid 1px black;
    border-bottom: solid 2px black;
    padding: 0.5em;
}

#index td, #tests td {
    border: solid 1px black;
    padding: 0 0.5em;
}

.fail { background: #e33; }
.pass { background: #5e5; }
.warn { background: #ff3; }

#index, #tests {
    border: solid 2px black;
    margin-top: 2em;
}

#config td:first-child {
    font-weight: bold;
    padding-right: 3em;
    vertical-align: top;
}

.diff {
    font-family: monospace;
    white-space: pre;
}

Fix vertical alignment in report summary


Revert "Revert "Revert "Revert "CSS Fix for Slider""""

This reverts commit 562402f0e3ba41fd28ed3c39e4c6c1602c318157.


/* Copyright (c) 2012 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. */

#certificateManagerPage {
  min-width: 700px;
}

.certificate-tree-table {
  width: 100%;
}

.certificate-tree {
  /* TODO(mattm): BLAH.  Make this not statically sized. */
  height: 300px;
}

/* Copyright (c) 2012 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. */

#certificateManagerPage {
  min-width: 700px;
}

#certificateRestoreOverlay h1 {
  /* Leave enough space for the close-button. */
  /* TODO(KGR): make dialogs to use flex-boxes instead of relying on padding. */
  padding-right: 35px;
}

.certificate-tree-table {
  width: 100%;
}

.certificate-tree {
  /* TODO(mattm): BLAH.  Make this not statically sized. */
  height: 300px;
}

Fix for certificate password dialog spacing.

BUG=123828
TEST=see ticket

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

git-svn-id: de016e52bd170d2d4f2344f9bf92d50478b649e0@132648 0039d316-1c4b-4281-b951-d872f2087c98


input[type='number'] {
  -moz-appearance: textfield;
}

input[type='text'],
input[type='number'] {
  appearance: none;
  box-shadow: none;
  border-radius: none;
  text-align: center;
  font-size: 1em;
  color: $color-silver;
  border: none;
  width: 100%;
  background-color: $color-tundora;
  transition: background-color 0.3s;

  &::-webkit-outer-spin-button,
  &::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  &:focus {
    color: $color-mineShaft;
    background-color: $color-dustyGray;
    outline: none;
  }
}

@define-mixin inputText {
  appearance: none;
  box-shadow: none;
  border-radius: none;
  text-align: center;
  font-size: 1em;
  color: $color-silver;
  border: none;
  width: 100%;
  background-color: $color-tundora;
  transition: background-color 0.3s;

  &:focus {
    color: $color-mineShaft;
    background-color: $color-dustyGray;
    outline: none;
  }
}

input[type='text'],
input[type='number'] {
  @mixin inputText;
}

input[type='number'] {
  -moz-appearance: textfield;
  &::-webkit-outer-spin-button,
  &::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
}

Fix Firefox input css issue

Fix Firefox input css issue


/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require_tree .
 *= require_custom-bootstrap
 */

.helpertext-wrapper {
  display: inline-block;
}
.helpertext-wrapper-overflow {
  overflow: hidden;
  text-overflow:ellipsis;
  display: block;
}
.table-overflow {
  table-layout: fixed;
}
.tooltip {
  word-wrap: break-word;
}

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require_tree .
 *= require_custom-bootstrap
 */

.helpertext-wrapper {
  display: inline-block;
}
.helpertext-wrapper-overflow {
  display: block;
  overflow: hidden;
  text-overflow:ellipsis;
}
.table-overflow {
  table-layout: fixed;
}
.tooltip {
  word-wrap: break-word;
}

Reorder properties to be in alpha order

Reorder properties to be in alpha order


html {
  height: 100%;
}

body {
  background:  var(--body-background-color);
  color:       var(--body-color);
  font-family: var(--body-font-family);
  font-size:   var(--body-font-size);
}

a {
  color: var(--link-color);
  text-decoration: none;
}

a:hover {
  transition: background 0.1s ease 0, color 0.1s ease 0;
}

a:hover, a:active {
  color: var(--link-color-highlight);
}

a:focus {
  outline: thin dotted;
  outline-offset: -1px;
}

a:visited {
  color: var(--link-color-visited);
}

::selection {
  background-color: color(var(--color-main) l(+25%));
}

html {
  height: 100%;
}

body {
  background:  var(--body-background-color);
  color:       var(--body-color);
  font-family: var(--body-font-family);
  font-size:   var(--body-font-size);
}

a {
  color: var(--link-color);
  text-decoration: none;
}

a:hover {
  transition: background 0.1s ease 0, color 0.1s ease 0;
}

a:hover, a:active {
  color: var(--link-color-highlight);
}

a:focus {
  outline: thin dotted;
  outline-offset: -1px;
}

a:visited {
  color: var(--link-color-visited);
}

::selection {
  background-color: color(var(--color-main) l(+25%));
  text-shadow: none;
}

Remove text-shadow on selected text

Remove text-shadow on selected text


@media (min-width: 992px) {
  .nav-users {
    position: fixed;
  }
}
.remove-account-container {
  display: inline-block;
  position: relative;
}
.btn-remove-account {
  top: 10px;
  right: 10px;
  position: absolute;
}

/* For user modals. */
.modal-open {
  overflow-y: scroll;
}

.or-group
{
  position: relative;
  border-top: 1px solid #dfdfdf;
  padding-top: 20px;
}
.or-line
{
  color: #666666;
  background-color: #ffffff;
  position: absolute;
  text-align: center;
  top: -12px;
  width: 100px;
  left: 70px;
}

Add some css for modal usage.

Add some css for modal usage.


/* Position */

.pos-f { position: fixed; }
.pos-a { position: absolute; }
.pos-r { position: relative; }
.pos-s { position: static; }
.pos-i { position: initial; } /* default */

/* Border radius */

.rad {
  border-radius: var(--radius);
}

/* Floats */

.float-l { float: left; }
.float-r { float: right; }

@each $media, $ext in (var(--breakpoint-media)), (var(--breakpoints)) {
  @media ($media) {
    .pos-f-$(ext) { position: fixed; }
    .pos-a-$(ext) { position: absolute; }
    .pos-r-$(ext) { position: relative; }
    .pos-s-$(ext) { position: static; }
    .pos-i-$(ext) { position: initial; }

    .float-l-$(ext) { float: left; }
    .float-r-$(ext) { float: right; }
  }
}

/* Visibility (for use with @wearegenki/vue-directive-view) */

.hide {
  pointer-events: none;
  opacity: 0;
}

/* Scroll prevention */

.scroll-lock {
  height: 100%;
  overflow-y: hidden;
}

/* Clearfix */

.clr {
  @mixin clearfix;
}

/* Box model */
.content-box { box-sizing: content-box; }
.border-box { box-sizing: border-box; }

/* Position */

.pos-f { position: fixed; }
.pos-a { position: absolute; }
.pos-r { position: relative; }
.pos-s { position: static; }
.pos-i { position: initial; } /* default */

/* Border radius */

.rad {
  border-radius: var(--radius);
}

/* Floats */

.float-l { float: left; }
.float-r { float: right; }

@each $media, $ext in (var(--breakpoint-media)), (var(--breakpoints)) {
  @media ($media) {
    .pos-f-$(ext) { position: fixed; }
    .pos-a-$(ext) { position: absolute; }
    .pos-r-$(ext) { position: relative; }
    .pos-s-$(ext) { position: static; }
    .pos-i-$(ext) { position: initial; }

    .float-l-$(ext) { float: left; }
    .float-r-$(ext) { float: right; }
  }
}

/* Scroll prevention */

.scroll-lock {
  height: 100%;
  overflow-y: hidden;
}

/* Clearfix */

.clr {
  @mixin clearfix;
}

/* Box model */
.content-box { box-sizing: content-box; }
.border-box { box-sizing: border-box; }

Remove .hide util CSS class (it's really part of @wearegenki/vue-directive-view)


#clock {
	border-style: solid;

	border-radius: 50%;

	margin: 10px auto;
	width: 300px;
	height: 300px;

	position: relative;
}

#clock.day {
	border-color: orange black black;
	border-width: 3px 1px 1px ;
}

#clock.night {
	border-color: black black orange;
	border-width: 1px 1px 3px ;
}

#clock img {
	-webkit-transition: -webkit-transform 1s linear 0s;
	-webkit-transform-origin: 32px 32px;
	-webkit-transform: scale(0.01, 0.01);
	position: relative;
	left: 118px;
	top: 118px;
}

#clock {
	border-style: solid;

	border-radius: 50%;

	margin: 10px auto;
	width: 300px;
	height: 300px;

	position: relative;
}

#secs {
	width: 10px;
	height: 10px;
	background-color: black;

}

#clock.day {
	border-color: orange black black;
	border-width: 3px 1px 1px ;
}

#clock.night {
	border-color: black black orange;
	border-width: 1px 1px 3px ;
}

#clock img {
	-webkit-transition: -webkit-transform 1s linear 0s;
	-webkit-transform-origin: 32px 32px;
	-webkit-transform: scale(0.01, 0.01);
	position: relative;
	left: 118px;
	top: 118px;
}

Add CSS for seconds indicator

Add CSS for seconds indicator


body {
  margin: 0;
  padding: 0;
  font-family: sans-serif;
}

@import './variables.css';

body {
  margin: 0;
  padding: 0;
  font-family: sans-serif;
  color: white;
  background-color: #131313;
}

a {
  color: white;
  text-decoration: none;
}

Change background color to black

Change background color to black


/**
 * CSS for jQuery Plugin Fast Facts
 */

body {
	font-size: 22px;
}

.subtitle {
	font-size: 50%;
	vertical-align: middle;
}

.fast-facts-problem {
	border-bottom: 1px solid #000;
	font-size: 110%;
	margin: 0 auto 70px;
	max-width: 40px;
	text-align: right;
}

.fast-facts-operator {
	float: left;
}

#name {
	border-bottom: 2px solid black;
	width: 200px;
	padding-top: 25px;
	text-indent: -90px;
}

/**
 * CSS for jQuery Plugin Fast Facts
 */

.subtitle {
	font-size: 50%;
	vertical-align: middle;
}

.fast-facts-problem {
	border-bottom: 1px solid #000;
	font-size: 110%;
	margin: 0 auto 40px;
	max-width: 40px;
	text-align: right;
}

.fast-facts-operator {
	float: left;
}

#name {
	border-bottom: 2px solid black;
	width: 200px;
	padding-top: 25px;
	text-indent: -50px;
}

Revert "Increase font size to correct printing issue"

This reverts commit 02aac9b6ddd120776377d2230195d29fc7e96c79.


Adjust System theme for Linux

[Themes] Adjust System theme for Linux


.modal-open {
	/* needed for iOS to not zoom in when modals are opened */
	overflow-y: auto;
}
input[type=text] {
	width: 100%;
}
textarea {
	width: 100%;
}
#encodedInput {
	font-family: monospace;
}
pre {
	white-space: all;
	word-break: normal;
}
.fixed {
	position: fixed;
	width: 100%;
	width: calc(100% - 30px);
	background-color: white;
}
.spacer {
	background-color: white;
}
#codepage td {
	text-align: center;
}
#codepage th {
	text-align: center;
}
.modal-xl {
	width: 700px;
}
.table {
	margin-bottom: 0px !important; /* override bootstrap */
}
#advanced-search-div {
    width: 70%;
    border: 1px solid black;
    margin: 10px auto;
    padding: 10px;
}
#advanced-search-div td {
	padding: 2px;
}
/* Fix bug in Bootstrap, see https://stackoverflow.com/a/47924156 */
body:not(.modal-open){
  padding-right: 0px !important;
}

.modal-open {
	/* needed for iOS to not zoom in when modals are opened */
	overflow-y: auto;
}
input[type=text] {
	width: 100%;
}
textarea {
	width: 100%;
	height: 100px;
}
#encodedInput {
	font-family: monospace;
}
pre {
	white-space: all;
	word-break: normal;
}
.fixed {
	position: fixed;
	width: 100%;
	width: calc(100% - 30px);
	background-color: white;
}
.spacer {
	background-color: white;
}
#codepage td {
	text-align: center;
}
#codepage th {
	text-align: center;
}
.modal-xl {
	width: 700px;
}
.table {
	margin-bottom: 0px !important; /* override bootstrap */
}
#advanced-search-div {
    width: 70%;
    border: 1px solid black;
    margin: 10px auto;
    padding: 10px;
}
#advanced-search-div td {
	padding: 2px;
}
/* Fix bug in Bootstrap, see https://stackoverflow.com/a/47924156 */
body:not(.modal-open){
  padding-right: 0px !important;
}

Increase textarea height to 100px

Increase textarea height to 100px


:root {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, sans-serif;
  background-image: url('streamers-bg.svg'), linear-gradient(#306CBF, #5D1D6E);
  background-repeat: repeat, no-repeat;
  height: 100vh;
  overflow: hidden;
}

:root {
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, sans-serif;
  background-image: url('streamers-bg.svg'), linear-gradient(#306CBF, #5D1D6E);
  background-repeat: repeat, no-repeat;
  height: 100vh;
}

:root, body {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
  margin: 0;
  padding: 0;
  position: relative;
}

Fix balloons messin the viewport

Fix balloons messin the viewport


/*
Copyright 2015, 2016 OpenMarket Ltd

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/

.mx_RoomPreviewBar {
    text-align: center;
}

.mx_RoomPreviewBar_preview_text {
    color: #a4a4a4;
}

.mx_RoomPreviewBar_join_text {
    color: #ff0064;
}

.mx_RoomPreviewBar_join_text a {
    text-decoration: underline;
    cursor: pointer;
}

Add css for room preview bar.

Add css for room preview bar.


body, html {
  font-family: sans-serif;
  font-size: 18px;
}

body {
 font-size: 18px;
}
h1,h2,h3,h4,h5,h6,p {
 line-height: 1.45;
}
h1 { font-size: 4em; }
h2 { font-size: 3em; }

Raise font size and line-heights

Raise font size and line-heights


.navbar
{
    background-color: #495F72;
    overflow: hidden;
}

.navbar .icon {
  display: none;
}

.navbar a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: x-large;
  font-weight:bold;

}

@media screen and (max-width: 1024px) {
  .navbar a:not(:first-child) {display: none;}
  .navbar a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 1024px) {
  .navbar.responsive {position: relative;}
  .navbar.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .navbar.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

.navbar
{
    background-color: #495F72;
    overflow: hidden;
}

.navbar .icon {
  display: none;
}

.navbar a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: x-large;
  font-weight:bold;
  border-radius:0px;
}

@media screen and (max-width: 1024px) {
  .navbar a:not(:first-child) {display: none;}
  .navbar a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 1024px) {
  .navbar.responsive {position: relative;}
  .navbar.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .navbar.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}

Set navbar border-radius to 0px

Set navbar border-radius to 0px


html,body{
  height: 100%;
  width: 100%;
  margin: 0;
}
#cover{
  height: 100%;
  width: 100%;
  overflow: hidden;
  text-align: center;
  position: relative;
  background-size: cover;
  background-attachment: fixed;
}

Cover take 100% of landing view

Cover take 100% of landing view


.home {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    background: url("images/Family-2.png");
    background-size: 100%;
    background-repeat: no-repeat;
}

.main {
    display: flex;
    flex: 1;
}

.home {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    background: url("images/Family-2.png");
    background-size: 100%;
    background-repeat: no-repeat;

    overflow: hidden;
}

.main {
    display: flex;
    flex: 1;
}

Add overflow: hidden to prevent scrolling to right on mobile


.command-panel {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: #515151;
  padding: 3px;
}

.command-panel .preview-list {
  max-height: 300px;
  overflow: auto;
  margin-bottom: 3px;
  position: relative;
}

.command-panel .preview-list .path {
  padding-left: 3px;
  color: #00ffff;
}

.command-panel .preview-list .preview {
  padding-left: 1em;
  color: #f6f3e8;
}

.command-panel .preview-list .preview .match {
  background-color: #8E8A8A;
  padding: 1px;
}

.command-panel .preview-list li.selected {
  background-color: green;
}

.command-panel .prompt-and-editor {
  display: -webkit-box;
}

.command-panel .prompt {
  color: white;
  font-weight: bold;
  padding: .2em;
}

.command-panel {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: #515151;
  padding: 3px;
}

.command-panel .preview-list {
  max-height: 300px;
  overflow: auto;
  margin-bottom: 3px;
  position: relative;
  background: #161616;
}

.command-panel .preview-list .path {
  padding-left: 3px;
  color: #f9ee98;
  margin-right: 1ex;
}

.command-panel .preview-list .preview {
  color: #f6f3e8;
}

.command-panel .preview-list .preview .match {
  background-color: rgba(255,255,255,.25);
  padding: 1px;
}

.command-panel .preview-list li.selected {
  background: #444;
}

.command-panel .preview-list:focus li.selected {
  background: #223555;
}

.command-panel .prompt-and-editor {
  display: -webkit-box;
}

.command-panel .prompt {
  color: white;
  font-weight: bold;
  padding: .2em;
}

Apply some more styling, for better or worse :-)


body {
	font-family:verdana, Helvetica;
	font-size:11px;
    width: 500px;
    margin-left:auto;
    margin-right:auto;
    text-align: justify;
}

a { color:black; }
a:visited { color:black; }

h1 { font-size: 55px; font-weight:normal; margin-top:0;  padding:0; display:inline;
     letter-spacing: 1px; }
h2 { font-size: 30px; font-weight:normal; margin:0; margin-top:16px; margin-bottom:2px; }
h3 { font-size: 16px; font-weight:normal; }
h4 { font-size: 13px; font-weight:normal; }

p { line-height:15px; }

hr { color: #aaa; background-color:#aaa; height:1px; border:0; }

.footer { width:100px; margin-left: auto; margin-right: auto; }

.byline { margin-left: 208px; margin-top:-14px; letter-spacing: 1px; }
.strapline { margin-top:-11px; letter-spacing: 1px; }

ol { padding-left: 16px; }
li { padding: 5px 0 5px 0; }

body {
	font-family:verdana, Helvetica;
	font-size:11px;
    width: 500px;
    margin-left:auto;
    margin-right:auto;
    text-align: justify;
}

a { color:black; }
a:visited { color:black; }

h1 { font-size: 55px; font-weight:normal; margin-top:0;  padding:0; display:inline;
     letter-spacing: 1px; }
h2 { font-size: 26px; font-weight:normal; margin:0; margin-top:16px; margin-bottom:2px; }
h3 { font-size: 16px; font-weight:normal; }
h4 { font-size: 13px; font-weight:normal; }

p { line-height:15px; }

hr { color: #aaa; background-color:#aaa; height:1px; border:0; }

.footer { width:100px; margin-left: auto; margin-right: auto; }

.byline { margin-left: 208px; margin-top:-14px; letter-spacing: 1px; }
.strapline { margin-top:-11px; letter-spacing: 1px; }

ol { padding-left: 16px; }
li { padding: 5px 0 5px 0; }

Make docs titles a bit smaller.

Make docs titles a bit smaller.


body {
    font-family: "Roboto", sans-serif;
    background-color: #3a4145;
    color: white;
}

#streamCtrl {
    z-index: 1;
    padding: 20px;
    position: fixed;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
}

.twitter-timeline {
    max-width: 400px !important;
}

.main-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#versionInfo {
    font-size: x-small;
}

#volumeBar, #visualizer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

#visualizer {
    width: 100%;
    z-index: -1;
    max-height: 25vh;
}

body {
    font-family: "Roboto", sans-serif;
    background-color: #3a4145;
    color: white;
}

#streamCtrl {
    z-index: 1;
    padding: 20px;
    position: fixed;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
}

.twitter-timeline {
    max-width: 400px !important;
}

.main-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#versionInfo {
    font-size: x-small;
}

#volumeBar, #visualizer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

#visualizer {
    width: 100%;
    z-index: -1;
}

Revert "limited visualizer height to 25% of viewport height"

This reverts commit 9ef4511595a7c252a4aeee3069ad252610591352.


body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

h2 {
    font-size: 1.5rem;
    font-weight: bold;
}

p {
    font-size: 1rem;
    line-height: 1.5em;
}

input {
    width: 8rem;
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

h2 {
    font-size: 1.5rem;
    font-weight: bold;
}

p {
    font-size: 1rem;
    line-height: 1.5em;
}

input[type="text"] {
    width: 8rem;
}

Fix input css to apply only to text fields


#graph-display {
	text-align: center;
	width: 100%;
}

#title {
	font-family: Georgia, serif;
	font-size: 30pt;
	text-align: center;
	margin-top: 45px;
	margin-bottom: 50px;
}

#canvas-container {
	width: 100%;
	text-align: center;
}

#canvas {
	display: inline;
}

Add basic fonts and centering css

Add basic fonts and centering css


.ui-intertag-subinput {
    width: 5px;
    border: 1px #FFF;
    border-radius:6px;
    outline: none;
    margin: 0px;
    padding: 0px;
    padding-top: 7px;
    padding-bottom: 11px;
    padding-left: 4px;
    float: left;
}
.ui-tag {
    padding: 4px;
    padding-right: 20px;
    margin-left: 4px;
    background: #eeeeee;
    border: 1px solid #333333;
    color: #333333;
    margin-top: 2px;
    margin-bottom: 2px;
    float: left;
    cursor: default;
    position: relative;
}
.ui-tag .ui-label {
    display: inline-block;
    vertical-align: top;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.ui-intertag-tags {
    float: left;
}
.ui-tag .ui-icon-close {
    display: block;
    position: absolute;
    top: 4px;
    right: 4px;
    height: 11px;
    background-position: -80px -130px;
    cursor: pointer;
}
.ui-intertag {
    width: 300px;
    border: 1px solid blue;
    display: block;
    padding: 0px;
    margin: 0px;
    overflow: hidden;
    position: relative;
}

.ui-intertag-subinput {
    width: 5px;
    border: 1px #FFF;
    border-radius:6px;
    outline: none;
    margin: 0px;
    padding: 0px;
    padding-top: 9px;
    padding-bottom: 10px;
    padding-left: 4px;
    float: left;
}
.ui-tag {
    padding: 4px;
    padding-right: 20px;
    margin-left: 4px;
    background: #eeeeee;
    border: 1px solid #333333;
    color: #333333;
    margin-top: 2px;
    margin-bottom: 2px;
    float: left;
    cursor: default;
    position: relative;
}
.ui-tag .ui-label {
    display: inline-block;
    vertical-align: top;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.ui-intertag-tags {
    float: left;
}
.ui-tag .ui-icon-close {
    display: block;
    position: absolute;
    top: 4px;
    right: 4px;
    height: 11px;
    background-position: -80px -130px;
    cursor: pointer;
}
.ui-intertag {
    width: 300px;
    border: 1px solid blue;
    display: block;
    padding: 0px;
    margin: 0px;
    overflow: hidden;
    position: relative;
}

Tweak spacing on the search box.

Tweak spacing on the search box.


div.export-formats div {
  float: left;
  margin: 8px;
  padding: 8px;
  cursor: pointer;
}

div.export-formats img {
  height: 150px;
  width: 200px;
}

div.export-formats div.selected {
  background-color: [[BUTTON_BG]];
  color: [[BUTTON_TEXT]];
}

div.export-formats div {
  float: left;
  margin: 8px;
  padding: 8px;
  cursor: pointer;
}

div.export-formats img {
  height: 150px;
  width: 200px;
  border: 1px solid [[PANEL_BORDER]];
}

div.export-formats div {
}

div.export-formats div.selected {
  background-color: [[BUTTON_BG]];
  color: [[BUTTON_TEXT]];
}

Add a border to preview images so that it's obvious they're deliberately truncated


/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2016, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/
.jp-Notebook-panel {
  display: flex;
  flex-direction: column;
}

.p-Widget.jp-NBToolbar {
  flex: 0 0 auto;
}

.p-Widget.jp-Notebook-container {
  flex: 1 1 auto;
}

.jp-InputArea {
  display: flex;
  flex-direction: row;
}

.jp-InputArea-prompt {
  flex-grow: 0;
  flex-shrink: 0;
}

.jp-InputArea-editor {
  flex-grow: 1;
  flex-shrink: 1;
}

.jp-Console-panel {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.p-Widget.jp-Console {
  overflow: auto;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2016, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/
.jp-Notebook-panel {
  display: flex;
  flex-direction: column;
}

.p-Widget.jp-NBToolbar {
  flex: 0 0 auto;
}

.p-Widget.jp-Notebook-container {
  flex: 1 1 auto;
}

.jp-InputArea {
  display: flex;
  flex-direction: row;
}

.jp-InputArea-prompt {
  flex-grow: 0;
  flex-shrink: 0;
}

.jp-InputArea-editor {
  flex-grow: 1;
  flex-shrink: 1;
}

.jp-MarkdownCell-renderer.p-Widget {
  user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
}

.jp-OutputArea-result.p-Widget {
  user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
}

.jp-Console-panel {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.p-Widget.jp-Console {
  overflow: auto;
}

Make outputs and markdown user selectable


.main {
  padding: 40px 15px;
}

.row {
  margin-bottom: 15px;
}

.navbar-default {
  background-color: white;
}

.navbar-brand {
  height: 80px;
  padding: 8px 8px;
}

@media (min-width: 768px) {
  .navbar-nav li a {
    height: 80px;
    padding-top: 30px;
  }
}

.navbar-brand img {
  margin-right: 5px;
}

#navbar {
  font-size: 18px;
  font-family: "Courier New", monospace;
  font-weight: bold;
}

.navbar-default .navbar-nav>li>a {
  color: #339933;
  background-color: white;

}

.navbar-default .navbar-nav>.active>a {
  color: #236b23;
  background-color: white;
}

.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
  color: #5bad5b;
  background-color: white;
}

/* remove dotted lines around links in Firefox/Iceweasel */
a:active {
  outline: none;
}

Fix dotted lines around links in some browsers


.reveal blockquote {
  width: 85%;
}
.deemphasized-title {
  color: rgba(220, 163, 163, 0.8);
  font-size: 0.75em;
}
.reveal a {
  color: orange;
}
.highlight {
  color: lightblue;
}
cite {
  color: lightgrey;
}

.reveal blockquote {
  width: 85%;
}
.deemphasized-title {
  color: rgba(220, 163, 163, 0.8);
  font-size: 0.75em;
}
.reveal a {
  color: orange;
}
.highlight {
  color: lightblue;
}
cite {
  color: rgba(190, 228, 253, 0.67)
}

Use different color for citations

Use different color for citations


body {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
}

body {
    margin: 0;
    padding: 0;
    padding-top: 5%;
    font-family: sans-serif;
}

Add top padding to body

Add top padding to body


fieldset {
	padding: 0px;
}
fieldset legend {
	cursor: pointer; cursor: hand;
}
fieldset legend:hover {
	background: #eee;
}

#addattributesb {
	margin-right: .2em;
}
table.attributes {
	width: 100%;
	margin: 0px;
	border: 0px;
	border-collapse: collapse;
}

table.attributes td.attrname {
	text-align: right;
}
table.attributes tr.even td {
	background: #eee;
}

table.attributes tr td {
	border-bottom: 1px solid #bbb;
	border-left: 0px;
	border-right: 0px;

	padding-top: 5px;
	padding-left: 1em;
	padding-right: 1em;

	vertical-align: top;
}
table#table_with_attributes tr:last-child td {
	border-bottom: none;
}
td.attrvalue img {
	border: 1px solid #777;
	margin: 4px;
}

table#table_with_attributes td.attrname {
	color: #555;
	font-weight: light;
	font-size: 90%;
}
table#table_with_attributes ul {
	margin: 0px;
}

Make attribute names look a bit different form the values


body {
	overflow: hidden;
}
.message {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 170px;
	font-weight: bold;
	text-align: center;
	font-family: georgia;
	padding-top: 40px;
}
.message.unread {
	background-color: red;
	color: white
}
.message.read {
	background-color: green;
	color: #42AC42;
}

.input-container {
	background-color: white;
	position: absolute;
	z-index: 1;
	bottom: 0;
	left: 0;
	height: 50px;
	width: 100%;
}
#text {
	position: absolute;
	left: 0;
	font-size: 34px;
	width: 100%;
}
.input-container button {
	font-size: 34px;
	position: absolute;
	right: 0;
}

body {
	overflow: hidden;
}
.message {
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 170px;
	font-weight: bold;
	text-align: center;
	font-family: georgia;
	padding-top: 40px;
}
.message.unread {
	background-color: red;
	color: white
}
.message.read {
	background-color: green;
	color: #42AC42;
}

.input-container {
	background-color: white;
	position: absolute;
	z-index: 1;
	bottom: 0;
	left: 0;
	height: 50px;
	width: 100%;
}
#text {
	position: absolute;
	left: 0;
	font-size: 34px;
	width: 100%;
}
.input-container button {
	font-size: 34px;
	position: absolute;
	right: 0;
}

Allow messages to be marked as read on mobile


* {
	box-sizing: border-box;
}
body {
	background-color: #9FC5E8;
	font-family: helvetica;
}
.column-1 {
width: 50%;
float:left;
padding: 10px;

}
.column-2 {
width: 50%;
float: left;
padding: 20px;

}

a:visited {
	color: red;
}

a:link {
	color: #0B5394;
}

header {
	background-color: #608FBA;
}

footer {
	clear: both;
	padding-top: 20px;

}

Add style to GPS 2.1

Add style to GPS 2.1


html {
  background-color: red;
  color:#000080;
}

html {
  background-color: #ffffff;
  color:#000080;
}

a {
  color: #800080;
}

a:visited {
  color:#ff0000;
}

Change the following colors 1

Change the following colors 1


.zci--riffsy .tile__img--loader {
    display: block;
    width: 64px;
    height: 40px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 100;

    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -moz-animation: loader-animate 0.5s steps(16) infinite;
    -webkit-animation: loader-animate 0.5s steps(16) infinite;
    animation: loader-animate 0.5s steps(16) infinite;
}

@-moz-keyframes loader-animate {
    0%, from {
        background-position: 1024px;
    }
    100%, to {
        background-position: 0px;
    }
}
@-webkit-keyframes loader-animate {
    0%, from {
        background-position: 1024px;
    }
    100%, to {
        background-position: 0px;
    }
}
@keyframes loader-animate {
    0%, from {
        background-position: 1024px;
    }
    100%, to {
        background-position: 0px;
    }
}

.zci--riffsy .tile__img--loader {
    display: block;
    width: 64px;
    height: 40px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 100;
    background-color: rgba(0,0,0,0.5);
    border-radius: 3px;

    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -moz-animation: loader-animate 0.5s steps(16) infinite;
    -webkit-animation: loader-animate 0.5s steps(16) infinite;
    animation: loader-animate 0.5s steps(16) infinite;
}

@-moz-keyframes loader-animate {
    0%, from {
        background-position: 1024px;
    }
    100%, to {
        background-position: 0px;
    }
}
@-webkit-keyframes loader-animate {
    0%, from {
        background-position: 1024px;
    }
    100%, to {
        background-position: 0px;
    }
}
@keyframes loader-animate {
    0%, from {
        background-position: 1024px;
    }
    100%, to {
        background-position: 0px;
    }
}

Add background to loader, move to top-right corner