.FBTraceColumn {
    float: left;
    width: 16.7%;
}

.FBTraceOption {
    cursor: default !important;
    border-color: #D7D7D7;
    -moz-border-radius: 4px 4px 0 0;
    background-color: #FFFFFF;
}
.FBTraceOption[checked="true"] {
    font-weight: bold;
}

Put trace options in panel (as well as options)

http://code.google.com/p/fbug/source/detail?r=541


/*
 * Copyright (C) 2013 salesforce.com, inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *         http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.THIS .modal-container {
    width: 50%;
    max-width: 640px;
    min-width: 480px;
}

.THIS .modal-header .title {
    padding: 1.5rem 1rem;
}

.THIS--large .modal-container {
    width: 90%;
    max-width: 960px;
    min-width: 640px;
}

/*
 * Copyright (C) 2013 salesforce.com, inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *         http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.THIS .modal-container {
    width: 50%;
    max-width: 640px;
    min-width: 480px;
}

.THIS .modal-header .title {
    padding: 1.5rem 1rem;
}

.THIS--large .modal-container {
    width: 90%;
    min-width: 640px;
}

Change the max-width for large flavor of uiModal. @bug W-2803930@


div.wy-side-nav-search {
    background-color: #7ebbff;
}

div.version {
    color: #ffffff !important;
    font-weight: bolder !important;
}

li.toctree-l1:not(.current) a {
    color: #f8f8f8 !important;
}

form.wy-form input {
    border: 3px solid #6eabef !important;
}

/* Lighten the header blue color */
div.wy-side-nav-search {
    background-color: #7ebbff;
}

/* White version text in header */
div.version {
    color: #ffffff !important;
    font-weight: bolder !important;
}

/* Blue border around the search bar */
form.wy-form input {
    border: 3px solid #6eabef !important;
}

/*
    ul.current selects only the sidebar ul. Otherwise,
    toctrees in the text get colored white, too
*/
ul.current li.toctree-l1:not(.current) a {
    color: #f8f8f8 !important;
}

/* Increase font size for code object names in navbar toctree */
a.reference.internal code.docutils.literal.notranslate {
    font-size: 85%;
}

/*
    Reduce margin at bottom of 'property' docs.
    Too much vertical whitespace previously.
*/
.rst-content dl.property {
    margin-bottom: 10px !important;
}

Tweak styles of docs theme

Tweak styles of docs theme


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

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

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

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

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

.node_name, .node_ip,
.node_env, .node_role,
.node_recipe {
    width: 16em;
}

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

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

table#nodes th { cursor: pointer; }

div.dataTables_info {
    float: right;
}

div.dataTables_filter {
    float: left;
}

input::-webkit-input-placeholder {
    color:#cdc9c9;
}
input:-moz-placeholder {
    color:#cdc9c9;
}

.expanded_node table{
    float: left;
    margin-right: 50px;
}

Set css styles for the expanded area

Set css styles for the expanded area


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

section {
  margin-top: 60px;
}

@media (min-width: 980px) {
  body {
    padding-top: 50px;
  }
}

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

section {
  margin-top: 60px;
}

.form-horizontal .control-label {
  margin-right: 20px
}

@media (min-width: 980px) {
  body {
    padding-top: 50px;
  }
}

Add margin to labels on horizontal forms


.dg input[type=checkbox] {
  display: block;
}

.dg {
  font: 13px;
  font-family: "Arial", "Helvetica", sans-serif;
}

.dg.main.a ul {
  height: auto;
}

.dg.main.taller-than-window {
  overflow: visible;
}

Change dat.gui css so that the control box does not change height on window resize


#editor {
    position: absolute;
    font-size: 15px;
    top: 40px;
    right: 0;
    bottom: 0;
    left: 0;
}

#output {
    padding: 8px;
    position: absolute;
    font-size: 15px;
    height: 141px;
    right: 0;
    bottom: 0;
    left: 0;
    border-top: 3px solid #ccc;
    background-color: #eee;
    overflow: auto;
    display: none;
}

.navbar li button {
    margin-left: 10px;
    margin-right: 10px;
}

.errorGutter {
    background-color: #ffcccc;
    color: #cc0000;
}

#editor {
    position: absolute;
    font-size: 15px;
    top: 40px;
    right: 0;
    bottom: 0;
    left: 0;
}

#output {
    padding: 8px;
    position: absolute;
    font-size: 15px;
    height: 143px;
    right: 0;
    bottom: 0;
    left: 0;
    border-top: 1px solid #ccc;
    background-color: #eee;
    overflow: auto;
    display: none;
    box-shadow: inset 0px 1px 10px rgba(0, 0, 0, 0.1);
}

.navbar li button {
    margin-left: 10px;
    margin-right: 10px;
}

.errorGutter {
    background-color: #ffcccc;
    color: #cc0000;
}

Change border on output box and add a shadow


Add padding to profile titles

Add padding to profile titles


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

footer {
    height: 15vh;
    background: #2a2730;
    padding-top: 20px;
    padding-bottom: 15px;
    color: white;
}

#favorite-btn {
    margin-top: 10px;
    margin-left: 0;
}

#comment-box {
    margin-top: 20px;
    margin-bottom: 10px;
}

#comment-box textarea {
    width: 100%;
}

#comment-box img{
    width: 5vw;
}

#tag-group {
    margin-top: 3px;
    margin-bottom: 10px;
}

.tag {
    margin: 3px;
}

html, body {
    height: 100%;
    width: 100%;
    background-color: #f5f5f5;
}

footer {
    height: 15vh;
    background: #2a2730;
    padding-top: 20px;
    padding-bottom: 15px;
    color: white;
}

#favorite-btn {
    margin-top: 10px;
    margin-left: 0;
}

#comment-box {
    margin-top: 20px;
    margin-bottom: 10px;
}

#comment-box textarea {
    width: 100%;
}

#comment-box img{
    width: 5vw;
}

#tag-group {
    margin-top: 3px;
    margin-bottom: 10px;
}

.tag {
    margin: 3px;
}

Edit background color for web

Edit background color for web


body {
  background: #F5F4F3 none repeat scroll 0% 0%;
}

.dropzone {
  border: 2px dashed rgba(0,0,0,0.3);
  border-radius: 5px;
  background: #FFF none repeat scroll 0% 0%
}

.nav-link {
  color: #FFF;
  font-size: 2em;
  margin-right: .5em;
}

body {
  background: #F5F4F3 none repeat scroll 0% 0%;
}

.dropzone {
  border: 2px dashed rgba(0,0,0,0.3);
  border-radius: 5px;
  background: #FFF none repeat scroll 0% 0%
}

.navbar {
  box-shadow: 0px 0px 10px 1px #000;
}

.nav-link {
  color: #FFF;
  font-size: 2em;
  margin-right: .5em;
}

Drop shadow on the nav bar

Drop shadow on the nav bar


body {
   color: black;
   font-family: sans-serif;
   margin: 15px;
   padding: 10px;
   padding-top: 0px;
   border: 2px #aaaaaa solid;
   border-radius: 10px;
}
hr {
   border: 1px solid #aaaaaa;
}
h1, h2 {
   border-radius: 5px;
   padding: 3px;
   border: 1px solid black;
}
h1 {
   background-color: darkGrey;
}
h2 {
   background-color: lightGrey;
}
table, td, th {
   border-collapse: collapse;
}
th {
   background-color: #dddddd;
   text-align: center;
}
th, td {
   border: 1px solid #aaaaaa;
   padding: 0.4em;
}
tr:nth-child(even) {
   background: white;
}
tr:nth-child(odd) {
   background: #eeeeee;
}
td.no-issues {
   background: lightGreen;
}
td.severity-major {
   background: lightCoral;
}
td.severity-minor {
   background: yellow;
}

body {
   color: black;
   font-family: sans-serif;
   margin: 15px;
   padding: 10px;
   padding-top: 0px;
   border: 2px #aaaaaa solid;
   border-radius: 10px;
}
hr {
   border: 1px solid #aaaaaa;
}
h1, h2 {
   border-radius: 5px;
   padding: 3px;
   border: 1px solid black;
}
h1 {
   background-color: darkGrey;
}
h2 {
   background-color: lightGrey;
}
table, td, th {
   border-collapse: collapse;
}
th {
   background-color: #dddddd;
   text-align: center;
}
th, td {
   border: 1px solid #aaaaaa;
   padding: 0.4em;
}
tr:hover td {
   background: lightblue;
}
tr:nth-child(even) {
   background: white;
}
tr:nth-child(odd) {
   background: #eeeeee;
}
td.no-issues {
   background: lightGreen;
}
tr:hover td.no-issues {
   background: #73BE73;
}
td.severity-major {
   background: lightCoral;
}
tr:hover td.severity-major {
   background: #C06666;
}
td.severity-minor {
   background: yellow;
}
tr:hover td.severity-minor {
   background: #CCCC00;
}

Add table row highlighting on hover.

Add table row highlighting on hover.


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

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

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

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

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

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

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

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

table#nodes th { cursor: pointer; }

div.dataTables_info {
    float: right;
}

div.dataTables_filter {
    float: left;
}

input::-webkit-input-placeholder {
    color:#cdc9c9;
}
input:-moz-placeholder {
    color:#cdc9c9;
}

Set the placeholder with a brighter color


body, h1, h2, h3, h4, h5, h6, p, p+p {
  font-family: "Helvetica Neue", "Helvetica", sans-serif;
  font-weight: 300;
}

code {
  font-family: "Courier New", "Courier", monospace;
}

.table {
  font-size: 10pt;
  font-weight: 400;
}

.table-hover > tbody > tr:hover {
  background-color: #FFFF00;
}

footer {
  float: left;
}

a.navbar-brand>img {
  width: 20px;
  height: 20px;
}

#search_container {
  text-align: right;
}

.well > .list-group {
  margin-bottom: 0px;
}

.flex-input-container {
  display: flex;
}

.flex-input-container > input {
  flex: 2;
  margin-left: 5px;
}

body, h1, h2, h3, h4, h5, h6, p, p+p {
  font-family: "Helvetica Neue", "Helvetica", sans-serif;
}

body, h1, h2, h3, h4, h5, h6, p, p+p {
  font-weight: 400;
}

code {
  font-family: "Courier New", "Courier", monospace;
}

.table {
  font-size: 10pt;
}

.table-hover > tbody > tr:hover {
  background-color: #FFFF00;
}

footer {
  float: left;
}

a.navbar-brand>img {
  width: 20px;
  height: 20px;
}

#search_container {
  text-align: right;
}

.well > .list-group {
  margin-bottom: 0px;
}

.flex-input-container {
  display: flex;
}

.flex-input-container > input {
  flex: 2;
  margin-left: 5px;
}

Use default font-weight, reduce only for headings.


.icon {
  height: 2.4em;
}

/* this bit borrowed from the guardian */

.player__results {
  min-width: 1.875rem;
  font-size: 0;
  white-space: nowrap
}

.player-result {
  display: inline-block;
  top: 0;
  vertical-align: middle;
  -webkit-border-radius: 0.25rem;
  border-radius: 0.25rem;
  margin-left: 0.125rem;
  height: 1rem;
  width: 0.4rem;
  cursor: help
}

.player-result:first-child {
  margin-left: 0
}

.player-result--win {
  background-color: #CEA035;
  margin-top: -0.375rem
}

.player-result--draw {
  background-color: #666;
  height: 0.4rem
}

.player-result--lose {
  background-color: #B30001;
  margin-top: 0.375rem
}

.icon {
  height: 2.4em;
}

/* this bit borrowed from the guardian */

.player__results {
  min-width: 1.875rem;
  font-size: 0;
  white-space: nowrap
}

.player-result {
  display: inline-block;
  top: 0;
  vertical-align: middle;
  -webkit-border-radius: 0.25rem;
  border-radius: 0.25rem;
  margin-left: 0.125rem;
  height: 1rem;
  width: 0.4rem;
  cursor: help
}

.player-result:first-child {
  margin-left: 0
}

.player-result--win {
  background-color: #356921;
  margin-top: -0.375rem
}

.player-result--draw {
  background-color: #666;
  height: 0.4rem
}

