modified: view/theme/smoothly/css/typography.css

[friendica.git] / view / theme / smoothly / style.css

diff --git a/view/theme/smoothly/style.css b/view/theme/smoothly/style.css
index 913e5d6e4b07fc19448589d40e1ff0fede92510b..ceda263fe5b74f86c81d07050996bc067986871f 100644 (file)
--- a/view/theme/smoothly/style.css
+++ b/view/theme/smoothly/style.css
@@ -2,7 +2,7 @@
        style.css
        Smoothly
    
-       Created by alex@friendica.pixelbits.de on 2012-10-24
+       Created by alex@friendica.pixelbits.de on 2012-11-12
 
 ** Colors ** 
 Blue links - #1873a2
@@ -215,12 +215,18 @@ section {
 }
 
 #login_standard {
-       width: 210px;
+       width: 250px;
        float: left;
+       border: 1px solid #7C7D7B;
+       border-radius: 5px;
+               -moz-border-radius: 5px;
+               -webkit-border-radius: 5px;
+       padding: 10px;
+       margin: 10px 0 0 0;
 }
 
 #login_openid {
-       width: 210px;
+       width: 300px;
        margin-left: 150px;
 }
 
@@ -249,6 +255,10 @@ section {
        margin-left: 75px;
 }
 
+#login-submit-button {
+       width: 271px;
+}
+
 .login-form,
        margin-top: 10px;
 }
@@ -351,7 +361,7 @@ nav #banner {
        display: block;
        position: absolute;
        margin-left: 3px;
-       margin-top: 3px;
+       /*margin-top: 2px;*/
        padding-bottom: 5px;    
 }
 
@@ -385,8 +395,24 @@ nav #user-menu {
        text-decoration: none;
        text-align: center;   
 }
+
+nav #user-menu:hover {
+       border: 1px solid #7C7D7B;
+       box-shadow: 0 0 8px #BDBDBD;
+               -moz-box-shadow: 3px 3px 4px #959494;
+               -webkit-box-shadow: 3px 3px 4px #959494;
+       border-radius: 5px;
+               -moz-border-radius: 5px;
+               -webkit-border-radius: 5px;
+       background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
+       background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
+       background-color: #1873a2;
+       color: #efefef;
+}
+
 nav #user-menu-label::after {
-       content: url("menu-user-pin.png") no-repeat;
+       content: url("images/menu-user-pin.png") no-repeat;
        padding-left: 15px;
 }
 
@@ -431,9 +457,9 @@ ul#user-menu-popup {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#797979', endColorstr='#898988');
        background-color: #898988;
        width: 100%;
-       padding: 10px 0px;
+       padding: 0;
        margin: 0px;
-       margin-top: 4px;
+       margin-top: 10px;
        top: 20px;
        left: 0px;
        border: 1px solid #9a9a9a;
@@ -461,7 +487,7 @@ ul#user-menu-popup li a:hover {
        background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6da6c4), color-stop(1, #1873a2) );
        background: -moz-linear-gradient( center top, #6da6c4 5%, #1873a2 100% );
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da6c4', endColorstr='#1873a2');
-       background-color: #6da6c4;
+       background-color: #1873a2;
 }
 
 ul#user-menu-popup li a.nav-sep {
@@ -483,7 +509,7 @@ ul#user-menu-popup li a.nav-sep {
 .nav-ajax-update {
        width: 44px;
        height: 32px;
-       background: transparent url('notifications.png') 0px 0px no-repeat; 
+       background: transparent url('images/notifications.png') 0px 0px no-repeat; 
        color: #333333;
        font-weight: bold;
        font-size: 0.8em;
@@ -696,7 +722,7 @@ aside h4 {
 }
 
 h3 #search:before {
-       content: url("search.png");
+       content: url("images/search.png");
        padding-right: 10px;
        vertical-align: middle;
 }
@@ -717,6 +743,29 @@ h3 #search:before {
        padding-bottom: 10px;
 }
 
+#message-sidebar {
+       vertical-align: middle;
+       margin-top: 40px;
+}
+
+#message-new {
+       padding: 7px;
+       width: 165px;
+       margin: 10px;
+       background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
+       background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
+       background-color: #bdbdbd;
+       display: inline-block;
+       color: #efefef;
+       text-decoration: none;
+       text-align: center;
+       border: 1px solid #7C7D7B;
+       border-radius: 5px;
+               -moz-border-radius: 5px;
+               -webkit-border-radius: 5px;
+}
+
 #peoplefind-desc {
        margin-left: 10px;
 }
