solid-panes/src/microblogPane/mbStyle.css

Solid-compatible Panes: applets and views for the mashlib and databrowser

.ppane {
  font-family: helvetica, arial, sans-serif;
  color: #333;
  background-color: #fff;
  border: #999 solid 1px;
  min-width: 35em !important;
  word-wrap: break-word;
}
.ppane a {
  color: #357598;
}
.ppane input {
  border: solid 1px #333 !important;
}
.ppane input[type='button'],
.ppane input[type='submit'] {
  background-color: #fff;
  padding: 0.1em 0.5em;
  border: solid 1px #333;
  -moz-border-radius: 3px;
}
.ppane input[type='button']:hover,
.ppane input[type='submit']:hover {
  background-color: #eef;
  border: solid 1px #357598 !important;
}
.ppane ul {
  padding: 0px;
}
.ppane .update-container {
  background-color: #fff;
  margin-bottom: 2em;
  padding: 5px 1em;
  -moz-box-shadow: 0px 5px 10px #fff;
}
.ppane .createNewMB {
  padding: 5px 1em;
  border: solid 1px #ccc;
  background-color: #fff;
}
.ppane ul {
  list-style-type: none !important;
}
.ppane .postLink {
  display: inline;
  margin-top: 0.7em;
  font-size: 90%;
  color: #888 !important;
}
.ppane .userLink {
  display: block;
  clear: both;
  margin-bottom: 1em;
  margin-right: 1em;
}
.ppane .postAvatar {
  max-width: 4em;
  max-height: 4em;
  float: left;
  margin-right: 1em;
  border: double 3px #888;
  -moz-box-shadow: 0px 0px 8px #ccc;
}

/*reply view*/
.ppane .replyView {
  display: none;
}
.replyView-active .favorit {
  display: none;
}
.ppane .replyView-active {
  margin: 0 !important;
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: #eee;
  opacity: 0.97;
  z-index: 5;
  width: 100%;
  height: 100%;
  padding-top: 20%;
}
.ppane .replyView-active li {
  display: block;
  opacity: 1 !important;
  margin: 1em auto;
  width: 30em;
  border: solid 1px #888;
  background-color: #fff;
  padding: 1em;
  -moz-box-shadow: 0px 0px 10px #aaa;
}
.ppane .replyView-active .closeContainer {
  -moz-box-shadow: none;
  text-align: right;
  vertical-align: bottom;
  margin-bottom: -1em;
  border: none;
  padding: 0px;
  background: none;
}
.ppane .replyView-active .closeContainer .closeButton {
  background-color: #000;
  width: 1em;
  font-size: 110%;
  margin-right: -2em;
  color: #fff;
  padding: 0.2em 0.4em;
  font-weight: bold;
  border: solid 3px #fff;
  -moz-border-radius: 2em;
  -moz-box-shadow: 0px 0px 10px #333;
  cursor: pointer;
}

/*notifications*/
.ppane .notify-container {
  width: 100%;
}
.ppane .notify-container .notify {
  background-color: #fffae6;
  border: solid 1px #ffe788;
  padding: 1em 0.5em;
  margin: 1em;
  -moz-border-radius: 0.5em;
}
.ppane .notify-container .notify.conf {
  background-color: #ffeeee;
  border-color: #880000;
  text-align: right;
  position: fixed;
  margin: 0px auto;
  left: 3em;
  width: 35em !important;
  top: 40%;
  -moz-box-shadow: 0px 0px 10px #800;
}
.ppane .notify-container .notify.conf p {
  text-align: left;
}
.ppane .notify-container .notify.conf .confirm {
  margin-left: 1em;
}
/*view*/
.ppane .view-container {
  display: none;
  padding: 1em;
}
.ppane .view-container.active {
  display: block;
  -moz-box-shadow: 0px 3px 8px #ccc;
}

/*header container*/
.ppane .header-container {
  border-bottom: solid 1px #999;
  background-color: #fafaf8;
}
.ppane .header-container img {
  float: left;
  max-height: 75px;
  margin: 1em;
  border: solid 3px #fff;
  margin-top: 0em;
  -moz-box-shadow: 0px 0px 8px #ccc;
}
.ppane .header-container .subheader-container {
  min-height: 75px;
  margin-bottom: 2em;
  padding: 1em;
}
.ppane .header-container textarea {
  width: 100%;
  margin-bottom: 0.4em;
  font-family: helvetica, arial, sans-serif;
  font-size: 100%;
  padding: 0.5em 0;
  line-height: 120%;
}
.ppane .header-container textarea:focus,
.ppane input:focus {
  border: solid 1px #357598 !important;
  outline: none;
  -moz-box-shadow: 0px 0px 2px #357598;
}
.ppane .header-container input[type='submit'] {
  float: right;
}
.ppane .header-container .createNewMB input[type='text'] {
  min-width: 25em;
}
.ppane .header-container .createNewMB input[type='submit'] {
  float: none;
}

/*post list*/
.ppane .postList .post {
  margin: 0;
  display: block;
  border: solid 1px #888;
  padding: 1em;
  margin: 0.2em 0em;
}
.ppane .postList blockquote,
.ppane .replyView-active blockquote {
  margin-left: 0;
  font-size: 110%;
  max-width: 30em;
  padding-left: 5em;
}
.ppane .postList .reply,
.ppane .replyView-active .reply {
  float: right;
}
.ppane .postList .post div {
  margin: 0.5em auto;
}
.ppane .postList .favorit {
  color: #aaa;
  float: right;
  font-size: 150%;
  margin-left: 0.5em;
}
.ppane .postList .favorit.ed {
  color: #e5cc44;
}
.ppane .postList .favorit.ing {
  color: #777;
  text-shadow: 0px 0px 3px #000;
}

/*tabs list*/
.ppane .tabslist {
  padding: 0em;
  margin: 0.5em 0em;
}
.ppane .tabslist li {
  cursor: default;
  display: inline;
  background-color: #fff;
  padding: 0.5em 2em;
  margin: 0 0.5em;
  border: solid 1px #999;
  -moz-border-radius-topleft: 0.5em;
  -moz-border-radius-topright: 0.5em;
}
.ppane .tabslist li.active {
  border-bottom: solid 1px #fff;
  -moz-box-shadow: 0px 10px 0px #fff, 0px 0px 8px #ccc;
}
.ppane .tabslist li:hover {
  background-color: #eee;
}
.ppane .tabslist li.active:hover {
  background-color: #fff;
}

/*follow list*/
.ppane .followlist-container {
}
.ppane .followlist-container .follow {
  display: inline;
  font-size: 120%;
  padding: 0 2em;
  line-height: 150%;
}