.player-result--lose {
  background-color: #B30001;
  margin-top: 0.375rem
}

Make player form win green

Make player form win green


div.log {
    border-bottom: #DDD 1px solid;
    width: 3000px;
}

div.raw {
    border-left: red 4px solid;
}

div.warn {
    background-color: lightyellow;
}

div.error {
    background-color: maroon;
    color: lightgray;
}

div.info {
    background-color: lightblue;
}

div.verbose {
    color: darkgray;
}

.log span {
    display: inline-block;
    height: 15px;
    margin-right: 4px;
    margin-left: 4px;
    overflow: hidden;
}

span.pid, span.tid {
    width: 5ch;
    text-align: right;
}

span.tag {
    width: 10ch;
}

span.ts {
    display: none;
}

div.log {
    border-bottom: #DDD 1px solid;
    width: 3000px;
}

div.raw {
    border-left: red 4px solid;
    padding-left: 4px;
}

div.warn {
    background-color: lightyellow;
}

div.error {
    background-color: maroon;
    color: lightgray;
}

div.info {
    background-color: lightblue;
}

div.verbose {
    color: darkgray;
}

.log span {
    display: inline-block;
    height: 15px;
    margin-right: 4px;
    margin-left: 4px;
    overflow: hidden;
}

span.pid, span.tid {
    width: 5ch;
    text-align: right;
}

span.tag {
    width: 10ch;
}

span.ts {
    display: none;
}

Tweak css for unparsed lines

Tweak css for unparsed lines


header h1 {
    font-family: 'Raleway', sans-serif;
    font-size: 72pt;
    text-align: center;
}

nav a
{
    display: inline-block;
    font-size: 14pt;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
}

nav
{
    text-align: center;
}

header
{
    margin-bottom: 3.0em;
}

.gallery-image
{
    text-align: center;
    width: 100%;
}

.gallery-image>p
{
    white-space: pre-line;
}

footer {
    text-align: center;
    margin-top: 2.0em;
    padding-top: 2.0em;
    border-top: 1px solid #eee;
    color: #aaa;
    white-space: pre-line;
    margin-bottom: 1.0em;
}

nav a
{
    display: inline-block;
    margin-right: 1.0em;
    margin-left: 1.0em;
}

header h1 a
{
    color: black;
    text-decoration: none;
}

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

.block-gallery-list a.active img
{
    opacity: 0.4;
}

.image-navigation-bar
{
    overflow: hidden;
    font-size: 1.3em;
    margin-top: 0.5em;
    text-align: right;
}

.image-navigation-bar .back
{
    float: left;
}

.container
{
    width: 849px;
}

.page-section
{
    clear: both;
    margin-bottom: 1.0em;
}

a:hover
{
    text-decoration: none;
}

Move CSS into its own file

Move CSS into its own file


/*
Date: 24 Fev 2015
Author: Pedro Oliveira <kanytu@gmail . com>
*/

.hljs
{
    color: #A9B7C6;
    background: #282b2e;
    display: block;
    overflow-x: auto;
    padding: 0.5em;
    webkit-text-size-adjust: none;
}
.hljs-number
{
    color: #6897BB;
}

.hljs-keyword, .hljs-deletion
{
    color: #CC7832;
}
.hljs-javadoc
{
    color: #629755;
}
.hljs-comment
{
    color: #808080;
}
.hljs-annotation
{
    color: #BBB529;
}
.hljs-string, .hljs-addition
{
    color: #6A8759;
}
.hljs-function .hljs-title, .hljs-change
{
    color: #FFC66D;
}
.hljs-tag .hljs-title, .hljs-doctype
{
    color: #E8BF6A;
}
.hljs-tag .hljs-attribute
{
    color: #BABABA;
}
.hljs-tag .hljs-value
{
    color: #A5C261;
}

Use two spaces for indention

Use two spaces for indention


* {
  margin: 0;
  padding: 0; }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  margin: 0 auto;
  text-align: center;
  width: 41em; }
  body h1 {
    margin: 1em 0 2em 0;
    text-align: center; }

.left-column {
  display: inline-block;
  text-align: left;
  width: 20em; }
  .left-column .mockup-page {
    box-shadow: 0 0 5px 0px #999;
    margin: 0 auto;
    padding: 0.001em; }
    .left-column .mockup-page section {
      border: solid 1px #ccc;
      color: #999;
      font-family: serif;
      font-size: 0.8em;
      margin: 0.4em;
      padding: 0.2em 0.4em; }

.right-column {
  display: inline-block;
  padding: 0 2em;
  text-align: left;
  vertical-align: top;
  width: 20em; }
  .right-column pre {
    font-size: 0.9em;
    overflow: auto;
    margin: 0 auto;
    padding: 0; }
  .right-column input {
    left: 3em;
    position: relative;
    top: 0.5em; }
    .right-column input[type='range'] {
      width: 5em; }
  .right-column .css-code {
    display: inline-block;
    width: 12em; }

button {
  margin-top: 4em;
  padding: 0.4em 1.4em; }

Add ghost file (will be removed in a moment)


.zuul-change {
    margin-bottom: 10px;
}

.zuul-change-id {
    float: right;
}

.zuul-job-result {
    float: right;
    width: 70px;
    height: 15px;
    margin: 2px 0 0 0;
}

.zuul-change-total-result {
    height: 10px;
    width: 100px;
    margin: 5px 0 0 0;
}

.zuul-spinner,
.zuul-spinner:hover {
    opacity: 0;
    transition: opacity 0.5s ease-out;
    cursor: default;
    pointer-events: none;
}

.zuul-spinner-on,
.zuul-spinner-on:hover {
    opacity: 1;
    transition-duration: 0.2s;
    cursor: progress;
}

.zuul-change-cell {
    padding-left: 5px;
}

.zuul-change-job {
    padding: 2px 8px;
}

.zuul-job-name {
    font-size: small;
}

.zuul-non-voting-desc {
    font-size: smaller;
}

.zuul-patchset-header {
    font-size: small;
    padding: 8px 12px;
}

.zuul-change {
    margin-bottom: 10px;
}

.zuul-change-id {
    float: right;
}

.zuul-job-result {
    float: right;
    width: 70px;
    height: 15px;
    margin: 2px 0 0 0;
}

.zuul-change-total-result {
    height: 10px;
    width: 100px;
    margin: 0;
    display: inline-block;
    vertical-align: middle;
}

.zuul-spinner,
.zuul-spinner:hover {
    opacity: 0;
    transition: opacity 0.5s ease-out;
    cursor: default;
    pointer-events: none;
}

.zuul-spinner-on,
.zuul-spinner-on:hover {
    opacity: 1;
    transition-duration: 0.2s;
    cursor: progress;
}

.zuul-change-cell {
    padding-left: 5px;
}

.zuul-change-job {
    padding: 2px 8px;
}

.zuul-job-name {
    font-size: small;
}

.zuul-non-voting-desc {
    font-size: smaller;
}

.zuul-patchset-header {
    font-size: small;
    padding: 8px 12px;
}

Status: Use vertical-align for progress bar instead of margin

This way the progress bar is always aligned with the change id
on the left. Right now this renders exactly the same, but it
seems easier to maintain.

Change-Id: I73c0bf59f9243eb4194f5235275dd68eedb4b404


.form-horizontal .form-group {
    margin-bottom: 5px;
}

.form-control:not(textarea),
.select2-container--default .select2-selection--single {
    height: 30px !important;
    padding: 5px 10px !important;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.form-control + .input-group-btn > button,
.form-control + .input-group-btn > .btn-file,
.control-label + .input-group .btn {
    padding: 4px 10px;
}

.form-horizontal .form-group {
    margin-bottom: 5px;
}

.form-control:not(textarea, input[type="tel"], input[name*="daterangepicker"]),
.select2-container--default .select2-selection--single {
    height: 30px !important;
    padding: 5px 10px !important;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.form-control + .input-group-btn > button,
.form-control + .input-group-btn > .btn-file,
.control-label + .input-group .btn {
    padding: 4px 10px;
}

Fix css for condensed form inputs

Fix css for condensed form inputs


/* header styling */
.header {
  overflow: hidden;
  background-color: #333;
  padding: 20px 10px;
}

.header a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 18px;
  line-height: 25px;
  border-radius: 4px;
}

.header a.title {
  font-size: 25px;
  font-weight: bold;
}

.header a.title:hover {
  font-size: 25px;
  font-weight: bold;
  color: #f2f2f2;
  text-decoration: none;
}

body {
  font-family: Arial;
  font-size: 17px;
  margin: 0;
}

div.center {
    text-align: center;
}

div.select {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    padding: 30px;
}

div.bar-chart {
    margin-left: auto;
    margin-right: auto;
    width: 75%;
}

label {
    padding-right: 15px;
}

Revert "Add padding to checkboxes."

Revert "Add padding to checkboxes."

This reverts commit 58896eca0c927f98572093fc54e5d7f0e4661fbb.


.main.dark .list {
  background-color: black;
  color: gray;
}

.main.dark .list-item.selected {
  color: white;
}

.main.dark .menu-button-content {
  stroke: white;
}

.main.dark .menu-button.active > .menu-button-content,
.main.dark.list-visible .menu-button-content {
  stroke: gray;
}

.main.dark .settings-button-content {
  fill: white;
}

.main.dark .settings-button.active > .settings-button-content,
.main.dark.preferences-visible .settings-button-content {
  fill: gray;
}

.main.dark .list {
  background-color: black;
  border-color: gray;
  color: gray;
}

.main.dark .list-item.selected {
  color: white;
}

.main.dark .menu-button-content {
  stroke: white;
}

.main.dark .menu-button.active > .menu-button-content,
.main.dark.list-visible .menu-button-content {
  stroke: gray;
}

.main.dark .settings-button-content {
  fill: white;
}

.main.dark .settings-button.active > .settings-button-content,
.main.dark.preferences-visible .settings-button-content {
  fill: gray;
}

Set border color of list in dark theme

Set border color of list in dark theme


body {
    background-color: #fafafa;
}

h1 .ds-primary-title {
    color: gray;
}

.well,
.ds-grid .well,
.breadcrumb {
    background-color: white;
}

.well .ds-singlestat h3 {
    color: #666;
}

#ds-tooltip {
    color: black;
    background-color: white;
    border: 1px solid #888;
}

Fix flot tooltip in 'snow' theme

Fix flot tooltip in 'snow' theme


@charset "UTF-8";

@import url(fonts/crimson/crimson.css);

body {
    background-image: url(img/background.jpg);
    background-size: 100%;
}

@charset "UTF-8";

body {
    background-image: url(img/background.jpg);
    background-size: 100%;
}

Delete reference to removed font.

Delete reference to removed font.


/* CSS file for OTF Mapping WebApp */

html, body
{
	margin: 0;			/* Remove body margin/padding */
	padding: 0;
	height: 100%;
}

body {
	background-color: #FFF;
	padding-top: 50px;
	padding-bottom: 100px;
}

p {
  margin: 0 0 0px;
}

.panel-heading {
padding: 5px 5px;
border-bottom: 1px solid transparent;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}

.panel-body {
padding: 7px;
}

/** from bootstrap.css - changes margin between panels in a group */
.panel-group {
margin-bottom: 10px;
}

/** from bootstrap.css - changes panel titles from 16 to 14 px */
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 15px;
  color: inherit;
}

/** from bootstrap.css - changes font-size from 14 to 13 px */
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}

/* CSS file for OTF Mapping WebApp */

html, body
{
	margin: 0;			/* Remove body margin/padding */
	padding: 0;
	/**height: 100%;*/
}

body {
	background-color: #FFF;
	padding-top: 50px;
	padding-bottom: 40px;
}

p {
  margin: 0 0 0px;
}

.panel-heading {
padding: 5px 5px;
border-bottom: 1px solid transparent;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}

.panel-body {
padding: 7px;
}

/** from bootstrap.css - changes margin between panels in a group */
.panel-group {
margin-bottom: 10px;
}

/** from bootstrap.css - changes panel titles from 16 to 14 px */
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 15px;
  color: inherit;
}

/** from bootstrap.css - changes font-size from 14 to 13 px */
body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}