@@ -726,6 +775,10 @@ h3 #search:before {
        margin-right: 30px;
 }
 
+#sidebar-ungrouped {
+       margin: 10px;
+}
+
 #sidebar-group-list  a {
 }
 
@@ -740,6 +793,11 @@ h3 #search:before {
        margin: 10px;
 }
 
+#side-peoplefind-url {
+       margin: 10px;
+       width: 175px;
+}
+
 #sidebar-page-list {}
 
 .widget {
@@ -760,7 +818,7 @@ h3 #search:before {
 
 li.widget-list {
        list-style: none outside none;
-       background: url("arrow.png") no-repeat scroll left center transparent;
+       background: url("images/arrow.png") no-repeat scroll left center transparent;
        display: block;
        padding: 3px 24px;
 }
@@ -858,7 +916,12 @@ ul .sidebar-group-li .icon {
 }
 
 .nets-link {
-       margin-left: 24px;
+       color: #1873A2;
+       text-decoration: none;
+       margin-left: 2px;
+       padding-left: 20px;
+       background: url("images/arrow.png") no-repeat scroll left center transparent;
+       box-shadow: none;
 }
 .nets-all {
        margin-left: 42px;
@@ -897,7 +960,7 @@ ul .sidebar-group-li .icon {
 }
 
 #group-sidebar h3:before {
-       content: url("groups.png");
+       content: url("images/groups.png");
        padding-right: 10px;
        vertical-align: middle;
 }
@@ -964,6 +1027,7 @@ ul .sidebar-group-li .icon {
 
 .contact-block-h4,
 .contact-block-content {
+       margin: 0;
 }
 
 #contact-block,
@@ -1307,14 +1371,10 @@ ul .sidebar-group-li .icon {
        margin-left: 10px;
 }
 
-.wall-item-photo-menu {
-       display: none;
-}
-
 .wall-item-photo-menu-button {
        display: none;
        text-indent: -99999px;
-       background: #eeeeee url("menu-user-pin.png") no-repeat 75px center;
+       background: #eeeeee url("images/menu-user-pin.png") no-repeat 75px center;
        position: absolute;
        overflow: hidden;
        height: 20px;
@@ -1333,8 +1393,16 @@ ul .sidebar-group-li .icon {
 
 .wall-item-photo-wrapper { 
        width: 80px; 
-       height: 80px;  
+       height: 80px;
+       padding: 4px;
        position: relative;
+       border: 1px solid #dddddd;
+       border-radius: 5px;
+               -webkit-border-radius: 5px;
+               -moz-border-radius: 5px;
+       box-shadow: 3px 3px 4px #959494;
+               -moz-box-shadow: 3px 3px 4px #959494;
+               -webkit-box-shadow: 3px 3px 4px #959494;
 }
 
 .wall-item-tools { 
@@ -1537,6 +1605,7 @@ ul .sidebar-group-li .icon {
 }
 
 .wall-item-photo-menu {
+       display: none;
        min-width: 92px;
        color: #2e3436;
        border-top: 1px;
@@ -1545,7 +1614,7 @@ ul .sidebar-group-li .icon {
        border-left: 1px solid #dddddd;
        border-bottom: 1px solid #dddddd;
        position: absolute;
-       left: -2px; 
+       left: -1px; 
        top: 101px;
        display: none;
        z-index: 10000;
@@ -1599,7 +1668,7 @@ ul .sidebar-group-li .icon {
 
 .icon.drop,
 .icon.drophide { 
-       float: right;
+       float: left;
 }
 
 #item-delete-selected-end,
@@ -1827,6 +1896,10 @@ div[id$="wrapper"] br {
        color: #898989;
 }
 
+#profile-edit-links {
+       margin-left: 0;
+}
+
 #profile-edit-links li {
        display: inline;
        width: 150px;
@@ -1885,10 +1958,12 @@ div[id$="wrapper"] br {
 }
 
 .profile-match-wrapper {
-       width: 82%;
-       padding: 5px;
+       float:left;
+       height:120px;
+       padding:10px;
+       width:120px;
        margin-bottom: 10px;
-       margin-left: 20px;
+       /*margin-left: 20px;*/
        background-color: #f6f6f6;
        border: 1px solid #dddddd;
        box-shadow: 3px 3px 4px #959494;
@@ -1917,12 +1992,19 @@ div[id$="wrapper"] br {
 }
 
 .photo {
-       height: 191px;
-       width: 191px;
+       height: 191px!important;
+       width: 191px!important;
+}
+
+#side-bar-photos-albums {
+}
+
+#photo-albums-upload-link {
+       margin: 20px;
 }
 
 #side-bar-photos-albums h3:before {
-       content: url("photography.png");
+       content: url("images/photography.png");
        padding-right: 10px;
        vertical-align: middle;
 }
@@ -2000,7 +2082,9 @@ div[id$="wrapper"] br {
        border-bottom: 0px; 
 }
 
-.photo-top-photo {}
+.photo-top-photo {
+       width: 180px;
+}
 .photo-album-photo {} 
 
 .photo-top-album-name {
@@ -2056,13 +2140,13 @@ div[id$="wrapper"] br {
 #photo-prev-link { 
        left: 0px; 
        top: 0px; 
-       background-image: url('prev.png'); 
+       background-image: url('images/prev.png'); 
 }
 
 #photo-next-link { 
        right: 0px; 
        top: 0px; 
-       background-image: url('next.png');
+       background-image: url('images/next.png');
 }
 
 #photo-prev-link a,
@@ -2095,17 +2179,15 @@ div[id$="wrapper"] br {
 
 #photos-upload-existing-album-text,
 #photos-upload-newalbum-div { 
-       background-color: #fff;
        color: #909090;
-       font-size: 1.2em;
        padding: 3px 0px;
-       padding-left: 0px;
        width: 300px;
 }
 
 #photos-upload-album-select,
 #photos-upload-newalbum { 
-       width: 400px; 
+       width: 400px;
+       margin-bottom: 10px;
 }
 
 #photos-upload-perms-menu {
@@ -2117,6 +2199,12 @@ div[id$="wrapper"] br {
        display: none;
 }
 
+#photos-upload-perms {
+       margin-top: 10px;
+}
+
+.photos-upload-perms {}
+
 select, input {
        border: 1px solid #b0b0b0;
        padding: 2px;
@@ -2231,9 +2319,9 @@ input #photo_edit_form {
 .mail-conv-detail, 
 .mail-list-detail {
        position: relative;
-       width: 500px;
+       width: 550px;
        padding: 50px;
-       margin: 20px auto;
+       margin: 20px 0 0 0;
        background-color: #fff;
        -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
@@ -2584,10 +2672,18 @@ margin-left: 0px;
 }
 
 #contact-edit-update-now:hover {
+       color: #efefef;
        background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
        background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
        background-color: #1873a2;
+       border: 1px solid #7C7D7B;
+       box-shadow: 0 0 8px #BDBDBD;
+               -moz-box-shadow: 3px 3px 4px #959494;
+               -webkit-box-shadow: 3px 3px 4px #959494;
+       border-radius: 5px;
+               -moz-border-radius: 5px;
+               -webkit-border-radius: 5px;
 }
 
 #contact-edit-update-now:active {
@@ -2618,7 +2714,7 @@ margin-left: 0px;
 
 .contact-photo-menu-button {
        position: absolute;
-       background-image: url("photo-menu.jpg");
+       background-image: url("images/photo-menu.jpg");
        background-position: top left; 
        background-repeat: no-repeat;
        margin: 10px 0 0 0; 
@@ -2676,11 +2772,11 @@ margin-left: 0px;
 }
 
 #follow-sidebar {
-       margin-bottom: 80px;
+       margin-bottom: 10px;
 }
 
 #follow-sidebar h3:before {
-       content: url("user.png");
+       content: url("images/user.png");
        padding-right: 10px;
        vertical-align: middle;
 }
@@ -2696,50 +2792,10 @@ margin-left: 0px;
        text-align: center;
 }
 
