aboutsummaryrefslogtreecommitdiffstats
path: root/view/theme/quattro/quattro.less
diff options
context:
space:
mode:
authorfriendica <info@friendica.com>2012-06-29 16:34:23 -0700
committerfriendica <info@friendica.com>2012-06-29 16:34:23 -0700
commit1b27e24bb727c20346b81dc2f02ffac9105f5622 (patch)
treea3f090db847cb404297833252be8b02134c30104 /view/theme/quattro/quattro.less
parentbe658788de3632599d00483511439a3df537b854 (diff)
parenta03e6b96ea96c81d4cb1a1e8c4e86a8a3a82863e (diff)
downloadvolse-hubzilla-1b27e24bb727c20346b81dc2f02ffac9105f5622.tar.gz
volse-hubzilla-1b27e24bb727c20346b81dc2f02ffac9105f5622.tar.bz2
volse-hubzilla-1b27e24bb727c20346b81dc2f02ffac9105f5622.zip
Merge pull request #368 from fabrixxm/master
Some work on quattro
Diffstat (limited to 'view/theme/quattro/quattro.less')
-rw-r--r--view/theme/quattro/quattro.less111
1 files changed, 104 insertions, 7 deletions
diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less
index 9099f0be1..0dac79bf9 100644
--- a/view/theme/quattro/quattro.less
+++ b/view/theme/quattro/quattro.less
@@ -27,13 +27,17 @@ h4 { font-size: 1.1em }
.opaque(@v: 0.5){
opacity: @v;
- -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;
+ .transition();
}
+.transition(@d: 0.2s){
+ -webkit-transition: all @d ease-in-out;
+ -moz-transition: all @d ease-in-out;
+ -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; }
a:visited { color: @LinkVisited; text-decoration: none; }
@@ -81,6 +85,7 @@ code {
height: auto; overflow: auto;
.label { float: left;}
.action { float: right; }
+ > img { float: left; }
}
@@ -282,6 +287,8 @@ aside {
padding:0px 10px 0px 20px;
border-right: 1px solid @AsideBorder;
+ .profile-edit-side-div { display: none; }
+
.vcard {
.fn { font-size: 16px; font-weight: bold; margin-bottom: 5px; }
.title { margin-bottom: 5px; }
@@ -1068,12 +1075,102 @@ ul.tabs {
width: 50px; float: left;
}
-/* photo */
-.lframe {
+/* photo albums */
+@photosize: 150px;
+
+#photo-edit-link-wrap { margin-bottom: 10px; }
+
+#album-edit-link {
+ border-right: 1px solid @MenuBorder;
+ float: left;
+ padding-right: 5px;
+ margin-right: 5px;
+}
+#photo-edit-link,
+#album-edit-link a {
+ background: url("../../../images/icons/16/edit.png") no-repeat left center;
+ padding-left: 18px;
+}
+#photo-toprofile-link {
+ background: url("../../../images/icons/16/user.png") no-repeat left center;
+ padding-left: 18px;
+}
+
+.photos-upload-link a,
+#photo-top-upload-link {
+ background: url("../../../images/icons/16/add.png") no-repeat left center;
+ padding-left: 18px;
+}
+
+
+.photo-top-image-wrapper,
+.photo-album-image-wrapper {
float: left;
margin: 0px 10px 10px 0px;
+ 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);
+ .transition(0.5s);
+ }
+}
+
+#photo-photo {
+ display: block; width: 660px;
+ padding: 50px; margin-bottom: 0px;
+ text-align: center;
+ background-color: @Grey3;
+ img { max-width: 560px; }
+}
+#photo-album-title {
+ background: url("../../../images/icons/22/image.png") no-repeat top left;
+ padding-left: 23px;
+ min-height: 22px;
+ a { display: block; padding-top: 5px; }
}
+#photo-caption {
+ display: block; width: 660px;
+ min-height: 55px;
+ background-color: @Grey2;
+ padding:0 50px 0 50px;
+}
+#photo-next-link > a > div {
+ background: url("icons/next.png") no-repeat center center;
+ float: right;
+ width: 50px; height: 50px;
+}
+#photo-prev-link > a > div {
+ background: url("icons/prev.png") no-repeat center center;
+ float: left;
+ width: 50px; height: 50px;
+}
+#photo-like-div {
+ display: block; width: 660px;
+ height: 30px;
+ background-color: @Grey2;
+ padding:0 50px 0 50px;
+ .icon {float: left;}
+ .like-rotator {float: right;}
+}
/* profile match wrapper */
.profile-match-wrapper {
float: left;