.navbar {
  min-height: 30px;
}

Fix to allow scrolling to make data at the bottom visible. Css modifications for footer.


body {
    height: 135px;
    background-color: #EFEFEF;
    width: 400px;
}

#notifications {
    margin-bottom: 5px;
}

.container {
    margin-top: 20px;
}

.select2 {
    width: 300px;
}

ul.select2-results {
 max-height: 70px;
}

body {
    height: 135px;
    background-color: #EFEFEF;
    width: 400px;
    min-height: 400px;
}

#notifications {
    margin-bottom: 5px;
}

.container {
    margin-top: 20px;
}

.select2 {
    width: 300px;
}

ul.select2-results {
 max-height: 300px;
}

Increase display height of container and select2 results


ul.keyLangValuePairs,ul.keyLangValuePairs>li {
  list-style: none;
}

ul.keyLangValuePairs>li>textarea {
  width: 70%;
  height: 75px;
  margin-left: 5px;
  margin-right: 5px;
}

ul.keyLangValuePairs>li>input {
  width: 70%;
}

ul.keyLangValuePairs>li>div {
  display: block;
  float: right;
  max-width: 20%;
}

a.kvLangPairDeleteButton {
  line-height: 0;
  font-size: 0;
  color: transparent;
}

a.kvLangPairDeleteButton:before {
  content: url("../img/admin/icon_deletelink.gif")
}

a.kvLangPairDeleteButtonHidden {
  visibility: hidden;
}

.lang_name {
	color: #7CA0C7;
}

ul.keyLangValuePairs,ul.keyLangValuePairs>li {
  list-style: none;
  overflow: hidden;
}

ul.keyLangValuePairs>li>textarea {
  width: 70%;
  height: 75px;
  margin-left: 5px;
  margin-right: 5px;
}

ul.keyLangValuePairs>li>input {
  width: 70%;
}

ul.keyLangValuePairs>li>div {
  display: block;
  float: right;
  max-width: 20%;
}

a.kvLangPairDeleteButton {
  line-height: 0;
  font-size: 0;
  color: transparent;
}

a.kvLangPairDeleteButton:before {
  content: url("../img/admin/icon_deletelink.gif")
}

a.kvLangPairDeleteButtonHidden {
  visibility: hidden;
}

.lang_name {
	color: #7CA0C7;
}

Fix bad alignment on dict widgets when the width of the window is decreased.


*{
  background-color: #FFFFE0;
}

.Heading{
  font-family: Arial, Verdana, sans-serif;
  position: relative;
  text-align: center;
}

p{
  width: 48%;
  margin: 5px;
  margin-top: 20px;
  float: left;
/*  padding: 10px 0px 5px 0px;*/
  background-color: #EFEFEF;
  text-align: left;
}

/*#Strings{
  height: 50px;
}

#Integers{
  height: 50px;
}

#Arrays{
  height: 100px;
}

#Hashes{
  height: 100px;
}*/

*{
  background-color: #FFFFE0;
}

.Heading{
  font-family: Arial, Verdana, sans-serif;
  position: relative;
  text-align: center;
}

p{
  width: 48%;
  margin: 5px;
  margin-top: 20px;
  float: left;
  background-color: #EFEFEF;
  text-align: left;
}

/*#Strings{
  height: 50px;
}

#Integers{
  height: 50px;
}

#Arrays{
  height: 100px;
}

#Hashes{
  height: 100px;
}*/

Edit css to swap class/id calls

Edit css to swap class/id calls


body {
  padding: 0;
  border: 0;
  margin: 0;
}
#div-container-for-title-and-board {
  background-color: black;
}
#div-title-west {
  background-color: cyan;
  display: none;
}
#div-title-north {
  background-color: blue;
}
#div-board-area {
  background-color: grey;
  display: inline;
}
#div-info-south {
  background-color: red;
}
#div-info-east {
  background-color: pink;
  float: right;
  display:none;
}
#button-logo-west{
  width: 10%;
}
#button-new-game-west{
  width: 10%;
}
#button-full-screen-west{
  width: 10%;
}
#button-logo-north{
  height: 10%;
}
#button-new-game-north{
  height: 10%;
}
#button-full-screen-north{
  height: 10%;
}

body {
  padding: 0;
  border: 0;
  margin: 0;
}
#div-outer-vertical-flexbox {
  display: flex;
  flex-direction: column;
  background-color: black;
}
#div-inner-horizontal-flexbox {
  display: flex;
  flex-direction: row;
  order: 2;
  background-color: white;
}
#div-title-north {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: stretch;
  order: 1;
  background-color: blue;
}
#div-title-west {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  order: 1;
  background-color: cyan;
  display: none;
}
#div-board-area {
  order: 2;
  background-color: grey;
  display: inline;
}
#div-info-east {
  order: 3;
  background-color: pink;
  display:none;
}
#div-info-south {
  order: 3;
  background-color: red;
}
#button-logo-west{
  order: 1;
}
#button-new-game-west{
  order: 2;
}
#button-full-screen-west{
  order: 3;
}
#button-logo-north{
  order: 1;
}
#button-new-game-north{
  order: 2;
}
#button-full-screen-north{
  order: 3;
}

Restructure css following switch to flexboxes


.navbar {
  background-color: black;
}

.fill-height {
    min-height: 100%;
    height:auto !important; /* cross-browser */
    height: 100%; /* cross-browser */
}
#number-records-nd {
    font-size: 55px;
}
.dc-chart g.row text {
    fill: black;
}
#map{
  position: relative;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 700px;
}

.navbar-brand{
  font-size: 3em;
}

.info {
    padding: 6px 8px;
    font: 14px/16px Arial, Helvetica, sans-serif;
    background: white;
    background: rgba(255,255,255,0.8);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
}
.info h4, h6 {
    margin: 0 0 5px;
    color: #777;
}

.chart-wrapper .chart-stage {
    padding: 10px 10px;
}

.navbar {
  background-color: black;
}

.fill-height {
    min-height: 100%;
    height:auto !important; /* cross-browser */
    height: 100%; /* cross-browser */
}
#number-records-nd {
    font-size: 55px;
}
.dc-chart g.row text {
    fill: black;
}
#map{
  position: relative;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.navbar-brand{
  font-size: 3em;
}

.info {
    padding: 6px 8px;
    font: 14px/16px Arial, Helvetica, sans-serif;
    background: white;
    background: rgba(255,255,255,0.8);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
}
.info h4, h6 {
    margin: 0 0 5px;
    color: #777;
}

.chart-wrapper .chart-stage {
    padding: 10px 10px;
}

Change the map css to fill 100% of height


/* Custom CSS */
/* Change coloured bars at top and bottom of pages */
 .comments-container #disqus_thread:before
,.entry+.list-container:before
,.entry-nav-links:before
,.prev-entry~.next-entry:before
,.site-header:after
,.entry-header:after
,.footer:before {
  content:"";
  display:block;
  border-bottom:.11111em solid #2a698b;
  width:4em
}

Change yellow lines to blue

Change yellow lines to blue


/* 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/. */

@media only screen and (max-width: 730px) {
   #things-view {
     background: #5d9bc7;
   }
 }

#things-view {
  height: 100%;
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
  box-sizing: border-box;
}

#things-container {
  text-align: center;
  font-size: 1.6rem;
  color: #fff;
  max-height: 100%;
  height: 100%;
  overflow: auto;
}

#things {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  max-height: 100%;
}

#add-button {
  bottom: 2rem;
  right: 2rem;
  background-image: url('../optimized-images/add.svg');
}

/* 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/. */

#things-view {
  height: 100%;
  box-sizing: border-box;
}

#things-container {
  text-align: center;
  font-size: 1.6rem;
  color: #fff;
  max-height: 100%;
  height: 100%;
  overflow: auto;
}

#things {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  max-height: 100%;
}

#add-button {
  bottom: 2rem;
  right: 2rem;
  background-image: url('../optimized-images/add.svg');
}

Remove padding from Things screen

Remove padding from Things screen


/* Small devices (portrait and landscape phones, less than 768px)
   No media query since this is the default */

emu-example {
  margin-left: 0;
  margin-right: 0;
}

pre {
  max-width: 100%;
}

emu-grammar {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  white-space: nowrap;
}

emu-production {
  margin-left: 0;
  margin-right: 0;
}

emu-gmod emu-t {
  margin-left: 1ex;
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  emu-grammar {
    margin-left: 5ex;
  }
}

/* Ecmarkup's breakpoint for showing the menu */
@media (max-width: 1000px) {
  /* Move all content down to accomodate the menu button */
  #spec-container {
    margin-top: 54px;
  }
}

/* Small devices (portrait and landscape phones, less than 768px)
   No media query since this is the default */

emu-example {
  margin-left: 0;
  margin-right: 0;
}

pre {
  max-width: 100%;
}

emu-grammar {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  white-space: nowrap;
}

emu-production {
  margin-left: 0;
  margin-right: 0;
}

emu-gmod emu-t {
  margin-left: 1ex;
}

emu-opt {
  margin-right: 0;
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  emu-grammar {
    margin-left: 5ex;
  }
}

/* Ecmarkup's breakpoint for showing the menu */
@media (max-width: 1000px) {
  /* Move all content down to accomodate the menu button */
  #spec-container {
    margin-top: 54px;
  }
}

Remove right margin from opt modifiers

Remove right margin from opt modifiers

Terminals and non-terminals already have right margin, so the margin on
opt modifiers is redundant.


