1819 lines
25 KiB
SCSS
1819 lines
25 KiB
SCSS
@import "compass";
|
|
@import "perfect-scrollbar";
|
|
|
|
@import "colors";
|
|
@import "ui";
|
|
@import "_mixins";
|
|
@import "_flash_messages";
|
|
@import "new_styles/_spinner";
|
|
|
|
@import "sidebar";
|
|
@import "leftnavbar";
|
|
@import "sprites";
|
|
@import "header";
|
|
@import "footer";
|
|
@import "opengraph";
|
|
@import "poll";
|
|
@import "help";
|
|
@import "publisher_blueprint";
|
|
@import "facebox";
|
|
@import "aspects";
|
|
@import "stream-faces";
|
|
@import "popover";
|
|
@import "stream_element_blueprint";
|
|
@import "report";
|
|
@import "new_styles/_forms";
|
|
@import "tag";
|
|
@import "photo";
|
|
@import "chat";
|
|
|
|
/* ====== media ====== */
|
|
.media {
|
|
margin: 10px;
|
|
}
|
|
|
|
.media, .bd {
|
|
overflow: hidden;
|
|
zoom: 1;
|
|
}
|
|
|
|
.media .img {
|
|
float: left;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.media .img img {
|
|
display: block;
|
|
}
|
|
|
|
.media .imgEt {
|
|
float: right;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
/* ====== ----- ====== */
|
|
|
|
body {
|
|
padding: 2em;
|
|
margin: 0 {
|
|
top: 33px;
|
|
};
|
|
background-color: $background-white;
|
|
font: {
|
|
family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
size: 13px;
|
|
};
|
|
}
|
|
|
|
header {
|
|
line-height: 20px;
|
|
}
|
|
|
|
a {
|
|
color: $blue;
|
|
text: {
|
|
decoration: none;
|
|
};
|
|
&:hover {
|
|
color: $blue;
|
|
text: {
|
|
decoration: underline;
|
|
};
|
|
}
|
|
&.disabled {
|
|
color: $link-disabled-grey;
|
|
cursor: default;
|
|
}
|
|
&.disabled.button:hover {
|
|
color: $link-disabled-grey;
|
|
cursor: default;
|
|
background: #f7f7f7;
|
|
}
|
|
}
|
|
|
|
p {
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
h1, h2, h3, h4 {
|
|
margin: {
|
|
bottom: 5px;
|
|
};
|
|
small {
|
|
font-size: small;
|
|
color: $text-grey;
|
|
}
|
|
}
|
|
|
|
ul > li {
|
|
list-style: none;
|
|
}
|
|
|
|
.content ul li {
|
|
list-style: disc;
|
|
}
|
|
|
|
.rtl {
|
|
direction: rtl;
|
|
text-align: right;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
.avatar {
|
|
box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 5px inset;
|
|
background: {
|
|
color: $background-grey;
|
|
};
|
|
width: 50px;
|
|
height: 50px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#content {
|
|
background: {
|
|
color: white;
|
|
};
|
|
border: 1px solid #cccccc;
|
|
height: 100%;
|
|
}
|
|
|
|
.login_error,
|
|
.login_alert {
|
|
color: rgb(208, 49, 43);
|
|
text-shadow: 1px 1px 20px rgb(208, 49, 43);
|
|
}
|
|
|
|
.login_notice {
|
|
color: rgb(10, 150, 10);
|
|
text-shadow: 1px 1px 20px rgb(126, 240, 77);
|
|
}
|
|
|
|
.fieldWithErrors {
|
|
display: inline;
|
|
}
|
|
|
|
.error_messages {
|
|
width: 400px;
|
|
border: 2px solid #cf0000;
|
|
padding: 0;
|
|
padding-bottom: 12px;
|
|
margin-bottom: 20px;
|
|
background-color: #f0f0f0;
|
|
font: {
|
|
size: 12px;
|
|
};
|
|
h2 {
|
|
text-align: left;
|
|
padding: 5px 5px 5px 15px;
|
|
margin: 0;
|
|
font: {
|
|
weight: bold;
|
|
size: 12px;
|
|
};
|
|
background-color: #cc0000;
|
|
}
|
|
p {
|
|
margin: 8px 10px;
|
|
}
|
|
ul {
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
//////////////////////////////////
|
|
|
|
//////////////////////////////////
|
|
//hacks for tagging plugin...
|
|
ul.as-selections {
|
|
width: 100% !important;
|
|
}
|
|
|
|
//////////////////////////////////
|
|
|
|
.unread {
|
|
background-color: #e6e6e6;
|
|
color: #333333 !important;
|
|
time {
|
|
color: #333333 !important;
|
|
}
|
|
}
|
|
|
|
#author_info {
|
|
position: relative;
|
|
.avatar img {
|
|
position: relative;
|
|
top: 0px;
|
|
display: inline-block;
|
|
height: 30px;
|
|
width: 30px;
|
|
}
|
|
.from {
|
|
display: inline-block;
|
|
}
|
|
&.profile {
|
|
.from {
|
|
padding: 0;
|
|
}
|
|
}
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5 {
|
|
display: inline-block;
|
|
margin: {
|
|
bottom: 10px;
|
|
right: 10px;
|
|
};
|
|
}
|
|
h2 {
|
|
margin: {
|
|
bottom: 0;
|
|
};
|
|
}
|
|
&.show {
|
|
a {
|
|
margin: {
|
|
right: 1em;
|
|
};
|
|
font: {
|
|
weight: normal;
|
|
};
|
|
}
|
|
h4,
|
|
h5 {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
.right {
|
|
top: 10px;
|
|
}
|
|
.description {
|
|
margin: {
|
|
bottom: 10px;
|
|
};
|
|
}
|
|
}
|
|
|
|
.info {
|
|
font-size: smaller;
|
|
}
|
|
|
|
.controls {
|
|
z-index: 6;
|
|
float: right;
|
|
.post_report, .comment_report {
|
|
display: inline-block;
|
|
.icons-report {
|
|
height: 14px;
|
|
width: 14px;
|
|
}
|
|
}
|
|
.block_user {
|
|
display: inline-block;
|
|
.icons-ignoreuser {
|
|
height: 14px;
|
|
width: 14px;
|
|
}
|
|
}
|
|
.create_participation {
|
|
display: inline-block;
|
|
.icons-create-participation {
|
|
height: 14px;
|
|
width: 14px;
|
|
background: image-url("icons/create_participation.png") center;
|
|
}
|
|
}
|
|
.destroy_participation {
|
|
display: inline-block;
|
|
.icons-destroy-participation {
|
|
height: 14px;
|
|
width: 14px;
|
|
background: image-url("icons/destroy_participation.png") center;
|
|
}
|
|
}
|
|
.delete {
|
|
display: inline-block;
|
|
.icons-deletelabel {
|
|
height: 14px;
|
|
width: 14px;
|
|
}
|
|
}
|
|
a:hover {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
.grey,
|
|
.grey * {
|
|
color: $text-grey;
|
|
}
|
|
|
|
.pull-left {
|
|
float: left;
|
|
}
|
|
|
|
.pull-right {
|
|
float: right;
|
|
}
|
|
|
|
.details,
|
|
.details * {
|
|
font: {
|
|
weight: normal;
|
|
};
|
|
}
|
|
|
|
.time,
|
|
.via {
|
|
color: #aaaaaa;
|
|
a {
|
|
color: $text-grey;
|
|
}
|
|
text: {
|
|
decoration: none;
|
|
};
|
|
border: none;
|
|
}
|
|
|
|
#user_name {
|
|
margin: {
|
|
bottom: 20px;
|
|
};
|
|
img {
|
|
margin: {
|
|
right: 10px;
|
|
};
|
|
display: inline-block;
|
|
float: left;
|
|
height: 40px;
|
|
}
|
|
h1 {
|
|
margin: {
|
|
bottom: 7px;
|
|
};
|
|
line-height: 18px;
|
|
a {
|
|
color: black;
|
|
}
|
|
}
|
|
span {
|
|
size: small;
|
|
font: {
|
|
weight: normal;
|
|
};
|
|
color: $text-grey;
|
|
}
|
|
#latest_message_time {
|
|
font-style: italic;
|
|
}
|
|
ul {
|
|
display: inline;
|
|
margin: 0;
|
|
padding: 0;
|
|
> li {
|
|
display: inline;
|
|
margin: {
|
|
right: 1em;
|
|
};
|
|
}
|
|
}
|
|
}
|
|
|
|
.stream.show {
|
|
&:hover {
|
|
> li {
|
|
background: none;
|
|
border: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.submit_button {
|
|
input {
|
|
float: right;
|
|
}
|
|
}
|
|
|
|
#photo_container {
|
|
text: {
|
|
align: center;
|
|
};
|
|
}
|
|
|
|
#show_photo {
|
|
z-index: 11;
|
|
position: relative;
|
|
display: inline-block;
|
|
max-width: 100%;
|
|
img {
|
|
max-width: 100%;
|
|
}
|
|
#photo_spinner {
|
|
z-index: 1;
|
|
position: absolute;
|
|
height: 100px;
|
|
width: 100px;
|
|
}
|
|
#caption {
|
|
min-height: 20px;
|
|
padding: 0 10px;
|
|
font: {
|
|
size: 16px;
|
|
};
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
input:not([type='submit']):not([type='reset']):not([type='hidden']):not(.as-input),
|
|
textarea {
|
|
border-radius: 2px;
|
|
background-color: white;
|
|
color: black;
|
|
margin-top: 1px;
|
|
font: {
|
|
family: "Arial", "Helvetica", sans-serif;
|
|
size: 14px;
|
|
};
|
|
padding: 0.3em;
|
|
display: block;
|
|
border: 1px solid #cccccc;
|
|
height: auto;
|
|
}
|
|
|
|
input[type='checkbox'] {
|
|
width: auto !important;
|
|
}
|
|
|
|
form p {
|
|
position: relative;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
form#update_profile_form p.checkbox_select {
|
|
label {
|
|
top: 0;
|
|
}
|
|
}
|
|
|
|
form p.checkbox_select {
|
|
label {
|
|
left: 25px;
|
|
top: 3px;
|
|
position: absolute;
|
|
font-size: 1em;
|
|
}
|
|
img {
|
|
position: relative;
|
|
top: 6px;
|
|
}
|
|
}
|
|
|
|
@mixin placeholder_styles {
|
|
color: $text-grey;
|
|
text-shadow: 0 1px 1px #eeeeee;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.placeholder {
|
|
@include placeholder_styles;
|
|
}
|
|
|
|
/* those can't be combined, see: http://stackoverflow.com/questions/2610497 */
|
|
*::input-placeholder {
|
|
@include placeholder_styles;
|
|
}
|
|
|
|
.field_with_submit {
|
|
input[type='text'] {
|
|
width: 82%;
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
.dim {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
img.thumb_small {
|
|
max-height: 50px;
|
|
max-width: 50px;
|
|
}
|
|
|
|
img.thumb_medium {
|
|
max-height: 100px;
|
|
max-width: 100px;
|
|
}
|
|
|
|
img.thumb_large {
|
|
max-height: 300px;
|
|
max-width: 300px;
|
|
}
|
|
|
|
img.scaled_full {
|
|
max-height: 700px;
|
|
max-width: 700px;
|
|
}
|
|
|
|
#thumbnails {
|
|
a {
|
|
display: inline-block;
|
|
height: 140px;
|
|
min-height: 100px;
|
|
margin: {
|
|
bottom: 5px;
|
|
right: 2px;
|
|
};
|
|
img {
|
|
height: 140px;
|
|
}
|
|
}
|
|
}
|
|
|
|
ul#settings_nav {
|
|
display: inline;
|
|
padding: 0;
|
|
font: {
|
|
size: large;
|
|
};
|
|
position: absolute;
|
|
left: 198px;
|
|
top: 5px;
|
|
> li {
|
|
display: inline;
|
|
margin: {
|
|
right: 1em;
|
|
};
|
|
font: {
|
|
weight: 700;
|
|
};
|
|
a {
|
|
padding: 2px;
|
|
font: {
|
|
weight: normal;
|
|
};
|
|
}
|
|
}
|
|
}
|
|
|
|
.settings_pane {
|
|
display: none;
|
|
}
|
|
|
|
#account_data {
|
|
a {
|
|
line-height: 30px;
|
|
}
|
|
}
|
|
|
|
.contact_pictures.horizontal {
|
|
img {
|
|
margin-right: -5px;
|
|
}
|
|
}
|
|
|
|
#thumbnails {
|
|
line-height: 14px;
|
|
}
|
|
|
|
.dull {
|
|
color: #aaaaaa;
|
|
text-align: center;
|
|
font: {
|
|
style: italic;
|
|
};
|
|
a {
|
|
color: #69aedd;
|
|
}
|
|
}
|
|
|
|
h1,h2,h3,h4 {
|
|
.description {
|
|
font: {
|
|
size: 70%;
|
|
weight: 100;
|
|
};
|
|
color: #aaaaaa;
|
|
margin: {
|
|
top: 0.5em;
|
|
};
|
|
}
|
|
}
|
|
|
|
h2,h3,h4 {
|
|
.description {
|
|
font: {
|
|
size: 80%;
|
|
weight: 200;
|
|
};
|
|
}
|
|
}
|
|
|
|
input[type="search"] {
|
|
appearance: textfield;
|
|
}
|
|
|
|
#photo_edit_options {
|
|
display: none;
|
|
}
|
|
|
|
#photodropzone {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
#section_header {
|
|
width: 100%;
|
|
border: {
|
|
bottom: 2px solid #777777;
|
|
};
|
|
position: relative;
|
|
margin: {
|
|
bottom: 2em;
|
|
};
|
|
padding: {
|
|
bottom: 0.4em;
|
|
};
|
|
h2 {
|
|
display: inline;
|
|
}
|
|
.right {
|
|
margin: {
|
|
top: 10px;
|
|
};
|
|
}
|
|
h4 {
|
|
display: inline;
|
|
margin: {
|
|
left: 1em;
|
|
};
|
|
}
|
|
}
|
|
|
|
.photo_options {
|
|
color: $text-grey;
|
|
text: {
|
|
align: center;
|
|
};
|
|
}
|
|
|
|
.inline {
|
|
display: inline;
|
|
}
|
|
|
|
.floating {
|
|
box-shadow: 0 1px 3px #333333;
|
|
position: relative;
|
|
padding: 12px;
|
|
margin: {
|
|
bottom: 2em;
|
|
};
|
|
background: {
|
|
color: rgb(255, 255, 255);
|
|
};
|
|
border: {
|
|
bottom: 1px solid #cccccc;
|
|
top: 1px solid white;
|
|
};
|
|
.submit_block {
|
|
position: absolute;
|
|
bottom: 13px;
|
|
right: 12px;
|
|
}
|
|
form {
|
|
display: relative;
|
|
}
|
|
}
|
|
|
|
#user_photo_uploader {
|
|
.avatar {
|
|
border-radius: 5px;
|
|
height: 100px;
|
|
width: 100px;
|
|
}
|
|
}
|
|
|
|
h3 span.current_gs_step {
|
|
color: #22c910;
|
|
}
|
|
|
|
ul#request_result {
|
|
padding: 0;
|
|
margin: 0;
|
|
li {
|
|
margin: {
|
|
bottom: 25px;
|
|
};
|
|
input.add {
|
|
color: green;
|
|
}
|
|
}
|
|
.stream_element {
|
|
.content {
|
|
display: inline;
|
|
position: relative;
|
|
bottom: 2.5em;
|
|
padding: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
#signup_field {
|
|
margin: {
|
|
top: -200px;
|
|
};
|
|
height: 46px;
|
|
padding: 0;
|
|
width: 400px;
|
|
display: inline;
|
|
div {
|
|
display: inline;
|
|
}
|
|
#mce-responses {
|
|
margin: {
|
|
top: 12px;
|
|
};
|
|
font: {
|
|
size: 12px;
|
|
};
|
|
display: block;
|
|
color: $text-grey;
|
|
text-shadow: 0 1px 0 white;
|
|
#mce-error-response {
|
|
color: red;
|
|
}
|
|
#mce-success-response {
|
|
color: green;
|
|
}
|
|
}
|
|
input[type='text'] {
|
|
top: -1px;
|
|
margin: 0 {
|
|
right: -3px;
|
|
};
|
|
width: 300px;
|
|
border-radius: 5px 0 0 5px;
|
|
position: relative;
|
|
display: inline;
|
|
padding: 12px;
|
|
font: {
|
|
size: 18px;
|
|
};
|
|
}
|
|
#big_action_button, input[type='submit'] {
|
|
@include linear-gradient(rgb(65, 182, 250), rgb(0, 123, 194));
|
|
height: 47px;
|
|
margin: 0;
|
|
background: {
|
|
color: $blue;
|
|
};
|
|
border-radius: 0 5px 5px 0;
|
|
border: 1px solid #cccccc;
|
|
padding: 12px;
|
|
font: {
|
|
size: 18px;
|
|
weight: bold;
|
|
};
|
|
color: #eeeeee;
|
|
text-shadow: 0 1px 0 #333333;
|
|
text: {
|
|
align: center;
|
|
};
|
|
&:hover {
|
|
@include linear-gradient(rgb(0, 136, 209), rgb(113, 204, 255));
|
|
}
|
|
}
|
|
}
|
|
|
|
#diaspora_description {
|
|
background: {
|
|
image: image-url("branding/ball.png");
|
|
repeat: no-repeat;
|
|
position: top center;
|
|
};
|
|
padding: {
|
|
top: 250px;
|
|
};
|
|
margin: {
|
|
top: -200px;
|
|
};
|
|
font: {
|
|
size: 3.3em;
|
|
weight: bold;
|
|
};
|
|
text-shadow: 0 1px 3px #999999;
|
|
p {
|
|
box-shadow: 0 1px 3px #cccccc;
|
|
padding: 12px;
|
|
background: {
|
|
color: white;
|
|
};
|
|
}
|
|
}
|
|
|
|
#login_field {
|
|
text: {
|
|
align: left;
|
|
};
|
|
font: {
|
|
style: italic;
|
|
};
|
|
margin: {
|
|
top: 14px;
|
|
left: 540px;
|
|
};
|
|
color: $text-grey;
|
|
}
|
|
|
|
ul#press_logos {
|
|
margin: 0 {
|
|
top: 100px;
|
|
};
|
|
padding: 0;
|
|
> li {
|
|
display: inline;
|
|
margin: {
|
|
right: 30px;
|
|
};
|
|
img {
|
|
height: 40px;
|
|
}
|
|
&:last-child {
|
|
margin: {
|
|
right: 0;
|
|
};
|
|
}
|
|
}
|
|
}
|
|
|
|
#landing_content {
|
|
margin: {
|
|
top: 100px;
|
|
};
|
|
text: {
|
|
align: center;
|
|
};
|
|
}
|
|
|
|
#why {
|
|
margin: {
|
|
bottom: 48px;
|
|
};
|
|
h2 {
|
|
text-shadow: 0 1px white;
|
|
border: {
|
|
bottom: 3px solid #eeeeee;
|
|
};
|
|
}
|
|
}
|
|
|
|
#signup {
|
|
margin: {
|
|
bottom: 48px;
|
|
};
|
|
}
|
|
|
|
#already_invited_pane {
|
|
h4 {
|
|
color: $text-dark-grey;
|
|
}
|
|
color: $text-dark-grey;
|
|
}
|
|
|
|
#search_title {
|
|
font: {
|
|
weight: 200;
|
|
};
|
|
.term {
|
|
font: {
|
|
weight: bold;
|
|
};
|
|
}
|
|
}
|
|
|
|
.aspects {
|
|
position: relative;
|
|
margin: {
|
|
top: 1em;
|
|
};
|
|
.right {
|
|
right: 12px;
|
|
}
|
|
.contact_list {
|
|
height: auto;
|
|
max-height: auto;
|
|
width: 500px;
|
|
}
|
|
}
|
|
|
|
.aspects .aspect_badge {
|
|
font: {
|
|
size: 1em;
|
|
};
|
|
}
|
|
|
|
.share_with {
|
|
min-width: 430px;
|
|
.avatar {
|
|
width: 50px;
|
|
height: 50px;
|
|
float: left;
|
|
}
|
|
h4,p {
|
|
padding: {
|
|
left: 64px;
|
|
};
|
|
}
|
|
p {
|
|
color: #eeeeee;
|
|
}
|
|
}
|
|
|
|
#aspects_list {
|
|
height: auto;
|
|
}
|
|
|
|
.show_comments {
|
|
border: {
|
|
top: 1px solid $border-grey;
|
|
};
|
|
margin: {
|
|
top: 5px;
|
|
};
|
|
}
|
|
|
|
.show_comments,
|
|
.likes_container {
|
|
a {
|
|
color: $text-grey;
|
|
}
|
|
}
|
|
|
|
.likes {
|
|
.entypo.heart {
|
|
font-size: 16px;
|
|
line-height: 16px;
|
|
vertical-align: top;
|
|
margin-right: 5px;
|
|
}
|
|
.bd {
|
|
display: inline-block;
|
|
.expand_likes {
|
|
vertical-align: text-bottom;
|
|
}
|
|
}
|
|
}
|
|
|
|
.mark_all_read {
|
|
position: relative;
|
|
top: 10px;
|
|
}
|
|
|
|
#inner_account_delete {
|
|
width: 810px;
|
|
}
|
|
|
|
.icons-monotone_email_letter_round {
|
|
height: 128px;
|
|
width: 128px;
|
|
}
|
|
|
|
#email_invitation {
|
|
input {
|
|
width: 100%;
|
|
}
|
|
textarea {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.share_with {
|
|
.add_aspect {
|
|
border-radius: 5px;
|
|
margin: {
|
|
top: 0.5em;
|
|
};
|
|
background: {
|
|
color: #dddddd;
|
|
};
|
|
p {
|
|
padding: {
|
|
left: 1em;
|
|
};
|
|
input[type='text'] {
|
|
width: 95%;
|
|
}
|
|
&.checkbox_select {
|
|
label {
|
|
padding: {
|
|
left: 15px;
|
|
};
|
|
top: 0;
|
|
}
|
|
height: 2em;
|
|
}
|
|
}
|
|
.right {
|
|
z-index: 5;
|
|
top: 34px;
|
|
right: 1em;
|
|
}
|
|
}
|
|
.done {
|
|
padding: 1em {
|
|
bottom: 2em;
|
|
};
|
|
.right {
|
|
right: 1em;
|
|
}
|
|
}
|
|
}
|
|
|
|
.invite_friends {
|
|
padding: 1em;
|
|
background: {
|
|
color: $background-grey;
|
|
};
|
|
border: 1px solid #cccccc;
|
|
}
|
|
|
|
#remember_me {
|
|
input[type='checkbox'] {
|
|
display: inline;
|
|
height: auto !important;
|
|
top: 2px !important;
|
|
}
|
|
label {
|
|
font-size: inherit !important;
|
|
position: static;
|
|
}
|
|
}
|
|
|
|
.public_icon, .service_icon {
|
|
cursor: pointer;
|
|
}
|
|
|
|
#contact_visibility_padlock:hover {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.side_stream {
|
|
.stream_element {
|
|
padding: 10px 0;
|
|
}
|
|
.avatar {
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
.diaspora_handle {
|
|
font: {
|
|
size: 12px;
|
|
weight: normal;
|
|
};
|
|
color: #555555;
|
|
}
|
|
|
|
.add_tags {
|
|
font: {
|
|
weight: normal;
|
|
size: 11px;
|
|
};
|
|
}
|
|
|
|
.hover_edit {
|
|
display: none;
|
|
font: {
|
|
weight: normal;
|
|
size: 11px;
|
|
};
|
|
margin: {
|
|
left: 5px;
|
|
};
|
|
}
|
|
|
|
.description:hover {
|
|
.hover_edit {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
.date {
|
|
background: {
|
|
color: #e6e6e6;
|
|
};
|
|
border-radius: 8px;
|
|
padding: 5px;
|
|
color: $text-grey;
|
|
text-align: center;
|
|
.day {
|
|
font-size: 50px;
|
|
font-weight: 200;
|
|
margin-bottom: -15px;
|
|
margin-top: -10px;
|
|
}
|
|
.month {
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
.subtle {
|
|
color: $text-grey;
|
|
font: {
|
|
style: italic;
|
|
};
|
|
}
|
|
|
|
.button.sign_up {
|
|
@include linear-gradient(#d9ffa9, #b9e68a);
|
|
text-shadow: none;
|
|
color: #333333;
|
|
&:hover {
|
|
@include linear-gradient(darken(#d9ffa9, 10%), darken(#b9e68a, 10%));
|
|
}
|
|
&:active {
|
|
@include linear-gradient(darken(#d9ffa9, 20%), darken(#b9e68a, 20%));
|
|
}
|
|
}
|
|
|
|
#client-application-image {
|
|
max-width: 100%;
|
|
}
|
|
|
|
#service_stream {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
#authorize {
|
|
text-align: center;
|
|
}
|
|
|
|
#application-description {
|
|
display: inline-block;
|
|
width: 300px;
|
|
padding-bottom: 20px;
|
|
}
|
|
|
|
ul#requested-scopes {
|
|
vertical-align: middle;
|
|
li {
|
|
display: inline-block;
|
|
padding: 5px;
|
|
img {
|
|
height: 30px;
|
|
width: 30px;
|
|
}
|
|
.scope-description {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.item_count {
|
|
min-width: 16px;
|
|
line-height: 16px;
|
|
text-align: center;
|
|
float: right;
|
|
border-radius: 4px;
|
|
margin-top: 1px;
|
|
color: $text-grey;
|
|
background: {
|
|
color: $background-grey;
|
|
};
|
|
display: inline-block;
|
|
font: {
|
|
size: 11px;
|
|
weight: 700;
|
|
};
|
|
}
|
|
|
|
ul.left_nav {
|
|
margin: 0 {
|
|
bottom: 15px;
|
|
};
|
|
padding: 0;
|
|
&.sub {
|
|
padding-left: 6px;
|
|
}
|
|
a.community_aspect_selector {
|
|
width: 152px;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
line-height: 25px;
|
|
text: {
|
|
decoration: none;
|
|
};
|
|
}
|
|
a {
|
|
font-weight: bold;
|
|
color: $link-grey;
|
|
text: {
|
|
decoration: none;
|
|
};
|
|
}
|
|
li {
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
li.active {
|
|
> a.home_selector:not(.sub_selected) {
|
|
font: {
|
|
weight: 700;
|
|
};
|
|
}
|
|
> a:not(.sub_selected) {
|
|
color: #333333;
|
|
.item_count {
|
|
color: $text-dark-grey;
|
|
}
|
|
}
|
|
}
|
|
a.aspect_selector,
|
|
a.home_selector,
|
|
a.tag_selector,
|
|
a.element_selector {
|
|
&:active {
|
|
cursor: grabbing;
|
|
}
|
|
}
|
|
a.home_selector,
|
|
a.tag_selector,
|
|
a.element_selector,
|
|
.root_element {
|
|
display: block;
|
|
width: 100%;
|
|
padding: 3px 7px;
|
|
}
|
|
a.home_selector,
|
|
li.aspect_element,
|
|
a.element_selector {
|
|
&:hover {
|
|
border-radius: 2px;
|
|
background: {
|
|
color: lighten($blue, 45%);
|
|
};
|
|
text: {
|
|
decoration: none;
|
|
};
|
|
}
|
|
}
|
|
.unfollow_icon {
|
|
margin-right: 10px;
|
|
margin-top: 4px;
|
|
@include transition(opacity);
|
|
opacity: 0.3;
|
|
position: absolute;
|
|
display: none;
|
|
padding: 0 5px;
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
.edit {
|
|
margin-right: 10px;
|
|
margin-top: 4px;
|
|
width: 12px;
|
|
height: 12px;
|
|
margin-top: 6px;
|
|
@include transition(opacity);
|
|
opacity: 0.3;
|
|
float: right;
|
|
display: none;
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
ul.sub_nav {
|
|
padding: {
|
|
left: 25px;
|
|
};
|
|
margin: 0;
|
|
li {
|
|
width: 204px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.section {
|
|
.left_nav {
|
|
a.aspect_selector,
|
|
a.home_selector {
|
|
width: 150px;
|
|
}
|
|
ul.sub_nav {
|
|
width: 140px;
|
|
&:hover {
|
|
width: auto;
|
|
}
|
|
a.aspect_selector {
|
|
width: 112px;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
line-height: 25px;
|
|
text: {
|
|
decoration: none;
|
|
};
|
|
}
|
|
a.tag_selector {
|
|
width: 117px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
display: inline-block;
|
|
&:after {
|
|
display: inline-block;
|
|
content: "";
|
|
width: 80px;
|
|
height: 25px;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 100px;
|
|
}
|
|
&:hover:after {
|
|
background: none;
|
|
}
|
|
}
|
|
li {
|
|
height: 25px;
|
|
.icons-check_yes_ok {
|
|
height: 18px;
|
|
width: 18px;
|
|
display: inline-block;
|
|
margin-left: 3px;
|
|
vertical-align: middle;
|
|
}
|
|
.icons-deletelabel {
|
|
height: 14px;
|
|
width: 14px;
|
|
margin-top: 4px;
|
|
}
|
|
}
|
|
li.unfollow,
|
|
li.sub_nav_item {
|
|
width: 172px;
|
|
}
|
|
li.unfollow:hover,
|
|
li.sub_nav_item:hover,
|
|
li.hover {
|
|
border-radius: 2px;
|
|
background: {
|
|
color: lighten($blue, 45%);
|
|
};
|
|
.edit,
|
|
.unfollow_icon {
|
|
z-index: 1;
|
|
display: inline-block;
|
|
.icons-monotone_close_exit_delete {
|
|
height: 16px;
|
|
width: 16px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.user_card {
|
|
margin-left: 8px;
|
|
}
|
|
}
|
|
|
|
.unread-setter {
|
|
display: none;
|
|
}
|
|
|
|
.stream_container {
|
|
min-height: 500px;
|
|
h3 {
|
|
margin: {
|
|
bottom: 0;
|
|
};
|
|
}
|
|
border: {
|
|
left: 1px solid $border-grey;
|
|
};
|
|
padding: {
|
|
left: 10px;
|
|
top: 20px;
|
|
};
|
|
margin: {
|
|
left: -10px;
|
|
top: -20px;
|
|
};
|
|
}
|
|
|
|
#aspect_stream_header {
|
|
padding: 0 12px;
|
|
}
|
|
|
|
.new_aspect,
|
|
a.toggle_selector {
|
|
outline: none;
|
|
color: $text-grey;
|
|
font: {
|
|
style: italic;
|
|
};
|
|
&:hover {
|
|
color: $link-grey;
|
|
}
|
|
}
|
|
|
|
#community_spotlight {
|
|
.avatar {
|
|
height: 140px;
|
|
width: 140px;
|
|
}
|
|
}
|
|
|
|
.user_card {
|
|
border-radius: 3px;
|
|
box-shadow: 0 1px 5px #cccccc;
|
|
padding: 10px {
|
|
bottom: 30px;
|
|
};
|
|
margin: {
|
|
bottom: 15px;
|
|
right: 10px;
|
|
};
|
|
position: relative;
|
|
min-height: 220px;
|
|
vertical-align: top;
|
|
border: 1px solid #cccccc;
|
|
display: inline-block;
|
|
width: 140px;
|
|
.tags {
|
|
color: $text-grey;
|
|
}
|
|
h4 {
|
|
margin: {
|
|
bottom: 0;
|
|
};
|
|
padding: {
|
|
bottom: 2px;
|
|
};
|
|
}
|
|
.dropdown {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.add_user_to_aspect {
|
|
bottom: 12px;
|
|
right: 5px;
|
|
position: absolute;
|
|
}
|
|
|
|
#right_service_icons {
|
|
text-align: center;
|
|
padding: 10px {
|
|
bottom: 0;
|
|
};
|
|
.social_media_logos-facebook-24x24,
|
|
.social_media_logos-twitter-24x24,
|
|
.social_media_logos-tumblr-24x24,
|
|
.social_media_logos-wordpress-24x24,
|
|
.social_media_logos-email-24x24,
|
|
.social_media_logos-feed-24x24,
|
|
.social_media_logos-website-24x24 {
|
|
height: 24px;
|
|
width: 24px;
|
|
}
|
|
a {
|
|
display: inline-block;
|
|
}
|
|
}
|
|
|
|
.action_item {
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.accept_invitation_form,
|
|
.sign_up_form {
|
|
min-height: 350px;
|
|
font-size: 16px;
|
|
input[type='text'],
|
|
input[type='password'],
|
|
input[type='email'] {
|
|
font-size: 16px !important;
|
|
width: 378px !important;
|
|
}
|
|
.diaspora_id_text {
|
|
font-size: 12px;
|
|
text-align: right;
|
|
color: $text-grey;
|
|
margin: {
|
|
top: -8px;
|
|
};
|
|
padding: 0;
|
|
}
|
|
.submit_field {
|
|
text-align: right;
|
|
}
|
|
}
|
|
|
|
.accept_invitation_text {
|
|
font: {
|
|
weight: lighter;
|
|
};
|
|
}
|
|
|
|
.red {
|
|
color: $red;
|
|
}
|
|
|
|
.green {
|
|
color: green;
|
|
}
|
|
|
|
.resend {
|
|
color: black;
|
|
&:hover {
|
|
text-decoration: none;
|
|
color: black;
|
|
&:hover {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
#grey_header {
|
|
box-shadow: 0 1px 1px #eeeeee;
|
|
background: {
|
|
color: #fafafa;
|
|
};
|
|
width: 100%;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
padding: {
|
|
top: 80px;
|
|
bottom: 20px;
|
|
};
|
|
text: {
|
|
align: center;
|
|
};
|
|
border: {
|
|
bottom: 1px solid $border-grey;
|
|
};
|
|
}
|
|
|
|
.mobile_row {
|
|
margin: {
|
|
bottom: 50px;
|
|
};
|
|
}
|
|
|
|
.field_with_errors {
|
|
position: relative;
|
|
input {
|
|
box-shadow: 0 0 8px lighten(#dd0000, 30%);
|
|
border: 1px solid #dd0000 !important;
|
|
}
|
|
}
|
|
|
|
.field_with_errors .message {
|
|
color: #dd0000;
|
|
font-size: 12px;
|
|
position: absolute;
|
|
top: 4px;
|
|
right: 10px;
|
|
left: auto;
|
|
}
|
|
|
|
.new_user_form fieldset, .accept_invitation_form fieldset {
|
|
border-radius: 3px;
|
|
background: {
|
|
color: white;
|
|
color: rgba(255, 255, 255, 0.95);
|
|
};
|
|
.submit_field {
|
|
margin: {
|
|
top: 15px;
|
|
};
|
|
}
|
|
span.host_uri {
|
|
float: right;
|
|
margin-top: -28px;
|
|
color: $text-grey;
|
|
padding-right: 9px;
|
|
}
|
|
}
|
|
|
|
.center {
|
|
text-align: center;
|
|
}
|
|
|
|
.nostrap,
|
|
.nostrap:focus {
|
|
box-shadow: none;
|
|
}
|
|
|
|
#hello-there {
|
|
p {
|
|
font-size: medium;
|
|
}
|
|
h1 {
|
|
margin: 0px;
|
|
}
|
|
h2 {
|
|
margin: {
|
|
top: 80px;
|
|
bottom: 12px;
|
|
};
|
|
}
|
|
h3 {
|
|
font: {
|
|
size: large;
|
|
weight: 200;
|
|
};
|
|
margin: 0px;
|
|
}
|
|
form, p {
|
|
margin-left: 30px;
|
|
}
|
|
input {
|
|
margin-bottom: 15px;
|
|
}
|
|
.hero-unit {
|
|
margin: 20px 42px;
|
|
padding: 40px 80px;
|
|
}
|
|
.awesome {
|
|
text-align: center;
|
|
margin-top: 60px;
|
|
.creation {
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
}
|
|
|
|
#profile_photo_upload {
|
|
#fileInfo {
|
|
margin-top: 12px;
|
|
text-align: left;
|
|
}
|
|
}
|
|
|
|
#welcome-to-diaspora {
|
|
box-shadow: inset 0 -2px 10px rgba(0, 0, 0, 0.35);
|
|
position: absolute;
|
|
width: 100%;
|
|
left: 0;
|
|
top: 0;
|
|
padding: {
|
|
top: 50px;
|
|
bottom: 10px;
|
|
};
|
|
h1,h3 {
|
|
color: white;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
background: orange;
|
|
&:hover {
|
|
#gs-skip-x {
|
|
opacity: 0.4;
|
|
@include transition(opacity, 0.25s);
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#gs-shim {
|
|
position: absolute;
|
|
top: 380px;
|
|
}
|
|
|
|
#gs-skip-x {
|
|
opacity: 0;
|
|
@include transition(opacity, 0.25s);
|
|
img {
|
|
position: relative;
|
|
right: 4px;
|
|
height: 20px;
|
|
}
|
|
}
|
|
|
|
.avatar.micro {
|
|
height: 20px;
|
|
width: 20px;
|
|
}
|
|
|
|
#gs-name-form-spinner {
|
|
position: absolute;
|
|
top: 24px;
|
|
right: -33px;
|
|
}
|
|
|
|
.left_nav {
|
|
#new_tag_following {
|
|
width: 137px;
|
|
margin: {
|
|
left: 24px;
|
|
};
|
|
input[type='text'] {
|
|
width: 137px;
|
|
font: {
|
|
size: 13px;
|
|
};
|
|
}
|
|
}
|
|
#tag_following_submit {
|
|
&.hidden {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.nsfw-shield {
|
|
border-radius: 3px;
|
|
background-color: $background-grey;
|
|
width: 90%;
|
|
padding: 5px 10px;
|
|
border: 1px solid $border-grey;
|
|
color: $text-grey;
|
|
}
|
|
|
|
#back-to-top {
|
|
display: block;
|
|
color: white;
|
|
position: fixed;
|
|
z-index: 49;
|
|
right: 20px;
|
|
bottom: 20px;
|
|
opacity: 0;
|
|
font-size: 3em;
|
|
padding: 0 11px 0 12px;
|
|
border-radius: 10px;
|
|
background-color: #aaaaaa;
|
|
&:hover {
|
|
opacity: 0.85 !important;
|
|
}
|
|
&.visible {
|
|
opacity: 0.5;
|
|
}
|
|
}
|
|
|
|
.float-right {
|
|
float: right;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.nsfw_off {
|
|
font-size: smaller;
|
|
color: $text-grey;
|
|
a {
|
|
color: $text-dark-grey;
|
|
}
|
|
}
|
|
|
|
#fileInfo {
|
|
font-size: small;
|
|
text-align: right;
|
|
margin: 5px 2px;
|
|
}
|
|
|
|
.post_preview_button {
|
|
padding: 3px 9px 4px;
|
|
}
|
|
|
|
.post_preview {
|
|
padding: {
|
|
top: 5px;
|
|
};
|
|
border: {
|
|
bottom: 3px solid #3f8fba !important;
|
|
};
|
|
background: {
|
|
color: #e8f7ff;
|
|
};
|
|
}
|
|
|
|
#location {
|
|
border: 1px solid $border-dark-grey;
|
|
height: 20px;
|
|
#location_address {
|
|
border: none;
|
|
color: #aaaaaa;
|
|
height: 10px;
|
|
width: 430px;
|
|
float: left;
|
|
}
|
|
a#hide_location {
|
|
position: absolute;
|
|
right: 22px;
|
|
filter: alpha(opacity = 30);
|
|
-moz-opacity: 0.3;
|
|
-khtml-opacity: 0.3;
|
|
opacity: 0.3;
|
|
z-index: 5;
|
|
}
|
|
a#hide_location:hover {
|
|
opacity: 1;
|
|
cursor: pointer;
|
|
}
|
|
}
|