body {
    margin: 0;
    background: none transparent;
}
#container {
    position: absolute;
    top: 0;
    left: 0;
    width: 1920px;
    height: 1080px;
    overflow: hidden;

    background-image: url("../images/in-game/in-game.png");
}

/** SCORE **/
#blue-score, #red-score {
    position: absolute;
    margin-top: 74px;
    width: 293px;

    font-family: spiegelcdotregular, sans-serif;
    color: #F8FCFD;
    font-size: 36px;
    text-align: center;
}
#blue-score { margin-left: 579px; }
#red-score { margin-left: 1047px; }

body {
    margin: 0;
    background: none transparent;
}
#container {
    position: absolute;
    top: 0;
    left: 0;
    width: 1920px;
    height: 1080px;
    overflow: hidden;

    background-image: url("../images/in-game/in-game.png");
}

/** SCORE **/
#score {
    position: absolute;
    margin-top: 64px;
    margin-left: 567px;
    height: 54px;
    width: 785px;

    overflow: hidden;
}
#blue-score, #red-score {
    position: absolute;
    width: 317px;
    height: 54px;

    overflow: hidden;
}
#blue-score-text, #red-score-text {
    margin-top: 10px;

    font-family: spiegelcdotregular, sans-serif;
    color: #F8FCFD;
    font-size: 36px;
    text-align: center;
}
#blue-score {

    background-image: url("../images/in-game/blue-score.png")
}
#red-score {
    margin-left: 468px;

    background-image: url("../images/in-game/red-score.png");
}

/** SCOREBOARD **/
#bottom-center > div {
    position: absolute;

    font-family: spiegelcdotsemibold, sans-serif;
    color: #F8FCFD;
    text-align: center;
}
#bottom-center-left-text-upper {
    margin-top: 836px;
    margin-left: 574px;
    width: 349px;
    height: 32px;

    font-size: 30px;
}
#bottom-center-left-text-lower {
    margin-top: 867px;
    margin-left: 574px;
    width: 349px;
    height: 32px;

    font-size: 30px;
}
#bottom-center-right-text {
    margin-top: 839px;
    margin-left: 1003px;
    width: 349px;
    height: 51px;

    font-size: 50px;
}

Update fonts and position text/images.

Update fonts and position text/images.


/*All custom styles go here*/
.author {
  margin-top: 10%;
}

.author .github-logo {
  height: 30px;
}

.author .github-avatar {
  height: 150px;
}

/*All custom styles go here*/
.author {
  margin-top: 10%;
}

.author .github-logo {
  height: 20px;
}

.author .github-avatar {
  height: 150px;
}

#disqus_thread {
  margin-top: 10%;
}

Add margin-top to disqus element

Add margin-top to disqus element


/** initial setup **/
.nano {
  position : relative;
  width    : 100%;
  height   : 100%;
  overflow : hidden;
}
.nano .content {
  position      : absolute;
  overflow      : scroll;
  overflow-x    : hidden;
  top           : 0;
  right         : 0;
  bottom        : 0;
  left          : 0;
}
.nano .pane {
  background: rgba(0,0,0,.25);
  position : absolute;
  width    : 10px;
  right    : 0;
  top      : 0;
  bottom   : 0;
}
.nano .pane .slider {
  background: rgba(0,0,0,.5);
  position      : relative;
  margin        : 0 1px 0 1px;
  border-radius : 3px;
}
.nano:hover .pane, .pane.active {
  visibility: visible;
}
.nano .pane {
  -webkit-transition : .2s;
  -moz-transition    : .2s;
  -o-transition      : .2s;
  transition         : .2s;
  border-radius      : 5px;
  -moz-border-radius : 5px;
  opacity            : .01;
}
.nano:hover .pane, .pane.active {
  opacity : 1;
}

/** initial setup **/
::-webkit-scrollbar {
    -webkit-appearance: none;
}
.nano {
  position : relative;
  width    : 100%;
  height   : 100%;
  overflow : hidden;
}
.nano .content {
  position      : absolute;
  overflow      : scroll;
  overflow-x    : hidden;
  top           : 0;
  right         : 0;
  bottom        : 0;
  left          : 0;
}
.nano .pane {
  background: rgba(0,0,0,.25);
  position : absolute;
  width    : 10px;
  right    : 0;
  top      : 0;
  bottom   : 0;
}
.nano .pane .slider {
  background: rgba(0,0,0,.5);
  position      : relative;
  margin        : 0 1px 0 1px;
  border-radius : 3px;
}
.nano:hover .pane, .pane.active {
  visibility: visible;
}
.nano .pane {
  -webkit-transition : .2s;
  -moz-transition    : .2s;
  -o-transition      : .2s;
  transition         : .2s;
  border-radius      : 5px;
  -moz-border-radius : 5px;
  opacity            : .01;
}
.nano:hover .pane, .pane.active {
  opacity : 1;
}

Fix webkit double scrollbar issue with OS X lion


.wrapper {
  padding-top: 5rem;
  padding-bottom: 5rem;
  position: relative;
}

.wrapper {
  padding-top: 5rem;
  padding-bottom: 5rem;
  position: relative;
  min-height: 100vh;
  box-sizing: border-box;
}

Fix Background height on Work page

Fix Background height on Work page


#rule-list {
    cursor: pointer;
}

.rule-item {
    padding: 0.2em;
    border-radius: 10px;
}

Improve the way rule items look when they are being hovered over in the Rule Browser.


em, strong, code
{
	/* Override font-style, otherwise the default font-style will be used.
		For example, em will use italic font-style.*/
	font-style: normal;
}

p
{
	line-height: 130%
}

hr
{
	page-break-after: always;
}

h2
{
	text-align: center;
}

em, strong, code
{
	/* Override font-style, otherwise the default font-style will be used.
		For example, em will use italic font-style.*/
	font-style: normal;
}

p
{
	line-height: 130%
}

hr, div
{
	page-break-after: always;
}

h2
{
	text-align: center;
}

Add page break for the table of content in html


@import url("../bootstrap/css/bootstrap.min.css");
@import url("./github.css");

html, body { overflow-x: hidden; }
textarea {
    width: 100%;
    resize: vertical;
}

.gh-generated {
    margin: 20px 0;
    height: 200px !important;
    font-family: monospace;
}

.active { fill: red !important; }
.day { fill: #eeeeee; }
.today {
	fill: darkgray;
}

#loading-text {
	display: none;
	font-weight: bold;
}

.day.disabled {
	opacity: 0;
}

@import url("../bootstrap/css/bootstrap.min.css");
@import url("./github.css");

html, body { overflow-x: hidden; }
textarea {
    width: 100%;
    resize: vertical;
}

.gh-generated {
    margin: 20px 0;
    height: 200px !important;
    font-family: monospace;
}

.active { fill: green !important; }
.day { fill: #eeeeee; }
.today {
	fill: darkgray;
}

#loading-text {
	display: none;
	font-weight: bold;
}

.day.disabled {
	opacity: 0;
}

Use green for active instead of red.

Use green for active instead of red.


/* Menu
----------------------------------*/
.ui-menu {
	list-style:none;
	padding: 2px;
	margin: 0;
	display:block;
}
.ui-menu .ui-menu {
	margin-top: -3px;
}
.ui-menu .ui-menu-item {
	margin:0;
	padding: 0;
	zoom: 1;
	width: 100%;
}
.ui-menu .ui-menu-item a {
	text-decoration:none;
	display:block;
	padding:.2em .4em;
	line-height:1.5;
	zoom:1;
}
.ui-menu .ui-menu-item a {
	font-weight: normal;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
	font-weight: normal;
	margin: -1px;
}

/*
 * jQuery UI Menu @VERSION
 *
 * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 */
.ui-menu {
	list-style:none;
	padding: 2px;
	margin: 0;
	display:block;
}
.ui-menu .ui-menu {
	margin-top: -3px;
}
.ui-menu .ui-menu-item {
	margin:0;
	padding: 0;
	zoom: 1;
	width: 100%;
}
.ui-menu .ui-menu-item a {
	text-decoration:none;
	display:block;
	padding:.2em .4em;
	line-height:1.5;
	zoom:1;
}
.ui-menu .ui-menu-item a {
	font-weight: normal;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
	font-weight: normal;
	margin: -1px;
}

Update license header in theme.

Menu: Update license header in theme.


div.tableview-info {
    padding-top: 8px;
}

div.tableview-pagination {
    float: right;
    margin: 0;
}

.tableview-table {
    margin-top: 2em;
}

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

.tableview-filterbox {
    padding-right: 10px;
}

.tableview-sorting:after {
    content: "";
    float: right;
    margin-top: 7px;
    border-width: 0 4px 4px;
    border-style: solid;
    border-color: black transparent;
    visibility: hidden;
}

.tableview-sorting:hover:after {
    visibility: visible;
}

.tableview-sorting-asc:after {
    visibility: visible;
}

.tableview-sorting-desc:after {
    border-bottom: none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid black;
    visibility: visible;
}

div.tableview-info {
    padding-top: 8px;
}

div.tableview-pagination {
    float: right;
    margin: 0;
}

.tableview-table {
    margin-top: 1em;
}

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

.tableview-filterbox {
    padding-right: 10px;
}

.tableview-sorting:after {
    content: "";
    float: right;
    margin-top: 7px;
    border-width: 0 4px 4px;
    border-style: solid;
    border-color: black transparent;
    visibility: hidden;
}

.tableview-sorting:hover:after {
    visibility: visible;
}

.tableview-sorting-asc:after {
    visibility: visible;
}

.tableview-sorting-desc:after {
    border-bottom: none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid black;
    visibility: visible;
}

Reduce a bit the distance between filters and table


@import url('./fonts/manrope.css');
@import url('./fonts/roboto-mono.css');
@import url('./fonts/open-sans.css');
@import url('./header.css');
@import url('./footer.css');
@import url('./mobile-nav.css');
@import url('./colors.css');
@import url('./codemirror.css');
@import url('./code.css');

html {
  font-size: 18px;
  --header-height: 3.33rem;
  --footer-top-height: 12rem;
  --footer-bottom-height: 6rem;
  --content-max-width: 76rem;
}

@media (max-width: 864px) {
  html {
    --footer-top-height: 20rem;
  }
}

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

main {
  /* Ensures that the footer never floats above the bottom of the viewport on
     short pages. */
  min-height: calc(100vh - var(--header-height) - var(--footer-top-height) -
    var(--footer-bottom-height)
  );
}

a {
  text-decoration: none;
  color: #1879cd;
}

/* Hide something visually in a way that screen readers will read. */
.offscreen {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@import url('./fonts/manrope.css');
@import url('./fonts/roboto-mono.css');
@import url('./fonts/open-sans.css');
@import url('./header.css');
@import url('./footer.css');
@import url('./mobile-nav.css');
@import url('./colors.css');
@import url('./codemirror.css');
@import url('./code.css');

html {
  font-size: 18px;
  --header-height: 3.33rem;
  --footer-top-height: 12rem;
  --footer-bottom-height: 6rem;
  --content-max-width: 76rem;
}

code {
  font-family: "Roboto Mono", monospace;
}

@media (max-width: 864px) {
  html {
    --footer-top-height: 20rem;
  }
}

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

main {
  /* Ensures that the footer never floats above the bottom of the viewport on
     short pages. */
  min-height: calc(100vh - var(--header-height) - var(--footer-top-height) -
    var(--footer-bottom-height)
  );
}

a {
  text-decoration: none;
  color: #1879cd;
}

/* Hide something visually in a way that screen readers will read. */
.offscreen {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

Use Roboto Mono for code

Use Roboto Mono for code


body {
  font-family: 'Slabo 27px', serif;
}

a {
  color: #00B7FF;
}

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

input[type="text"] {
    box-sizing: border-box;
    height: 48px;
}

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

.main-content {
  margin: 15% auto 0 auto;
  max-width: 500px;
}

.btn-toolbar{
  text-align: center;
  display: inline-block;
}

.form-group {
  text-align:center;
}

.drawing {
  outline: 1px solid LightGrey;
  width: 100%;
}

.gamecode {
  font-family: monospace;
  box-shadow: 0 0 10pt 1pt LightGrey;
  padding: 5px;
}

.gamecode-entry {
    font-family: monospace;
}

.user {
  border: 1px solid LightGrey;
  padding: 8px;
}

.user-container {
  padding: 3px;
}

.disconnected {
  background-color: LightGrey;
}

.drawphone-info {
  text-align:left;
  font-size: 125%;
}

.alert {
    text-align: left;
}

body {
  font-family: 'Slabo 27px', serif;
}

a {
  color: #00B7FF;
}

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

input[type="text"] {
    box-sizing: border-box;
    height: 48px;
}

.container {
  position: relative;
  max-width: 500px;
  margin: 0 auto;
  padding: 28px;
}

.btn-toolbar{
  text-align: center;
  display: inline-block;
}

.form-group {
  text-align:center;
}

.drawing {
  outline: 1px solid LightGrey;
  width: 100%;
}

.gamecode {
  font-family: monospace;
  box-shadow: 0 0 10pt 1pt LightGrey;
  padding: 5px;
}

.gamecode-entry {
    font-family: monospace;
}

.user {
  border: 1px solid LightGrey;
  padding: 8px;
}

.user-container {
  padding: 3px;
}

.disconnected {
  background-color: LightGrey;
}

.drawphone-info {
  text-align:left;
  font-size: 125%;
}

.alert {
    text-align: left;
}

Fix vertical centering on large displays


div.tcenter.embedvideo, div.embedvideo.ev_center {
	margin-left: auto;
	margin-right: auto;
}

div.embedvideo.ev_right {
	clear: right;
	float: right;
}

div.tcenter.embedvideo, div.embedvideo.ev_center {
	margin-left: auto;
	margin-right: auto;
}

div.embedvideo.ev_left {
	clear: left;
	float: left;
}

div.embedvideo.ev_right {
	clear: right;
	float: right;
}

Add missing left alignment CSS.

Add missing left alignment CSS.


@import "results-template.css";
@import "results-color.css";
@import "results-font.css";
@import "results-animation.css";

/*
CSS for Datafari widgets
*/
@import "widgets/ontology-suggestion-widget.css";
@import "widgets/tab-widget.css";

/*
CSS for Datafari modules
*/
@import "modules/query-elevator-module.css";

body { overflow-y: scroll; }

.title {
 display: block;
}

Fix for title not aligned on several lines


.result-img {
    height: 200px;
}
#footer {
    padding-top: 50px;
}

.result-img {
    height: 200px;
    min-width:200px;
    background-color: #CCC;
}
#footer {
    padding-top: 50px;
}