a.link-btn {
  font-size: 0.9em;
  font-weight: 200;
  background: #f0f0f0;
  background: linear-gradient(0deg, #f0f0f0, #fefefe);
  box-shadow: 0px 1px 1px #eee;
  border: 1px solid #aaa;
  border-radius: 2px;
  padding: 10px 12px;
  cursor: pointer;
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  border-bottom: 2px solid #aaa;
  color:#232323;
  width:276px;
  margin-left:104px;
}
a.link-btn:hover {
  background: linear-gradient(0deg, #e8e8e8, #f8f8f8);
}

Add basic styling for "link to" buttons

Add basic styling for "link to" buttons


.icon {
  display: inline-block;
  margin-right: 0.3rem;
  height: 32px;
  width: 32px;

  background: transparent url("../images/icon.png") no-repeat center center;

  vertical-align: text-top;
}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {

  .icon {
    background-image: url("../images/icon2x.png");
    background-size: 32px 32px;
  }

}

.icon {
  display: inline-block;
  margin-right: 0.3rem;
  height: 32px;
  width: 32px;

  background: transparent url("../images/icon.png") no-repeat center center;

  vertical-align: text-top;
}

@media (min-resolution: 144dpi) {

  .icon {
    background-image: url("../images/icon2x.png");
    background-size: 32px 32px;
  }

}

Remove the extra Webkit stuff

Remove the extra Webkit stuff


.galereya-cats.open .galereya-cats-item {
    padding: 1px 25px 1px 10px;
}

.galereya-cell, .galereya-cell-img {
    width: 300px;
}

    .galereya-cell-desc {
        display: block;

        filter: alpha(opacity=0);
        background: #000;
    }

.galereya-cell:hover {}

    .galereya-cell:hover .galereya-cell-desc {
        filter: alpha(opacity=90);
    }

.galereya-slider-nav { filter: alpha(opacity=5); }
.galereya-slider-nav:hover { filter: alpha(opacity=15); }

.galereya-slider-play,
.galereya-slider-close,
.galereya-slide-loader {
    filter: alpha(opacity=15);
}
.galereya-slider-play:hover,
.galereya-slider-close:hover {
    filter: alpha(opacity=30);
}

.galereya-slider-desc { filter: alpha(opacity=90); background: #000; }

Remove excessive tabulation in CSS

Remove excessive tabulation in CSS


/*
Copyright 2016 OpenMarket Ltd

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

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

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

.mx_TextualEvent.mx_MemberEventListSummary_summary {
    font-size: 14px;
}

.mx_MemberEventListSummary_avatars {
    display: inline-block;
    margin-right: 8px;
    padding-top: 8px;
    line-height: 12px;
}

.mx_MemberEventListSummary_avatars .mx_BaseAvatar {
    margin-right: -4px;
    cursor: pointer;
}

.mx_MemberEventListSummary_toggle {
    color:#76cfa6;
    cursor:pointer;
}

Add CSS for mlist truncation

Add CSS for mlist truncation

matrix-org/matrix-react-sdk#544


@import url(../../Source/Widgets/Viewer/Viewer.css);
@import url(../../Source/Widgets/lighter.css);
@import url(../../Source/Widgets/checkForChromeFrame.css);

body {
    height: 100%;
    width: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    background: #000;
}

.fullWindow {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    font-family: sans-serif;
}

.loadingIndicator {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -33px;
    margin-left: -33px;
    width: 66px;
    height: 66px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(Images/ajax-loader.gif);
}

@import url(../../Source/Widgets/widgets.css);
@import url(../../Source/Widgets/lighter.css);

body {
    height: 100%;
    width: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    background: #000;
}

.fullWindow {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    font-family: sans-serif;
}

.loadingIndicator {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -33px;
    margin-left: -33px;
    width: 66px;
    height: 66px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(Images/ajax-loader.gif);
}

Fix model test app after merge

Fix model test app after merge


Add reference to style in toc extension

Add reference to style in toc extension


h1, h2, h3, h4, h5, h6, p, body {
	font-family: 'Raleway', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 300;
}

.page-header {
	margin-bottom: 0;
}

.input-group-addon a {
	cursor: pointer;
}

.section-header {
	border-bottom: 1px solid #919191;
}

.item-listing {
	width: 100%;
	min-height: 125px;
}

.featured-item {
	height: 125px;
}

.item {
	border: 1px solid #919191;
	padding: 6px;
}

.glyphicon {
	margin-right: 6px;
}

.centered {
	text-align: center;
}

.add-item {
	padding: 2px;
}

h1, h2, h3, h4, h5, h6, p, body {
	font-family: 'Raleway', 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 300;
}

.page-header {
	margin-bottom: 0;
}

.input-group-addon a {
	cursor: pointer;
}

.section-header {
	border-bottom: 1px solid #919191;
}

.item-listing {
	width: 100%;
	min-height: 125px;
}

.featured-item {
	height: 125px;
}

.item {
	border: 1px solid #919191;
	padding: 6px;
}

.glyphicon {
	margin-right: 6px;
}

.centered {
	text-align: center;
}

.add-item {
	padding: 2px;
}

Add Segoe UI as a fallback font.

Add Segoe UI as a fallback font.


body {
  font-size: 16px;
  font-family: Helvetica, Arial, sans-serif;
  line-height: 1.5;
  background-color: #999;
  color: #008080;
}

h1 {
  font-size: 3em;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 5px;
}

p {
  margin-top: 1em;
  font-family: Georgia, 'Times New Roman', serif;
  text-align: center;
}

body {
  font-size: 16px;
  font-family: Helvetica, Arial, sans-serif;
  line-height: 1.5;
  background-color: #999;
  color: #e6e6e6;
}

h1 {
  font-size: 3em;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0.5em;
  color: #008080;
}

p {
  margin-top: 1em;
  font-family: Georgia, 'Times New Roman', serif;
  text-align: center;
}

Adjust colouring and unit of letter spacing from px to em


/* FORMS */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 1em;
  margin: 0;
}

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button;
}

[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
  height: auto;
}

[type='search'] {
  outline-offset: -2px;
  -webkit-appearance: textfield;
}

[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}

progress {
  max-width: 100%;
  vertical-align: middle;
}

/* FORMS */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 1em;
  margin: 0;
}

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button;
}

[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
  height: auto;
}

[type='search'] {
  outline-offset: -2px;
  -webkit-appearance: textfield;
}

[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}

progress {
  max-width: 100%;
  vertical-align: baseline;
}

Correct vertical align of progress element


body { font: 13px sans-serif; color: #474739; padding: 0; margin: 0 }

#chart-and-ping { position: relative }
#ping { font-size: 60px; position: absolute; top: 0; left: 0; padding: 10px }
#chart > svg { height: 300px; font-size: 9px;
    background-image: linear-gradient(#fff 0, #F2F1D3 100%);
    background-image: -webkit-linear-gradient(#fff 0, #F2F1D3 100%);
    background-image: -moz-linear-gradient(#fff 0, #F2F1D3 100%) }
#chart > svg > rect { fill: #474739 }

#fork-me > img { position: absolute; top: 0; right: 0; border: 0 }

body { font: 13px sans-serif; color: #474739; padding: 0; margin: 0 }

#chart-and-ping { position: relative }
#ping { font-size: 60px; position: absolute; top: 0; left: 0; padding: 10px }
#chart > svg { height: 300px; font-size: 9px;
    background-image: linear-gradient(#fff 0, #F2F1D3 100%);
    background-image: -webkit-linear-gradient(#fff 0, #F2F1D3 100%);
    background-image: -moz-linear-gradient(#fff 0, #F2F1D3 100%);
    box-shadow: 0 0 10px #aaa }
#chart > svg > rect { fill: #474739 }

#fork-me > img { position: absolute; top: 0; right: 0; border: 0 }

Make the chart to drop a shadow

Make the chart to drop a shadow


@import "./variables.css";

.base {
  font-size: 100%;
  font-family: var(--font-family-base);
  line-height: var(--line-height-base);
  color: var(--text-color);
}

@import "style:@sanity/base/theme/variables";

.base {
  font-size: 100%;
  font-family: var(--font-family-base);
  line-height: var(--line-height-base);
  color: var(--text-color);
}

Use role name for import over local path


html {
  height: 100%
}
body {
  min-height: 100%;
  display: flex;
  flex-flow: column;
}
.flexrow {
  display: flex;
  flex-flow: row;
}
.flexrow > * {
  flex: 1;
}
.bar {
  flex: none;
  height: 48px;
}
.bar input {
  font-size: 40px;
}
.small-bar {
  flex: none;
  height: 24px;
}
.region {
  flex: 1 1 100px;
  overflow-y: scroll;
}
.slack-message {
  display: flex;
  flex-flow: column;
  border: 1px solid gray;
  margin: 4px;
  padding: 4px;
}
.dingroll-message {
  display: flex;
  flex-flow: column;
  border: 1px solid gray;
  margin: 2px 0;
}
.new-dingroll-message {
  display: flex;
  flex-flow: row;
  border: 1px solid gray;
  margin: 2px 0;
}
.tag-line {
  display: flex;
  flex-flow: row;
}

html {
  height: 100%
}
body {
  min-height: 100%;
  display: flex;
  flex-flow: column;
}
.flexrow {
  display: flex;
  flex-flow: row;
}
.flexrow > * {
  flex: 1;
}
.bar {
  flex: none;
  height: 48px;
}
.bar input {
  font-size: 40px;
}
.small-bar {
  flex: none;
  height: 24px;
}
.region {
  flex: 1 1 100px;
  margin: 0;
  overflow-y: scroll;
}
.slack-message {
  display: flex;
  flex-flow: column;
  border: 1px solid gray;
  margin: 4px;
  padding: 4px;
}
.dingroll-message {
  display: flex;
  flex-flow: column;
  border: 1px solid gray;
  margin: 2px 0;
}
.new-dingroll-message {
  display: flex;
  flex-flow: row;
  border: 1px solid gray;
  margin: 2px 0;
}
.tag-line {
  display: flex;
  flex-flow: row;
}

Remove margin on regions (ie. day list)

Remove margin on regions (ie. day list)


.bg-white {
  background-color: white;
}
.rounded-corners {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;

  box-shadow: 0 0 200px 100px rgba(0,0,0,0.05);
}

body {
  background-color: hsla(60, 100%, 97%, 1);
}

#shortcut {
  position: fixed;
  top: 0.0em;
  left: calc( -112.391px + 1.5em );
  transform: rotate( -90deg );
  transform-origin: bottom right;
  /* background-color: hsla(60, 100%, 97%, 1); /*/
}

.bg-white {
  background-color: white;
}
.rounded-corners {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;

  box-shadow: 0 0 400px 300px hsla(9, 100%, 95%, 1);
}

body {
  background-color: hsla(60, 100%, 97%, 1);
}

#shortcut {
  position: fixed;
  top: 0.0em;
  left: calc( -112.391px + 1.5em );
  transform: rotate( -90deg );
  transform-origin: bottom right;
  /* background-color: hsla(60, 100%, 97%, 1); /*/
}

Make the drop-shadow bigger and red

Make the drop-shadow bigger and red


body {
  margin: 0;
  position: relative;
}

a, a:active {
  color: #888;
  text-decoration: none;
}

a:hover {
  color: #888;
  text-decoration: underline;
}

a:visited {
  color: #444;
}

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

.hid {
  display: none;
}

#info {
  background-color: #ffffff;
  bottom: 90px;
  opacity: 0.6;
  padding: 4px;
  position: absolute;
  right: 20px;
  width: 325px;
}

#info-icon {
  cursor: pointer;
}

#icons {
  align-items: center;
  bottom: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  position: absolute;
  right: 20px;
  width: 100px;
}

#speaker {
  background-size: cover;
  cursor: pointer;
  height: 50px;
  width: 63px;
}

#speaker.playing {
  background-image: url("/img/speaker.png");
}

#speaker.mute {
  background-image: url("/img/speaker_mute.png");
}

body {
  margin: 0;
  overflow: hidden;
  position: relative;
}

a, a:active {
  color: #888;
  text-decoration: none;
}

a:hover {
  color: #888;
  text-decoration: underline;
}

a:visited {
  color: #444;
}

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

.hid {
  display: none;
}

#info {
  background-color: #ffffff;
  bottom: 90px;
  opacity: 0.6;
  padding: 4px;
  position: absolute;
  right: 20px;
  width: 325px;
}

#info-icon {
  cursor: pointer;
}

#icons {
  align-items: center;
  bottom: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  position: absolute;
  right: 20px;
  width: 100px;
}

#speaker {
  background-size: cover;
  cursor: pointer;
  height: 50px;
  width: 63px;
}

#speaker.playing {
  background-image: url("/img/speaker.png");
}

#speaker.mute {
  background-image: url("/img/speaker_mute.png");
}

Hide overflow of body so there are no scroll bars.


body {
  font-size:16px;
  height:100%;
  margin:0;
}

#headername {
 color:black;
}

.padding {
 padding-top:100px;
}

@media(min-width:1100px) {

}

body {
  font-size:16px;
  height:100%;
  margin:0;
}

#headername {
 color:black;
}

.padding {
 padding-top:100px;
}

@media(max-width:480px) {
  .twoheadings {
   font-size:45px;
    font-family:Times New Roman, Times, serif;
    font-weight:bold;
    color:black;
  }

  .twoparagraphs {
   color:black;
    font-family:Arial, sans-serif;
    font-size:18px;
  }
}

@media(min-width:480px) and (max-width:1100px){
  .twoheadings {
   font-size:40px;
    font-family:Times New Roman, Times, serif;
    font-weight:bold;
    color:black;
  }

  .twoparagraphs {
   color:black;
    font-family:Arial, sans-serif;
    font-size:17px;
  }
}

@media(min-width:1100px) {
  .twoheadings {
   font-size:35px;
    font-family:Times New Roman, Times, serif;
    font-weight:bold;
    color:black;
  }

  .twoparagraphs {
   color:black;
    font-family:Arial, sans-serif;
    font-size:16px;
  }
}

Add Media Queries and information to those queries


html {
    background: #333;
    height: 100%;
}
body { position:absolute; top:0; bottom:0; right:0; left:0; }
body {
    padding: 0 20px;
    min-height: 100%;
    font-size: large;
    margin: 0 auto;
    max-width: 900px;
}

pre.src {
    font-size: large;
    padding: 0.5em;
}

html {
    background: #333;
    height: 100%;
}

body {
    padding: 0 20px;
    min-height: 100%;
    font-size: large;
    margin: 0 auto;
    max-width: 900px;
}

pre.src {
    font-size: large;
    padding: 0.5em;
}

Fix body height bug in CSS

Fix body height bug in CSS


