ソースを参照

Ticket #434: Default cover height.

AntonLV 10 年 前
親
コミット
d4983ca8eb

+ 3 - 7
modules/base/profile/template/cover.html

@@ -3,20 +3,16 @@
     <div class="bx-base-pofile-cover bx-def-box-sizing">
     <div class="bx-base-pofile-cover bx-def-box-sizing">
         <a class="bx-base-pofile-cover-image bx-def-box-sizing" href="__cover_href__" onclick="$('#__cover_popup_id__').dolPopupImage('__cover_url__', this)" style="background-image:url(__cover_url__)">&nbsp;</a>
         <a class="bx-base-pofile-cover-image bx-def-box-sizing" href="__cover_href__" onclick="$('#__cover_popup_id__').dolPopupImage('__cover_url__', this)" style="background-image:url(__cover_url__)">&nbsp;</a>
         <div class="bx-cover-gradient"></div>
         <div class="bx-cover-gradient"></div>
-        <div class="bx-base-pofile-cover-info-container bx-def-centered bx-def-page-width" onclick="$('#__cover_popup_id__').dolPopupImage('__cover_url__', this)">
-
-            <div class="bx-base-pofile-cover-info bx-def-padding">
+        <div class="bx-base-pofile-cover-info-container bx-def-centered bx-def-page-width bx-def-padding bx-def-box-sizing" onclick="$('#__cover_popup_id__').dolPopupImage('__cover_url__', this)">
+            <div class="bx-base-pofile-cover-info">
                 <a href="__picture_href__" onclick="$('#__picture_popup_id__').dolPopupImage('__picture_url__', $(this).parent()); event.stopPropagation();"><img class="bx-def-ava bx-def-ava-size" src="__picture_avatar_url__" /></a>
                 <a href="__picture_href__" onclick="$('#__picture_popup_id__').dolPopupImage('__picture_url__', $(this).parent()); event.stopPropagation();"><img class="bx-def-ava bx-def-ava-size" src="__picture_avatar_url__" /></a>
                 <h1 class="bx-def-unit-info bx-def-margin-sec-bottom bx-def-margin-sec-top bx-def-font-contrasted">__title__</h1>
                 <h1 class="bx-def-unit-info bx-def-margin-sec-bottom bx-def-margin-sec-top bx-def-font-contrasted">__title__</h1>
                 <div class="bx-base-pofile-cover-actions" onclick="event.stopPropagation();">
                 <div class="bx-base-pofile-cover-actions" onclick="event.stopPropagation();">
                     __action_menu__                    
                     __action_menu__                    
                 </div>
                 </div>
             </div>
             </div>
-
         </div>
         </div>
     </div>
     </div>
 </div>
 </div>
-
 __cover_popup__
 __cover_popup__
-__picture_popup__
-
+__picture_popup__

+ 7 - 2
modules/base/profile/template/css/main.css

@@ -97,14 +97,19 @@ a.bx-base-pofile-cover-image:hover,
 }
 }
 
 
 .bx-base-pofile-cover-info-container {
 .bx-base-pofile-cover-info-container {
-    display:block;
     position:relative;
     position:relative;
-    height:100%;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+    min-height: 40vh;
+
     cursor:pointer; 
     cursor:pointer; 
     cursor:hand;
     cursor:hand;
 }
 }
 
 
 .bx-base-pofile-cover-info {
 .bx-base-pofile-cover-info {
+	width: 100%;
     text-align:center;
     text-align:center;
 }
 }
 .bx-base-pofile-cover-info .bx-def-ava,
 .bx-base-pofile-cover-info .bx-def-ava,

+ 11 - 9
template/cover.html

@@ -7,19 +7,21 @@
 </bx_if:logged_in>
 </bx_if:logged_in>
 
 
 <div class="bx-menu-toolbar-padding">
 <div class="bx-menu-toolbar-padding">
-	<div class="bx-cover-wrapper __class__" <bx_if:bg>style="background-image:url(__image_url__)"</bx_if:bg>>
+    <div class="bx-cover-wrapper __class__" <bx_if:bg>style="background-image:url(__image_url__)"</bx_if:bg>>
 	    <div class="bx-cover-gradient"></div>
 	    <div class="bx-cover-gradient"></div>
 	    <div class="bx-cover bx-def-centered bx-def-page-width bx-def-padding bx-def-box-sizing">
 	    <div class="bx-cover bx-def-centered bx-def-page-width bx-def-padding bx-def-box-sizing">
-	        <bx_if:image>
-		        <div class="bx-cover-image">
-		            <img class="bx-def-border bx-def-round-corners" style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" />
+	        <div class="bx-cover-cnt">
+		        <bx_if:image>
+		            <div class="bx-cover-image">
+		                <img class="bx-def-border bx-def-round-corners" style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" />
+		            </div>
+		        </bx_if:image>
+		        <div class="bx-cover-title bx-def-margin-sec-topbottom bx-def-font-h1" style="z-index:2;">
+		            <bx_if:icon><i class="sys-icon bx-def-font-contrasted bx-def-margin-sec-right __icon__"></i></bx_if:icon>
+		            <span class="bx-def-font-contrasted">__title__</span>
 		        </div>
 		        </div>
-	        </bx_if:image>
-	        <div class="bx-cover-title bx-def-margin-sec-topbottom bx-def-font-h1" style="z-index:2;">
-	            <bx_if:icon><i class="sys-icon bx-def-font-contrasted bx-def-margin-sec-right __icon__"></i></bx_if:icon>
-	            <span class="bx-def-font-contrasted">__title__</span>
+		        <div class="bx-cover-actions">__actions__</div>
 	        </div>
 	        </div>
-	        <div class="bx-cover-actions">__actions__</div>
 	    </div>
 	    </div>
 	</div>
 	</div>
 </div>
 </div>

+ 12 - 4
template/css/cover.css

@@ -24,10 +24,18 @@
 }
 }
 
 
 .bx-cover {
 .bx-cover {
-    position:relative;
-    z-index:2;
-    min-height:6rem;
-    text-align:center;
+    position: relative;
+    z-index: 2;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-align-items: center;
+    align-items: center;
+    min-height: 40vh;
+    text-align: center;
+}
+
+.bx-cover-cnt {
+	width: 100%;
 }
 }
 
 
 .bx-cover-title {
 .bx-cover-title {