Add grey background before loading image


* { margin: 0; padding: 0; font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif; font-size: 100%; font-weight: normal; }
body { margin: 10px; background-color: #ffffff; color: #000000; letter-spacing: 0.08em; line-height: 1.4em; font-size: 90%; }

p { margin-bottom: 15px; }
a { color: #48ba32; }
h1 { font-size: 160%; }
h2 { margin: 15px 0; font-size: 150%; }
h2.breaker { padding-bottom: 15px; border-bottom: 1px dotted #a0a0a0; }
h3 { margin: 5px 0; font-size: 120%; }

pre { padding: 4px; border: 1px solid #808080; margin-bottom: 15px; }
pre, code { font-family: Monaco, "Courier New", sans-serif; background-color: #000000; color: #00ff00; font-size: 90%; }

ul { margin: 15px 30px; }
li { margin: 5px 0; }
* html ul { padding-left: 30px; }

Fix lists in TinyMCE editor

Fix lists in TinyMCE editor


.social-container {
  display: flex;
}
.social-container .social {
  width: 50px;
  height: 50px;
}
.social-container .social:last-child {
margin-right: 0 !important;
}
.social-container .social a {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.social-container .social a i.fa {
  color: #fff;
}
.social-container .social.facebook {
  background-color: #4460a1;
}
.social-container .social.twitter {
  background-color: #01aaed;
}
.social-container .social.google-plus {
  background-color: #f9402e;
}
.social-container .social.instagram {
  background-color: #275a85;
}
.social-container .social.linkedin {
  background-color: #007ebb;
}
.social-container .social.youtube {
  background-color: #cf1312;
}
.social-container .social.github {
  background-color: #000000;
}
.social-container .social.rss {
  background-color: #ff9a00;
}
.social-container .social.facebook:hover {
  background-color: #3f5995;
}
.social-container .social.twitter:hover {
  background-color: #019edc;
}
.social-container .social.google-plus:hover {
  background-color: #dd1906;
}
.social-container .social.instagram:hover {
  background-color: #235178;
}
.social-container .social.linkedin:hover {
  background-color: #0073aa;
}
.social-container .social.youtube:hover {
  background-color: #bf1211;
}
.social-container .social.github:hover {
  background-color: #000000;
}
.social-container .social.rss:hover {
  background-color: #ee9000;
}

Add social icons styling css file

Add social icons styling css file


body, html {
    background-image: url(images/arch-linux-minimalistic-rainbow.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    overflow: hidden;
    margin: 0;
}

body {
    height: 100%;
    overflow: scroll;
    padding-bottom: 20px;
}

a:link {
    color: white;
}

a:visited {
    color: lightgrey;
}

.element {
    text-decoration: none;
    color: black;
    background-color: lightgrey;
    padding: 10px
}

.element:hover {
    background-color: grey;
}

.active {
    background-color: grey;
}

img {
    text-align: center;
}

.img-container {
    text-align: center;
}

.icon-container {
    text-align: center;
}

.icon-container a {
    text-decoration: none;
}

.icon-container img:hover {
    opacity: 0.5;
}

.navbar {
    padding: 18px;
}

.navbar a:link {
    color: black
}

.navbar a:visited {
    color: black
}

.content {
    padding: 10px 18px;
    color: white;
}

table, th, td {
    border: 1px solid white;
    text-align: center;
}

body, html {
    background-image: url(images/arch-linux-minimalistic-rainbow.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    overflow: hidden;
    margin: 0;
}

body {
    height: 100%;
    overflow: scroll;
    padding-bottom: 20px; /* Remove small white bar */
}

a:link {
    color: white;
}

a:visited {
    color: lightgrey;
}

.element {
    text-decoration: none;
    color: black;
    background-color: lightgrey;
    padding: 10px
}

.element:hover {
    background-color: grey;
}

.active {
    background-color: grey;
}

img {
    text-align: center;
}

.img-container {
    text-align: center;
}

.icon-container {
    text-align: center;
}

.icon-container a {
    text-decoration: none;
}

.icon-container img:hover {
    opacity: 0.5;
}

.navbar {
    padding: 18px;
}

.navbar a:link {
    color: black
}

.navbar a:visited {
    color: black
}

.content {
    padding: 10px 18px;
    color: white;
}

table, th, td {
    border: 1px solid white;
    text-align: center;
}

Add comment to body padding-bottom

Add comment to body padding-bottom

Signed-off-by: Kien Ha <3e36ebd6a7c89ee7d9a20a5fbbffc571f107e566@gmail.com>


.loan-details a {
  margin-left: 20px !important;
  float: left;
}

.ignore-btn {
  color: #772d72;
  padding: 0px 2px 0px 2px;
  float: right;
}

.loan-details a {
  margin-left: 0px !important;
  float: left;
}

.ignore-btn {
  color: #772d72;
  padding: 0px 2px 0px 2px;
  float: right;
}

.loan-parts .company-info {
  min-width: 2.6em  !important;
}

fix: Set relative min width for loan ID number

Most loans now have an ID number of 5 digits, so set a min
width to match the 5 digits, even if there are less than 5
digits. It is set in em units, so it will scale with font size.

Resolves: #3


@import "fonts.css";
@import "colors.css";
@import "actions.css";
@import "navbar.css";
@import "calendar.css";
@import "form.css";
@import "button.css";
@import "box.css";
@import "legend.css";
@import "table.css";
@import "states.css";
@import "print.css";
@import "error.css";

/**************************************************************************

  COMMON STYLING

**************************************************************************/

body {
    font-family: Verdana,sans-serif;
    font-size: 12px;
    margin: 0;
    color: #444444;
}

.content {
    /* = height of navbar (50px) plus margin-bottom of row (27px) */
    margin-top: 77px;
}

.modal-dialog {
  margin-top: 77px;
}

hr {
    border-color: #D5D5D5;
}

footer {
    color: #aaa;
    font-size: 11px;
    text-align: center;
}

a {
    color: #2A6496;
}

a:hover,
a:focus {
    color: #1896db;
}

.is-centered {
    text-align: center;
}

.is-inline-block {
    display: inline-block;
}

.is-sticky {
    margin:  0;
}

@import "fonts.css";
@import "colors.css";
@import "actions.css";
@import "navbar.css";
@import "calendar.css";
@import "form.css";
@import "button.css";
@import "box.css";
@import "legend.css";
@import "table.css";
@import "states.css";
@import "print.css";
@import "error.css";

/**************************************************************************

  COMMON STYLING

**************************************************************************/

body {
    font-family: Verdana,sans-serif;
    font-size: 12px;
    margin: 0;
    color: #444444;
}

.content {
    /* = height of navbar (50px) plus margin-bottom of row (27px) */
    margin-top: 77px;
}

.modal-dialog {
    margin-top: 77px;
    z-index: 2000;
}

hr {
    border-color: #D5D5D5;
}

footer {
    color: #aaa;
    font-size: 11px;
    text-align: center;
}

a {
    color: #2A6496;
}

a:hover,
a:focus {
    color: #1896db;
}

.is-centered {
    text-align: center;
}

.is-inline-block {
    display: inline-block;
}

.is-sticky {
    margin:  0;
}

Fix hidden modal dialog due to too little z-index

* refs #81


#project1, #project2 {
  display: none;
}

.wrap {
    margin: auto;
    width: 50%;
    border: 3px;
    padding: 10px;
}

#project1, #project2 {
  display: none;
}

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

Add color to border css

Add color to border css


.multivaluefieldlist > li { margin-bottom: 4px; width: 250px; }
.multivaluefieldlist > li::after { content: '↕'; cursor: pointer; }
.multivaluefieldlist > li:last-child { margin-bottom: 0; }
.mventryfield { max-width: 200px !important; display: inline; }

.multivaluefieldlist > li { margin-bottom: 4px; min-width: 250px; }
.multivaluefieldlist > li::after { content: '↕'; cursor: pointer; }
.multivaluefieldlist > li:last-child { margin-bottom: 0; }
.mventryfield { max-width: 200px !important; display: inline; }

FIX Adjust width to being 'min' width instead of fixed


.btn {
    font-size: 1.2rem;
    padding: 0.3em 0.5em;
    min-width: 3em;
    background: hsl(0, 0%, 39%);
    color: hsl(0, 0%, 100%);
    box-shadow: 0 1px 1px 0 hsl(0, 0%, 0%);
    border: 0;
    border-radius: 4px;
    cursor: pointer;

    &:hover {
        background: hsl(0, 0%, 31%);
    }
}

.btn--green {
    background: hsl(106, 92%, 41%);

    &:hover {
        background: hsl(106, 92%, 36%);
    }
}

.btn--red {
    background: hsl(357, 100%, 47%);

    &:hover {
        background: hsl(357, 100%, 41%);
    }
}

.btn {
    font-size: 1.2rem;
    padding: 0.3em 0.5em;
    min-width: 3em;
    background: hsl(0, 0%, 45%);
    color: hsl(0, 0%, 100%);
    box-shadow: 0 1px 1px 0 hsl(0, 0%, 0%);
    border: 0;
    border-radius: 4px;
    cursor: pointer;
    transition-property: transform, box-shadow;
    transition-duration: .1s;
    transition-timing-function: ease-out;

    &:hover {
        background: hsl(0, 0%, 40%);
    }

    &:active {
        transform: translateY(1px);
        box-shadow: none;
    }
}

.btn--green {
    background: hsl(106, 92%, 41%);

    &:hover {
        background: hsl(106, 92%, 36%);
    }
}

.btn--red {
    background: hsl(357, 100%, 47%);

    &:hover {
        background: hsl(357, 100%, 41%);
    }
}

Add animation to button press

Add animation to button press


.scrivener-frame-preview-overlay {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	cursor: not-allowed;
	background-color: #fff;
}
.scrivener-focused-element {
	z-index: 9001;
	cursor: text;
}
.scrivener-focused-element:hover {
	outline: rgba(240, 240, 240, 0.5) solid 5px;
}
.scrivener-focused-element:focus {
	outline: transparent solid 5px;
}

.scrivener-frame-preview-overlay {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	opacity: .8;
	width: 100%;
	z-index: 1;
	cursor: not-allowed;
	background-color: #fff;
}
.scrivener-focused-element {
	z-index: 9001;
	cursor: text;
}
.scrivener-focused-element:hover {
	outline: rgba(240, 240, 240, 0.5) solid 5px;
}
.scrivener-focused-element:focus {
	outline: transparent solid 5px;
}

Change opacity of frame overlay to .8

Change opacity of frame overlay to .8


}

 body {

   font-family: Helvetica;
   color: white;
 }
 nav ul li
   margin: 0;
   paddin: 0;
   overflow: hidden;
   display: inline;
   color: white;
   float; right;
 }
a h1 p {
  color:black;
 }

h3 {
  color:black;
  font-size: 200%;

 /* Change the link color to black on hover */
  a:hover {
     background-color: black;

  .active {
      background-color: grey;
      color:black;
  }

 body {

   font-family: Helvetica;
   color: white;
 }

 nav ul li {
   margin: 0;
   paddin: 0;
   overflow: hidden;
   display: inline;
   color: white;
   float; right;
 }

a h1 p {
  color:black;
 }

h3 {
  color:black;
  font-size: 200%;
  }

 /* Change the link color to black on hover */
  a:hover {
     background-color: black;
     }

  .active {
      background-color: grey;
      color: black;
  }

Move nav bar to the right

Move nav bar to the right


html {
background-color: white;
color: black;
}

body {
font-family: Helvetica;
color: black;}

header {
background: white;
color: black;
}

nav ul {
display: inline-block
}

nav li {
  text-align: right;
  display: inline-block;
  color: black;
}

a h1 h3 p hr {
color: black;
}

html {
background-color: white;
color: black;
}

body {
font-family: Helvetica;
color: black;}

header {
background: white;
color: black;
}

nav ul {
display: inline-block
text-align: right;
}

nav li {
  text-align: right;
  display: inline-block;
  color: black;
}

a h1 h3 p hr {
color: black;
}

Align nav bar text to the right

Align nav bar text to the right


html {
  overflow-y: scroll;
}

#ex1Slider .slider-selection {
  background: #BABABA;
}

.marginupper {
  padding-top: 2.5em;
}

.slider {
  margin: 2.5em;
}

.panel-margin {
  margin-left: 0.5em;
  margin-top: 0.5em;
}

.bar rect {
  fill: steelblue;
}

.bar text.value {
  fill: white;
}

.axis {
  shape-rendering: crispEdges;
}

.axis path {
  fill: none;
}

.x.axis line {
  stroke: #fff;
  stroke-opacity: .8;
}

.y.axis path {
  stroke: black;
}

#d3container {
  margin-top: 2em;
}

Fix scrollbar messing up layout

Fix scrollbar messing up layout


/*
Theme Name:         Satus Framework for WordPress
Theme URI:          http://satusframework.com/
Description:        Satus Framework for WordPress is a minimalist, LESS powered, mobile first responsive theme for developers that uses schema.org rather than microformats and is based off of Satus Framework and Roots Theme. Satus Framework is based off of the HTML5 Boilerplate and 320 and Up.
Version:            1.0
Author:             Kyle Geminden
Author URI:         http://kylegeminden.com/
License:            MIT License
License URI:        http://opensource.org/licenses/MIT
*/

/*
Theme Name:         Satus Framework for WordPress
Theme URI:          http://satusframework.com/
Description:        Satus Framework for WordPress is a minimalist, LESS powered, mobile first responsive theme for developers that uses schema.org rather than microformats and is based off of Satus Framework and Roots Theme. Satus Framework is based off of the HTML5 Boilerplate and 320 and Up.
Version:            1.5.0
Author:             Kyle Geminden
Author URI:         http://kylegeminden.com/
License:            MIT License
License URI:        http://opensource.org/licenses/MIT
*/

Update theme version to 1.5.0.

Update theme version to 1.5.0.


body {
    font-family: sans;
}

a {
    color: blue;
    cursor: pointer;
}

a.disabled {
    color: grey;
    cursor: inherit;
}

.exhausted {
    font-style: italic;
    color: grey;
}

.video {
    display: inline-block;
    width: 320px;
    height: 180px;
    background-image: url("http://placehold.it/320x180/C40022&text=Loading...");
    margin: 0.5em;
    border: 2px solid grey;
    border-radius: 4px;
    overflow: hidden;
}

.video .title {
    margin: 0;
    padding: 6px 0px;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.6);
}

.video .title.swift {
    color: blue;
}

.video .title.zerovm {
    color: #ff3300;
}

.pending {
    background-color: #efefef;
}

.updated {
    font-weight: bold;
}

body {
    font-family: sans;
}

a {
    color: blue;
    cursor: pointer;
}

a.disabled {
    color: grey;
    cursor: inherit;
}

.exhausted {
    font-style: italic;
    color: grey;
}

.video {
    display: inline-block;
    width: 320px;
    height: 180px;
    background-image: url("http://placehold.it/320x180/C40022&text=Loading...");
    margin: 0.5em;
    border: 2px solid grey;
    border-radius: 4px;
    overflow: hidden;
}

.video .title {
    margin: 0;
    padding: 10px 6px;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.6);
}

.video .title.swift {
    color: blue;
}

.video .title.zerovm {
    color: #ff3300;
}

.pending {
    background-color: #efefef;
}

.updated {
    font-weight: bold;
}

Add more air around title text

Add more air around title text


#logo {
  height: 92px;
  width: 272px;

  background-color: white;

  display: block;
  margin: auto;
  padding-top: 109px;
}

Add padding-top and centrally align logo


body {
    padding-top: 54px;
}

.navbar {
    background: #2196F3;
}

.sidebar, .content {
    padding: 1.5rem;
}
    .sidebar {
        border-right: 1px solid #B6B6B6;
        bottom: 0px;
        left: 0px;
        position: fixed;
        top: 54px;
    }

.controls {
    margin-bottom: 1rem;
    text-align: right;
}
    .material-icons {
        font-size: 16px;
        vertical-align: middle;
    }
    .controls .c-select {
        margin: 0 .5rem;
    }
    .controls .form-group {
        margin: 0 .5rem;
    }

.title {
    font-size: 1.5rem;
}

body {
    padding-top: 54px;
}

.navbar {
    background: #2196F3;
}

.sidebar, .content {
    padding: 1.5rem;
}
    .sidebar {
        border-right: 1px solid #B6B6B6;
        bottom: 0px;
        left: 0px;
        position: fixed;
        top: 54px;
    }

.controls {
    margin-bottom: 1rem;
    text-align: right;
}
    .controls .form-group {
        margin-left: 1rem;
    }
    .controls .c-select {
        margin-left: 0.5rem;
    }

.material-icons {
    font-size: 16px;
    vertical-align: middle;
}

.table th, .table td {
    vertical-align: middle;
}

Fix margins for pagination controls; and update the alignment for contents in a table cell (middle)


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

#profiles-list,
#profiler-report {
  background: hsl(208,11%,27%);
}

