our-journey/style/journeystyle.css

Our Journey interactive student journey creator. | © 2018 The Open University (IET-OU).

/*!
  Our Journey styles | ©The Open University.
*/

body.our-journey-whole-page {
  margin: 0;
  padding: 0 10px;
}

.our-journey-js,
input,
textarea,
select {
  background: #fff;
  color: #111;
  font: .93rem Arial, Helvetica, sans-serif; 
}

.our-journey-whole-page .our-journey-js {
  background: transparent;
  /* padding: 0 8px;
  position: absolute;
  top: 0; */
}

input[ type = file ],
input[ type = submit ],
input[ type = button ] {
  cursor: pointer;
  font-size: .97rem;
  padding: 3px 8px;
}

select,
textarea {
  padding: 3px;
}

textarea {
  resize: none;
}

label,
input,
select {
  vertical-align: top;
}

a:link,
a[ href *= '?demo=' ] {
  color: blue;
}

a:visited {
  color: purple;
}

form {
  display: inline;
}

h1,
h2 {
    font-size: 1rem; /* Was: 12pt; */
}

h3 {
    font-size: .92rem;
}

svg#journey-canvas .in_postit {
    font-family: 'Comic Sans MS', sans-serif;
    font-size: .90rem;
    text-align: center;
    word-wrap: break-word;
    max-lines: 4;
}

.help_link {
  vertical-align: -5px;
  font-size: 1rem;
  border: 1px solid #aaa;
  border-radius: 2px;
  padding: 5px;
}

.editorbar
    {
      position: fixed;
      top: 0;
      background: ivory;
      display: block;
      width: 40%;
      min-width: 300px;
      border: 1px solid #aaa;
    }

.float_bar
    {
      border: 1px solid #aaa;
      border-radius: 5px;
      position: fixed;
      background: ivory;
      padding: 5px;
      display: block;
      font-size: 1rem;
    }

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

 .floating_post
 {
    background-color: lightyellow;
 }

.floating_icon_select
{
  width: 110px;
}

.our-journey-js .fork-me-btn {
  clear: both;
}

.fork-me-btn {
  margin-left: 1.5rem;
}

.our-journey-js .fork-me-btn a {
  background-color: #eff3f6;
  background-image: -webkit-linear-gradient(top, #fafbfc, #e4ebf0);
  background-image: -moz-linear-gradient(top, #fafbfc, #e4ebf0);
  background-image: linear-gradient(to bottom, #fafbfc, #e4ebf0);
  background-repeat: repeat-x;
  background-size: 110% 110%;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFAFBFC', endColorstr='#FFE4EBF0')";
   display: inline-block;
  font-weight: 600;
  vertical-align: bottom;
  cursor: pointer;
  border: 1px solid #d1d2d3;
  border-radius: 0.25em;
   color: #24292e;
  text-decoration: none;
  outline: 0;
  padding: .6rem;
}

.floating_emoticon_select
{
  width: 110px;
}

.floating_move_menu
{
  width: 70px;
  background: ivory;
}

.main {
        margin-top: 0px;
        text-align: center;
}

svg#journey-canvas .in_card {
  font: 0.9rem sans-serif;
}

svg#journey-canvas .card > rect {
  fill-opacity: 1.0;
  stroke: black;
  stroke-width: 1;
  fill: ivory;
}

svg#journey-canvas .card > .focussed {
  stroke: blue;
  stroke-width: 2.5;
}

.card.orient-horiz {
  outline: none;
}

.card.orient-vert {
  outline: none;
}

.journey-canvas {
  outline: none;
}

/* svg#journey-canvas .card.orient-horiz > rect {
  height: 130px;
  width: 240px;
}

svg#journey-canvas .card.orient-vert > rect {
  height: 240px;
  width: 130px;
} */

.add_more_card {
  cursor: pointer;
}

.add_more_card > .focussed {
  stroke: blue;
  stroke-width: 2.5;
}

.add_more_card > .not-focussed {
  stroke: black;
  stroke-width: 1;
}

.footer-copy {
  color: #333;
  float: left;
  font-size: .85rem;
  margin-top: 89px;
  margin-left: 1.5rem;
}

.footer-copy .p:before,
.footer-copy [ rel = license ]:before {
  color: #000;
  content: '|';
  margin: 0 .25rem;
  text-decoration: none;
}

.footer-copy .p[ href = '' ] {
  display: none;
}

.footer-logos {
  float: right;
}

.footer-logos img:focus,
.footer-logos img:hover {
  border-color: #2b6ab7;
}

img[ src $= 'assets/ou-logo.svg' ],
img[ src $= 'assets/iet-logo.svg' ] {
  border: 1px solid transparent;
  border-radius: 3px;
  height: 68px;
  padding: 1.5rem;
}

.ojs-error,
.no-js {
  color: #a00;
}

.our-journey-whole-page h1 {
  display: none;
}

.XX-our-journey-whole-page #qr-code {
  clear: both;
  position: absolute;
}