.panelist-list {
  lost-utility: clearfix;

  &__panelist {

    @media only screen and (min-width: 730px) {
      lost-column: 1/2;
    }

    @media only screen and (min-width : 900px) {
      lost-column: 1/3;
    }
  }
}

.panelist-list {
  lost-utility: clearfix;

  width: 90%;
  margin: auto;

  &__panelist {

    @media only screen and (min-width: 730px) {
      lost-column: 1/2;
    }

    @media only screen and (min-width : 900px) {
      lost-column: 1/3;
    }
  }
}

Make panelist list a bit narrower than the container


section, header, footer {
  padding: 25px;
}

header, footer {
  text-align: center;
  background-color: black;
  color: lightgray;
}

ul {
  list-style-type: square;
}

img {
  width: 100%;
}

.outline {
  border: 2px black solid;
}

.description {
  font-size: 1.5em;
  width: 70%;
  margin: 0 auto;
}

Add padding to body sections

Add padding to body sections


.navbar-project-arrow {
    position: relative;
    top: 8px;
    color: rgba(255, 255, 255, 0.5);
}

.active-navitem,
.active-navitem > a {
    color: white !important;
}

.navbar-project-arrow {
    position: relative;
    top: 9px;
    left: -6px;
    margin-right: -12px;
    color: rgba(255, 255, 255, 0.5);
}

.active-navitem,
.active-navitem > a {
    color: white !important;
}

Adjust arrow icon position & margin

Adjust arrow icon position & margin


.imon-percent .fa {
  font-size: 1em;
}

.imon-percent h3{
  float: right;
}

.imon-percent .fa.colored {
  color: #6192BD;
}

.imon-percent .fa.plain {
  color: #bdc3c7;
}

.imon-percent .online-users {
  line-height: 1.1em;
}

.imon-percent .users-container{
  overflow: hidden;
}

.imon-percent .no-data {
  margin-top: 2em;
  text-align: right;
  margin-right: 1em;
}

.imon-percent .indicator-value {
  font-size: 5em;
  color: #888;
}

.imon-percent .value-container{
  padding-left: 0px !important;
  overflow: hidden;
}

.imon-percent .fa {
  font-size: 1em;
}
.imon-percent h2, .imon-percent h3{
  display:inline;
}
.imon-percent h3{
  float: right;
}

.imon-percent .fa.colored {
  color: #6192BD;
}

.imon-percent .fa.plain {
  color: #bdc3c7;
}

.imon-percent .online-users {
  line-height: 1.1em;
}

.imon-percent .users-container{
  overflow: hidden;
}

.imon-percent .no-data {
  margin-top: 2em;
  text-align: right;
  margin-right: 1em;
}

.imon-percent .indicator-value {
  font-size: 5em;
  color: #888;
}

.imon-percent .value-container{
  padding-left: 0px !important;
  overflow: hidden;
}

Make year on same line as country in imon-percent


/* Global Master Styles */
h1 {
  color: #369;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 250%;
}
h2, h3 {
  color: #333;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: lighter;
}
body {
  margin: 0;
  background-color: #FFF;
}
body, input[text], button {
  color: #222;
  font-family: Cambria, Georgia;
}
.qr-code > svg {
  width: 2000px;
  max-width: 30%;
  max-height: 30%;
  color: #000;
  background-color: #FFF;
}
/* everywhere else */
* {
  font-family: Arial, Helvetica, sans-serif;
}

/* Global Master Styles */
h1 {
  color: #369;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 250%;
}
h2, h3 {
  color: #333;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: lighter;
}
body {
  margin: 0;
  background-color: #FFF;
}
body, input[text], button {
  color: #222;
  font-family: Cambria, Georgia;
}
.qr-code > svg {
  color: #000;
  background-color: #FFF;
}
@media (orientation: landscape) {
  .qr-code > svg {
    width: 30%;
  }
}
@media (orientation: portrait) {
  .qr-code > svg {
    width: 100%;
  }
}

/* everywhere else */
* {
  font-family: Arial, Helvetica, sans-serif;
}

Fix width in portrait mode screen

Fix width in portrait mode screen


  #top {
display:block;
position: absolute;
top: 170px;
}
#second_from_top {
display: block;
position: relative;
margin-top: 40px;

}

Change position blocks week stylesheet

Change position blocks week stylesheet


body {
  font-family: helvetica neue;
  font-weight:200!important;
}

h1 {
  font-weight:300;
  text-align:center;
}

table {
  width:100%;
  margin:0 auto;
}

tr {

}

tr.headings td {
  font-weight:400;
  width:auto;
}

td {
  text-align:center;
  line-height:40px;
  font-size:18px;
  font-weight:300;
  width:100px;
}

td.feature {
  text-align:left;
}
/*
button.stripe-button-el {
  font-size: 1.4em;
  font-weight: 200;
  background: #f0f0f0;
  background: linear-gradient(0deg, #f0f0f0, #fefefe);
  box-shadow: 0px 1px 1px #eee;
  border: 1px solid #aaa;
  border-radius: 2px;
  padding: 10px 12px;
  cursor: pointer;
  display: inline;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  border-bottom: 2px solid #aaa;
}
button.stripe-button-el:hover {
  background: linear-gradient(0deg, #e8e8e8, #f8f8f8);
}
*/

body {
  font-family: helvetica neue;
  font-weight:200!important;
}

h1 {
  font-weight:300;
  text-align:center;
}

table {
  width:100%;
  margin:0 auto;
}

tr {

}

tr.headings td {
  font-weight:400;
  width:auto;
}

td {
  text-align:center;
  line-height:40px;
  font-size:18px;
  font-weight:300;
  width:100px;
}

td.feature {
  text-align:left;
  width:auto;
}
/*
button.stripe-button-el {
  font-size: 1.4em;
  font-weight: 200;
  background: #f0f0f0;
  background: linear-gradient(0deg, #f0f0f0, #fefefe);
  box-shadow: 0px 1px 1px #eee;
  border: 1px solid #aaa;
  border-radius: 2px;
  padding: 10px 12px;
  cursor: pointer;
  display: inline;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  border-bottom: 2px solid #aaa;
}
button.stripe-button-el:hover {
  background: linear-gradient(0deg, #e8e8e8, #f8f8f8);
}
*/

Use width auto for the left most <td>'s

Use width auto for the left most <td>'s


@import '@teamleader/ui-utilities';

.container {
  min-width: 1056px;
  padding-left: var(--spacer-big);
  padding-right: var(--spacer-big);
}

.is-fixed {
  margin: 0 auto;
  max-width: 1056px;
}

@media (--larger-than-lg-viewport) {
  .container:not(.is-fixed) {
    padding-left: var(--spacer-biggest);
    padding-right: var(--spacer-biggest);
  }
}

@import '@teamleader/ui-utilities';

.container {
  min-width: 1056px;
  padding-left: var(--spacer-big);
  padding-right: var(--spacer-big);
}

.is-fixed {
  margin: 0 auto;
  max-width: 1056px;
}

@media (--larger-than-xl-viewport) {
  .container:not(.is-fixed) {
    padding-left: var(--spacer-biggest);
    padding-right: var(--spacer-biggest);
  }
}

Use a larger breakpoint to avoid horizontal scrollbars


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

body {
  font-size: 16px;
  background: white;
}

a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: underline; }
a:active { text-decoration: underline; }

#canvas {
  position: fixed;
  top: 0px;
  right: 0px;
  display: block;
  margin: 0;
  width: 100%;
  height: 100%;
}

h1#title {
  padding: 1em;
  margin: 0em;
  font-family: Verdana, Geneva, sans-serif;
}

.info {
  font-family: Verdana, Geneva, sans-serif;
  padding: 1rem;
  max-width: 16rem;
  position: relative;
  z-index: 1;
}

.info h1 {
  margin-top: 0;
  margin-bottom: 0;
}

.info p {
  margin-top: 0.79em;
  margin-bottom: 1.27em;
}

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

body {
  font-size: 16px;
  background: white;
}

a:link { text-decoration: underline; }
a:visited { text-decoration: underline; }
a:hover { text-decoration: none; }
a:active { text-decoration: none; }

#canvas {
  position: fixed;
  top: 0px;
  right: 0px;
  display: block;
  margin: 0;
  width: 100%;
  height: 100%;
}

h1#title {
  padding: 1em;
  margin: 0em;
  font-family: Verdana, Geneva, sans-serif;
}

.info {
  font-family: Verdana, Geneva, sans-serif;
  padding: 1rem;
  max-width: 16rem;
  position: relative;
  z-index: 1;
}

.info h1 {
  margin-top: 0;
  margin-bottom: 0;
}

.info p {
  margin-top: 0.79em;
  margin-bottom: 1.27em;
}

Make links underline by default

Make links underline by default


body { background-color: #3a4e70 }

a:link {
    color: white;
}

/* visited link */
a:visited {
    color: white;
}

/* mouse over link */
a:hover {
    color: grey;
}

/* selected link */
a:active {
    color: grey;
}

.icon {
	max-height: 100px;
	max-width: 200px;
	background-color: white;
	margin-top: 25px;
}

.med-icon {
	max-height: 200px;
	max-width: 200px;
	background-color: white;
}

.big-icon {
	max-height: 350px;
	max-width: 350px;
	background-color: white;
}

table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    text-align: left;
    padding: 8px;
}