#profiles-list {
  min-width: 196px;
}

#graph {
  overflow: hidden;
  padding: 4px;
  background: rgba(17, 19, 21, 1);
}

#gc,
#cc {
  min-width: 40px;
}

.color-legend::before {
  content: "";
  display: inline-block;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  margin-left: 5px;
  border-width: 1px;
  border-style: solid;
}

#gc::before {
  background-image: linear-gradient(#444444, rgb(70, 175, 227));
  border-color: rgb(70, 175, 227);
}

#cc::before {
  background-image: linear-gradient(#444444, rgb(185, 135, 188));
  border-color: rgb(185, 135, 188);
}

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

#profiles-list,
#profiler-report {
  background: hsl(208,11%,27%);
}

#profiles-list {
  min-width: 196px;
}

#graph {
  overflow: hidden;
  padding: 4px;
  background: rgba(17, 19, 21, 1);
}

#gc,
#cc {
  min-width: 40px;
}

.color-legend::before {
  content: "";
  display: inline-block;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  margin-left: 5px;
  border-width: 1px;
  border-style: solid;
}

#gc::before {
  background-image: linear-gradient(rgb(90, 195, 247), rgb(50, 155, 207));
  border-color: rgb(70, 175, 227);
}

#cc::before {
  background-image: linear-gradient(rgb(205, 155, 208), rgb(165, 115, 168));
  border-color: rgb(185, 135, 188);
}

Fix the gradient of the swatches.

Fix the gradient of the swatches.


#header {
  color: red;
}

.head-shot #headshot {
  width: 150px;
  height: 150px;
  border-radius: 150px;

}

.header-text {
  display: inline-block;
  color: red;
  margin-left: 100px;
}

Move text next to header image

Move text next to header image


@import '@teamleader/ui-colors';
@import '@teamleader/ui-utilities';
@import '@teamleader/ui-typography';

.select {
  composes: reset-font-smoothing;
  font-family: var(--font-family-regular);
  font-size: calc(1.4 * var(--unit));
  border-color: var(--color-neutral-dark);
  max-width: 360px;
}

.dropdown-indicator {
  border: 0 !important;
  border-radius: 0 4px 4px 0;
  min-height: 100%;
}

.validation-icon {
  margin-top: -1px;
}

.has-error {
  &:not(.is-inverse) .validation-text {
    color: var(--color-ruby-dark);
  }

  &.is-inverse .validation-text {
    color: var(--color-ruby-light);
  }
}

Add styles for the validation text & icon


/* Move badge to deal with advanced text addition to button */
.badgeContainer .badge {
    left: 5px !important;
}
/* Move folder to deal with advanced text addition to button */
.site-save_folder {
    background-position: 0 -136px !important;
    margin-left: 14px !important;
}

/* Move advanced search button to deal with advanced text addition to button */
.queryBox .advancedBtn {
    width: 6.5em !important;
    right: -4.7em !important;
    margin-right: -5px !important;
    white-space: nowrap !important;
    padding: 4px !important;
}

/* Move search button to deal with advanced text addition to button */
.queryBox .searchBtn {
    width: 5em !important;
    right: 2.3em !important;
}
/* disable the pointless language switch (only 1 option anyway) */
.languageSwitcher {
    display: none !important;
}

/* Make Clear Refinements Link more noticeable */
.clearRefinements {
    background: #88b3da;
    font-size: 1.1em;
    font-weight: bold;
    padding: 1em;
    text-align: center;
}

.backToBasic {
    color: #08c !important;
}

/* Make back to basic link in header white, different from other back to basic link */
.advancedBtn .backToBasic {
    color: #ffffff !important;
}

/* Move badge to deal with advanced text addition to button */
.badgeContainer .badge {
    left: 5px !important;
}
/* Move folder to deal with advanced text addition to button */
.site-save_folder {
    background-position: 0 -136px !important;
    margin-left: 14px !important;
}

/* Move advanced search button to deal with advanced text addition to button */
.queryBox .advancedBtn {
    width: 6.5em !important;
    right: -4.7em !important;
    margin-right: -5px !important;
    white-space: nowrap !important;
    padding: 4px !important;
}

/* Move search button to deal with advanced text addition to button */
.queryBox .searchBtn {
    width: 5em !important;
    right: 2.3em !important;
}
/* disable the pointless language switch (only 1 option anyway) */
.languageSwitcher {
    display: none !important;
}

/* Make Clear Refinements Link more noticeable */
.clearRefinements {
    background: #88b3da;
    font-size: 1.1em;
    font-weight: bold;
    padding: 1em;
    text-align: center;
}

/* Make back to basic link blue to match the default link colour */
.backToBasic {
    color: #08c !important;
}

Make back to basic link blue to match the default link colour - this could be moved into the summon admin gui and out of this css file if it is well received [72007650]


/*
 * Custom overrides for embedded bookreader.
 */

/* Hide some navigation buttons */
#GBtoolbar .label,.pageform,.play,.embed,.two_page_mode,.one_page_mode,
    .book_leftmost,.book_rightmost,.book_top,.book_bottom {
    display: none;
}

#GBtoolbar .title {
    font-size: 0.9em;
}

/*
 * Custom overrides for embedded bookreader.
 */

/* Hide some navigation buttons */
#GBtoolbar .label,.pageform,.play,.embed,.two_page_mode,.one_page_mode,
    .book_leftmost,.book_rightmost,.book_top,.book_bottom,.print {
    display: none;
}

#GBtoolbar .title {
    font-size: 0.9em;
}

Hide print icon when embedded

Hide print icon when embedded


.windowsill.window {
  display: flex;
  flex-direction: column;
}
.windowsill.window .body {
  flex-grow: 1;
}
.windowsill.window .titlebar {
  display: block;
  height: 1em;
  cursor: move;
}

.windowsill.window {
  display: flex;
  flex-direction: column;
  position: absolute;
}
.windowsill.window .body {
  flex-grow: 1;
}
.windowsill.window .titlebar {
  display: block;
  height: 1em;
  cursor: move;
}

Set position:absolute on windows to take them out of flow


body {
	font-family: futura;
	font: large;
	background-color:#F6CEFC;
}

.examples {
	font: large;
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border:4px solid #eeeeee;
}

.title {
	font: large;
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border:4px solid #eeeeee;
}

.about {
	font: large;
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border:4px solid #eeeeee;
}

.contact {
	font: large;
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border:4px solid #eeeeee;
}

.table {
	font: large;
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border:4px solid #eeeeee;
}