+#side-invite-link,
+#side-random-profile-link,
+#side-suggest-link,
 #side-match-link {
-       width: 158px;
-       padding: 10px;
-       margin: auto 10px 20px;
-       background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
-       background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
-       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
-       background-color: #bdbdbd;
-       padding: 5px 10px 5px 10px;
-       color: #efefef;
-       font-size: 1.1em;
-       text-align: center;
-       border: 1px solid #7C7D7B;
-       border-radius: 5px;
-               -moz-border-radius: 5px;
-               -webkit-border-radius: 5px;
-}
-
-#side-match-link:hover {
-       color: #efefef;
-       background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
-       background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
-       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
-       background-color: #1873a2;
-       border: 1px solid #7C7D7B;
-       box-shadow: 0 0 8px #BDBDBD;
-               -moz-box-shadow: 3px 3px 4px #959494;
-               -webkit-box-shadow: 3px 3px 4px #959494;
-       border-radius: 5px;
-               -moz-border-radius: 5px;
-               -webkit-border-radius: 5px;
-}
-
-#side-match-link:active {
-       background-color: #1873a2;
-       position: relative;
-       top: 1px;
-}
-
-#side-match-link a {
-       color: #efefef;
-}
-
-#side-invite-link {
        width: 80%;
        padding: 10px;
        margin: auto;
