X-Git-Url: https://git.mxchange.org/?a=blobdiff_plain;f=view%2Ftheme%2Fvier%2Fstyle.css;h=e716766492f0198c446a603e7ad56288f8d3c2e5;hb=ec68e33c6b91293531a3ef34d3e3a5c089273739;hp=04328e00da7c1310b9f1771837c20dbc5584b2bd;hpb=17236b18011f6c2fa7df7d1433dd815d4438baf8;p=friendica.git diff --git a/view/theme/vier/style.css b/view/theme/vier/style.css index 04328e00da..e716766492 100644 --- a/view/theme/vier/style.css +++ b/view/theme/vier/style.css @@ -19,6 +19,10 @@ img { /* width: 80%;*/ } +#adminpage .screenshot img { + width: 640px; +} + #pending-update { float:right; color: #ffffff; @@ -125,10 +129,12 @@ img { background-repeat: no-repeat; width: 18px; height: 18px; - display: block; + /* display: block; */ + display: inline-block; overflow: hidden; padding: 1px; color: #999; + vertical-align: text-top; } .icon:hover { @@ -143,8 +149,9 @@ img { text-indent: 0px; } .icon.s10 { - min-width: 10px; - height: 10px; +/* min-width: 10px; + height: 10px; */ + /* font-size: 10px; */ } .icon.s10.text { padding: 2px 0px 0px 15px; @@ -190,26 +197,35 @@ img { margin-bottom: 5px; } +div.pager a { + margin-left: 5px; + margin-right: 5px; +} + +span.pager_first a, span.pager_n a, +span.pager_last a, span.pager_prev a, span.pager_next a { + color: darkgray; +} + div.pager { -/* .birthday-notice { */ + clear: left; text-align: center; +/* height: 1.2em; padding-bottom: 12px; color: black; - /*-webkit-border-radius: 6px; - -moz-border-radius: 6px; - border-radius: 6px;*/ background-color: #f2f2f2; - clear: left; margin-top: 5px; padding: 1%; height: 1em; margin-bottom: 5px; -}*/ +*/ +} -.birthday-notice { +.birthday-notice, .event-notice { margin-top: 5px; margin-bottom: 5px; + background-color: #F5F5F5; } #live-network { @@ -230,42 +246,8 @@ div.pager { float: left; } -.shared_header { - height: 32px; - color: #999; - border-top: 1px solid #D2D2D2; - padding-top: 5px; - margin-top: 5px; -} - -.shared_header a { - color: black; - -webkit-transition: all 0.2s ease-in-out; - -moz-transition: all 0.2s ease-in-out; - -o-transition: all 0.2s ease-in-out; - -ms-transition: all 0.2s ease-in-out; - transition: all 0.2s ease-in-out; -} - -.shared_header a:hover { - color: #36c; -} - -.shared_header img { - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - float: left; -} - -.shared_header span { - margin-left: 9px; -} - -blockquote.shared_content { - margin-left: 32px; - color: #000; - border: none; +#contacts-actions { + clear: both; } #contact-edit-drop-link-end { @@ -289,11 +271,16 @@ blockquote.shared_content { /* global */ body { - font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif; + /* font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif; */ + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; + /* font-size: 13px; + line-height: 19.5px; */ + font-weight: 400; + font-style: normal; /* background-color: #ffffff; */ - background-color: #FAFAFA; - /* background-color: rgb(252, 252, 252); */ + /* background-color: #FAFAFA; */ + background-color: rgb(229, 229, 229); color: #2d2d2d; margin: 0px 0px 0px 0px; display: table; @@ -373,8 +360,6 @@ code { list-style: none; border: 3px solid #364e59; z-index: 100000; - -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); - -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); } /* tool */ @@ -415,7 +400,8 @@ code { #sidebar-ungrouped:hover, .side-link:hover, .nets-ul li:hover, #forum-list div:hover, .nets-all:hover, .saved-search-li:hover, li.tool:hover, .admin.link:hover, aside h4 a:hover, #message-new:hover { /* background-color: #ddd; */ - background-color: #e5e5e5; +/* background-color: #e5e5e5; */ + background-color: #F5F5F5; } #message-new a { @@ -441,11 +427,11 @@ code { a.nets-link, .side-link a, #sidebar-new-group a, a.savedsearchterm, a.fileas-link, aside h4 a { display: block; - color: black; + color: #737373; } a.sidebar-group-element { - color: black; + color: #737373; } #follow-sidebar form, #peoplefind-sidebar form, #netsearch-box form, #posted-date-selector { @@ -463,7 +449,7 @@ a.sidebar-group-element { } #forum-list a, .tool a, .admin.link a { - color: black; + color: #737373; } #forum-list { @@ -548,10 +534,7 @@ nav { background: linear-gradient(top, #516499 0%,#364a84 100%); */ color: #ffffff; z-index: 100; - /*-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); - -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); - border-bottom: 5px solid #F80; */ } nav .icon { @@ -724,6 +707,7 @@ nav #nav-messages-linkmenu.selected, nav #nav-user-linklabel.selected, nav #nav-apps-link.selected { background-color: #364e59; + border-bottom-style: none; } /* nav #nav-community-link { */ @@ -767,8 +751,6 @@ ul.menu-popup { list-style: none; border: 3px solid #364e59; z-index: 100000; - -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); - -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); } ul.menu-popup a { @@ -809,8 +791,6 @@ ul.menu-popup .empty { border: 1px solid #MenuBorder; overflow: auto; z-index: 100000; - -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); - -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); } .acpopupitem { @@ -873,18 +853,22 @@ aside { padding: 10px 10px 0px 20px; /* border-right: 1px solid #D2D2D2; */ /* background-color: #ECECF2; */ - background-color: #F2F2F2; + /* background-color: #F2F2F2; */ + background-color: #FFFFFF; font-size: 13px; /* background: #F1F1F1; */ /* top: 0px; */ top: 32px; overflow-y: auto; z-index: 2; - + line-height: 17px; position: fixed; /* overflow: auto; */ + height: 100%; height: calc(100% - 42px); /* overflow: scroll; */ + box-shadow: 1px 2px 0px 0px #D8D8D8; + color: #737373; } aside .vcard .fn { font-size: 18px; @@ -918,6 +902,10 @@ aside .vcard dd { margin-left: 4px; /* width: 60%; */ } +aside #profile-photo-wrapper img { + width: 175px; +} + aside #profile-extra-links ul { padding: 0px; margin: 0px; @@ -949,7 +937,7 @@ aside #profiles-menu { } aside #search-text, aside #side-follow-url, aside #side-peoplefind-url { - width: 150px; + width: 140px; height: 17px; padding-left: 10px; /*border-top-left-radius: 15px; @@ -1083,6 +1071,11 @@ aside h4 { } /* section */ section { + /*font-size: 13px; + line-height: 19.5px;*/ + font-size: 14.95px; + line-height: 21px; + /* font-family: Quodana,Verdana,DejaVu Sans,Bitstream Vera Sans,Helvetica,sans-serif; */ display: table-cell; vertical-align: top; top: 32px; @@ -1091,13 +1084,15 @@ section { padding: 10px 10px 10px 10px; /* background-color: white; */ /* background-color: rgb(252, 252, 252); */ - background-color: #FAFAFA; - border-bottom: 1px solid lightgray; + /* background-color: #FAFAFA; */ + background-color: inherit; + /* border-bottom: 1px solid lightgray; border-right: 1px solid lightgray; - border-left: 1px solid lightgray; - + border-left: 1px solid lightgray; */ position: absolute; left: 215px; + left: calc(215px + (100% - (215px + 766px)) / 6); + /* left: calc(215px + (100% - 215px) / 10); */ } section.minimal { @@ -1108,15 +1103,18 @@ section.minimal { /* wall item */ .tread-wrapper { /* border-bottom: 1px solid #BDCDD4; */ -border-bottom: 1px solid #D2D2D2; + border-bottom: 1px solid #D2D2D2; position: relative; padding: 5px; - margin-bottom: 0px; - /* width: 755px; */ + margin-bottom: 10px; + box-shadow: 1px 2px 0px 0px #D8D8D8; + background-color: #FFFFFF; + /* width: 755px; */ } .wall-item-decor { position: absolute; left: 755px; + left: calc(100% - 16px); /* top: -10px; */ width: 16px; } @@ -1126,22 +1124,39 @@ border-bottom: 1px solid #D2D2D2; .wall-item-container { display: table; width: 745px; + width: calc(100% - 10px); +} + +.wall-item-content hr { + background: none repeat scroll 0% 0% rgb(221, 221, 221); + color: rgb(221, 221, 221); + clear: both; + float: none; + width: 100%; + height: 0.1em; + /* margin: 0px 0px 1.45em; */ + border: medium none; } + .wall-item-container .wall-item-item, .wall-item-container .wall-item-bottom { display: table-row; } .wall-item-bottom { - font-size: 14px; + /* font-size: 14px; */ } -.wall-item-container .wall-item-bottom { - opacity: 0; +.wall-item-container .wall-item-tags, +.wall-item-container .wall-item-links, +.wall-item-container .wall-item-actions { + opacity: 0.2; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } -.wall-item-container:hover .wall-item-bottom { +.wall-item-container:hover .wall-item-tags, +.wall-item-container:hover .wall-item-links, +.wall-item-container:hover .wall-item-actions { opacity: 1; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; @@ -1178,38 +1193,29 @@ border-bottom: 1px solid #D2D2D2; width: 350px; float: left; font-size: 12px; -} +}} -.wall-item-container .wall-item-content .type-link img, -.type-link img { - max-width: 160px; - max-height: 160px; - float: left; - margin-right: 10px; -} -.type-link blockquote { - margin-left: 160px; - max-height: 160px; - overflow: hidden; -} -.type-link .oembed { +h2 { + line-height: normal; } .wall-item-container .wall-item-content { - font-size: 14px; + /* font-size: 14px; */ max-width: 660px; word-wrap: break-word; - line-height: 1.36; + /* line-height: 1.36; */ padding-bottom: 6px; } .wall-item-container .wall-item-content img { - max-width: 650px; + max-width: 100%; + /* max-width: 650px; */ /* max-width: 580px; */ } .children .wall-item-container .wall-item-item .wall-item-content img { /* max-width: 650px; */ - max-width: 580px; + /* max-width: 580px; */ + max-width: 100%; } .wall-item-container .wall-item-links, .wall-item-container .wall-item-actions { display: table-cell; @@ -1273,7 +1279,7 @@ border-bottom: 1px solid #D2D2D2; transition: all 0.2s ease-in-out; } -/* .wall-item-container .wall-item-content a, */ +.wall-item-container .wall-item-content a, .toplevel_item .fakelink, .wall-item-container .fakelink { color: black; @@ -1298,6 +1304,11 @@ border-bottom: 1px solid #D2D2D2; transition: all 0.2s ease-in-out; } +.toplevel_item:hover .togglecomment, +.wall-item-container:hover .togglecomment { + color: #999; +} + .wall-item-container .wall-item-actions-author { width: 100%; margin-bottom: 0.3em; @@ -1327,8 +1338,10 @@ border-bottom: 1px solid #D2D2D2; margin-bottom: 5px; margin-left: 80px; width: 665px; + width: calc(100% - 90px); border-bottom: 1px solid hsl(198, 21%, 79%); } + .wall-item-container.comment .wall-item-content { max-width: 585px; } @@ -1353,19 +1366,30 @@ border-bottom: 1px solid #D2D2D2; .wall-item-comment-wrapper { margin: 1px 15px 1px 80px; } +.wall-item-comment-wrapper.photo { + margin: 1px 15px 1px 0px; +} +.wall-item-comment-wrapper.photo .wall-item-container.comment { + margin-left: 0px; + width: 665px; + width: 100%; + border-bottom: 1px solid hsl(198, 21%, 79%); +} + + .wall-item-comment-wrapper .comment-edit-photo { display: none; } .wall-item-comment-wrapper textarea { height: 1.2em; width: 100%; - font-size: 10px; + font-size: 13px; color: #999999; border: 1px solid #DDD; padding: 0.3em; } .wall-item-comment-wrapper .comment-edit-text-full { - font-size: 14px; + /* font-size: 14px; */ height: 4em; color: #2d2d2d; border: 1px solid #2d2d2d; @@ -1384,7 +1408,8 @@ border-bottom: 1px solid #D2D2D2; } .comment-edit-preview { - width: 660px; + /* width: 660px; */ + width: 100%; border: 1px solid #2d2d2d; margin-top: 10px; top: 15px !important; @@ -1394,13 +1419,16 @@ border-bottom: 1px solid #D2D2D2; padding-left: 12px; } .comment-edit-preview .wall-item-container { - width: 700px; + /* width: 700px; */ + width: 100%; } .comment-edit-preview .tread-wrapper { - width: 700px; + /* width: 700px; */ + width: 100%; padding: 0; - margin: 10px 0; + margin: 10px 0px 0px 0px; border-bottom: 0px; + box-shadow: none; } .wall-item-bottom .comment-edit-preview { @@ -1414,35 +1442,17 @@ border-bottom: 1px solid #D2D2D2; padding-right: 12px; */ } -.twit { - background-color: #FFFAFA; -} -.pump { - background-color: #FAFFFA; -} -.face { - background-color: #FAFAFF; -} -.feed { - background-color: #FFFFFA; -} -.dspr { - background-color: #FFFAFF; -} -.dfrn { - background-color: #FAFFFF; -} -.stat { - background-color: #FAFAFA; -} -.mail { - background-color: #FFFFF9; +#profile-jot-form { + box-shadow: 1px 2px 0px 0px #D8D8D8; + background-color: #fafafa; + padding: 10px; } #profile-jot-form #profile-jot-text { height: 2.0em; /* width: 99%; */ width: 752px; + width: calc(100% - 10px); font-size: 15px; color: #999999; border: 1px solid #DDD; @@ -1457,7 +1467,8 @@ border-bottom: 1px solid #D2D2D2; height: 20px; margin: 0 0 5px; /* width: 60%; */ - width: 762px; + /* width: 762px; */ + width: 100%; border: 1px solid #d2d2d2; } @@ -1468,7 +1479,8 @@ border-bottom: 1px solid #D2D2D2; font-weight: normal; } #profile-jot-form #profile-jot-text_parent #profile-jot-text_tbl{ - width: 785px; +/* width: 785px; */ + width: 100%; height: 100px; } @@ -1513,8 +1525,6 @@ border-bottom: 1px solid #D2D2D2; position: absolute !important; top: 40px; left: 30px; - -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); - -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); } .wwto .contact-photo { @@ -1740,6 +1750,13 @@ border-bottom: 1px solid #D2D2D2; margin-left: 15px; cursor: pointer; } +#profile-smiley-wrapper { + float: left; + margin-left: 15px; + cursor: pointer; + margin-top: 3px; + height: 10px; +} #jot-perms-icon { float: right; margin-left: 15px; @@ -1754,7 +1771,7 @@ border-bottom: 1px solid #D2D2D2; width: 780px; } #profile-jot-wrapper { - margin-bottom: 20px; + margin-bottom: 10px; } /** buttons **/ @@ -1871,16 +1888,21 @@ border-bottom: 1px solid #D2D2D2; } /** /acl **/ /** tab buttons **/ -ul.tabs { +div.pager, ul.tabs { list-style-type: none; padding-bottom: 10px; - padding-left: 0px; + padding-left: 10px; + padding-top: 0px; margin-bottom: 5px; - line-height: 27px; - height: 27px; - font-size: 11px; + line-height: 28px; + height: 20px; +/* font-size: 11px; */ + font-size: 13px; font-weight: bold; /* margin-bottom: 30px; */ + background-color: #FAFAFA; + box-shadow: 1px 2px 0px 0px #D8D8D8; + border-bottom: 1px solid #D2D2D2; } ul.tabs li { float: left; @@ -1890,39 +1912,81 @@ ul.tabs li { border-bottom: 1px solid #005c94; }*/ -ul.tabs a { +ul.tabs a, div.pager a { /* min-width: 34px; */ - display: block; - float: left; - padding-bottom: 0px; - padding: 0px 12px 0px 12px; - color: #444; +/* display: block; + float: left; */ + padding: 0px; + padding-bottom: 6px; +/* padding: 0px 12px 0px 12px; */ +/* color: #444; */ + color: darkgray; +} + +ul.tabs a { +/* box-shadow: 1px 2px 0px 0px #D8D8D8; */ + margin-right: 15px; + margin-left: 5px; } -div.pager, .birthday-notice, #jot-preview-link, .comment-edit-submit-wrapper .fakelink { +#birthday-notice, #event-notice { + box-shadow: 1px 2px 0px 0px #D8D8D8; + margin-bottom: 5px; +} + +#birthday-wrapper, #event-wrapper { + background-color: #FAFAFA; + box-shadow: 1px 2px 0px 0px #D8D8D8; + padding-left: 10px; + padding-right: 10px; + padding-top: 5px; + padding-bottom: 5px; + margin-bottom: 0px; +} + +.birthday-notice, .event-notice { + padding: 2px 7px 2px 7px; + color: darkgrey; + font-weight: bold; +} +.comment-edit-submit-wrapper .fakelink { padding: 2px 7px 2px 7px; color: black; } -div.pager, .birthday-notice, ul.tabs a, #jot-preview-link, .comment-edit-submit-wrapper .fakelink { - border: 1px solid lightgray; +.comment-edit-submit-wrapper .fakelink { +/* border: 1px solid lightgray; */ background: #F2F2F2; margin-top: 2px; margin-bottom: 2px; } +#event-notice:hover, #birthday-notice:hover, ul.tabs li .active, +.comment-edit-submit-wrapper .fakelink:hover { + color: black; +} + +span.pager_current, span.pager_n a:hover, +span.pager_first a:hover, span.pager_last a:hover, +span.pager_prev a:hover, span.pager_next a:hover, ul.tabs a:hover { - color: #333; + border-bottom: 2px solid #244C5E; + text-decoration: none; + color: grey; + padding-bottom: 6px; } -#event-notice:hover, #birthday-notice:hover, ul.tabs li .active, #jot-preview-link:hover, .comment-edit-submit-wrapper .fakelink:hover { - color: black; +ul.tabs li .active, span.pager_current a { + border-bottom: 2px solid #244C5E; + text-decoration: none; + color: black; } -ul.tabs a:hover, #event-notice:hover, #birthday-notice:hover, ul.tabs li .active, #jot-preview-link:hover, .comment-edit-submit-wrapper .fakelink:hover { - background-color: #e5e5e5; +#event-notice:hover, #birthday-notice:hover, .comment-edit-submit-wrapper .fakelink:hover { +/* background-color: #e5e5e5; */ + color: grey; text-decoration: none; - border: 1px solid darkgray; +/* border: 1px solid darkgray; */ } .comment-edit-bb { @@ -1931,6 +1995,7 @@ ul.tabs a:hover, #event-notice:hover, #birthday-notice:hover, ul.tabs li .active .comment-edit-bb a { color: #888; padding: 0px 5px 1px 5px; + cursor: pointer; } .comment-edit-bb a:hover { @@ -1952,7 +2017,7 @@ ul.tabs a:hover, #event-notice:hover, #birthday-notice:hover, ul.tabs li .active width: 200px; } .field input, .field textarea { - width: 400px; + max-width: 400px; } .field textarea { height: 100px; @@ -1997,6 +2062,12 @@ ul.tabs a:hover, #event-notice:hover, #birthday-notice:hover, ul.tabs li .active .field.radio .field_help { margin-left: 0px; } +aside form { + overflow-x: hidden; +} +aside form .field label { + float: inherit; +} #profile-edit-links-end { clear: both; @@ -2056,8 +2127,10 @@ ul.tabs a:hover, #event-notice:hover, #birthday-notice:hover, ul.tabs li .active /* contacts */ .contact-entry-wrapper { width: 120px; - height: 120px; + height: 130px; float: left; +/* overflow: hidden; */ + margin-left: 5px; } /* photo */ .lframe { @@ -2135,8 +2208,10 @@ blockquote { } .oembed { - font-size: large; + /* font-size: large; */ + font-size: larger; font-weight: bold; + display: block; } /* ================== */ @@ -2282,7 +2357,13 @@ a.mail-list-link { .vevent { border: 1px solid #CCCCCC; + max-width: 600px; + position: relative; + margin-top: 4px; + margin-right: 4px; + margin-bottom: 15px; } + .vevent .event-description, .vevent .event-location { margin-left: 10px; margin-right: 10px; @@ -2342,9 +2423,9 @@ a.mail-list-link { } .settings-block { - border: 1px solid #AAA; - margin: 10px; - padding: 10px; + /* border: 1px solid #AAA; */ + padding-left: 5px; + padding-right: 5px; } .app-title { @@ -2647,3 +2728,6 @@ a.mail-list-link { border: none; } +.settings-heading { + cursor: pointer; +}