body {
	font-family: Futura, sans-serif;
	background-color: #F6CEFC;
}

.examples {
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border: 4px solid #eeeeee;
}

.title {
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border: 4px solid #eeeeee;
}

.about {
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border: 4px solid #eeeeee;
}

.contact {
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border: 4px solid #eeeeee;
}

.table {
	margin: 8px;
	padding: 4px 6px 4px 6px;
	border: 4px solid #eeeeee;
}

Remove invalid CSS, add generic to font stack

`large` is not a valid `font` property, and this makes no change to the rendering of the site.
Added `sans-serif` to the end of the font stack to avoid falling back to a serif font on systems without Futura installed.


.hidden { display: none; }
.full-width { width: 100%; }
.full-height { height: 100%; }
.scroll {height: 100%;}

Add some css helper classes

Add some css helper classes


.wrapper::before {
  content: "" !important;
}

.picture {
  display: inline-block;
  height: 75px;
  border-radius: 50%;
}

.name {
  margin-bottom: 0.4rem;
}

.animated-ellipsis-wrapper {
  font-size: 0.45rem;
  position: absolute;
  top: 2.7rem;
  left: 0;
  width: 100%;
}

.wrapper {
  &::before {
    content: "" !important;
  }

  .picture {
    display: inline-block;
    height: 5.35rem;
    border-radius: 50%;
  }

  .name {
    margin-bottom: 0.4rem;
  }

  .animated-ellipsis-wrapper {
    font-size: 0.45rem;
    position: absolute;
    top: 2.7rem;
    left: 0;
    width: 100%;
  }
}

Convert px to rem in user list item styling


.exampleOutput {
  display: flex;
  border: 1px solid rgb(224, 224, 224);
  padding: 2rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.codeBlock pre {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.example-grid-content {
  background: rgb(224, 224, 224);
  display: flex;
  padding: 5px;
}

.exampleOutput .btn + .btn {
  margin-left: 1rem;
}

.example-color {
  width: 12em;
  line-height: 50px;
  text-align: center;
  font-family: Menlo, Monaco, Consolas, 'Courier New', monospace;
}

.exampleOutput {
  display: flex;
  border: 1px solid rgb(224, 224, 224);
  padding: 2rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.codeBlock pre {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  max-height: 250px;
  overflow: auto;
}

.example-grid-content {
  background: rgb(224, 224, 224);
  display: flex;
  padding: 5px;
}

.exampleOutput .btn + .btn {
  margin-left: 1rem;
}

.example-color {
  width: 12em;
  line-height: 50px;
  text-align: center;
  font-family: Menlo, Monaco, Consolas, 'Courier New', monospace;
}

Allow `pre` to overflow in docs

Allow `pre` to overflow in docs


.light {
  background-color: var(--color-white);
  color: var(--color-greyDark);
}

.dark {
  background-color: var(--color-black);
  color: var(--color-white);
}

.body {
  padding: var(--size-medium);
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  overflow-y: scroll;
  max-height: 100vh;
  padding: var(--size-medium);
  clear: both;
}

.light {
  background-color: var(--color-white);
  color: var(--color-greyDark);
}

.dark {
  background-color: var(--color-black);
  color: var(--color-white);
}

.body {
  padding: var(--size-medium);
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  overflow-y: scroll;
  max-height: 100vh;
  padding: var(--size-large);
  clear: both;
}

Fix modal window padding being different to the action bar's


#header {
	background-image: url("../img/SWHacks_landing_bg.png");
	background-repeat: repeat;
	background-size: contain;
	/*max-height: 91vh;*/
	min-height: 20vh;
}

#hdr-top {
	width: 100%;
}

#hdr-top #hdr-top-left {
	float: left;
	margin-top: 16px;
	margin-left: 16px;

	font-size: 18pt;
	font-family: "raleway-light", Verdana, Tahoma;
}

#hdr-top #hdr-top-right {
	float: right;
	word-spacing: 4px;
	margin-top: 16px;
	margin-right: 16px;
}

#hdr-pic-pos {
	padding-left: 10vw;
	padding-right: 10vw;
}

@media (max-width: 540px) {
	#hdr-pic-pos {
		padding-top: 50px;
	}
}

#header-img {
	padding: 1vh 3vw 2vh 3vw;
}

#header-img-mobile {
	padding: 2vh 4vw 3vh 4vw;
}

#header {
	background-image: url("../img/SWHacks_landing_bg.png");
	background-repeat: repeat;
	background-size: contain;
	/*max-height: 91vh;*/
	min-height: 20vh;
}

#hdr-top {
	width: 100%;
}

#hdr-top #hdr-top-left {
	float: left;
	margin-top: 16px;
	margin-left: 16px;

	font-size: 18pt;
	font-family: "raleway-light", Verdana, Tahoma;
}

#hdr-top #hdr-top-right {
	float: right;
	word-spacing: 4px;
	margin-top: 16px;
	margin-right: 16px;
}

#hdr-pic-pos {
	padding-left: 10vw;
	padding-right: 10vw;
}

@media (max-width: 540px) {
	#hdr-pic-pos {
		padding-top: 50px;
	}
}

#header-img {
	padding: 5vh 3vw 5vh 3vw;
}

#header-img-mobile {
	padding: 2vh 4vw 3vh 4vw;
}

Add more padding to header image on desktop


.openFullAll {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  overflow: auto;
}

.watermark_grid {
  display: block;
  position: absolute;
  top: 0;
  background-repeat: no-repeat;
}

.watermark_grid span {
  display: inline-block;
  border: 1px dashed rgba(255, 255, 255, .2);
  cursor: pointer;
}

.editor-inline-image tips {
  font-size: 12px;
  position: absolute;
  right: 0;
  color: #aaa;
}
.uploadingImagies {
    text-align: center;
}
.uploadingImagies a {
    font-size: 20px;
    position: relative;
    display: inherit;
    margin: 0 auto;
}
.breakImages>div {
  width: 100px;
  height: 100px;
  overflow: hidden;
  display: inline-block;
  margin: 10px 10px 0 0;
  background-clip: content-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid #E9E9E9;
  border-radius: 3px;
  overflow: hidden;
}

.openFullAll {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  overflow: auto;
}

.watermark_grid {
  display: block;
  position: absolute;
  top: 0;
  background-repeat: no-repeat;
}

.watermark_grid span {
  display: inline-block;
  border: 1px dashed rgba(255, 255, 255, .2);
  cursor: pointer;
}

.editor-inline-image tips {
  font-size: 12px;
  position: absolute;
  right: 0;
  color: #aaa;
}
.uploadingImagies {
    text-align: center;
}
.uploadingImagies img{
    max-width: 100%;
}
.uploadingImagies a {
    font-size: 20px;
    position: relative;
    display: inherit;
    margin: 0 auto;
}
.breakImages>div {
  width: 100px;
  height: 100px;
  overflow: hidden;
  display: inline-block;
  margin: 10px 10px 0 0;
  background-clip: content-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid #E9E9E9;
  border-radius: 3px;
  overflow: hidden;
}

Fix problem that the image width overflow preview modal box


svg {
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gray {
  fill:   hsl(  0,   0%,  55%);
  stroke: hsl(  0,   0%,  35%);
}

svg {
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#foreground {
  fill:   hsl(  0,   0%, 100%);
}

.gray {
  fill:   hsl(  0,   0%,  55%);
  stroke: hsl(  0,   0%,  35%);
}

Set foreground fill to white

Set foreground fill to white


.slide-title {
    float: left;
    width:100%;
    z-index: 10;
    background-color: #80deea;
    box-shadow: rgba(0, 0, 0, 0.117647) 0 1px 6px, rgba(0, 0, 0, 0.117647) 0 1px 4px;
}
.slide-title h1 {
    text-align: center;
}

.slide-title {
    position: absolute;
    top:0;
    width:100%;
    z-index: 10;
    background-color: #80deea;
    box-shadow: rgba(0, 0, 0, 0.117647) 0 1px 6px, rgba(0, 0, 0, 0.117647) 0 1px 4px;
}
.slide-title h1 {
    text-align: center;
}

Stop title pushing content down

Stop title pushing content down


.page-container {
  margin-top: 21px;
  margin-bottom: 21px;
}

.content-column {
  padding-left: 45px;
}

h1, .h1, h2, .h2, h3, .h3 {
  margin-top: 0;
  padding-top: 21px;
}

a.anchorjs-link:active, a.anchorjs-link:hover {
  text-decoration: none;
}

nav.affix[data-toggle='toc'] {
  margin-top: -60px;
}

#toc {
  width: 190px;
}

@media (max-width: 767px) {
  #toc {
    display: none;
  }
}

@media (max-width: 479px) {
  .content-column {
    padding-left: 15px;
  }

  .anchorjs-link {
    display: none;
  }
}

.page-container {
  margin-top: 21px;
  margin-bottom: 21px;
}

.content-column {
  padding-left: 45px;
}

h1, .h1, h2, .h2, h3, .h3 {
  margin-top: 0;
  padding-top: 21px;
}

h4, .h4, h5, .h5, h6, .h6 {
  margin-top: 14px;
  margin-bottom: 7px;
}

a.anchorjs-link:active, a.anchorjs-link:hover {
  text-decoration: none;
}

nav.affix[data-toggle='toc'] {
  margin-top: -60px;
}

#toc {
  width: 190px;
}

@media (max-width: 767px) {
  #toc {
    display: none;
  }
}

@media (max-width: 479px) {
  .content-column {
    padding-left: 15px;
  }

  .anchorjs-link {
    display: none;
  }
}

Improve spacing around smaller headings.


#sidebar {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh + -65px);
  z-index: 2000;
  width: 250px;
  overflow: auto;
  background-color: #303030;
}
.light #sidebar {
  background-color: #111;
}
#sidebar.drag {
  box-sizing: border-box;
  outline: 2px dashed rgba(255,255,255,0.7);
  outline-offset: -3px;
}
#sidebar.drag > #upload-container {
  display: none;
}
#sidebar.no-drag {
  box-sizing: unset;
  outline: none;
}
#sidebar.no-drag > #upload-container {
  display: inherit;
}
#sidebar-header {
  background-color: #222;
  padding: 10px;
  -webkit-app-region: drag;
  background-repeat: no-repeat;
  background-position: right 10px center;
}
.light #sidebar-header {
  background-color: #1b1b1b;
}

#sidebar {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh + -65px);
  z-index: 2000;
  width: 250px;
  overflow: auto;
  background-color: #303030;
}
.video + #sidebar{
    transition: all .5s;
    margin-right: -250px;

}
.video:hover  + #sidebar,.video  + #sidebar:hover {
    margin-right: 0;

}

.light #sidebar {
  background-color: #111;
}
#sidebar.drag {
  box-sizing: border-box;
  outline: 2px dashed rgba(255,255,255,0.7);
  outline-offset: -3px;
}
#sidebar.drag > #upload-container {
  display: none;
}
#sidebar.no-drag {
  box-sizing: unset;
  outline: none;
}
#sidebar.no-drag > #upload-container {
  display: inherit;
}
#sidebar-header {
  background-color: #222;
  padding: 10px;
  -webkit-app-region: drag;
  background-repeat: no-repeat;
  background-position: right 10px center;
}
.light #sidebar-header {
  background-color: #1b1b1b;
}

Hide the playlist when "not hover"

Hide the playlist when "not hover"


/*
  General
 */
@font-face {
  font-family: "LubalinDemiIBM";
  src: url("../static/ibm.woff") format("woff"); }