@@ -2758,7 +2814,10 @@ margin-left: 0px;
                -webkit-border-radius: 5px;
 }
 
-#side-invite-link:hover {
+#side-invite-link:hover,
+#side-random-profile-link:hover,
+#side-suggest-link:hover,
+#side-match-link:hover {
        color: #efefef;
        background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
        background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
@@ -2774,59 +2833,22 @@ margin-left: 0px;
 }
 
 
-#side-invite-link:active {
+#side-invite-link:active,
+#side-random-profile-link:active,
+#side-suggest-link:active,
+#side-match-link:active {
        background-color: #1873a2;
        position: relative;
        top: 1px;       
 }
 
-#side-invite-link a {
+#side-invite-link a,
+#side-random-profile-link a,
+#side-suggest-link a,
+#side-match-link a {
        color: #efefef; 
 }
 
-#side-suggest-link {
-       width: 80%;
-       padding: 10px;
-       margin: auto;
-       margin-bottom: 20px;
-       background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) );
-       background: -moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% );
-       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2');
-       background-color: #bdbdbd;
-       padding: 5px 10px 5px 10px;
-       color: #efefef;
-       font-size: 1.1em;
-       text-align: center;
-       border: 1px solid #7C7D7B;
-       border-radius: 5px;
-               -moz-border-radius: 5px;
-               -webkit-border-radius: 5px;
-}
-
-#side-suggest-link:hover {
-       color: #efefef;
-       background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1873a2), color-stop(1, #6da6c4) );
-       background: -moz-linear-gradient( center top, #1873a2 5%, #6da6c4 100% );
-       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1873a2', endColorstr='#6da6c4');
-       background-color: #1873a2;      
-       border: 1px solid #7C7D7B;
-       box-shadow: 0 0 8px #BDBDBD;
-               -moz-box-shadow: 3px 3px 4px #959494;
-               -webkit-box-shadow: 3px 3px 4px #959494;
-       border-radius: 5px;
-               -moz-border-radius: 5px;
-               -webkit-border-radius: 5px;
-}
-
-#side-suggest-link:active {
-       background-color: #1873a2;
-       position: relative;
-       top: 1px;       
-}
-
-#side-suggest-link a {
-       color: #efefef; 
-}
 
 #invite-message,
 #invite-recipients, 
@@ -2910,10 +2932,10 @@ margin-left: 0px;
 
 #id_openid_url, 
 .openid input {
-       background: url(login-bg.gif) no-repeat;
+       background: url(images/login-bg.gif) no-repeat;
        background-position: 0 50%;
        padding-left: 18px;
-       width: 220px!important;
+       width: 250px!important;
 }
 
 .openid:hover {
@@ -3344,7 +3366,7 @@ margin-left: 0px;
 }
 
 .event-description:before {
-       content: url('calendar.png');
+       content: url('images/calendar.png');
        margin-right: 15px;
        vertical-align: middle;
 }
@@ -3527,6 +3549,7 @@ margin-left: 0px;
 #adminpage h3 {
        border-bottom: 1px solid #898989;
        margin-bottom: 5px;
+       padding-bottom: 5px;
        margin-top: 10px;
 }
 
