X-Git-Url: https://git.mxchange.org/?a=blobdiff_plain;f=view%2Ftheme%2Fquattro%2Fquattro.less;h=91c8074d9f0f12dbb3476201177eff9e7eb8daef;hb=4e9236e9e999a19d5346d8d19088b167f8e42e09;hp=dded1514a54e81d41fd4c023661311a82a69fdaf;hpb=4554526515bd6a10041ffaacb156ec2c8d6942ac;p=friendica.git diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index dded1514a5..91c8074d9f 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -6,12 +6,12 @@ body { font-size: 11px; background-color: @BodyBackground; color: @BodyColor; - margin: 50px 0px 0px 0px; + margin: 50px 0 0 0; display:table; } h4 { font-size: 1.1em } -.shadow(@x: 0px, @y: 5px){ +.shadow(@x: 0, @y: 5px){ -webkit-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); -moz-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); @@ -36,7 +36,7 @@ h4 { font-size: 1.1em } -o-transition: all @d ease-in-out; -ms-transition: all @d ease-in-out; transition: all @d ease-in-out; -} +} a, a:link { color: @Link; text-decoration: none; } @@ -56,7 +56,7 @@ blockquote { padding: 1em; margin-left: 1em; border-left: 1em solid @BlockquoteBorderColor; - + } code { @@ -68,7 +68,7 @@ code { background: #EEE; color: #444; padding: 10px; - margin-top: 20px; + margin-top: 20px; } #panel { @@ -76,17 +76,19 @@ code { width: 10em; background: @MenuBg; color: @Menu; - margin: 0px; + margin: 0; padding: 1em; list-style: none; border: 3px solid @MenuBorder; z-index: 100000; - - .shadow(); + + .shadow(); } + /* tool */ + .tool { height: auto; overflow: auto; .label { float: left;} @@ -95,6 +97,8 @@ code { } + + /* popup notifications */ #jGrowl.top-right { top: 30px; @@ -122,15 +126,15 @@ div.jGrowl div.info { /* header */ header { - position: fixed; left: 43%; right: 43%; top: 0px; - margin: 0px; padding: 0px; + position: fixed; left: 43%; right: 43%; top: 0; + margin: 0; padding: 0; /*width: 100%; height: 12px; */ z-index: 110; color: @Grey1; #site-location { display: none; } - + #banner { overflow: hidden; text-align: center; @@ -140,42 +144,41 @@ header { #logo-text { font-size: 22px } } } - /* nav */ -nav { +nav { width: 100%; height: 32px; - position: fixed; left: 0px; top: 0px; - padding: 0px; + position: fixed; left: 0; top: 0; + padding: 0; background-color: @NavbarBackground; color: @Grey1; z-index: 100; - .shadow(0px, 0px); + .shadow(0px, 0); a, a:active, a:visited, a:link, a:hover { color: @Banner; text-decoration: none; outline: none; } ul { - margin: 0px; - padding: 0px 20px; - li { - list-style: none; - margin: 0px; padding: 0px; + margin: 0; + padding: 0 20px; + li { + list-style: none; + margin: 0; padding: 0; float: left; - .menu-popup{ left: 0px; right: auto; } + .menu-popup{ left: 0; right: auto; } } - + } .nav-menu-icon { position: relative; height: 22px; padding: 5px; - margin: 0px 10px; + margin: 0 10px; .roundtop(); - + &.selected { background-color: @NavbarSelectedBg; } - + img { width: 22px; height: 22px; } .nav-notify { top: 3px; } } @@ -184,13 +187,13 @@ nav { position: relative; height: 16px; padding: 5px; - margin: 3px 15px 0px; + margin: 3px 15px 0; font-size: 14px; border-bottom: 3px solid @NavbarBackground; &.selected { border-bottom: 3px solid @NavbarSelectedBorder; } - + } .nav-notify { @@ -200,30 +203,30 @@ nav { .rounded(); font-size: 10px; padding: 1px 3px; - top: 0px; + top: 0; right: -10px; min-width: 15px; text-align: right; - + &.show{ display: block; } } - - + + #nav-help-link, #nav-search-link, #nav-directory-link, #nav-apps-link, - #nav-site-linkmenu { + #nav-site-linkmenu { float: right; - .menu-popup{ right: 0px; left: auto; } + .menu-popup{ right: 0; left: auto; } } - + #nav-notifications-linkmenu.on .icon.s22.notify, #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/22/notify_on.png") } #nav-introductions-link.on .icon.s22.intro, #nav-introductions-link.selected .icon.s22.intro { background-image: url("icons/contacts_on.png") } #nav-messages-link.on .icon.s22.mail, - #nav-messages-link.selected .icon.s22.mail { background-image: url("icons/messages_on.png") } + #nav-messages-link.selected .icon.s22.mail { background-image: url("icons/messages_on.png") } #nav-apps-link.selected { background-color: @NavbarSelectedBg; } } @@ -234,14 +237,14 @@ ul.menu-popup { width: 10em; background: @MenuBg; color: @Menu; - margin: 0px; - padding: 0px; + margin: 0; + padding: 0; list-style: none; border: 3px solid @MenuBorder; z-index: 100000; - + .shadow(); - + a { display: block; color: @MenuItem; padding: 5px 10px; text-decoration: none;} a:hover { background-color: @MenuItemHoverBg; } .menu-sep { border-top: 1px solid @MenuItemSeparator; } @@ -253,18 +256,19 @@ ul.menu-popup { color: @MenuEmpty; } .toolbar { - background-color: @MenuEmpty; + background-color: @MenuEmpty; height: auto; overflow: auto; a { float: right; } a:hover { background-color: @MenuBg; } } - + } /* autocomplete popup */ +.autocomplete, .acpopup-mce { max-height:150px; } .autocomplete, +.acpopup-mce, .acpopup { - max-height:150px; background-color:@MenuBg; color: @Menu; border:1px solid @MenuBorder; @@ -272,7 +276,7 @@ ul.menu-popup { z-index:100000; .shadow(); } -.autocomplete > div, +.autocomplete > div, .acpopupitem { color: @MenuItem; padding: 4px; clear:left; @@ -288,6 +292,15 @@ ul.menu-popup { background-color: @MenuItemHoverBg; } } +.textcomplete-item { + color: @MenuItem; + a:hover{ + color: @MenuItem; + } + &.active{ + background-color: @MenuItemHoverBg; + } +} #nav-notifications-menu { @@ -298,13 +311,30 @@ ul.menu-popup { .notif-when { font-size: 10px; color: @MenuItemDetail; display: block; } } +/* Contact-Header for the Network Stream */ +#viewcontact_wrapper-network { + width: 100%; + min-height: 100px; + background-color: #eff0f1; + border-bottom: 1px solid #cccccc; + #contact-entry-wrapper-network { + float: none; + width: auto; + height: auto; + padding: 10px; + #contact-entry-accounttype-network { font-size: 22px; } + #contact-entry-name-network { font-size: 24.5px; font-weight: normal; } + .contact-details { font-size: 12px; } + } +} + /* aside 230px*/ -aside { +aside { display: table-cell; vertical-align: top; width: 200px; - padding:0px 10px 0px 20px; + padding:0px 10px 0 20px; border-right: 1px solid @AsideBorder; .profile-edit-side-div { display: none; } @@ -312,15 +342,17 @@ aside { .vcard { .fn { font-size: 16px; font-weight: bold; margin-bottom: 5px; } .title { margin-bottom: 5px; } + .p-addr { margin-bottom: 5px; } + .account-type { font-size: 14px; margin-bottom: 13px; } dl { height: auto; overflow: auto; } - dt {float: left; margin-left: 0px; width: 35%; text-align: right; color: @VCardLabelColor; } + dt {float: left; margin-left: 0; width: 35%; text-align: right; color: @VCardLabelColor; } dd {float: left; margin-left: 4px; width: 60%;} - + } #profile-extra-links { - ul { padding: 0px; margin: 0px; } - li { padding: 0px; margin: 0px; list-style: none; } + ul { padding: 0; margin: 0; } + li { padding: 0.2em 0; margin: 0; list-style: none; } } #wallmessage-link { @@ -332,30 +364,41 @@ aside { text-transform:uppercase; padding: 4px 2px 2px 35px; margin-top: 3px; - + &:hover { text-decoration: none; background-color: @AsideConnectHoverBg; } } #dfrn-request-link { display: block; .rounded(); color: @AsideConnect; - background: @AsideConnectBg url('../../../images/connect-bg.png') no-repeat left center; + background: @AsideConnectBg url('icons/connect-bg.png') no-repeat left center; font-weight: bold; text-transform:uppercase; padding: 4px 2px 2px 35px; - + + &:hover { text-decoration: none; background-color: @AsideConnectHoverBg; } + } + #subscribe-feed-link { + display: block; + .rounded(); + color: @AsideConnect; + background: @AsideConnectBg url('icons/rss-bg.png') no-repeat left center; + font-weight: bold; + text-transform:uppercase; + padding: 4px 2px 2px 35px; + &:hover { text-decoration: none; background-color: @AsideConnectHoverBg; } } #profiles-menu { width: 20em; } - + .posted-date-selector-months { margin-left: 10px; } } #contact-block { overflow: auto; height: auto; - .contact-block-h4 { float: left; margin: 5px 0px; } - .allcontact-link { float: right; margin: 5px 0px; } + .contact-block-h4 { float: left; margin: 5px 0; } + .allcontact-link { float: right; margin: 5px 0; } .contact-block-content { clear: both; overflow: hidden; @@ -364,7 +407,7 @@ aside { /*.contact-block-div { width:60px; height: 60px; }*/ .contact-block-link { float: left; - margin: 0px 2px 2px 0px; + margin: 0 2px 2px 0; img { width: 48px; height: 48px; } } } @@ -375,19 +418,19 @@ aside { .group-delete-wrapper { float: right; margin-right: 50px; - .drophide { - background-image: url('../../../images/icons/22/delete.png'); - display: block; width: 22px; height: 22px; - opacity: 0.3; - position: relative; - top: -50px; - } - .drop { - background-image: url('../../../images/icons/22/delete.png'); - display: block; width: 22px; height: 22px; - position: relative; - top: -50px; - } + .drophide { + background-image: url('../../../images/icons/22/delete.png'); + display: block; width: 22px; height: 22px; + opacity: 0.3; + position: relative; + top: -50px; + } + .drop { + background-image: url('../../../images/icons/22/delete.png'); + display: block; width: 22px; height: 22px; + position: relative; + top: -50px; + } } /* #group-members { @@ -415,28 +458,42 @@ aside { width: 60px; height: 60px; }*/ - + /* widget */ .widget { margin-bottom: 2em; - - h3 { padding: 0px; margin: 2px;} + + h3 { padding: 0; margin: 2px;} .action { .opaque(0.1); } input.action { .opaque(0.5); } &:hover .title .action { .opaque(1); } .tool:hover .action { .opaque(1); } .tool:hover .action.ticked { .opaque(1); } - ul { padding: 0px;} + ul { padding: 0;} ul li {padding-left: 16px; min-height: 16px; list-style: none; } - + .tool.selected { background: url('../../../images/selected.png') no-repeat left center; } - - /*.action .s10 { width: 10px; overflow: hidden; padding: 0px;} - .action .s16 { width: 16px; overflow: hidden; padding: 0px;}*/ - + + /*.action .s10 { width: 10px; overflow: hidden; padding: 0;} + .action .s16 { width: 16px; overflow: hidden; padding: 0;}*/ + + .notify { + display: none; + background-color: #19AEFF; + border-radius: 5px; + font-size: 10px; + padding: 1px 3px; + min-width: 15px; + text-align: right; + float: right; + color: rgb(255, 255, 255); + margin-right: 10px; + + &.on { display: block; } + } } /* widget: search */ @@ -447,19 +504,19 @@ aside { /* section 800px */ -section { +section { display: table-cell; vertical-align: top; width: 770px; - padding:0px 20px 0px 10px; + padding:0px 20px 0 10px; } .sparkle { - cursor: url('icons/lock.cur'), pointer; + cursor: url('icons/lock.cur'), pointer; } /* wall item */ -.tread-wrapper { +.tread-wrapper { background-color: @ThreadBackgroundColor; position: relative; padding: 10px; @@ -473,10 +530,10 @@ section { .wall-item-container { display: table; width: 750px; - + .wall-item-item, .wall-item-bottom { display: table-row; } - + .wall-item-bottom { .opaque(0.5); } &:hover .wall-item-bottom { .opaque(1); } .wall-item-info { @@ -484,8 +541,8 @@ section { vertical-align: top; text-align: left; width: 60px; - - } + + } .wall-item-location { word-wrap: break-word; width: 50px; @@ -498,59 +555,64 @@ section { } .wall-item-content img { max-width: 700px; } .wall-item-links, - .wall-item-actions { - display: table-cell; - vertical-align: middle; - + .wall-item-actions { + display: table-cell; + vertical-align: middle; + .icon { .opaque(0.5); } .icon:hover { .opaque(1.0); - } + } } - + .wall-item-ago { padding-right: 40px; } .wall-item-name { font-weight: bold; } - + .wall-item-actions-author { float: left; width: 20em; margin-top: 0.5em; } - .wall-item-actions-social { float: left; margin-top: 0.5em; + .wall-item-actions-events { float: left; margin-top: 0.5em; a { margin-right: 3em; } } - .wall-item-actions-tools { float: right; width: 15%; + .wall-item-actions-social { float: left; margin-top: 0.5em; + a { margin-right: 3em; + &.active { font-weight: bold;} + } + } + .wall-item-actions-tools { float: right; width: 15%; a { float: right; } input { float: right; } } - + } .wall-item-container.comment { .contact-photo-wrapper { margin-left: 16px; } - .contact-photo { - width: 32px; height: 32px; + .contact-photo { + width: 32px; height: 32px; } - + .contact-photo-menu-button { top: 15px !important; - left: 0px !important; + left: 0 !important; } .wall-item-links { padding-left: 12px; } - + .commentbox { - height: 0px; + height: 0; overflow: hidden; .wall-item-comment-wrapper { border-top: 1px solid @CommentBoxEmptyBorderColor; - height: 0px; overflow: hidden; + height: 0; overflow: hidden; } .transition(); } - + &:hover .commentbox { height:auto; overflow: visible; .wall-item-comment-wrapper { - border-top: 0px; + border-top: 0; height:auto;overflow: visible; } .transition(); @@ -563,9 +625,9 @@ section { .opaque(0.5); } .contact-photo-wrapper { margin-left: 32px; } - .contact-photo { + .contact-photo { width: 16px; height: 16px; - } + } .contact-photo-menu-button { top: 15px !important; left: 15px !important; @@ -576,8 +638,8 @@ section { .wall-item-comment-wrapper { margin: 1em 2em 1em 60px; .comment-edit-photo { display: none; } - - textarea { + + textarea { height: 1em; width: 100%; font-size: 10px; color: @CommentBoxEmptyColor; border: 1px solid @CommentBoxEmptyBorderColor; @@ -588,23 +650,23 @@ section { color: @CommentBoxFullColor; border: 1px solid @CommentBoxFullBorderColor; } - + &.photo { - margin: 1em 2em 1em 0px; + margin: 1em 2em 1em 0; } } -.threaded .wall-item-comment-wrapper { margin-left: 0px; } +.threaded .wall-item-comment-wrapper { margin-left: 0; } .comment-edit-preview { width: 710px; border: 1px solid @Grey5; margin-top: 10px; background-color: @JotPreviewBackgroundColor; - + .contact-photo { width: 32px; height: 32px; margin-left: 16px; /*background: url(../../../images/icons/22/user.png) no-repeat center center;*/ - } + } .contact-photo-menu-button { top: 15px !important; left: 15px !important; @@ -612,10 +674,10 @@ section { .wall-item-links { padding-left: 12px; } .wall-item-container { width: 90%; } - .tread-wrapper { - width: 90%; padding: 0; margin: 10px 0; + .tread-wrapper { + width: 90%; padding: 0; margin: 10px 0; background-color: @JotPreviewBackgroundColor; - border-bottom: 0px; + border-bottom: 0; } .wall-item-conv { display: none; } } @@ -655,11 +717,11 @@ section { a { color: @MentionColor; } } /*.filesavetags { - padding: 3px 0px 3px 0px; + padding: 3px 0 3px 0; opacity: 0.5; }*/ -.wwto { +.wwto { position: absolute !important; background: #FFFFFF; border: 2px solid @Metalic3; @@ -670,7 +732,7 @@ section { top: 40px; left: 30px; - .shadow(0px, 0px); + .shadow(0px, 0); } .wwto .contact-photo { width: 25px; height: 25px; } @@ -686,16 +748,16 @@ section { max-width: 650px; max-height: inital; float: none; - margin-right: 0px; + margin-right: 0; } - + } .type-link { blockquote { - margin: 1em 0px; + margin: 1em 0; max-height: 160px; overflow: hidden; - padding-left: 1em; + padding-left: 1em; } .oembed {} } @@ -726,12 +788,12 @@ blockquote.shared_content { border: none; } - .oembed.video { - > a.embed_video { + > a.embed_video { display: block; - float: none; + position: relative; > div { + position: absolute; top: 0px; left: 0px; background: rgba(255, 255, 255, 0.36) url(../../../images/icons/48/play.png) @@ -741,50 +803,49 @@ blockquote.shared_content { } } - /* threaded comments */ .children { margin-top: 1em; .hide-comments-outer { margin-left:60px; } - + .wwto { display: none; } - + .comment-edit-preview { width: 660px; .wall-item-container { width: 610px; } } - + & .children { - + margin-left: 40px; .wall-item-container { width: 710px; } .comment-edit-preview { width: 620px; .wall-item-container { width: 620px; } } - + & .children { .wall-item-container { width: 670px; } - .comment-edit-preview { width: 580px; + .comment-edit-preview { width: 580px; .wall-item-container { width: 580px; } } - + & .children { .wall-item-container { width: 630px; } - .comment-edit-preview { width: 540px; + .comment-edit-preview { width: 540px; .wall-item-container { width: 540px; } } & .children { .wall-item-container { width: 590px; } - .comment-edit-preview { width: 500px; + .comment-edit-preview { width: 500px; .wall-item-container { width: 500px; } } - + .children { - margin-left: 0px; - .hide-comments-outer { margin-left: 0px; } + margin-left: 0; + .hide-comments-outer { margin-left: 0; } } } - } + } } } } @@ -813,8 +874,8 @@ span[id^="showmore-wrap"] { .contact-select { position: absolute; top:64px; left:64px; display:none; } .contact-select:checked, .contact-photo:hover .contact-select { display:block; } -#contacts-actions { - position: absolute; +#contacts-actions { + position: absolute; left: 800px; width: 200px; background-color: @MenuBg; @@ -823,7 +884,7 @@ span[id^="showmore-wrap"] { display: block; width: 100%; background-color: @MenuBg; - border: 0px; + border: 0; color: @MenuItem; text-align: left; padding: 5px 10px; @@ -838,12 +899,12 @@ span[id^="showmore-wrap"] { #contacts-actions { left: 40px; } } -.contact-photo { +.contact-photo { width: 48px; height: 48px; img { width: 48px; height: 48px; } overflow: hidden; display: block; - } + } .contact-photo-menu-button { display: none; position: absolute; @@ -856,43 +917,65 @@ span[id^="showmore-wrap"] { width: 300px; height: 90px; padding-right: 10px; - margin: 0 10px 10px 0px; - .contact-photo-wrapper { - float: left; + margin: 0 10px 10px 0; + .contact-photo-wrapper { + float: left; margin-right: 10px; } - .contact-photo { + .contact-photo { width: 80px; height: 80px; img { width: 80px; height: 80px; } } .contact-photo-menu-button { - left: 0px; + left: 0; top: 63px; - } + } + .drop { + background-image: url('../../../images/icons/22/delete.png'); + display: block; width: 22px; height: 22px; + position: relative; + top: 10px; + left: -10px; + z-index: 99; + } + .drophide { + background-image: url('../../../images/icons/22/delete.png'); + display: block; width: 22px; height: 22px; + opacity: 0.3; + position: relative; + top: 10px; + left: -10px; + z-index: 99; + } + .contact-entry-connect { + padding-top: 5px; + font-weight: bold; + } } .directory-item { float: left; width: 200px; height: 200px; - .contact-photo { + .contact-photo { width: 175px; height: 175px; img { width: 175px; height: 175px; } } } -.contact-name { font-weight: bold; padding-top: 15px; } -.contact-details { +.contact-name { font-weight: bold; /* padding-top: 15px; */} +.contact-details { color: @Grey3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +#contact-edit-status-wrapper { border-color: @JotToolsOverBackgroundColor;} /* editor */ .jothidden { display: none; } #jot { width: 100%; - margin: 0px 2em 20px 0px; - + margin: 0 2em 20px 0; + .profile-jot-text { height: 1em; width: 99%; font-size: 10px; color: @CommentBoxEmptyColor; @@ -901,7 +984,7 @@ span[id^="showmore-wrap"] { } #jot-tools { - margin: 0px; padding: 0px; + margin: 0; padding: 0; height: 40px; overflow: none; width: 770px; background-color: @JotToolsBackgroundColor; @@ -939,7 +1022,7 @@ span[id^="showmore-wrap"] { border-left: 10px solid @JotPermissionLockBackgroundColor; background-color: @JotPermissionLockBackgroundColor; } - + } li.submit { float: right; @@ -948,7 +1031,7 @@ span[id^="showmore-wrap"] { border-right: 1px solid @Grey4; border-left: 1px solid @Grey4; input { - border: 0px; margin: 0px; padding: 0px; + border: 0; margin: 0; padding: 0; background-color: @JotSubmitBackgroundColor; color: @JotSubmitText; width: 80px; height: 40px; @@ -972,8 +1055,8 @@ span[id^="showmore-wrap"] { } #jot-title { - border: 0px; - margin: 0px; + border: 0; + margin: 0; height: 20px; width: 500px; font-weight: bold; @@ -985,12 +1068,12 @@ span[id^="showmore-wrap"] { &:-moz-placeholder { font-weight: normal; - } - + } + &:hover { border: 1px solid @CommentBoxEmptyBorderColor } &:focus { border: 1px solid @CommentBoxEmptyBorderColor } } - + #character-counter { width: 40px; float: right; @@ -999,10 +1082,10 @@ span[id^="showmore-wrap"] { line-height: 20px; padding-right: 20px; } - + #jot-category { - border: 0px; - margin: 0px; + border: 0; + margin: 0; height: 20px; width: 200px; border: 1px solid @BodyBackground; @@ -1014,14 +1097,35 @@ span[id^="showmore-wrap"] { /** buttons **/ /*input[type="submit"] { - border: 0px; + border: 0; background-color: @ButtonBackgroundColor; color: @ButtonColor; - padding: 0px 10px; + padding: 0 10px; .rounded(5px); height: 18px; }*/ +a.actionbutton { + border: 1px solid @Grey3; + background-color: @Grey2; + color: @Grey5; + font-size: 8pt; + padding: 2pt; + .rounded(); + + i.icon { + display: inline-block; + vertical-align: baseline; + padding: 0; + } + + &:hover { + text-decoration: none; + background-color: @Grey1; + } +} +h2 > .actionbutton { float: right; } + /** acl **/ #photo-edit-perms-select, @@ -1031,6 +1135,7 @@ span[id^="showmore-wrap"] { } + #acl-wrapper { width: 690px; float:left; @@ -1049,7 +1154,7 @@ span[id^="showmore-wrap"] { background-image: url("../../../images/show_all_off.png"); background-position: 7px 7px; background-repeat: no-repeat; - padding: 7px 5px 0px 30px; + padding: 7px 5px 0 30px; color: #999999; .rounded(5px); } @@ -1067,7 +1172,7 @@ span[id^="showmore-wrap"] { overflow: auto; } #acl-list-content { - + } .acl-list-item { display: block; @@ -1083,8 +1188,8 @@ span[id^="showmore-wrap"] { float: left; margin: 4px; } -.acl-list-item p { height: 12px; font-size: 10px; margin: 0px; padding: 2px 0px 1px; overflow: hidden;} -.acl-list-item a { +.acl-list-item p { height: 12px; font-size: 10px; margin: 0; padding: 2px 0 1px; overflow: hidden;} +.acl-list-item a { font-size: 8px; display: block; width: 40px; @@ -1129,12 +1234,12 @@ ul.tabs { li { float: left; margin-left: 20px; - + .active { border-bottom: 1px solid @LinkVisited; } } - + } @@ -1143,7 +1248,7 @@ ul.tabs { #group-update-wrapper{ height: auto; overflow: auto; #group { - width:300px; + width:300px; float:left; margin-right:20px; } @@ -1172,6 +1277,7 @@ ul.tabs { overflow: auto; width: 100%; + label { float: left; width: 200px; @@ -1184,15 +1290,15 @@ ul.tabs { input[type="checkbox"], input[type="radio"]{ width: auto; } - + textarea { height: 100px; } .field_help { display: block; margin-left: 200px; color: @FieldHelpColor; - } + .onoff { float: left; width: 80px; @@ -1224,7 +1330,7 @@ ul.tabs { } .hidden { display: none!important; } - &.radio .field_help { margin-left: 0px; } + &.radio .field_help { margin-left: 0; } } @@ -1264,7 +1370,7 @@ ul.tabs { } #profile-edit-profile-name, #profile-edit-name, -#gender-select, +#gender-select, #profile-edit-pdesc, #profile-edit-gender, #profile-edit-dob, @@ -1289,7 +1395,7 @@ ul.tabs { height: auto; overflow: auto; border-bottom: 2px solid #cccccc; padding-bottom: 1em; - margin-bottom: 1em; + margin-bottom: 1em; } .oauthapp img { float: left; @@ -1310,11 +1416,50 @@ ul.tabs { width: 50px; float: left; } +/* manage page */ +.identity-match-photo { + position: relative; + .manage-notify { + background-color: #19AEFF; + border-radius: 5px; + font-size: 10px; + padding: 1px 3px; + min-width: 15px; + text-align: right; + position: absolute; + right: 10px; + top: -5px; + color: rgb(255, 255, 255); + } +} + + +/* videos page */ +.videos { + .video-top-wrapper { + width: 200px; float: left; + margin: 0 10px 10px 0; + position: relative; + + .video-delete { + position: absolute; + opacity: 0; + right: 0; + top: 0; + transition: opacity 0.5s; + } + + &:hover .video-delete { + opacity: 1; + } + } +} + /* photo albums */ @photosize: 150px; #photo-edit-link-wrap { margin-bottom: 10px; } - + #album-edit-link { border-right: 1px solid @MenuBorder; float: left; @@ -1332,7 +1477,7 @@ ul.tabs { } #photo-top-upload-link, -.photos-upload-link { margin: 1em 0px; display: block; } +.photos-upload-link { margin: 1em 0; display: block; } .photos-upload-link a, #photo-top-upload-link { background: url("../../../images/icons/16/add.png") no-repeat left center; @@ -1343,36 +1488,36 @@ ul.tabs { .photo-top-image-wrapper, .photo-album-image-wrapper { float: left; - margin: 0px 10px 10px 0px; + margin: 0 10px 10px 0; width:@photosize; height: @photosize; position: relative; overflow: hidden; - + img { width: @photosize; } - + .photo-top-album-name, .caption{ position: absolute; color: @Menu; background-color: @MenuBg; - + width: 100%; .shadow(0px, 5px); .transition(0.5s); bottom: -@photosize; } - + &:hover .photo-top-album-name, &:hover .caption { - bottom: 0px; - .shadow(0px, 0px); + bottom: 0; + .shadow(0px, 0); .transition(0.5s); } } #photo-photo { display: block; width: 660px; - padding: 50px; margin-bottom: 0px; + padding: 50px; margin-bottom: 0; text-align: center; background-color: @Grey3; img { max-width: 560px; } @@ -1381,8 +1526,8 @@ ul.tabs { background: url("../../../images/icons/22/image.png") no-repeat top left; padding-left: 23px; min-height: 22px; - padding-top: 6px; - /* a { display: block;}*/ + padding-top: 6px; + /* a { display: block;}*/ } #photo-caption { @@ -1409,6 +1554,11 @@ ul.tabs { .icon {float: left;} .like-rotator {float: right;} } + +#photo_edit_form { + padding: 1em; +} + /* profile match wrapper */ .profile-match-wrapper { float: left; @@ -1430,14 +1580,14 @@ ul.tabs { top: 10px; left: -10px; } - .contact-photo { + .contact-photo { width: 80px; height: 80px; img { width: 80px; height: 80px; } } .contact-photo-menu-button { - left: 0px; + left: 0; top: 63px; - } + } } /* messages */ @@ -1450,7 +1600,7 @@ ul.tabs { text-align: center; display: block; font-weight: bold; - padding: 1em 0px; + padding: 1em 0; } } @@ -1458,31 +1608,50 @@ ul.tabs { background-color: @MailListBackgroundColor; margin-bottom: 5px; width: 100%; height: auto; overflow: hidden; - + span { display: block; float: left; width: 20%; overflow: hidden;} - - .mail-subject { + + .mail-subject { width: 30%; - padding:4px 0px 0px 4px; + padding:4px 0 0 4px; a { display: block; } &.unseen a { font-weight: bold; } } - .mail-date { padding: 4px 4px 0px 4px; } - .mail-from { padding: 4px 4px 0px 4px; } - .mail-count { padding: 4px 4px 0px 4px; text-align: right;} - + .mail-date { padding: 4px 4px 0 4px; } + .mail-from { padding: 4px 4px 0 4px; } + .mail-count { padding: 4px 4px 0 4px; text-align: right;} + .mail-delete { float: right; } } +#message-preview { + margin-top: 1em; + box-sizing: border-box; + * { box-sizing: border-box; white-space: nowrap;} + .mail-list-wrapper { + .mail-subject { + width: 100%; + } + .mail-date { font-size: 0.8em; width: 25%; text-align: right} + .mail-from { font-size: 0.8em; width: 75%;} + .mail-count { font-size: 0.8em; width: 100%;} + .mail-delete { display: none;} + + & .mail-date, & .mail-from, & .mail-count { .opaque(0.5); } + &:hover .mail-date, &:hover .mail-from, &:hover .mail-count { .opaque(1); } + } +} + + #mail-display-subject { background-color: @MailDisplaySubjectBackgroundColor; color: @MailDisplaySubjectColor; margin-bottom: 10px; width: 100%; height: auto; overflow: hidden; - span { float: left; overflow: hidden; padding: 4px 0px 0px 10px;} + span { float: left; overflow: hidden; padding: 4px 0 0 10px;} .mail-delete { float: right; .opaque(0.5);} &:hover .mail-delete { .opaque(1); } - + } /* theme screenshot */ @@ -1501,6 +1670,9 @@ footer { height: 100px; display: table-row; } margin-top: 25px; clear: both; } +.pager .disabled { + display: none; +} /** * ADMIN @@ -1511,7 +1683,7 @@ footer { height: 100px; display: table-row; } font-weight: bold; background-color: #FF0000; padding: 0em 0.3em; - + } #adminpage { dl { @@ -1539,7 +1711,7 @@ footer { height: 100px; display: table-row; } text-align: right; } #pluginslist { - margin: 0px; padding: 0px; + margin: 0; padding: 0; } .plugin { list-style: none; @@ -1558,31 +1730,32 @@ footer { height: 100px; display: table-row; } } table { width:100%; - border-bottom: 1px solid #000000; - margin: 5px 0px; - th { + border-bottom: 1px solid #000000; + margin: 5px 0; + th { text-align: left; } - td .icon { + td .icon { float: left; } - tr:hover { + tr:hover { background-color: #bbc7d7; } } - table#users img { - width: 16px; height: 16px; + table#users img { + width: 16px; height: 16px; } .selectall { text-align: right; } } /* edit buttons for comments */ + .icon.dim { opacity: 0.3;filter:alpha(opacity=30); } .comment-edit-bb { list-style: none; display: none; - margin: 0px; - padding: 0px; + margin: 0; + padding: 0; width: 75%; } .comment-edit-bb > li { @@ -1599,21 +1772,21 @@ footer { height: 100px; display: table-row; } text-decoration: none; :hover {background-color: #ccc;} } -.boldbb { background-position: 0px 0px; } -.boldbb:hover { background-position: 0px -16px; } -.italicbb { background-position: -16px 0px; } +.boldbb { background-position: 0 0; } +.boldbb:hover { background-position: 0 -16px; } +.italicbb { background-position: -16px 0; } .italicbb:hover { background-position: -16px -16px; } -.underlinebb { background-position: -32px 0px; } +.underlinebb { background-position: -32px 0; } .underlinebb:hover { background-position: -32px -16px; } -.quotebb { background-position: -48px 0px; } +.quotebb { background-position: -48px 0; } .quotebb:hover { background-position: -48px -16px; } -.codebb { background-position: -64px 0px; } +.codebb { background-position: -64px 0; } .codebb:hover { background-position: -64px -16px; } -.imagebb { background-position: -80px 0px; } +.imagebb { background-position: -80px 0; } .imagebb:hover { background-position: -80px -16px; } -.urlbb { background-position: -96px 0px; } +.urlbb { background-position: -96px 0; } .urlbb:hover { background-position: -96px -16px; } -.videobb { background-position: -112px 0px; } +.videobb { background-position: -112px 0; } .videobb:hover { background-position: -112px -16px; } @@ -1625,7 +1798,7 @@ footer { height: 100px; display: table-row; } cursor:pointer; border:1px solid #333; width:200px; - margin:10px 0px 10px 0px; + margin:10px 0 10px 0; float: left; } @@ -1657,6 +1830,36 @@ footer { height: 100px; display: table-row; } width: 20px!important; font-size: 8pt; margin-left: 10px; - border: 0px; + border: 0; color: @FieldHelpColor; } + +/* buttons for the event view */ +.plink-event-link { + float: left; + margin-left: 2px; +} + +/* upload/select popup */ +.fbrowser { + overflow: auto; + position: absolute; + top: 0; + width: 100%; + height: 100%; +} +.fbrowser .path { + background-color: @NavbarBackground; + a { padding: 5px; margin: 0 2px; display: inline-block; } + a, a:active, a:visited, a:link, a:hover { color: @Banner; text-decoration: none; outline: none; } +} +.fbrowser .folders ul { list-style: url("icons/folder.png"); padding-left: 22px;} +.fbrowser .list { padding: 10px; } +.fbrowser.image .photo-album-image-wrapper { width: 48px; height: 48px; } +.fbrowser.image a img { width: auto; height: 48px; } +.fbrowser.image a p { display: none;} +.fbrowser.file .photo-album-image-wrapper { float:none; white-space: nowrap; width: 100%; height: auto; } +.fbrowser.file img { display: inline; width: 16px; height: 16px} +.fbrowser.file p { display: inline; white-space: nowrap; } + +.fbrowser .upload { clear: both; padding-top: 1em;}