body {
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif !important;
  color: #222222; }

h1 {
  font-family: "LubalinDemiIBM" !important; }

a {
  color: #00649D; }
  a :visited {
    color: #53049C; }

/*
  Bootstrap Specific
 */
.navbar {
  background: #222222; }
  .navbar .navbar-text {
    color: #999999;
    font-family: "LubalinDemiIBM"; }

.btn-primary {
  background: #A72185; }

/*
  Reveal.js Specific
 */
.reveal h1, .reveal h2, .reveal h3, .reveal h4 {
  text-transform: none; }
.reveal h1 a, .reveal h2 a, .reveal h3 a, .reveal h4 a {
  color: #222222 !important; }
.reveal pre {
  font-size: 1em; }

/*
  General
 */
@font-face {
  font-family: "LubalinDemiIBM";
  src: url("../static/ibm.woff") format("woff"); }

body {
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif !important;
  color: #222222; }

h1 {
  font-family: "LubalinDemiIBM" !important; }

a {
  color: #00649D; }
  a :visited {
    color: #53049C; }

/*
  Bootstrap Specific
 */
.navbar {
  background: #222222; }
  .navbar .navbar-text {
    color: #999999;
    font-family: "LubalinDemiIBM"; }

.btn-primary {
  background: #A72185; }

/*
  Reveal.js Specific
 */
.reveal {
  background-color: #FFFFFF; }
.reveal h1, .reveal h2, .reveal h3, .reveal h4 {
  text-transform: none; }
.reveal h1 a, .reveal h2 a, .reveal h3 a, .reveal h4 a {
  color: #222222 !important; }
.reveal pre {
  font-size: 1em; }

Fix the full screen background

Fix the full screen background


body {
  background-color: #F9F5FC;
}

.container {
  background-color: #F1EEFA;
  border: 0.5em solid #AAF;
  box-shadow: 0.25em 0.25em 0.25em #444;
  margin: 0 auto;
  padding: 2em;
  text-align: center;
  width: 60em;
}

#element-description {
  border: 1px solid #DDA;
}
#tetris-grid {
  border: 1px solid #DAA;
}
#tetris-preview {
  border: 1px solid #AAD;
  display: block;
}
#tetris-table {
  border: 1px solid #ADA;
  display: block;
}

body {
  background-color: #F9F5FC;
}

.container {
  background-color: #F1EEFA;
  border: 0.5em solid #AAF;
  box-shadow: 0.25em 0.25em 0.25em #444;
  margin: 0 auto;
  padding: 2em;
  text-align: center;
  width: 60em;
}

#element-description {
  border: 1px solid #DDA;
  height: 182px;
  padding: 12px;
  text-align: left;
  width: 516px;
}
#element-description h2 {
  margin: 0;
}
#element-description p {
  margin: 8px 0 0 0;
}
#tetris-grid {
  border: 1px solid #DAA;
}
#tetris-preview {
  border: 1px solid #AAD;
  display: block;
}
#tetris-table {
  border: 1px solid #ADA;
  display: block;
}

Update styling for element description and children


/**
 * This is just an empty theme.
 */

body {
	margin: 0;
}

.signed-out #main {
	left: 5px;
}

#sidebar {
	bottom: 52px;
}

#footer {
	border-radius: 2px;
	bottom: 4px;
	left: 5px;
	width: 210px;
}

#main {
	bottom: 4px;
	right: 5px;
	top: 4px;
}

#chat .unhandled .from {
	color: #ddd;
}

#windows .window::before {
	background: #f4f4f4;
	background-image: linear-gradient(#f4f4f4, #ececec);
	border-bottom: 1px solid #d7d7d7;
	content: " ";
	display: block;
	height: 10px;
	position: relative;
	z-index: 10;
}

#windows .window {
	border-radius: 2px;
}

@media (max-width: 768px) {
	#sidebar {
		left: -220px;
	}

	#footer {
		left: -215px;
		width: 215px;
	}

	#main {
		left: 5px;
	}
}

/**
 * This is just an empty theme.
 */

body {
	margin: 0;
}

.signed-out #main {
	left: 5px;
}

#sidebar {
	bottom: 52px;
}

#footer {
	border-radius: 2px;
	bottom: 4px;
	left: 5px;
	width: 210px;
}

#main {
	bottom: 4px;
	right: 5px;
	top: 4px;
}

#chat .unhandled .from {
	color: #ddd;
}

#windows .window::before {
	background: #f4f4f4;
	background-image: linear-gradient(#f4f4f4, #ececec);
	border-bottom: 1px solid #d7d7d7;
	content: " ";
	display: block;
	height: 10px;
	position: relative;
	z-index: 10;
}

#windows .window {
	border-radius: 2px;
}

@media (max-width: 768px) {
	#sidebar {
		left: -220px;
	}

	#footer {
		left: -215px;
		width: 215px;
	}

	#main {
		left: 0;
		bottom: 0;
		right: 0;
		top: 0;
	}

	#windows .window::before {
		display: none;
	}

	#windows .window {
		border-radius: 0;
	}
}

Remove content borders on mobile to maximise use of space


body {
    padding-top: 70px;
}

.popover-title .close{
    position: relative;
    bottom: 3px;
}

.table-hover>tbody>tr:hover {
    cursor: pointer;
}

body {
    padding-top: 70px;
    padding-bottom: 20px;
}

.popover-title .close{
    position: relative;
    bottom: 3px;
}

.table-hover>tbody>tr:hover {
    cursor: pointer;
}

Add some padding at the bottom

Add some padding at the bottom


body {
	color: rgb(0,0,0);
	padding: 10px;
	font-family: 'Open Sans Condensed', sans-serif;}

a:link {
	color: rgb(38,12,240);
	text-decoration:none;}

a:visited {
	color:rbg(0,0,0);}

h1, h3, h4 {

	text-align: center;
	color: rgb(245,224,255);
	font-family: 'Open Sans Condensed', sans-serif;
	paddinng: 10px}

body {
	color: rgb(0,0,0);
	padding: 10px;
	margin: 8%;
	font-family: 'Open Sans Condensed', sans-serif;}

a{
	padding-right 3%;
}

a:link {
	color: rgb(38,12,240);
	text-decoration:none;}

a:visited {
	color:rbg(0,0,0);}

h1{
	font-size: 3em;
}

h1, h3, h4 {

	text-align: center;
	color: rgb(245,224,255);
	font-family: 'Open Sans Condensed', sans-serif;
	padding: 10px}

Add padding and margins, increased h1 font size

I added a bit of padding, margin, and font changes to the css.

Add a photo and think about using social media icons for everything.  Add the link to your website on your twitter asap!  And a project description too. It's pretty awesome and others should know about it.


body {
	margin: 10px 10px 10px 10px;
	padding: 10px 10px 10px 10px;
	border-top-color: #2323aa;
	border-top-width: 5px;
	border-top-style: double;
	font-family: sans-serif;
	color: #2323ff;
}

.the-form {
	color: #334433;
	border-bottom-width: 5px;
	border-bottom-style: double;
	border-bottom-color: #443344;

}

Add styling to the form section

Add styling to the form section


body, html {
	width: 100%;
	font-family: 'Roboto', sans-serif;
	overflow-x: hidden;
	text-rendering: geometricPrecision;
	hyphen: auto;
}

.header {
	padding-top: 80px;
	text-align: center;
	color: #ffffff;
}

.aboutMe{
	background: #eee;
	color: #111;
	background-size: cover;
}

.aboutme h1{
	text-align: center;
}

.fluid-container{
	width: 100%;
	padding-bottom: 100px;
	padding-top: 100px;
	color: #000000;
}

.container{
	width: 90%;
	max-width: 1200px;
	margin: auto;
}

#particles-js{
	background: #0055aa;
	position: fixed;
	z-index: -1;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

body, html {
	width: 100%;
	font-family: 'Roboto', sans-serif;
	overflow-x: hidden;
	text-rendering: geometricPrecision;
	hyphen: auto;
}

.header {
	padding-top: 80px;
	text-align: center;
	color: #ffffff;
}

.aboutMe{
	background: #eee;
	color: #111;
	background-size: cover;
}

.aboutme h1{
	text-align: center;
}

.fluid-container{
	width: 100%;
	padding-bottom: 100px;
	padding-top: 100px;
}

.container{
	width: 90%;
	max-width: 1200px;
	margin: auto;
}

#particles-js{
	background: #0055aa;
	position: fixed;
	z-index: -1;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

Revert "Testing container color change"

Revert "Testing container color change"

This reverts commit 871d7560dc4d52373ee1fa4b152120175895d99f.


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

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

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

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

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

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

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

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

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

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

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

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

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

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

Revert "Test fix for IOS again."

Revert "Test fix for IOS again."

This reverts commit 7c2ed0a66d8b63de6d0da7370d698712a51f1ecb.


/*
Override treebeard styles
*/
.citation-widget .title-text {
    cursor: initial;
}
.citation-widget .tb-expand-icon-holder {
    cursor: initial;
}
.citation-widget .tb-multiselect {
    background-color: white;
}
/* ---------------- */
.citation-picker {
    padding-bottom: 6px;
}
.citation-widget > ul {
    list-style-type: none;
    padding-left:0;
    margin-bottom:0;
}

.citation-widget > ul > li {
    margin-bottom:10px;
}

.citation-widget > ul > li:last-child {
    margin-bottom:0px;
}

.csl-left-margin {
    display: inline;
}

.csl-right-inline {
    display: inline;
}

Add css to display citations
    -after selecting alt style

[#OSF-5893]


body {
  margin: 0;
  overflow: hidden;
}
.desktopical {
  height: 100%;
  width: 100%;
}
.desktopical.taskbar {
  background: cornflowerblue;
}
.windowsill.window {
  background: ivory;
}
.windowsill.workspace {
  width: 100%;
  height: 100%;
  background: url(space.png);
  background-size: cover;
}
.windowsill.titlebar {
  background: cornflowerblue;
}

body {
  margin: 0;
  overflow: hidden;
}
.desktopical.desktop {
  height: 100%;
  width: 100%;
}
.desktopical.taskbar {
  background: cornflowerblue;
}
.windowsill.window {
  background: ivory;
}
.windowsill.workspace {
  width: 100%;
  height: 100%;
  background: url(space.png);
  background-size: cover;
}
.windowsill.titlebar {
  background: cornflowerblue;
}
.desktopical.menuButton {
  border-color: cornflowerblue;
}
.windowsill.window {
  border: 1px solid cornflowerblue;
}

Add window border and menu styling

Add window border and menu styling


@media (min-width: 992px) {
  .nav-users {
    position: fixed;
  }
}
.social-account-container {
  background-repeat: space;
  background-color: white !important; /*overide angular-material primary color*/
  background-position: -3px;
  background-size: 112% 112%;
}
.social-paypal {
  background-size: 90% 90%;
  background-position: 4px;
}
.btn-remove-account {
  top: 10px;
  right: 10px;
  position: absolute;
}
.btn-file {
  position: relative;
  overflow: hidden;
}
.btn-file input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  background: white;
  cursor: inherit;
  display: block;
}
.user-profile-picture {
  min-height: 150px;
  max-height: 150px;
}

.authenticationGridList {
  width: 100%;
}
.authenticationGridList md-grid-list {
  margin: 8px;
}
.authenticationGridList md-grid-tile {
  transition: all 400ms ease-out 50ms;
}

@media (min-width: 992px) {
  .nav-users {
    position: fixed;
  }
}
.social-account-container {
  background-repeat: space;
  background-color: white !important; /*overide angular-material primary color*/
  background-position: -3px;
  background-size: 112% 112%;
}
.social-paypal {
  background-size: 90% 90%;
  background-position: 4px;
}
.btn-file {
  position: relative;
  overflow: hidden;
}
.btn-file input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  background: white;
  cursor: inherit;
  display: block;
}
.user-profile-picture {
  min-height: 150px;
  max-height: 150px;
}

.authenticationGridList {
  width: 100%;
}
.authenticationGridList md-grid-list {
  margin: 8px;
}
.authenticationGridList md-grid-tile {
  transition: all 400ms ease-out 50ms;
}

Remove useless css on class btw-remove-account (unused)


#menu .nav-list > li > a {
  background-repeat : no-repeat;
  background-position : left center;
  padding-left : 20px;
}

#content {
  font-size:0.8em;
}

#auth_login_zone {
    max-width:450px;
    margin: auto;
}