@@ -3543,10 +3566,16 @@ margin-left: 0px;
 #adminpage .plugin {
        list-style: none;
        display: block;
-       border: 1px solid #888888;
-       padding: 1em;
-       margin-bottom: 5px;
        clear: left;
+       border: 1px solid #7C7D7B;
+       box-shadow: 0 0 8px #BDBDBD;
+               -moz-box-shadow: 3px 3px 4px #959494;
+               -webkit-box-shadow: 3px 3px 4px #959494;
+       border-radius: 5px;
+               -moz-border-radius: 5px;
+               -webkit-border-radius: 5px;
+       padding:10px;
+       margin:10px 10px 10px 0;
 }
 
 #adminpage .toggleplugin {
@@ -3674,19 +3703,19 @@ margin-left: 0px;
        display: block; 
        width: 20px; 
        height: 20px;
-       background-image: url("icons.png");
+       background-image: url("images/icons.png");
 }
 .starred { 
-       background-image: url("star.png");
+       background-image: url("images/star.png");
        repeat: no-repeat;
 }
 .unstarred { 
-       background-image: url("premium.png");
+       background-image: url("images/premium.png");
        repeat: no-repeat;
 }
 
 .notify {
-       background-image: url("notifications.png");
+       background-image: url("images/notifications.png");
        repeat: no-repeat;
 }
 
@@ -3727,7 +3756,7 @@ margin-left: 0px;
 }
 
 .sharePerms {
-       background-image: url("icons.png");
+       background-image: url("images/icons.png");
        width: 20px;
        height: 20px;
        margin: 2px 0px 2px 3px;
@@ -4157,7 +4186,7 @@ ul.menu-popup {
 }
 
 div.wall-item-content-wrapper.shiny {
-       background-image: url("shiny.png");
+       background-image: url("images/shiny.png");
        background-repeat: repeat-x;
 }
 
@@ -4182,7 +4211,7 @@ div.wall-item-content-wrapper.shiny {
 }
 
 hr.line-dots {
-    background: url("dot.png") repeat-x scroll left center transparent;
+    background: url("images/dot.png") repeat-x scroll left center transparent;
     border: medium none;
 }
 
@@ -4215,7 +4244,7 @@ hr.line-dots {
 
 .filer-icon {
        display: block; width: 16px; height: 16px;
-       background-image: url('file.gif');
+       background-image: url('images/file.gif');
 }
 
 .icon.dim { opacity: 0.3;filter:alpha(opacity=30); }
@@ -4289,8 +4318,7 @@ div #datebrowse-sidebar.widget {
        color: #1873a2;
        cursor: pointer;
        margin-bottom: 10px;
-       margin-left: 5px;
-       /*background: url("down.png") no-repeat scroll left center transparent;*/
+       /*background: url("images/down.png") no-repeat scroll left center transparent;*/
 }
 
 .fakelink:hover {
@@ -4330,10 +4358,14 @@ div #datebrowse-sidebar.widget {
 
 #settings-notifications {
        border: 1px solid #7C7D7B;
+       box-shadow: 0 0 8px #BDBDBD;
+               -moz-box-shadow: 3px 3px 4px #959494;
+               -webkit-box-shadow: 3px 3px 4px #959494;
        border-radius: 5px;
                -moz-border-radius: 5px;
                -webkit-border-radius: 5px;
        padding:10px;
+       margin:10px 10px 10px 0;
 }
 
 #id_npassword {}
@@ -4349,3 +4381,31 @@ div #datebrowse-sidebar.widget {
 #collapsed-comments-page-widget {}
 
 .tool {}
+
+#logo-text {
+}
+
+#logo-img {
+       margin: 3px 0 0 0;
+}
+
+.bigwidget {}
+
+#remote-friends-in-common  {}
+
+.settings-block {
+       border: 1px solid #7C7D7B;
+       box-shadow: 0 0 8px #BDBDBD;
+               -moz-box-shadow: 3px 3px 4px #959494;
+               -webkit-box-shadow: 3px 3px 4px #959494;
+       border-radius: 5px;
+               -moz-border-radius: 5px;
+               -webkit-border-radius: 5px;
+       padding:10px;
+       margin:10px 10px 10px 0;
+}
+
+#page-settings-label{
+       width: auto !important;
+       margin-bottom: 5px !important;
+}