Merge frio-specific share block template into the base template

- Add BIDI support for share blocks
- Remove redundant share block styles
This commit is contained in:
Hypolite Petovan 2021-07-09 19:23:01 -04:00
parent 6354d7c81d
commit 540dc90ce1
12 changed files with 68 additions and 220 deletions

View file

@ -151,13 +151,36 @@ span.connector {
}
/* Shared Messages */
.shared_header {
display: flex;
justify-content: space-between;
min-height: 32px;
color: #999;
border-top: 1px solid #D2D2D2;
padding-top: 5px;
margin-top: 5px;
}
.shared_header > .avatar {
display: block;
flex: 0 0 41px;
margin-inline-end: 9px;
}
.shared_header > .avatar > img {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.shared_header > .metadata {
flex: 1 0 auto;
}
.shared_header > .metadata > p {
margin: 0;
}
.shared_header > .preferences {
position: static;
flex: 0 0 auto;
}
.shared_header a {
-webkit-transition: all 0.2s ease-in-out;
@ -167,16 +190,8 @@ span.connector {
transition: all 0.2s ease-in-out;
}
.shared_header img {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
float: left;
margin-right: 9px;
}
blockquote.shared_content {
margin-left: 32px;
margin-inline-start: 32px;
color: #000;
border: none;
}

View file

@ -1,12 +1,38 @@
<div class="shared-wrapper">
<div class="shared-wrapper well well-sm">
<div class="shared_header">
{{if $avatar}}
<a href="{{$profile}}" target="_blank" rel="noopener noreferrer" class="shared-userinfo">
<img src="{{$avatar}}" height="32" width="32">
<a href="{{$profile}}" target="_blank" rel="noopener noreferrer" class="avatar shared-userinfo">
<img src="{{$avatar}}" alt="">
</a>
{{/if}}
<div><a href="{{$profile}}" target="_blank" rel="noopener noreferrer" class="shared-wall-item-name"><span class="shared-author">{{$author}}</span></a></div>
<div class="shared-wall-item-ago"><small><a href="{{$link}}" target="_blank" rel="noopener noreferrer"><span class="shared-time">{{$posted}}</a></a></small></div>
<div class="metadata">
<p class="shared-author">
<a href="{{$profile}}" target="_blank" rel="noopener noreferrer" class="shared-wall-item-name">
{{$author}}
</a>
</p>
<p class="shared-wall-item-ago">
{{if $guid}}
<a href="/display/{{$guid}}">
{{/if}}
<span class="shared-time">{{$posted}}</span>
{{if $guid}}
</a>
{{/if}}
</p>
</div>
<div class="preferences">
{{if $network_icon}}
<span class="wall-item-network"><i class="fa fa-{{$network_icon}}" title="{{$network_name}}" aria-hidden="true"></i></span>
{{else}}
<span class="wall-item-network">{{$network_name}}</span>
{{/if}}
{{if $link}}
<a href="{{$link}}" class="plink u-url" aria-label="{{$link_title}}" title="{{$link_title}}">
<i class="fa fa-external-link"></i>
</a>
{{/if}}
</div>
</div>
<blockquote class="shared_content">{{$content nofilter}}</blockquote>
</div>

View file

@ -1238,44 +1238,13 @@ input#dfrn-url {
background: rgba(0, 0, 0, 0.5) url(shiny.png) no-repeat scroll center center;
}
.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;
}
.wall-item-title {
float: left;
font-weight: bold;
@ -3244,10 +3213,6 @@ div.jGrowl div.info {
width: 20px;
}
.shared_header span {
margin-left: 10px;
}
/* small screens */
@media all and (max-width: 1089px) {
.field label { width: 90%; }

View file

@ -1709,10 +1709,20 @@ aside .panel-body {
right: 0;
top: 0;
}
.shared_header .preferences {
top: 7px;
right: 9px;
.shared_header {
margin-left: 0px;
margin-top: 0px;
padding-top: 0px;
margin-bottom: 10px;
border-top: none;
color: inherit;
}
blockquote.shared_content {
padding: 0px;
margin-inline-start: 0px;
color: inherit;
}
.wall-item-network {
font-size: 13px;
}
@ -1837,19 +1847,6 @@ aside .panel-body {
.vevent:hover {
box-shadow: 0 0 0 1.5px rgba(0, 0, 0, 0.15) inset, 0 1px 1px rgba(0, 0, 0, 0.05);
}
.shared_header {
margin-left: 0px;
margin-top: 0px;
padding-top: 0px;
margin-bottom: 10px;
border-top: none;
color: inherit;
}
blockquote.shared_content {
padding: 0px;
margin-left: 0px;
color: inherit;
}
code > .hl-main {
padding: 10px 10px 1px 0;
}

View file

@ -1,32 +0,0 @@
<div class="shared-wrapper well well-sm">
<div class="shared_header">
{{if $avatar}}
<a href="{{$profile}}" target="_blank" rel="noopener noreferrer" class="shared-userinfo">
<img src="{{$avatar}}" height="32" width="32">
</a>
{{/if}}
<div><a href="{{$profile}}" target="_blank" rel="noopener noreferrer" class="shared-wall-item-name"><span class="shared-author">{{$author}}</span></a></div>
<div class="preferences">
{{if $network_icon}}
<span class="wall-item-network"><i class="fa fa-{{$network_icon}}" title="{{$network_name}}" aria-hidden="true"></i></span>
{{else}}
<span class="wall-item-network">{{$network_name}}</span>
{{/if}}
{{if $link}}
<a href="{{$link}}" class="plink u-url" aria-label="{{$link_title}}" title="{{$link_title}}">
<i class="fa fa-external-link"></i>
</a>
{{/if}}
</div>
<div class="shared-wall-item-ago"><small>
{{if $guid}}
<a href="/display/{{$guid}}">
{{/if}}
<span class="shared-time">{{$posted}}</span>
{{if $guid}}
</a>
{{/if}}
</small></div>
</div>
<blockquote class="shared_content">{{$content nofilter}}</blockquote>
</div>

View file

@ -1437,27 +1437,6 @@ section {
.type-video blockquote {
padding-left: 1em;
}
.shared_header {
height: 32px;
color: #999;
border-top: 1px solid #cccccc;
padding-top: 5px;
margin-top: 5px;
}
.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;
}
.oembed.video > a.embed_video {
display: block;
position: relative;

View file

@ -1437,27 +1437,6 @@ section {
.type-video blockquote {
padding-left: 1em;
}
.shared_header {
height: 32px;
color: #999;
border-top: 1px solid #cccccc;
padding-top: 5px;
margin-top: 5px;
}
.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;
}
.oembed.video > a.embed_video {
display: block;
position: relative;

View file

@ -1437,27 +1437,6 @@ section {
.type-video blockquote {
padding-left: 1em;
}
.shared_header {
height: 32px;
color: #999;
border-top: 1px solid #cccccc;
padding-top: 5px;
margin-top: 5px;
}
.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;
}
.oembed.video > a.embed_video {
display: block;
position: relative;

View file

@ -770,22 +770,6 @@ section {
border-top: 1px solid @ThreadBottomBorderColor;
padding-top: 5px;
margin-top: 5px;
img {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
float: left;
}
span { margin-left: 9px; }
}
blockquote.shared_content {
margin-left: 32px;
color: #000;
border: none;
}
.oembed.video {

View file

@ -1815,44 +1815,13 @@ ul .sidebar-group-li .icon {
.type-link .oembed {
}
.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;
}
.icon.drop,
.icon.drophide {
float: left;

View file

@ -345,15 +345,6 @@ div.pager, ul.tabs {
line-height: normal;
}
.shared_header {
min-height: 32px;;
color: #999;
border-top: 0px;
padding-top: 5px;
margin-top: 5px;
}
/* Post footer */
.wall-item-like { font-size:12px; }

View file

@ -1438,10 +1438,6 @@ section.minimal {
font-size: 12px;
}
.shared_header {
line-height: 14px;
}
.wall-item-network {
color: #999;
font-size: 12px;