.jforms-error-list {
    margin-left: 0;
    background-color: #C43C35;
    background-image: -moz-linear-gradient(center top , #EE5F5B, #C43C35);
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
/*    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
    border-radius: 4px 4px 4px 4px;
    padding: 10px;
}
.jforms-error-list li {
    list-style: none;
    color: #FFF;
}

#menu .nav-list > li > a {
  background-repeat : no-repeat;
  background-position : left center;
  padding-left : 20px;
}

#content {
  font-size:0.8em;
}

#auth_login_zone {
    max-width:450px;
    margin: auto;
}

.jforms-error-list {
    margin-left: 0;
    background-color: #C43C35;
    background-image: -moz-linear-gradient(center top , #EE5F5B, #C43C35);
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
/*    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
    border-radius: 4px 4px 4px 4px;
    padding: 10px;
    color: white;
}
.jforms-error-list li {
    list-style: none;
    color: #FFF;
}

Fix color of error messages

Fix color of error messages

Fixes #834


/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS file within this 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 top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require main
*= require mobile
*= require bootstrap
*= require font-awesome.min.css
*= require_self
*/

.apollo-header{
   background-color: #396494;
   padding-left: 12px;
}

.apollo-dropdown{
   background-color: #396494;
}

.navbar {
    margin-bottom: 0px;
    min-height: 25px;
}

.btn {
    padding: 3px;
}

/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS file within this 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 top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require main
*= require mobile
*= require bootstrap
*= require font-awesome.min.css
*= require_self
*/

.apollo-header{
   background-color: #396494;
   padding-left: 12px;
}

.apollo-dropdown{
   background-color: #ddd;
}

.navbar {
    margin-bottom: 0px;
    min-height: 25px;
}

.btn {
    padding: 3px;
}

Add easier to read color to header bar for report pages


/* Responsive
-------------------------------------------------- */

/* Desktop large
------------------------- */
@media (min-width: 1200px) {
  .sidenav {
    width: 258px;
  }
  .sidenav > li > a {
    width: 230px \9; /* Override the previous IE8-9 hack */
  }
}

/* Desktop
------------------------- */
@media (min-width: 980px) and (max-width: 1199px)  {
  /* When affixed, space properly */
  .sidenav {
    top: 0;
    width: 218px;
    margin-top: 30px;
    margin-bottom: 30px;
    margin-right: 0;
  }
}

/* Tablet to desktop
------------------------- */
@media (min-width: 768px) and (max-width: 979px) {
  /* Remove any padding from the body */
  body {
    padding-top: 0;
  }

  /* Adjust sidenav width */
  .sidenav {
    width: 166px;
    margin-top: 20px;
  }

  .sidenav.affix {
    top: 0;
  }

  span.margin-div-inner {
    width: 166px;
    margin-left: 20px;
    font-size: 0.5em;
    padding-left: 14px;
  }
}

/* Tablet
------------------------- */
@media (min-width: 481px) and (max-width: 767px) {
  /* Remove any padding from the body */
  body {
    padding-top: 0;
  }

  /* Sidenav */
  .sidenav {
    margin-bottom: 20px;
    position: static;
    width: auto;
    top: 0;
  }

  .page > h3.title span.date {
    padding-left: 1em;
    position: relative;
  }

}

/* Landscape phones
------------------------- */
@media (max-width: 480px) {
  /* Remove padding above jumbotron */
  body {
    padding-top: 0;
  }

  /* Change up some type stuff */
  h2 small {
    display: block;
  }

  /* Do our best to make tables work in narrow viewports */
  table code {
    white-space: normal;
    word-wrap: break-word;
    word-break: break-all;
  }

  .sidenav{
    position: static;
    width: auto;
    top: 0;
  }

  .page > h3.title span.date {
    padding-left: 1em;
    position: relative;
  }

  .label-anchor {
	margin-top: -10px;
  }

}

Fix bug with long chapter header.

Fix bug with long chapter header.


body {
  background-color: #F9F5FC;
}

.container {
  background-color: #F1EEFA;
  border: 0.5em solid #AAF;
  box-shadow: 0.25em 0.25em 0.25em #444;
  margin: 0 auto;
  padding: 2em;
  text-align: center;
  width: 60em;
}

#tetris-grid {
  border: 1px solid #DAA;
}
#tetris-preview {
  border: 1px solid #AAD;
  vertical-align: top;
}

body {
  background-color: #F9F5FC;
}

.container {
  background-color: #F1EEFA;
  border: 0.5em solid #AAF;
  box-shadow: 0.25em 0.25em 0.25em #444;
  margin: 0 auto;
  padding: 2em;
  text-align: center;
  width: 60em;
}

#tetris-grid {
  border: 1px solid #DAA;
}
#tetris-preview {
  border: 1px solid #AAD;
  display: block;
  margin-bottom: 29px;
}
#tetris-table {
  border: 1px solid #ADA;
  display: block;
}

Update styling for periodic table

Update styling for periodic table


.tags ul {
	list-style-type: none;
	margin-left: 0rem;
	padding-left: 0rem;
}

.tags ul li {
	display: inline;
	padding: 0.1rem 0.3rem;
	border: 1px solid #cccccc;
}

.social-media {
	margin-top: 2em;
}

.social-media a {
	color: #DDDDDD;
}

.social-media a:hover {
	color: #FFFFFF;
}

.social-media .sidebar-nav-item {
	display: inline-block;
	margin-right: 0.7em;
}

.post-comments-link {
	display: block;
}

.related {
	padding-top: 1rem;
	border-top: none;
}

.post-metadata {
	border-top: 1px solid #eee;
}

.comments {
	padding-top: 0rem;
}

@media (min-width: 64em) {
  .layout-reverse .content {
    max-width: 100%;
    margin-left: 4rem;
    margin-right: 22rem;
  }
}

Remove middle gap in layout when viewed on large screens


input.name,
input.description {
    margin-top: 20px; /* Equal to margin-top of Bootstrap <h3> */
    margin-bottom: 10px; /* Equal to margin-top of Bootstrap <h3> */
}

.bracket {
    display: inline-block;
    width: 10px;
    border-top: 3px solid black;
    border-bottom: 3px solid black;
}

.bracket-left {
    border-left: 3px solid black;
}

.bracket-right {
    border-right: 3px solid black;
}

.content {
    display: inline-block;
    vertical-align: top;
}

.pair {
    margin-right: 5px;
    margin-bottom: 10px;
    margin-left: 5px;
}

.pair:after {
    clear: both;
    display: table;
    content: " ";
}

.value {
    display: inline-block;
    margin-left: 10px;
    float: right;
}

.empty-button {
    margin-left: 5px;
    cursor: pointer;
}

input.name,
input.description {
    margin-top: 20px; /* Equal to margin-top of Bootstrap <h3> */
    margin-bottom: 10px; /* Equal to margin-top of Bootstrap <h3> */
}

.bracket {
    display: inline-block;
    width: 10px;
    border-top: 3px solid black;
    border-bottom: 3px solid black;
}

.bracket-left {
    border-left: 3px solid black;
}

.bracket-right {
    border-right: 3px solid black;
}

.content {
    display: inline-block;
    vertical-align: top;
}

.pair {
    margin-right: 5px;
    margin-bottom: 10px;
    margin-left: 5px;
    cursor: pointer;
}

.pair:after {
    clear: both;
    display: table;
    content: " ";
}

.value {
    display: inline-block;
    margin-left: 10px;
    float: right;
}

.empty-button {
    margin-left: 5px;
    cursor: pointer;
}

[appearance] Change cursor to "pointer" shape when hovering over
attribute-value pairs in LHS.


.departure ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	width: 100%;
}

.header {
	background-color: slategrey;
}

.even {
	background-color: lightgrey;
}

.odd {
	background-color: ghostwhite;
}

.departure li {
	float: left;
	display: block;
	text-align: left;
	text-decoration: none;
}

.hide {
	display: none;
}

.route.type {
	width: 3%;
}

.stop.code {
	width: 10%;
}

.stop.name {
	width: 25%;
}

.stop.platform {
	width: 5%;
}

.route.number.nearest-type {
	width: 7%;
}

.route.destination.nearest-type {
	width: 40%;
}

.route.number.stop-type {
	width: 17%;
}

.route.destination.stop-type {
	width: 60%;
}

.route.deptime {
	width: 10%;
}

.departure ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	width: 100%;
}

.header {
	background-color: slategrey;
}

.even {
	background-color: lightgrey;
}

.odd {
	background-color: ghostwhite;
}

.departure li {
	float: left;
	/*display: block;*/
	text-align: left;
	text-decoration: none;
}

.hide {
	display: none;
}

.route.type {
	width: 3%;
}

.stop.code {
	width: 10%;
}

.stop.name {
	width: 25%;
}

.stop.platform {
	width: 5%;
}

.route.number.nearest-type {
	width: 7%;
}

.route.destination.nearest-type {
	width: 40%;
}

.route.number.stop-type {
	width: 17%;
}

.route.destination.stop-type {
	width: 60%;
}

.route.deptime {
	width: 10%;
}

Remove display block that breaks hiding.


#controls-container {
    border-bottom: 1px solid silver;
    padding: 10px 0px;
}

/* Note List Styles*/
#content-container {
  background-color: #ddd;
  background-color: #fff;
  background-color: hsl(60, 100%, 98%); /*(240, 100%, 99%);*/
}
.scroll {
    overflow-x: none;
    overflow-y: auto;
    max-height: 100%;
}

#page-main {
    background: #F5F5F5;
    overflow: hidden;
}

#controls-container {
    border-bottom: 1px solid silver;
    padding: 10px 0px;
}

/* Note List Styles*/
#content-container {
  background-color: #ddd;
  background-color: #fff;
  background-color: hsl(60, 100%, 98%); /*(240, 100%, 99%);*/
}

#notes-container {
  height: 100%;
}

.scroll {
    overflow-x: none;
    overflow-y: auto;
    max-height: 100%;
}

#page-main {
    background: #F5F5F5;
    overflow: hidden;
}

Fix cliping of color picker when too few notes.


.loader {
  display: flex;
  height: 50vh;
  justify-content: center;
  align-items: center;
}

:root {
  --spinner-Color: #0085a1;
  --spinner-Color-front: color(var(--spinner-Color) a(0.8));
  --spinner-Color-back: color(var(--spinner-Color) a(0.2));
}

.spinner {
  height: 8vh;
  width: 8vh;
  border: 6px solid var(--spinner-Color-back);
  border-top-color: var(--spinner-Color-front);
  border-radius: 100%;
  animation: rotation 0.6s infinite linear 0.25s;

  /* the opacity is used to lazyload the spinner, see animation delay */
  opacity: 0;
}

@keyframes rotation {
  from {
    opacity: 1;
    transform: rotate(0);
  }
  to {
    opacity: 1;
    transform: rotate(359deg);
  }
}

.loader {
  display: flex;
  height: 50vh;
  justify-content: center;
  align-items: center;
}

:root {
  --spinner-Color: #0085a1;
  --spinner-Color-front: color(var(--spinner-Color) a(0.8));
  --spinner-Color-back: color(var(--spinner-Color) a(0.2));
}

.spinner {
  height: 8vh;
  min-height: 5rem;
  width: 8vh;
  min-width: 5rem;
  border: 6px solid var(--spinner-Color-back);
  border-top-color: var(--spinner-Color-front);
  border-radius: 100%;
  animation: rotation 0.6s infinite linear 0.25s;

  /* the opacity is used to lazyload the spinner, see animation delay */
  opacity: 0;
}

@keyframes rotation {
  from {
    opacity: 1;
    transform: rotate(0);
  }
  to {
    opacity: 1;
    transform: rotate(359deg);
  }
}

Add min-height and min-width to prevent super small spinner when opening console


.sc-edit-link-tool {
  display: flex;
}

.sc-edit-link-tool > * {
  flex: 0 0 0;
}

.sc-edit-link-tool .sc-input {
  height: 24px;
  font-size: 11px;
  color: white;
  min-width: 200px;
  font-family: Monaco, 'Courier New';
  padding: 5px;
  background: transparent;
  border: none;
  margin: 2px;
}

.sc-edit-link-tool {
  display: flex;
  align-items: center;
}

.sc-edit-link-tool > * {
  flex: 0 0 0;
}

.sc-edit-link-tool .sc-input {
  height: 24px;
  font-size: 11px;
  color: white;
  min-width: 200px;
  font-family: Monaco, 'Courier New';
  padding: 5px;
  background: transparent;
  border: none;
  margin: 2px;
}

Align LinkTool buttons in the center

Align LinkTool buttons in the center

Fixes https://github.com/substance/substance/issues/1074


h1 a {
    text-decoration: none;
    color: #333
}

.content {
    padding-top: 2em;
}

.pure-button {
    line-height: 2em;
    margin-bottom: 1em;
}