tr:nth-child(even){background-color: #6a717c}

th {
    background-color: #3d434c;
    color: white;
}

.thumbnail {
    position: relative;
}

.caption {
	font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

#bold { font-weight: bold }

body { background-color: #3a4e70 }

a:link {
    color: white;
}

/* visited link */
a:visited {
    color: white;
}

/* mouse over link */
a:hover {
    color: grey;
}

/* selected link */
a:active {
    color: grey;
}

.icon {
	max-height: 100px;
	max-width: 200px;
	background-color: white;
	margin-top: 25px;
}

.med-icon {
	max-height: 200px;
	max-width: 200px;
	background-color: white;
}

.big-icon {
	max-height: 350px;
	max-width: 350px;
	background-color: white;
}

table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    text-align: left;
    padding: 8px;
}

tr:nth-child(even){background-color: #6a717c}

th {
    background-color: #3d434c;
    color: white;
}

.thumbnail {
    position: relative;
    border: 2px solid;
    border-radius: 25px;
    margin: 15px
}

.caption {
	font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

#bold { font-weight: bold }

Add rounded corners to homepage icons

Add rounded corners to homepage icons


html {
	background-color: honeydew;
}
header	{
	font-family: Papyrus, fantasy;
	font-size: 35px;
}
h2	{
	font-family: Copperplate, fantasy;
	font-size: 25px;
}
body {
	font-family: Arial;
}

Add font style to all selectors

Add font style to all selectors


.character .character-image {
  width: 250px;
  height: 250px;
}

.character .character-name {
  font-size: 20px;
  font-weight: bold;
}

.character .character-description a {
  text-decoration: none;
}

Remove the underline from the links

Remove the underline from the links


.project {
	border-top: 1px solid #000;
	clear: left;
}
	.status {
		display: inline-block;
		float: right;
		font-weight: bold;
		font-size: .7em;
		color: white;
		padding: 5px 10px;
	}
		.status + .planning {
			background-color: gray;
		}
		.status + .alpha {
			background-color: lightblue;
		}
		.status + .beta {
			background-color: blue;
		}
		.status + .shipped {
			background-color: green;
		}
.project > div:nth-of-type(2) {
	float: left;
	width: 48.82117%;
	margin-right: 2.35765%;
}
.project > div:nth-of-type(3) {
	float: left;
	width: 48.82117%;
}

.project {
	border-top: 1px solid #000;
	clear: left;
}
	.status {
		display: inline-block;
		float: right;
		font-weight: bold;
		font-size: .7em;
		color: white;
		padding: 5px 10px;
	}
		.status.planning {
			background-color: gray;
		}
		.status.alpha {
			background-color: lightblue;
		}
		.status.beta {
			background-color: blue;
		}
		.status.shipped {
			background-color: green;
		}
.project > div:nth-of-type(2) {
	float: left;
	width: 48.82117%;
	margin-right: 2.35765%;
}
.project > div:nth-of-type(3) {
	float: left;
	width: 48.82117%;
}

Use the double class selector for statuses


.textview {
	background-color: white;
	padding: 1px 2px;
}

.textviewContainer {
	background-color: #eeeeee;
	font-family: Monaco,"Ubuntu Mono", monospace;
	font-size: 9pt;
}
::-webkit-scrollbar-corner {
	background-color: #eeeeee;
}

.textviewContent {
}

.textview {
	background-color: white;
	padding: 1px 2px;
}

.textviewContainer {
	background-color: #eeeeee;
	font-family: Monaco,"Ubuntu Mono",Consolas, "Lucida Console", "Courier New", monospace;
	font-size: 9pt;
}
::-webkit-scrollbar-corner {
	background-color: #eeeeee;
}

.textviewContent {
}

Choose better fonts on windows than Courier if possible


.header {
  color: #eee;
  background: #111;
}

.nav {
  display: flex;
  flex-direction: row;

  max-width: 60rem;
  margin: 0 auto 1rem;
  padding: 0 1rem;
  line-height: 3rem;
}

.navPart1 {

  @media (width >= 60rem) {
    flex-grow: 1;
  }
}

.navPart2 {
  display: flex;
  flex-direction: row;
}

.link {
  display: flex;
  align-items: center;

  margin-left: 1rem;

  color: inherit;
  text-decoration: none;
}

.link svg {
  fill: currentColor;
  opacity: 0.5;
  margin-right: 0.5rem;
  width: 1rem;
  height: 1rem;
}

:root {
  --nav-item-padding: 0.5rem;
}

.header {
  color: #eee;
  background: #111;
}

.nav {
  display: flex;
  flex-direction: row;
  justify-content: space-between;

  max-width: calc(60rem + (var(--nav-item-padding) * 2));
  margin: 0 auto 1rem;
  padding: 0 1rem;
  line-height: 3rem;
}

.navPart1,
.navPart2 {
  display: flex;
  flex-direction: row;
}

.link {
  display: flex;
  align-items: center;

  padding: 0 var(--nav-item-padding);

  color: inherit;
  text-decoration: none;
}

.link svg {
  fill: currentColor;
  opacity: 0.5;
  margin-right: 0.5rem;
  width: 1rem;
  height: 1rem;
}

Fix default boilerplate nav spacing

Fix default boilerplate nav spacing


/* Hide unnecessary comment toolbar items */
.rgh-clean-rich-text-editor md-mention,
.rgh-clean-rich-text-editor md-ref,
.rgh-clean-rich-text-editor form#new_issue markdown-toolbar > :nth-last-child(5),
.rgh-clean-rich-text-editor form:not(#new_issue) markdown-toolbar > :nth-last-child(4) { /* H1, B, I */
	display: none !important; /* Has to override `.d-inline-block` */
}

/* Hide unnecessary comment toolbar items */
.rgh-clean-rich-text-editor md-mention,
.rgh-clean-rich-text-editor md-ref,
.rgh-clean-rich-text-editor md-header,
.rgh-clean-rich-text-editor md-bold,
.rgh-clean-rich-text-editor md-italic {
	display: none !important; /* Has to override `.d-inline-block` */
}

 Hide the correct editor buttons on the New Issue page /2

Fixes #2428 again


.debug { border: 1px solid red;}

.b-1 { border: 1px solid; }

.bcolor{ background-color: #2CA6CB;}

.white-with-blue-shadow {
   margin-left: 0.75em;
   text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
   color: white;
   font: 1.5em serif;
}

.bs-o {border-style:outset;}
.bs-d {border-style: double;}
.bs-s {border-style: solid;}

.c-w {color:white;}

.f-r{float:right;}

.debug { border: 1px solid red;}

.b-1 { border: 1px solid; }

.bcolor{ background-color: #2CA6CB;}

.white-with-blue-shadow {
   margin-left: 0.75em;
   text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
   color: white;
   font: 1.5em serif;
}

.white-with-blue-shadow-small {
   margin-left: 0.75em;
   text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
   color: white;
   font: serif;
}

.c-w{color:white;}

.f-r{float:right;}

Add shadow small, rmv unused css

Add shadow small, rmv unused css


html, body {
  font: 13px Helvetica Neue, Lucida Grande, sans-serif;
  height: 100%;
  margin: 0;
  background: rgb(236, 236, 236);
}

/* MARK: - Editor */

.editor {
  display: -webkit-flex;
  -webkit-flex-direction: row;
  height: 100%;
}

.layers-panel {
  border-right: 1px solid rgb(184, 184, 184);
}
.canvas {
  -webkit-flex: 1;
  background: rgb(242, 242, 242);
}
.inspector-panel {
  border-left: 1px solid rgb(184, 184, 184);
}

.panel-resizer {
  position: absolute;
  top: 0;
  height: 100%;
  width: 5px;
  cursor: col-resize;
}

Add CSS for panel resizers

Add CSS for panel resizers


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

.sg-clearfix {
	display: inline-block;
}

* html .sg-clearfix {
	height:1%;
}

.sg-clearfix {
	display:block;
}

ul.bk-box {
	width:         150pt;
	padding-top:   0pt;
	padding-left:  0pt;
	padding-right: 0pt;
	margin-left:   0pt;
	margin-right:  0pt;
	border-color:  #0ac;
	border-width:  1pt;
	border-style:  solid;
	float:         left;
}

li.bk-category {
	color:		  white;
	background-color: #0ac;
	text-align:       center;
	list-style-type:  none;
	margin-top:       0pt;
	margin-bottom:    0pt;
}

li.bk-item {
	list-style-type: none;
	margin-top:      2pt;
	margin-bottom:   2pt;
	text-align:      center;
}

a.bk-item {
	text-decoration: none;
}

Add a new style sheet for 'index' style bookmark viewer


body {
	font-size: 20px;
	line-height: 1.3;

	max-width: 60ch;
	margin-left: auto;
	margin-right: auto;
}

input[type="button"] {
	font-size: 200%;
}

input#start-ticking {
	margin-right: 0.5em;
}

h1 {
	margin-bottom: 0em;
}

header {
	margin-bottom: 2em;
}

.author {
	font-style: italic;
}

.book-quote {
	font-size: 80%;
	margin-top: 2em;
	margin-bottom: 2em;
}

body {
	font-size: 20px;
	line-height: 1.3;

	max-width: 60ch;

	margin-left: auto;
	margin-right: auto;
	padding-left: 1em;
	padding-right: 1em;
}

input[type="button"] {
	font-size: 2em;
}

input#start-ticking {
	margin-right: 0.5em;
}

h1 {
	margin-bottom: 0em;
}

header {
	margin-bottom: 2em;
}

.author {
	font-style: italic;
}

.book-quote {
	font-size: 0.8em;
	margin-top: 2em;
	margin-bottom: 2em;
}

@media (max-width: 600px) {
	body {
		font-size: 18px;
	}
	input[type="button"] {
		font-size: 1.5em;
	}
}
@media (max-width: 420px) {
	body {
		font-size: 16px;
	}
	input[type="button"] {
		font-size: 1.2em;
	}
}

Add @media rules so the page looks good on mobile


/* Custom style sheet */

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

img {
  display: block;
  margin: auto;
}

Add styling to center the main image

Add styling to center the main image


.vis-background.maintenance {
	background-color: rgba(255, 0, 0, 0.15);
}

.vis-background.demo {
	background-color: rgba(55, 116, 230, 0.15);
}

.vis-center>.vis-content {
    overflow-x: hidden;
    overflow-y: scroll;
    height: 100%;
}
.vis-left>.vis-content {
    height: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}

.vis-item.vis-range.maintenance {
  color: #000;
  background-color: #73B2E8;
  border-color: #2E6DA4;
}
.vis-item.vis-range.vis-selected.maintenance {
  color: #fff;
  background-color: #275F8E;
  border-color: #204d74;
}

.vis-item.vis-range.demo {
  color: #000;
  background-color: #FFC779;
  border-color: #DE8F1F;
}
.vis-item.vis-range.vis-selected.demo {
  color: #fff;
  background-color: #E68D11;
  border-color: #BD6F01;
}

Add styles to maintenance and demo items


/* See license.txt for terms of usage */

/******************************************************************************/
/* Basic Panel Styles */

.theme-firebug html {
  background-color: white;
}

/* Do not use 'collapsed' as a class name. It's too simple name that can
cause collisions with built-in styles (e.g. the MarkupView is using it). */
.theme-firebug [fb-collapsed="true"] {
  display: none;
}

/******************************************************************************/
/* Search */

.theme-firebug .jumpHighlight {
  background-color: #C4F4FF !important;
}

/* See license.txt for terms of usage */

/******************************************************************************/
/* Basic Panel Styles */

.theme-firebug html {
  background-color: white;
}

.theme-firebug body {
  margin: 0;
}

/* Do not use 'collapsed' as a class name. It's too simple name that can
cause collisions with built-in styles (e.g. the MarkupView is using it). */
.theme-firebug [fb-collapsed="true"] {
  display: none;
}

/******************************************************************************/
/* Search */

.theme-firebug .jumpHighlight {
  background-color: #C4F4FF !important;
}

Set body margin to zero by default

Set body margin to zero by default


.miq-toast-wrapper {
  position: fixed;
  top: 20px;
  right: 20px;
  left: 66%;
  bottom: 20px;
  z-index: 10000;
  width: calc(34% - 20px);
}

.miq-toast-wrapper {
  position: fixed;
  top: 20px;
  right: 20px;
  left: 66%;
  z-index: 10000;
  width: calc(34% - 20px);
  max-height: calc(100% - 40px);
  overflow-y: auto;
}

Make the debug toaster auto-adjust its height, scroll when necessary

The debug toaster would previously take the whole vertical space, obscuring buttons when a notification was shown.

This makes it automatically adjust its height and show a scrollbar when too large
(transferred from ManageIQ/manageiq@f247b14de9e2b8556a15d1cd41993b0b32b42fa9)


.page-header {
  background: url(../img/half-circle.png) no-repeat right bottom;
  position: relative;
  height: 112px;
}

.page-header h1,
.page-header h2 {
  position: absolute;
  bottom: 0;
}

#landing p {
  margin-bottom: 1.5em;
}

#app {
  margin-top: 3em;
}

#loader {
  float: right;
}

#author {
  width: 60px;
  height: 60px;
  padding: 15px;

  position: absolute;
  bottom: 0;
  right: 0;

  opacity: 0.5;
}

#author:hover {
  opacity: 1;
}

.email {
  font-weight: bold;
  color: #555;
  text-transform: lowercase;
}

.glyphicon {
  margin-right: 10px;
}

.host {
  font-weight: bold;
  margin-right: 5px;
}

.del {
  float: right;
  color: #999;
  cursor: pointer;
}

.del:hover {
  color: #bbb;
}

form#update-form {
  text-align: center;
}

input#new-address {
  border: none;
  border-bottom: 1px solid #999;

  padding: 3px;
  margin-right: 15px;

  width: 75%;
  text-align: center;
}

.page-header {
  background: url(../img/half-circle.png) no-repeat right bottom;
  position: relative;
  height: 112px;
}

.page-header h1,
.page-header h2 {
  position: absolute;
  bottom: 0;
}

#landing p {
  margin-bottom: 1.5em;
}

#app {
  margin-top: 3em;
}

#loader {
  float: right;
}

#author {
  width: 50px;
  height: 60px;
  padding: 15px;
  padding-left: 5px;

  position: absolute;
  bottom: 0;
  right: 0;

  opacity: 0.5;
}

#author:hover {
  opacity: 1;
}

.email {
  font-weight: bold;
  color: #555;
  text-transform: lowercase;
}

.glyphicon {
  margin-right: 10px;
}

.host {
  font-weight: bold;
  margin-right: 5px;
}

.del {
  float: right;
  color: #999;
  cursor: pointer;
}

.del:hover {
  color: #bbb;
}

form#update-form {
  text-align: center;
}

input#new-address {
  border: none;
  border-bottom: 1px solid #999;

  padding: 3px;
  margin-right: 15px;

  width: 75%;
  text-align: center;
}

Tweak margins and hover targets around SIPB logo


