converting _BNumPartial inline CSS styles to CSS classes

This commit is contained in:
Hamid Reza Mohammadi 2021-12-10 16:18:15 +03:30
parent 5f0b5c7196
commit 0975b7fa91
2 changed files with 52 additions and 11 deletions

View File

@ -4,7 +4,7 @@
Layout = null;
}
<table style="width:100%; margin-bottom:10px;">
<table class="bnum-partial-table">
<tr>
<td>شماره:</td>
<td>
@ -35,27 +35,27 @@
}
</table>
<div id="play-block-@Model.CoupletIndex" style="width: 100%;">
<select id="narrators-@Model.CoupletIndex" style="width:49%;float:right"></select>
<a role="button" id="listen-@Model.CoupletIndex" style="cursor: pointer; width: 49%; color: white; background-color: green; display: block; text-align: center; border-color: #300; padding:1px; float:left; margin-top:3px; " onclick="playCouplet(@Model.CoupletIndex)">از اینجا بخواند</a>
<div id="play-block-@Model.CoupletIndex" class="width-100per">
<select id="narrators-@Model.CoupletIndex" class="bnum-partial-narrators"></select>
<a role="button" id="listen-@Model.CoupletIndex" class="bnum-partial-narrate-btn" onclick="playCouplet(@Model.CoupletIndex)">از اینجا بخواند</a>
</div>
<script>
fillnarrations('@Model.CoupletIndex');
</script>
<div style="width: 100%; clear: both; background-color: #300;">
<a role="button" class="w3tooltip" id="copylink-@Model.CoupletIndex" style="cursor: pointer;" onclick="copyCoupletUrl(@Model.CoupletIndex)"><i class="material-icons" style="color:white;">link</i><span class="w3tooltiptext" id="copylink-tooltip-@Model.CoupletIndex">رونوشت نشانی</span></a>
<a role="button" class="w3tooltip" id="copytext-@Model.CoupletIndex" style="cursor: pointer;" onclick="copyCoupletText(@Model.CoupletIndex)"><i class="material-icons" style="color:white;">content_copy</i><span class="w3tooltiptext" id="copytext-tooltip-@Model.CoupletIndex">رونوشت متن</span></a>
<a role="button" id="share-@Model.CoupletIndex" style="cursor: pointer;" onclick="webShareCouplet(@Model.CoupletIndex)" title="همرسانی"><i class="material-icons" style="color:white;">share</i></a>
<div class="bnum-partial-action-box">
<a role="button" class="w3tooltip cursor-pointer" id="copylink-@Model.CoupletIndex" onclick="copyCoupletUrl(@Model.CoupletIndex)"><i class="material-icons color-white">link</i><span class="w3tooltiptext" id="copylink-tooltip-@Model.CoupletIndex">رونوشت نشانی</span></a>
<a role="button" class="w3tooltip cursor-pointer" id="copytext-@Model.CoupletIndex" onclick="copyCoupletText(@Model.CoupletIndex)"><i class="material-icons color-white">content_copy</i><span class="w3tooltiptext" id="copytext-tooltip-@Model.CoupletIndex">رونوشت متن</span></a>
<a role="button" id="share-@Model.CoupletIndex" class="cursor-pointer" onclick="webShareCouplet(@Model.CoupletIndex)" title="همرسانی"><i class="material-icons color-white">share</i></a>
@if (Model.LoggedIn)
{
<a role="button" id="bookmark-@Model.CoupletIndex" style="cursor: pointer;" onclick="switchBookmark(@Model.PoemId, @Model.CoupletIndex)" title="@Model.BookmarkingText"><i class="material-icons" id="bookmark-icon-@Model.CoupletIndex" style="color:white;">@Model.BookmarkingIcon</i></a>
<a role="button" id="listen-@Model.CoupletIndex" style="cursor: pointer;" onclick="editCouplet(@Model.PoemId, @Model.CoupletIndex)" title="ویرایش از اینجا"><i class="material-icons" style="color:white;">edit</i></a>
<a role="button" id="bookmark-@Model.CoupletIndex" class="cursor-pointer" onclick="switchBookmark(@Model.PoemId, @Model.CoupletIndex)" title="@Model.BookmarkingText"><i class="material-icons color-white" id="bookmark-icon-@Model.CoupletIndex">@Model.BookmarkingIcon</i></a>
<a role="button" id="listen-@Model.CoupletIndex" class="cursor-pointer" onclick="editCouplet(@Model.PoemId, @Model.CoupletIndex)" title="ویرایش از اینجا"><i class="material-icons color-white">edit</i></a>
}
</div>
<div id="comments-block-@Model.CoupletIndex" style="clear:both">
<div id="comments-block-@Model.CoupletIndex" class="clear-both">
@foreach (var comment in Model.Comments)
{
<partial name="_CommentPartial" model=Model.GetCommentModel(comment) />

View File

@ -1193,3 +1193,44 @@ ol {
.help-button::after {
content: 'help';
}
.bnum-partial-table {
width: 100%;
margin-bottom: 10px;
}
.bnum-partial-narrators {
width: 49%;
float: right;
}
.bnum-partial-narrate-btn {
cursor: pointer;
width: 49%;
color: white !important;
background-color: green;
display: block;
text-align: center;
border-color: #300;
padding: 1px;
float: left;
margin-top: 3px;
}
.bnum-partial-action-box {
width: 100%;
clear: both;
background-color: #300;
}
.cursor-pointer {
cursor: pointer;
}
.color-white {
color: white;
}
.clear-both {
clear: both;
}