.button-success,
.button-error,
.button-warning,
.button-secondary {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.button-success {
    background: rgb(28, 184, 65); /* this is a green */
}

.button-error {
    background: rgb(202, 60, 60); /* this is a maroon */
}

.button-warning {
    background: rgb(223, 117, 20); /* this is an orange */
}

.button-secondary {
    background: rgb(66, 184, 221); /* this is a light blue */
}

/* 48 em * 16 = 768 - 1 */
@media (max-width: 767px) {
    .header {
        padding-top: 1em;
    }

    h2.content-subhead {
        margin: 1em 0;
    }
}

Remove some space from header in low resolutions


body {
	background-color: rgb(51,51,51);
	color: rgb(210,210,210);
}

Adjust background and text colors

Adjust background and text colors


.status-red {
  background-color: #ED2D3A;
  color: white;
}
.status-yellow {
  background-color: #FFC108;
  color: white;
}
.status-green {
  background-color: #30A64A;
  color: white;
}

Add the css classes for the app status code


body {
	font-family: 'Varela Round', sans-serif;
}

/* Card hover tooltips */
.card:not(:hover) .card-hover {
	opacity: 0;
	transition: opacity 0.4s ease-in;
}
.card .card-hover {
	position: absolute;
	top: calc(100% + 0.5em);
	width: 100%;
	padding-left: 0.2em;
	padding-right: 0.2em;
	border-radius: 0.2em;
	background-color: white;
	z-index: 1;
	opacity: 1;
	transition: opacity 0.2s ease-in;
}
.card .card-hover::before {
	content: "";
	position: absolute;
	top: -0.5em;
	left: calc((100% - 1em)/2);
	width: 0;
	height: 0;
	border-left: 0.5em solid transparent;
	border-right: 0.5em solid transparent;
	border-bottom: 0.5em solid white;
}

body {
	font-family: 'Varela Round', sans-serif;
}

/* Card hover tooltips */
.card:not(:hover) .card-hover {
	opacity: 0;
	-webkit-transition: opacity 0.4s ease-in;
	-moz-transition: opacity 0.4s ease-in;
	-ms-transition: opacity 0.4s ease-in;
	-o-transition: opacity 0.4s ease-in;
	transition: opacity 0.4s ease-in;
}
.card .card-hover {
	position: absolute;
	top: calc(100% + 0.5em);
	width: 100%;
	padding-left: 0.2em;
	padding-right: 0.2em;
	border-radius: 0.2em;
	background-color: white;
	z-index: 1;
	opacity: 1;
	-webkit-transition: opacity 0.2s ease-in;
	-moz-transition: opacity 0.2s ease-in;
	-ms-transition: opacity 0.2s ease-in;
	-o-transition: opacity 0.2s ease-in;
	transition: opacity 0.2s ease-in;
}
.card .card-hover::before {
	content: "";
	position: absolute;
	top: -0.5em;
	left: calc((100% - 1em)/2);
	width: 0;
	height: 0;
	border-left: 0.5em solid transparent;
	border-right: 0.5em solid transparent;
	border-bottom: 0.5em solid white;
}

Make Crossbrowser transition for .card-hover


body {
  font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 1.2em;
  max-width: 1024px;
  margin: auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1,
h2 {
  text-align: center;
}

h1 {
  margin-bottom: 0;
  font-weight: bolder;
}

h2,
h5 {
  margin: 0;
}

h2 {
  font-weight: normal;
}

h3 {
  margin: .9em 0 0 0;
  font-weight: bolder;
}

h4 {
  margin: .2em 0 0 0;
  float: left;
  font-weight: normal;
}

h5 {
  margin: .4em 0 0 0;
  float: right;
  font-weight: normal;
  color: #666;
}

a {
  color: #348ac8;
  text-decoration: none;
}

ul {
  margin-top: 0;
  margin-bottom: .5em;
}

li {
  clear: both;
  margin-left: -1em;
}

@media print {
  body {
    margin-top: -1em;
    max-width: 95%;
    font-size: 1.4em;
  }
}

body {
  font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 1.2em;
  max-width: 1024px;
  margin: auto;
}

h1,
h2 {
  text-align: center;
}

h1 {
  margin-bottom: 0;
  font-weight: bolder;
}

h2,
h5 {
  margin: 0;
}

h2 {
  font-weight: normal;
}

h3 {
  margin: .9em 0 0 0;
  font-weight: bolder;
}

h4 {
  margin: .2em 0 0 0;
  float: left;
  font-weight: normal;
}

h5 {
  margin: .4em 0 0 0;
  float: right;
  font-weight: normal;
  color: #666;
}

a {
  color: #348ac8;
  text-decoration: none;
}

ul {
  margin-top: 0;
  margin-bottom: .5em;
}

li {
  clear: both;
  margin-left: -1em;
}

@media print {
  body {
    margin-top: -2em;
    max-width: 95%;
    font-size: .8em;
  }
}

Remove redundant font declaration, adjust print


/* Moon theme CSS at the following location:
 * https://github.com/gitpitch/gitpitch/blob/master/public/libs/reveal.js/3.4.1/css/theme/moon.css
 */
.reveal h1,
.reveal h2,
.reveal h3,
.reveal h4,
.reveal h5,
.reveal h6 {
  text-transform: none;
}

h1 > strong > em {
  color: #EA3046;
  font-family: "Noteworthy Bold", Impact, sans-serif;
}

/* Moon theme CSS at the following location:
 * https://github.com/gitpitch/gitpitch/blob/master/public/libs/reveal.js/3.4.1/css/theme/moon.css
 */
.reveal h1,
.reveal h2,
.reveal h3,
.reveal h4,
.reveal h5,
.reveal h6 {
  text-transform: none;
}

.reveal h1 > strong {
  color: #EA3046;
}

Change colour for bold values

Change colour for bold values


html, body{
  text-align: center;
  height: 100%;
  margin: 0;
}

a{
  text-decoration: none;
}

.build-panel{
  float: left;
  height: 100%;
  width: 100%;
  box-shadow: 0 0 0.2em 0.1em black inset;
}

.panel-count-2 .build-panel{
  width: 50%;
}

.panel-count-3 .build-panel{
  width: 33.33%;
  width: calc(100% / 3);
}

.panel-count-4 .build-panel{
  width: 50%;
  height: 50%;
}

.build-panel > h1:first-child{
  margin-top: 0;
}

.succeeded{
  background-color: green;
  color: white;
}

.failed{
  background-color: red;
  color: white;
}

.in-progress{
  background-color: yellow;
  color: black;
}

.in-progress-after-failed{
  background-color: orange;
  color: black;
}

.status{
  font-size: 400%;
}

.build-definition-name{
  font-size: 300%;
}

.build-number{
  font-size: 300%;
}

.commit-message{
  font-size: 300%;
}

html, body{
  text-align: center;
  height: 100%;
  margin: 0;
}

a{
  text-decoration: none;
}

.build-panel{
  float: left;
  height: 100%;
  width: 100%;
  box-shadow: 0 0 0.2em 0.1em black inset;
}

.panel-count-2 .build-panel{
  width: 50%;
  font-size: smaller;
}

.panel-count-3 .build-panel{
  width: 33.33%;
  width: calc(100% / 3);
  font-size: smaller;
}

.panel-count-4 .build-panel{
  width: 50%;
  height: 50%;
  font-size: smaller;
}

.build-panel > h1:first-child{
  margin-top: 0;
}

.succeeded{
  background-color: green;
  color: white;
}

.failed{
  background-color: red;
  color: white;
}

.in-progress{
  background-color: yellow;
  color: black;
}

.in-progress-after-failed{
  background-color: orange;
  color: black;
}

.status{
  font-size: 400%;
}

.build-definition-name{
  font-size: 300%;
}

.build-number{
  font-size: 300%;
}

.commit-message{
  font-size: 300%;
}

Make font smaller when there are multiple builds


/* Google web search tweak */
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url-prefix("https://www.google.com/search") {
.mw #center_col { width: 46em !important; }
.mw #rhs { margin-left: 62em !important; }
.mw #nyc { margin-left: 55em !important; }
.mw .s { max-width: 45em !important; line-height: 1.5 !important;  }
}

/* Google web search tweak */
@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url-prefix("https://www.google.com/search") {
  .mw #center_col { width: 46em !important; }
  .mw .s { max-width: 45em !important; line-height: 1.5 !important;  }

  .mw #rhs { margin-left: 62em !important; }
  .mw #nyc { margin-left: 55em !important; }
}

Adjust the indent and prettify

Adjust the indent and prettify


#import-from-div {
  margin-bottom: 20px;
}

#import-checkboxes > div:not(:first-child) {
  -webkit-padding-start: 8px;
  margin: 5px 0;
}

#import-throbber {
  margin: 4px 10px;
  vertical-align: middle;
  visibility: hidden;
}

#import-success-header {
  font-size: 1.2em;
}

#import-success-image {
  text-align: center;
  margin-top: -12px;
  margin-bottom: 10px;
}

#import-from-div {
  margin-bottom: 20px;
}

#import-checkboxes > div:not(:first-child) {
  -webkit-padding-start: 8px;
  margin: 5px 0;
}

#import-throbber {
  margin: 4px 10px;
  vertical-align: middle;
  visibility: hidden;
}

#import-success-header {
  font-size: 1.2em;
}

#import-success-image {
  text-align: center;
  margin: 20px;
}

Add vertical space around the import data confirmation icon.

Be nice to languages with long words.

BUG=85197
TEST=none

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

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


.tf__button {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  z-index: 10000;
}

.tf__button:focus {
  outline: none;
}

.tf__button:before {
  content: '★';
  -webkit-text-stroke: 1px black;
  margin-left: 0.5em;
}

.tf__button--follow:before {
  color: transparent;
}

.tf__button--unfollow:before {
  color: gold;
}

.ranklist .tf__button {
  float: right;
}

.author_name .tf__button {
  width: 0;
  margin: -1em 0;
}

.tf__button {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  z-index: 10000;
}

.tf__button:focus {
  outline: none;
}

.tf__button:before {
  content: '★';
  -webkit-text-stroke: 1px black;
  margin-left: 0.5em;
}

.tf__button--follow:before {
  color: transparent;
}

.tf__button--unfollow:before {
  color: gold;
}

.ranklist .tf__button {
  float: right;
}

.ranklist .first .tf__button {
  font-size: 1rem;
}

.author_name .tf__button {
  width: 0;
  margin: -1em 0;
}

Make star usual size for first place

Make star usual size for first place


.context-menu {
    background-color: rgba(250,250,250,0.8);
    border-radius: 4px;
    font: 12px sans-serif;
    cursor: default;
    padding: 3px;
}

.context-menu-item {
    padding: 2px
}

.context-menu-item:hover {
    background-color: #4677f8;
    color: #fefefe;
}

hr {
    margin-top: 5px;
    margin-bottom: 5px;
    border-top: 1px solid #ccc;
}

svg.play-icon {
    width: 12px;
    height: 12px;
    position: absolute;
    right: 5px;
}

.context-menu-span {
    margin-right: 20px;
}

.context-menu {
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    font-size: 12px;
    cursor: default;
    padding: 3px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.075);
}

.context-menu-item {
    padding: 2px;
    white-space: nowrap;
    border-radius: 2px;
}

.context-menu-item:hover {
    background-color: #4677f8;
    color: #fff;
}

hr {
    margin-top: 5px;
    margin-bottom: 5px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

svg.play-icon {
    width: 12px;
    height: 12px;
    position: absolute;
    right: 5px;
}

.context-menu-span {
    margin-right: 20px;
    vertical-align: middle;
    display: inline-block;
    line-height: normal;
}

.context-menu-item:hover {
    background-color: #4677f8;
    color: #fefefe;
}

.context-menu-thumbnail {
    margin-right: 10px;
    border: 1px solid #888888;
}

Make context menu look nicer

Make context menu look nicer


* {
  font-family: "Sans";
  font-size: 10;
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
}

* {
  font-family: initial;
  font-size: initial;
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
}

Fix for changes in this branch

tests: Fix for changes in this branch

The expected results are now more correct,  but still not perfect.


.node circle {
    fill: #fff;
    stroke: steelblue;
    stroke-width: 1.5px;
}

.node {
    font: 10px sans-serif;
}

.link {
    fill: none;
    stroke: #ccc;
    stroke-width: 1.5px;
}

#mp2 {
    margin-top: -50px;
}

#mp2 > svg {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.node circle {
    fill: #fff;
    stroke: steelblue;
    stroke-width: 1.5px;
}

.node {
    font: 11px sans-serif;
}

.link {
    fill: none;
    stroke: #ccc;
    stroke-width: 1.5px;
}

#mp2 {
    margin-top: -50px;
}

#mp2 > svg {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

Increase font size a bit.

Increase font size a bit.


body {
    background-color: #eee;
}

.wrap {
	position: relative;
    min-width: 950px;
}

.content {
    width: 800px;
    margin: 10px auto;
}

/***** Global Component *****/
body {
    background-color: #eee;
}

:global .input {
    padding: 0 8px;
    border-style: solid;
    border-color: #bfbfbf;
    border-width: 1px 1px 2px 1px;
    font-size: 14px;
    color: #222;

    &:focus {
        border-color: #2b99d6;
    }

    &.input--small {
        line-height: 24px;
    }

    &.input--medium {
        line-height: 32px;
    }

    &.input--large {
        font-size: 28px;
        line-height: 40px;
        padding: 0 10px;
    }

    &.input--error {
        border-color: #d93f2b;
    }
}

:global .input__msg {
    margin-top: 6px;
    color: #d93f2b;
    font-size: 14px;
}

:global .button {
    cursor: pointer;
    padding: 0 12px;
    min-width: 80px;
    font-size: 14px;
    color: #222;
    text-align: center;
    background-color: #cfcfcf;
    border: 1px solid #cfcfcf;

    &.button--small {
        height: 24px;
    }

    &.button--medium {
        height: 32px;
    }

    &.button--large {
        height: 40px;
        min-width: 96px;
    }

    &.button--red {
        background-color: #df313b;
        border-color: #df313b;
        color: #FFF;
    }
    &.button--blue {
        background-color: #2695d2;
        border-color: #2695d2;
        color: #FFF;
    }
}

