aboutsummaryrefslogtreecommitdiffstats
path: root/view
diff options
context:
space:
mode:
authorMario <mario@mariovavti.com>2021-11-23 09:17:04 +0000
committerMario <mario@mariovavti.com>2021-11-23 09:17:04 +0000
commit06e214e5675769318a40abc9850bf8d5c85a7ee3 (patch)
treea24462b427835e55fb2f167c69fa1fc0991bb92b /view
parent18f8cafee0cc127e97d40aa70e45fd08d91c2dfe (diff)
downloadvolse-hubzilla-06e214e5675769318a40abc9850bf8d5c85a7ee3.tar.gz
volse-hubzilla-06e214e5675769318a40abc9850bf8d5c85a7ee3.tar.bz2
volse-hubzilla-06e214e5675769318a40abc9850bf8d5c85a7ee3.zip
more work on responsive aside
Diffstat (limited to 'view')
-rw-r--r--view/css/widgets.css6
-rw-r--r--view/theme/redbasic/css/style.css31
-rw-r--r--view/theme/redbasic/php/style.php6
-rw-r--r--view/tpl/connstatus.tpl2
-rw-r--r--view/tpl/profile_vcard.tpl16
-rw-r--r--view/tpl/xchan_vcard.tpl4
6 files changed, 31 insertions, 34 deletions
diff --git a/view/css/widgets.css b/view/css/widgets.css
index b78725919..df77940dd 100644
--- a/view/css/widgets.css
+++ b/view/css/widgets.css
@@ -243,9 +243,9 @@ a.wikilist {
/* contact block */
.contact-block-div .oneway-overlay {
- font-size: 20px;
- margin-left: -25px;
- margin-top: 25px;
+ font-size: .9rem;
+ margin-left: -1.2rem;
+ margin-top: 2rem;
opacity: 0.8;
}
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index a4641b68e..aad17698b 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -24,15 +24,15 @@ body {
aside#region_1 {
border-right: 1px solid transparent;
- width: $left_aside_widthpx;
- min-width: $left_aside_widthpx;
- max-width: $left_aside_widthpx;
+ width: $left_aside_widthrem;
+ min-width: $left_aside_widthrem;
+ max-width: $left_aside_widthrem;
}
aside#region_3 {
- width: $right_aside_widthpx;
- min-width: $left_aside_widthpx;
- max-width: $right_aside_widthpx;
+ width: $right_aside_widthrem;
+ min-width: $left_aside_widthrem;
+ max-width: $right_aside_widthrem;
}
aside#left_aside_wrapper,
@@ -49,7 +49,7 @@ main {
#overlay {
position: fixed;
top: 0;
- left: $left_aside_widthpx;
+ left: $left_aside_widthrem;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, .3);
@@ -401,16 +401,10 @@ footer {
}
.vcard-card {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
+ background-color: rgba(254,254,254,0.5);
}
.vcard {
- margin-bottom: 10px;
- padding: 0px 10px 10px 10px;
- background-color: rgba(254,254,254,0.5);
- border: 1px solid rgba(254,254,254,0.5);
- border-top: 0px;
word-wrap: break-word;
}
@@ -563,8 +557,8 @@ footer {
}
.contact-block-img {
- width:47px;
- height:47px;
+ width: 2.95rem;
+ height: 2.95rem;
margin-bottom: 3px;
}
@@ -1183,7 +1177,6 @@ img.mail-conv-sender-photo {
.widget {
background-color: rgba(254,254,254,.5);
- border: 1px solid rgba(254,254,254,.5);
border-radius: $radius;
}
@@ -1522,8 +1515,8 @@ blockquote {
}
main {
- left: -$left_aside_widthpx;
- width: calc( 100% + $left_aside_widthpx );
+ left: -$left_aside_widthrem;
+ width: calc( 100% + $left_aside_widthrem );
}
main.region_1-on {
diff --git a/view/theme/redbasic/php/style.php b/view/theme/redbasic/php/style.php
index 3ea94f9aa..6ba0d569e 100644
--- a/view/theme/redbasic/php/style.php
+++ b/view/theme/redbasic/php/style.php
@@ -101,7 +101,7 @@ if (! $radius)
if (! $shadow)
$shadow = '0';
if (! $converse_width)
- $converse_width = '790';
+ $converse_width = '1250'; //unit: rem
if(! $top_photo)
$top_photo = '2.3rem';
if(! $reply_photo)
@@ -120,8 +120,8 @@ if(file_exists('view/theme/redbasic/css/style.css')) {
$x .= $schemecss;
}
- $left_aside_width = 288;
- $right_aside_width = 288;
+ $left_aside_width = 21; //unit: rem
+ $right_aside_width = 21; //unit: rem
$main_width = $left_aside_width + $right_aside_width + intval($converse_width);
diff --git a/view/tpl/connstatus.tpl b/view/tpl/connstatus.tpl
index 667775f3a..869345682 100644
--- a/view/tpl/connstatus.tpl
+++ b/view/tpl/connstatus.tpl
@@ -1 +1 @@
-<i class="fa fa-fw fa-comments oneway-overlay text-{{if $perminfo.connpermcount == 3}}success{{elseif $perminfo.connpermcount > 0}}warning{{else}}danger{{/if}}" title="{{$perminfo.connperms}}"></i>
+<i class="fa fa-comments oneway-overlay text-{{if $perminfo.connpermcount == 3}}success{{elseif $perminfo.connpermcount > 0}}warning{{else}}danger{{/if}}" title="{{$perminfo.connperms}}"></i>
diff --git a/view/tpl/profile_vcard.tpl b/view/tpl/profile_vcard.tpl
index 983c79fab..487fa3959 100644
--- a/view/tpl/profile_vcard.tpl
+++ b/view/tpl/profile_vcard.tpl
@@ -1,11 +1,13 @@
{{if !$zcard}}
-<div class="card h-card vcard-card">
+
+<div class="rounded mb-3 vcard-card h-card">
+<div class="card">
<div class="row">
- <div class="col-4">
+ <div class="col-4" style="width: 7rem;">
{{if $editmenu}}
<a href="profile_photo" title="{{$change_photo}}">
{{/if}}
- <img class="u-photo" src="{{$profile.photo}}?rev={{$profile.picdate}}" alt="{{$profile.fullname}}" width="80px" height="80px">
+ <img class="rounded-start u-photo" src="{{$profile.photo}}?rev={{$profile.picdate}}" alt="{{$profile.fullname}}" style="width: 6rem; height:6rem;">
{{if $editmenu}}
{{/if}}
</a>
@@ -44,9 +46,9 @@
</div>
</div>
</div>
-<div class="vcard h-card rounded-bottom">
+<div class="vcard ps-2 pe-2">
{{if $profile.pdesc}}
- <div class="pt-2 pb-3">{{$profile.pdesc}}</div>
+ <div class="pb-3 pt-2">{{$profile.pdesc}}</div>
{{/if}}
{{if $location}}
<dl class="">
@@ -77,7 +79,7 @@
</dl>
{{/if}}
{{if $homepage}}
- <dl class="">
+ <dl class="pb-2">
<dt class="homepage-label">{{$homepage}}</dt>
<dd class="homepage-url u-url">{{$profile.homepage}}</dd>
</dl>
@@ -85,6 +87,8 @@
<div class="hcard-addon"></div>
</div>
+</div>
+
{{/if}}
{{if $zcard}}
diff --git a/view/tpl/xchan_vcard.tpl b/view/tpl/xchan_vcard.tpl
index 2b5a6cb41..a5568f283 100644
--- a/view/tpl/xchan_vcard.tpl
+++ b/view/tpl/xchan_vcard.tpl
@@ -1,8 +1,8 @@
<div class="card mb-3 h-card">
<div class="row">
- <div class="col-4">
+ <div class="col-4" style="width: 7rem;">
<a href="{{$link}}" >
- <img class="u-photo rounded-start" src="{{$photo}}" alt="{{$name}}" width="80px" height="80px">
+ <img class="u-photo rounded-start" src="{{$photo}}" alt="{{$name}}" style="width: 6rem; height:6rem;">
</a>
</div>
<div class="col-7 m-1 p-0">