.jvectormap-label {
    position: absolute;
    display: none;
    border: solid 1px #CDCDCD;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #292929;
    color: white;
    font-family: sans-serif, Verdana;
    font-size: smaller;
    padding: 3px;
}

.jvectormap-zoomin, .jvectormap-zoomout {
    position: absolute;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #292929;
    padding: 3px;
    color: white;
    width: 10px;
    height: 10px;
    cursor: pointer;
    line-height: 10px;
    text-align: center;
}

.jvectormap-zoomin {
    left: 10px;
    top: 10px;
}

.jvectormap-zoomout {
    left: 10px;
    top: 30px;
}

.jvectormap-label {
    position: absolute;
    display: none;
    border: solid 1px #CDCDCD;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #292929;
    color: white;
    font-family: sans-serif, Verdana;
    font-size: smaller;
    padding: 3px;
}

.jvectormap-zoomin, .jvectormap-zoomout {
    position: absolute;
    left: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #292929;
    padding: 3px;
    color: white;
    width: 10px;
    height: 10px;
    cursor: pointer;
    line-height: 10px;
    text-align: center;
}

.jvectormap-zoomin {
    top: 10px;
}

.jvectormap-zoomout {
    top: 30px;
}

Move left offset to combined selector styles


/* override logo styling */

/*.logo {
  display: block;
  width: 150px !important;
  margin: 5px;
  fill: #fff;
  background-color: #fb8225 !important;
  border-radius: 0 !important;
}*/

html {
    background-color: #fcfcfc;
}

.wy-side-nav-search {
    background-color: #ee5a2b;
}

.wy-nav-top {
    background-color: #ee5a2b;
}

.wy-nav-content {
    text-align: justify;
}

@media screen and (min-width:1100px) {
    .wy-side-scroll {
        width: 350px;
    }
    .wy-side-nav-search {
        width: 340px;
    }
    .wy-menu-vertical {
        width: 340px;
    }
    .rst-versions {
        width: 340px;
    }
    nav.wy-nav-side {
        width: 340px;
    }
    .wy-side-scroll {
        width: 355px;
    }
}

/* override logo styling */

/*.logo {
  display: block;
  width: 150px !important;
  margin: 5px;
  fill: #fff;
  background-color: #fb8225 !important;
  border-radius: 0 !important;
}*/

html {
    background-color: #fcfcfc;
}

.wy-side-nav-search {
    background-color: #ee5a2b;
}

.wy-nav-top {
    background-color: #ee5a2b;
}

.wy-nav-content {
    text-align: justify;
    max-width: 100%;
}

@media screen and (min-width:1100px) {
    .wy-side-scroll {
        width: 350px;
    }
    .wy-side-nav-search {
        width: 340px;
    }
    .wy-menu-vertical {
        width: 340px;
    }
    .rst-versions {
        width: 340px;
    }
    nav.wy-nav-side {
        width: 340px;
    }
    .wy-side-scroll {
        width: 355px;
    }
}

Update view width of documentation

Update view width of documentation


body, td {
   font-family: sans-serif;
   background-color: white;
   font-size: 13px;
}

body {
  max-width: 1500px;
  margin: auto;
  padding: 1em;
  line-height: 20px;
}

tt, code, pre {
   font-family: 'DejaVu Sans Mono', 'Droid Sans Mono', 'Lucida Console', Consolas, Monaco, monospace;
}

h1 {
   font-size:2.2em;
}

h2 {
   font-size:1.8em;
}

h3 {
   font-size:1.4em;
}

h4 {
   font-size:1.0em;
}

h5 {
   font-size:0.9em;
}

h6 {
   font-size:0.8em;
}

a:visited {
   color: rgb(50%, 0%, 50%);
}

pre, img {
  max-width: 100%;
}
pre {
  overflow-x: auto;
}
pre code {
   display: block; padding: 0.5em;
}

code {
  font-size: 92%;
  border: 1px solid #ccc;
}

code[class] {
  background-color: #F8F8F8;
}

table, td, th {
  border: none;
}

blockquote {
   color:#666666;
   margin:0;
   padding-left: 1em;
   border-left: 0.5em #EEE solid;
}

hr {
   height: 0px;
   border-bottom: none;
   border-top-width: thin;
   border-top-style: dotted;
   border-top-color: #999999;
}

@media print {
   * {
      background: transparent !important;
      color: black !important;
      filter:none !important;
      -ms-filter: none !important;
   }

   body {
      font-size:12pt;
      max-width:100%;
   }

   a, a:visited {
      text-decoration: underline;
   }

   hr {
      visibility: hidden;
      page-break-before: always;
   }

   pre, blockquote {
      padding-right: 1em;
      page-break-inside: avoid;
   }

   tr, img {
      page-break-inside: avoid;
   }

   img {
      max-width: 100% !important;
   }

   @page :left {
      margin: 15mm 20mm 15mm 10mm;
   }

   @page :right {
      margin: 15mm 10mm 15mm 20mm;
   }

   p, h2, h3 {
      orphans: 3; widows: 3;
   }

   h2, h3 {
      page-break-after: avoid;
   }
}

Add css file for knitr html reports

Add css file for knitr html reports


/*
 * Sites that don't specify color details for text inputs seem to
 * break under my GTK theme, so I need to set some defaults here.
 */
input[type="text"], input[type="email"],
input[type="number"], textarea {
  background-color: #eee;
  color: #444;
}

/* Make Remember the Milk a bit easier to use */
/* https://developer.mozilla.org/en-US/docs/CSS/@document */
@-moz-document domain(rememberthemilk.com) {
  #appheader a[href="/"] {display: none ! important}
  #topnav {float: none ! important; position: relative;}
  #searchbox {float: none ! important; position: relative;}
  #listbox {float: none ! important}
  #detailsbox {float: none ! important; margin-top: 20px ! important}
  .appfooter {display: none ! important}
}

/*
 * Sites that don't specify color details for text inputs seem to
 * break under my GTK theme, so I need to set some defaults here.
 */
input[type="text"], input[type="email"],
input[type="number"], textarea {
  background-color: #eee;
  color: #444;
}

/* Make Remember the Milk a bit easier to use */
/* https://developer.mozilla.org/en-US/docs/CSS/@document */
@-moz-document domain(rememberthemilk.com) {
  #appheader a[href="/"] {display: none ! important}
  #topnav {float: none ! important; position: relative;}
  #searchbox {float: none ! important; position: relative;}
  #listbox {float: none ! important}
  #detailsbox {float: none ! important; margin-top: 20px ! important}
  .appfooter {display: none ! important}
  html body #detailsbox input[type="text"], textarea {color: #eee ! important}
}

Fix a weird RTM issue in conkeror where inputs have black backgrounds and black text


pre
{
    background-color: ghostwhite;
    border: 1px solid silver;
    padding: 0px;
    margin: 0px 0 2%;
}

.json-brace,
.json-bracket
{
    position: relative;
    float: left;
}

.json-key
{
    color: brown;
}

.json-value
{
    color: navy;
}

.json-string
{
    color: olive;
}

pre
{
    position: relative;
    float: left;
    width: 100%;
    background-color: ghostwhite;
    border: 1px solid silver;
    padding: 0px;
    margin: 0px 0 2%;
}

pre code
{
    position: relative;
    float: left;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    margin-top: -1%;
}

.json-brace,
.json-bracket
{
    position: relative;
    float: left;
}

.json-key
{
    color: brown;
}

.json-value
{
    color: navy;
}

.json-string
{
    color: olive;
}

Adjust initial layout of component.

Adjust initial layout of component.


.terminator-terminal-window notebook tab {
    border: none;
}

.terminator-terminal-window notebook header, .terminator-terminal-window stack {
    border: none;
}

.terminator-terminal-window notebook tab button {
  min-height: 0;
  min-width: 0;
  padding: 0px;
  margin: 0px;
}

.terminator-terminal-window notebook tab {
  background-color: darkgrey;
  padding: 0;
  border: none;
}

.terminator-terminal-window notebook header, .terminator-terminal-window stack {
    border: none;
}

.terminator-terminal-window notebook tab:checked {
  background-image: none;
  background-color: #FFFFFF;
}

.terminator-terminal-window notebook tab button {
  padding: 0;
}

Make active terminator tab more noticeable.


html {
  background-color:grey;
  font-family:Exo;
}

.header {
  position:relative;
  margin-bottom:50px;
}

.pages {
  position:relative;
  display:inline-block;
  background-color:black;
  padding:10px 20px 0px 20px;
  border-radius: 10px 10px 0 0;
  margin:5px 5px 0px 5px;
}

.linkbar {
  border-bottom:3px solid black;
}

.footer {
  border-top:1px solid black;
  clear:both;
  bottom:0px;
  width:100%;
  position:fixed;
  background:grey;
}

a:hover {
  text-decoration:none;
}

.subheader {
  margin-top:-40px;
  margin-bottom:10px;
}

.displayex {
  width:50%;
  height:auto;
}

.displayhead{
  border:1px solid black;
  font-weight: bold;
}

html {
  background-color:grey;
  font-family:Exo;
}
body{
  margin: 5%;
}

.header {
  position:relative;
  margin-bottom:50px;
}

.pages {
  position:relative;
  display:inline-block;
  background-color:black;
  padding:10px 20px 0px 20px;
  border-radius: 10px 10px 0 0;
  margin:5px 5px 0px 5px;
}

.linkbar {
  border-bottom:3px solid black;
}

.footer {
  border-top:1px solid black;
  clear:both;
  bottom:0px;
  width:100%;
  position:fixed;
  background:grey;
  margin-top: 3%;
}

a:hover {
  text-decoration:none;
}

.subheader {
  margin-top:-40px;
  margin-bottom:10px;
}

.displayex {
  width:50%;
  height:auto;
}

.displayhead{
  border:1px solid black;
  font-weight: bold;
}

Add margins to improve readibility

Add margins to improve readibility

The blog post on Arrays and Hashes needs margins to make it easier to read.  The post has a great analogy so show it off.


details {
  display: block;
  min-width: 400px;
  margin-bottom: 0.5em;
  border: 1px solid var(--color-table-border);
}

details.inactive {
  opacity: 0.5;
}

details summary {
  display: flex;
  align-items: center;
  padding: 5px 10px;
  cursor: pointer;
  background-color: var(--color-sidebar-background);
}

details summary::before {
  margin-right: 0.5em;
  content: "";
  border-top: 9px solid var(--color-treetable-expander);
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  transform: rotate(270deg);
}

details.error summary {
  background-color: var(--color-error);
}

details[open] summary::before {
  transform: rotate(0deg);
}

details summary pre {
  display: inline-block;
  padding: 3px 6px;
  margin: 0;
}

details > div {
  padding: 0.5em;
}

details {
  display: block;
  min-width: 400px;
  margin-bottom: 0.5em;
  border: 1px solid var(--color-table-border);
}

details.inactive {
  opacity: 0.5;
}

details summary {
  padding: 5px 10px;
  cursor: pointer;
  background-color: var(--color-sidebar-background);
}

details.error summary {
  background-color: var(--color-error);
}

details[open] summary::before {
  transform: rotate(0deg);
}

details summary pre {
  display: inline-block;
  padding: 3px 6px;
  margin: 0;
}

details > div {
  padding: 0.5em;
}

Use default browser style for <summary> arrow


/* https://bitsofco.de/holy-grail-layout-css-grid/ */
:root {
  --lighter:  #ccc;
  --lightest: #fff;
  --darker:   #999;
  --darkest:  #444;
  --background: pink;
}

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

aside { background: var(--background) }

Add link to css grail grid layout

Add link to css grail grid layout


/* Dashboard Page css */

.container-xxl {
    padding-left: 0;
    padding-right:0;
}

.dashboard-header.dashboard-header-institution {
    background: none;
}

.dashboard-header {
    background: url('/static/img/bg6.jpg') top no-repeat;
    border-bottom: 1px solid #eee;
    padding: 10px 20px;
}

.tb-th {
    font-weight: normal;
}
.container > #alert-container {
    margin-bottom: 0;
    margin-top: 0;
}

Add alert container class to dashboard page as well