:global .close {
    cursor: pointer;
    color: #222;
    font-size: 14px;
}

.wrap {
	position: relative;
    min-width: 950px;
}

.content {
    width: 800px;
    margin: 10px auto;
}

Set global input and basic button

Set global input and basic button


.alfresco-dialog-AlfDialog {
   .dialog-body {
      .alfresco-forms-Form.root-dialog-form > form {
         .alfresco-forms-controls-BaseFormControl.betterInlinePicker {
            > .control-row > .control > .alfresco-core-ProcessWidgets > .alfresco-lists-views-AlfListView > table > tbody > tr > td {
               padding: calc(@standard-line-height/4) @standard-column-width calc(@standard-line-height/4) 0;
            }
         }
      }
   }
}

Add some picker layout enhancements

Add some picker layout enhancements


.login-icon {
  padding-top: 100px;
  padding-bottom: 20px;
}

.uk-icon-very-large {
  font-size: 1000%;
  vertical-align: -22%;
}

.login-icon {
  padding-top: 80px;
  padding-bottom: 20px;
}

.uk-icon-very-large {
  font-size: 1000%;
  vertical-align: -22%;
}

Fix icon margin in sign in page

Fix icon margin in sign in page


/* Bug 958321 */

@font-face {
  font-family: X-LocaleSpecific;
  font-weight: normal;
  src: url('/media/fonts/l10n/DroidNaskh-Regular.eot?#iefix') format('embedded-opentype'),
       url('/media/fonts/l10n/DroidNaskh-Regular.woff') format('woff'),
       url('/media/fonts/l10n/DroidNaskh-Regular.ttf') format('truetype');
}

@font-face {
  font-family: X-LocaleSpecific;
  font-weight: bold;
  src: url('/media/fonts/l10n/DroidNaskh-Bold.eot?#iefix') format('embedded-opentype'),
       url('/media/fonts/l10n/DroidNaskh-Bold.woff') format('woff'),
       url('/media/fonts/l10n/DroidNaskh-Bold.ttf') format('truetype');
}

/* Bug 944269 */

* {
  letter-spacing: normal !important;
}
/* Fixes line height for all the headers */
h1,
h2,
h3,
h4,
h5,
h6,
.huge,
.large,
legend {
  line-height: 1.5 !important;
}

[ar] Increment line height on titles for Arabic language


.editor-container {
  height: calc(100vh - 10rem);
}

.transcript-editor {
  overflow-y: scroll;
}

.timestamp {

}

#content > .uk-grid {
  width: 95vw;
}

.editor-container {
  height: calc(100vh - 10rem);
}

.transcript-editor {
  overflow-y: scroll;
}

.timestamp {

}

.ql-editor {
  color: rgba(0, 0, 0, 0.8);
  font-size: 12pt;
}

#content > .uk-grid {
  width: 95vw;
}

Tweak the text color in the editor

Tweak the text color in the editor


.mx_UserPill {
    color: white;
    background-color: #76cfa6;
    padding: 2px 8px;
    border-radius: 16px;
}

.mx_RoomPill {
    background-color: white;
    color: #76cfa6;
    border: 1px solid #76cfa6;
    padding: 2px 8px;
    border-radius: 16px;
}

.mx_Markdown_BOLD {
    font-weight: bold;
}

.mx_Markdown_ITALIC {
    font-style: italic;
}

.mx_Markdown_CODE {
    padding: .2em 0;
    margin: 0;
    font-size: 85%;
    background-color: rgba(0,0,0,.04);
    border-radius: 3px;
}

.mx_Markdown_HR {
    color: rgba(0, 0, 0, 0.5);
    text-decoration: #e7e7e7 double line-through;
}

.mx_UserPill {
    color: white;
    background-color: #76cfa6;
    padding: 2px 8px;
    border-radius: 16px;
}

.mx_RoomPill {
    background-color: white;
    color: #76cfa6;
    border: 1px solid #76cfa6;
    padding: 2px 8px;
    border-radius: 16px;
}

.mx_Markdown_BOLD {
    font-weight: bold;
}

.mx_Markdown_ITALIC {
    font-style: italic;
}

.mx_Markdown_CODE {
    padding: .2em 0;
    margin: 0;
    font-size: 85%;
    background-color: rgba(0,0,0,.04);
    border-radius: 3px;
}

.mx_Markdown_HR {
    display: block;
    background: #e7e7e7;
}

.mx_Markdown_STRIKETHROUGH {
    text-decoration: line-through;
}

Add strikethrough and <hr> styles

Add strikethrough and <hr> styles


:root {
  --lighter:  #ccc;
  --lightest: #fff;
  --darker:   #999;
  --darkest:  #444;
  --background: pink;
}

header, footer { background: var(--darker) }

aside {
  --background: pink;
  background: pink;
}

aside {
  background: var(--background);
  display: block;
  background: pink;
}

:root {
  --lighter:  #ccc;
  --lightest: #fff;
  --darker:   #999;
  --darkest:  #444;
  --background: pink;
}

header, footer { background: var(--darker) }

aside { background: var(--background) }

Change background color for IE browsers

Change background color for IE browsers


/*
 * https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout
 *  https://www.codementor.io/karaluton/a-beginner-s-guide-to-css-grid-j27g9uqys?utm_swu=7100
*/

body {

  display: grid;
  grid-template-columns: 70% 30%;

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

header { grid-area: header; }
main   { grid-area: main;   }
aside  { grid-area: aside;  }
footer { grid-area: footer; }

/*
@media ( orientation : landscape ) {

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

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

/*
 * https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout
 * https://medium.com/@elad/supporting-css-grid-in-internet-explorer-b38669e75d66
 * https://www.codementor.io/karaluton/a-beginner-s-guide-to-css-grid-j27g9uqys?utm_swu=7100
*/

body {

  display: grid;
  grid-template-columns: 70% 30%;

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

header { grid-area: header; }
main   { grid-area: main;   }
aside  { grid-area: aside;  }
footer { grid-area: footer; }

/*
@media ( orientation : landscape ) {

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

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

Add link to css grid layout

Add link to css grid layout


.container {
  margin: 0 auto;
  max-width: 700px;
  background-color: #fff;
}

h1, h2, h3, h4, h5 {
  margin: 5px 0 0;
}

.flex {
  display: inline-block;
  vertical-align: top;
}

.flex.flex-44 {
  width: 44%;
  max-width: 44%;
}

.md-margin>div {
  margin: 10px;
}

@media (max-width: 700px;
) {
  .flex.flex-44 {
    width: 100%;
    max-width: 100%;
  }
}

Add custom styling for Demo

chore(Demo): Add custom styling for Demo


/* LeechBlock options CSS style */

body {
	background-color: #fff;
	color: #000;
}

hr {
	background-color: #888;
	color: #888;
	border: none;
	height: 1px;
}

legend {
	font-weight: bold;
}

#form-container {
	display: flex;
	justify-content: center;
	align-items: center;
}

#panes {
	display: inline-block;
}

@media (max-width: 720px) {
	.ui-widget {
		font-size: 12px;
	}
}

Add CSS for small screens

Add CSS for small screens


/* http://www.w3schools.com/cssref/css_colorsfull.asp */

.video_link {
	fill: none;
	stroke: #C0C0C0;
	stroke-dasharray: 2 4;
	stroke-width: 3px;
}

.btn {
	min-width: 30px;
}

.svg {
	float: left;
/* 	margin-top: 200px;  */
}

.first-rows {
	margin-bottom: 15px;
	margin-top: 20px;
	text-align: center;
}

.graph_images {
	cursor: pointer;
}

.rect_video {
	fill: none;
	display: none;
	opacity: 0.5;
	stroke-width: 4;
}

.word_cloud {
	display: none;
	cursor: pointer;
	font-size: 13px;
	color: #707070;
}

.node text {
	pointer-events: none;
}

#graph_container .tab-content {
	overflow-x:hidden;
	overflow-y:auto;
}

rect.primary {
	fill: #0088cc;
}

rect.secondary {
	fill: grey;
}

rect.fixed {
	fill: #f00;
}

Remove red color on fixed node

Remove red color on fixed node


body {
    padding-top: 65px;
}

.loginHeaderCube {
    margin-top: 15px;
}

textarea {
    height: 100%;
    width: 100%;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: border-box;    /* Firefox, other Gecko */
            box-sizing: border-box;         /* Opera/IE 8+ */
}

Make sure things are visible

Make sure things are visible


/* Start remove giant gap on bottom of pages*/
body {
  padding-bottom: 0;
}
.navbar {
  margin-bottom: 0;
}
/*End remove giant gap on bottom of pages*/

/*Remove time from date because it is irrelevant for us*/
.feed-date {
  display: inline-block;
  white-space: nowrap;
  max-width: 9ch;
  overflow: hidden;
  vertical-align: bottom;
}

/* Start remove giant gap on bottom of pages*/
body {
  padding-bottom: 0;
}
.navbar {
  margin-bottom: 0;
}
/*End remove giant gap on bottom of pages*/

/*Remove rounded borders on bottom navbar*/
.navbar {
  border-radius: 0;
}

/*Remove time from date because it is irrelevant for us*/
.feed-date {
  display: inline-block;
  white-space: nowrap;
  max-width: 9ch;
  overflow: hidden;
  vertical-align: bottom;
}

Remove rounded borders on bottom navbar

Theme: Remove rounded borders on bottom navbar


body {
    font-family: Optima;
    color: #333;
    margin: 0;
    padding: 0;
}

pre {
    overflow: auto;
}

#salutation {
    position: absolute;
    right: 1em;
    z-index: 100;
    color: #ccc;
}

div#navigation {
    width: 100%;
    height: auto;
}

div#navigation ul {
    width: 100%;
}

#content h1 {
    margin-left: 10px;
    margin-right: 10px;
}

#content h1.title {
    margin: 0 0 5px 0;
    padding: 0 10px;
    background-color: #ccc;
}

/*** Shared Icon Classes ***/

.icon {
    padding-left: 18px;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    background-image: url(/images/icons/shading.png);
}

.icon.only {
    display: block;
    overflow: hidden;
    padding-left: 18px;
    width: 0;
    float: right;
}

body {
    font-family: Optima;
    color: #333;
    margin: 0;
    padding: 0;
}

pre {
    overflow: auto;
}

#salutation {
    position: absolute;
    right: 1em;
    z-index: 100;
    color: #ccc;
}

div#navigation {
    width: 100%;
    height: auto;
}

div#navigation ul {
    width: 100%;
    height: 11px;
}

#content h1 {
    margin-left: 10px;
    margin-right: 10px;
}

#content h1.title {
    margin: 0 0 5px 0;
    padding: 0 10px;
    background-color: #ccc;
}

/*** Shared Icon Classes ***/

.icon {
    padding-left: 18px;
    background-repeat: no-repeat;
    background-position: 1px 1px;
    background-image: url(/images/icons/shading.png);
}

.icon.only {
    display: block;
    overflow: hidden;
    padding-left: 18px;
    width: 0;
    float: right;
}

Make sure the menu doesn't collapse if it happens to get empty


.is-fullheight {
  min-height: 100vh;
  background-color: white;
  border: 10px solid #00d1b2;
}

.governmentNotification {
  background-color: #f5f5f5;
  color: #586e75;
}

.governmentNotification .subtitle {
  font-size: 1.4em;
}

.governmentInfo {
  padding-bottom: 0.2em;
}

.governmentInfo span {
  font-size: 0.9em;
}

.contact {
  font-size: 1.2em;
}

.generalInfo .subtitle{
  font-weight: 600;
}

.thematicCategoriesWrap {
  padding-top: 0.25em;
}

.decisionText {
  word-wrap: break-word;
}

.is-fullheight {
  min-height: 100vh;
  background-color: white;
  border: 10px solid #00d1b2;
}

.governmentNotification {
  background-color: #f5f5f5;
  color: #586e75;
}

.governmentNotification .subtitle {
  font-size: 1.4em;
}

.governmentInfo {
  padding-bottom: 0.2em;
}

.governmentInfo span {
  font-size: 0.9em;
}

.contact {
  font-size: 1.2em;
}

.generalInfo .subtitle{
  font-weight: 600;
}

.thematicCategory {
  margin-left: auto !important;
  margin-right: auto !important;
}

.thematicCategoriesWrap {
  padding-top: 0.25em;
}

.decisionText {
  word-wrap: break-word;
}

Make tags to get centered

Make tags to get centered