@import "$xwiki.getSkinFile('css/microformats.css')";
@import "$xwiki.getSkinFile('colibri.css', true)#if ("$!{request.colorTheme}" != '')?colorTheme=${request.colorTheme}#end";
#set ($workspaceManagerStyleDocumentReference = $services.model.createDocumentReference($xcontext.mainWikiName, 'WorkspaceManager', 'Style'))
@import "$xwiki.getURL($workspaceManagerStyleDocumentReference, 'ssx', '')";

XWIKI-6994: Add the CSS for the top menu enhancements (common to both main wiki and workspaces)


/*!
 * Mowe UI Helpers v0.5.0 (http://getvilla.org/)
 * Copyright 2013-2015 Noibe Developers
 * Licensed under MIT (https://github.com/noibe/villa/blob/master/LICENSE)
*/

/* Mowe Effects and Transitions */

/* Fade */

/* Fade-in */
/* You can edit the attributes */
.fade-in {
    animation: fade-in 1s ease-in-out 0s 1;
    -webkit-animation: fade-in 1s ease-in-out 0s 1;
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* Fade-out */
/* You can edit the attributes */
.fade-out {
    animation: fade-out 1s ease-in-out 0s 1;
    -webkit-animation: fade-out 1s ease-in-out 0s 1;
}

@-webkit-keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

Add UI Helpers to Effects, transitions and animations New animation and class to add Fade transition to elements


Remove an empty line from a Sass test case.

The blank line caused a test failure, because some Sass tests are
currently very strict about the expected output.

Change-Id: Id01818eca1da3310557c86a4aeb09f7dc23bcf70


.l-popup {
    height: 600px;
    width: 700px;
    max-width: 80%;
    max-height: 80%;
    min-height: 300px;
    margin: auto;
    padding: 20px 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
}

.fadingPanel {
    background-color: #023f67;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    display: none;
}

.fadingPanel_open {
    opacity: .5;
    display: block;
}

.popup-fade {
    z-index: 101;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.l-popup {
    height: 600px;
    width: 700px;
    max-width: 80%;
    max-height: 80%;
    min-height: 300px;
    margin: auto;
    padding: 20px 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
}

.fadingPanel {
    background-color: #023f67;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    visibility: hidden;
    transition: visibility 0, opacity 0.1s;
}

.fadingPanel_open {
    opacity: .5;
    visibility: visible;
    transition: visibility 0, opacity 0.1s;
}

.popup-fade {
    z-index: 101;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

Add transition to fading mask.

Add transition to fading mask.


.vse-gpa {
    font-family: 'SourceSansPro', Helvetica, Arial, sans-serif;
    font-size: 0.875rem;
    text-align: right;
    width: 60px;
    display: inline-block;
    color: #202020;
}

div.vse {
    border-radius: 5px;
    padding: 20px;
    text-align: center;
    margin: auto;
    margin-bottom: 10px;
}

div.vse button {
    width: 120px;
    padding: 4px 2px;
    margin: 2px 0;
    border-radius: 2px;
    cursor: pointer;
    font-weight: normal;
}

div.vse table {
    border-collapse: collapse;
    width: 100%;
}

div.vse th {
    padding: 8px;
    text-align: right;
}

div.vse td {
    padding: 8px;
    text-align: left;
}

div.vse tr:hover {
    background-color:#f5f5f5;
}

Add css style for setting divs and components.


/*
Copyright 2015 OpenMarket Ltd

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

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

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

.mx_MemberAvatar_image {
    z-index: 20;
    border-radius: 20px;
    position: relative;
}

.mx_MemberAvatar_initial {
    position: absolute;
    color: #fff;
    text-align: center;
    speak: none;
}

.mx_MemberAvatar {
    position: relative;
}

/*
Copyright 2015 OpenMarket Ltd

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

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

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

.mx_MemberAvatar {
    position: relative;
}

.mx_MemberAvatar_initial {
    position: absolute;
    color: #fff;
    text-align: center;
    speak: none;
}

.mx_MemberAvatar_image {
    border-radius: 20px;
}

Fix member avatar initials (I failed at git conflict merging)


body {
  font-family: 'Helvetica';
  letter-spacing:-5px;
  background:#000;
  background-size:100%;
  color:#fff;
  margin:0;
  padding:0;
  font-weight:bold;
}

h1, h2, h3, p {
  margin:0;
}

em, a {
  font-style:normal;
  color:#8dbd0c;
}

a {
  background: #34d0e7;
  color:#000;
  text-decoration:none;
}

img {
  width:100%;
}

div {
  cursor:pointer;
  cursor:hand;
  position:absolute;
  top:0px;
  left:0px;
  padding:75px;
  line-height:97%;
}

div.center {
  text-align:center;
}

div.imageText {
  text-shadow:0px 0px 5px rgba(0,0,0,0.2);
}

Add Big assets for presentations

Add Big assets for presentations


/*
 Theme Name:   Ubuntu Slovenija Wordpress Theme
 Theme URI:    http://ubuntu.si/
 Description:  Child theme for Ubuntu.si based on the Enigma theme
 Author:       Andrej Mernik
 Author URI:   http://andrej.mernik.eu
 Template:     enigma
 Version:      0.0.1
 License:      GNU General Public License v3 or later
 License URI:  http://www.gnu.org/licenses/gpl.html
 Tags:         beautiful, rich, dynamic, performant, web 2.0, beta
 Text Domain:  ubuntu-si-wp
*/

.navbar-header {
    float:right;
}

#enigma_nav_top {
    background-color: #77216F;
    margin: 0 5px 10px 5px;
}

.navigation_menu {
    width: inherit;
}

#menu {
    margin-top: 0;
    margin-bottom: 0;
}

/*
 Theme Name:   Ubuntu Slovenija Wordpress Theme
 Theme URI:    http://ubuntu.si/
 Description:  Child theme for Ubuntu.si based on the Enigma theme
 Author:       Andrej Mernik
 Author URI:   http://andrej.mernik.eu
 Template:     enigma
 Version:      0.0.1
 License:      GNU General Public License v3 or later
 License URI:  http://www.gnu.org/licenses/gpl.html
 Tags:         beautiful, rich, dynamic, performant, web 2.0, beta
 Text Domain:  ubuntu-si-wp
*/

.navbar-header {
    float:right;
}

#enigma_nav_top {
    background-color: #77216F;
    margin: 0 5px 10px 5px;
    border-radius: 4px;
}

.navigation_menu {
    width: inherit;
    border-top: none;
}

#menu {
    margin-top: 0;
    margin-bottom: 0;
}

.navbar-nav {
    height: 50px;
}

.container {
    padding-left: 15px;
    padding-right: 15px;
}

Make navbar smaller, override borders and reset container paddings


.header {
  margin-bottom: 30px;
  position: relative;
}

.header h1{
  font-size: 30px;
  margin-bottom: 10px;
}

.header a{
  text-decoration: none;
}

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

.header h3{
  font-size: 20px;
  font-family: 'Georgia';
  color:#888;
}

.header::after{
  content: " ";
  width: 100px;
  position: absolute;
  bottom: -17px;
  left: 0;
  border-bottom: 5px solid #2C9140;
}

Add missing line at end of file

Add missing line at end of file


/* Add SparkCC official fonts */
@font-face {
    font-family: Antipasto;
    src: url('../fonts/Antipasto.ttf');
}

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

body {
  font-family: 'Antipasto', Sans-Serif;
  font-size: 18px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Antipasto', Sans-Serif;
}

/* Navbar */
.navbar-text {
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: #888 !important;
  line-height: 100%;
  padding-top: 5px;
  margin:15px 20px 0 5px;
}

.navbar-brand {
  font-family: 'Yorkville', Sans-Serif;
  font-size: 18px;
  color: #000 !important;
  padding: 0px;
  padding-top: 5px;
  padding-right: 20px;
}

.navbar-brand img {
  max-height: 40px;
  width: auto;
}

/* Link colours */
a:hover, a:focus {
  color:
}

/* Add SparkCC official fonts */
@font-face {
    font-family: Antipasto;
    src: url('../fonts/Antipasto.ttf');
}

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

body {
  font-family: 'Yorkville', Sans-Serif;
  font-size: 18px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Yorkville', Sans-Serif;
}

/* Navbar */
.navbar-text {
  font-family: 'Antipasto', Sans-Serif;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: #888 !important;
  line-height: 100%;
  padding-top: 5px;
  margin:15px 20px 0 5px;
}

.navbar-brand {
  font-family: 'Yorkville', Sans-Serif;
  font-size: 18px;
  color: #000 !important;
  padding: 0px;
  padding-top: 5px;
  padding-right: 20px;
}

.navbar-brand img {
  max-height: 40px;
  width: auto;
}

/* Link colours */
a:hover, a:focus {
  color:
}

Change main font to Yorkville as it is more readable.


h2.panel-header {
  font-size: 1.5em !important;
  margin: 0 !important;
}

/* Set the pickadate field background color to white for consistency */
.picker__input {
  background-color: #fff !important;
}

Reduce panel header font and margin

Reduce panel header font and margin


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

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

Use non-min bootstrap stylesheet, for editability


.search-form {
  display: flex;
  font-size: 1.3em;
  text-align: center;
  flex-direction: row;
}

.textual {
  flex: 1;
}

.calendar {
  flex: 0;
}

@media (max-width: 35em) {
  .search-form {
    flex-direction: column;
  }
}

.DayPicker-Day {
  background-color: transparent;
  transition: background-color 100ms linear;
}

.DayPicker-Day:hover,
.DayPicker-Day:focus {
  background-color: #f3f3f3;
  outline: none;
}

.DayPicker-Day--outside {
  cursor: pointer;
}

.DayPicker-Day--outside:hover,
.DayPicker-Day--outside:focus {
  background-color: #fafafa;
}

.DayPicker-Month {
  margin-left: 0;
  margin-right: 0;
}

.DayPicker-Weekday abbr {
  text-decoration: none;
}

.DayPicker-Caption {
  line-height: 1.5rem;
}

.DayPicker-NavButton {
  opacity: .6;
  transition: opacity 100ms linear;
  outline: none;
}

.DayPicker-NavButton:hover,
.DayPicker-NavButton:focus {
  opacity: 1;
}

.search-form {
  display: flex;
  font-size: 1.3em;
  text-align: center;
  flex-direction: row;
}

.textual {
  flex: 1;
}

.calendar {
  flex: 0;
}

@media (max-width: 35em) {
  .search-form {
    display: block;
  }
  .search-form select {
    display: block;
    width: 100%;
  }
}

.DayPicker-Day {
  background-color: transparent;
  transition: background-color 100ms linear;
}

.DayPicker-Day:hover,
.DayPicker-Day:focus {
  background-color: #f3f3f3;
  outline: none;
}

.DayPicker-Day--outside {
  cursor: pointer;
}

.DayPicker-Day--outside:hover,
.DayPicker-Day--outside:focus {
  background-color: #fafafa;
}

.DayPicker-Month {
  margin-left: 0;
  margin-right: 0;
}

.DayPicker-Weekday abbr {
  text-decoration: none;
}

.DayPicker-Caption {
  line-height: 1.5rem;
}

.DayPicker-NavButton {
  opacity: .6;
  transition: opacity 100ms linear;
  outline: none;
}

.DayPicker-NavButton:hover,
.DayPicker-NavButton:focus {
  opacity: 1;
}

Use display: block for search form on small screens


.outcome {
  position: relative;
  padding: 10px;
  color: navy;
  font-size: 16px;
  background-color: transparent;
}

.border {
  border: 3px solid white;
  position: absolute;
  margin: auto;
  top: -100px; left: 0; bottom: 0; right: 0;
  width: 60%;
  height: 35%;
  overflow-y: scroll;
  display: inline-block;
  background-color: gray;
  opacity: .8;
}

.button_to {
  display: inline-block;
  margin: 5px;
  margin-top: 10px;
}

.choice {
  background-color: #4d4d4d;
  border: 1px solid black;
  color: white;
  border-radius: 25px;
}

.hidden {
  display: none;
}

.header {
  font: Helvetica;
}

.start {
  margin: 10px;
}

Add margin to start button

Add margin to start button