Skip to content

Commit d24acb7

Browse files
nteskenteske
authored
Merge pull request #114 from MDHD99/master
changed icons and icon layout
2 parents c2371d6 + 781ac6e commit d24acb7

File tree

5 files changed

+76
-48
lines changed

5 files changed

+76
-48
lines changed

‎widget/assets/css/style.css‎

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -475,6 +475,11 @@ videogular vg-controls, [videogular] vg-controls
475475
}
476476

477477
/* Link Items */
478+
479+
.link-list {
480+
padding-right: 1em;
481+
}
482+
478483
.link-list a {
479484
color: inherit;
480485
text-decoration: none;
@@ -496,8 +501,8 @@ videogular vg-controls, [videogular] vg-controls
496501
}
497502

498503
.link-list a.media-action i {
499-
width: 70px;
500-
height: 40px;
504+
width: 44px;
505+
height: 44px;
501506
font-size: 22px;
502507
padding: 0;
503508
display: flex;
@@ -1618,4 +1623,11 @@ input.volume-button[type=range]:focus::-ms-fill-upper {
16181623
position: relative;
16191624
height: 100vh;
16201625
overflow: hidden;
1621-
}
1626+
}
1627+
1628+
.material-icons {
1629+
font-size: 5em !important;
1630+
font-family: 'Material Icons' !important;
1631+
-webkit-font-feature-settings: 'liga' !important;
1632+
display: none;
1633+
}

‎widget/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
<link rel="stylesheet" href="assets/css/style.css">
1313
<link rel="stylesheet" href="assets/css/videogular.css">
1414
<!-- endbuild -->
15+
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
1516
<link rel="stylesheet" href="../../../styles/bootstrap.css">
1617
<link rel="stylesheet" href="../../../styles/siteIcons.css">
1718
<link rel="stylesheet" href="../../../styles/helper.css">

‎widget/templates/Feed_Layout_1.html‎

Lines changed: 24 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
<div class="holder padding-zero customBackground" ng-class="{'hideAndShow': hideandshow}">
22
<div class="media-center-plugin layout1-detail">
33
<div ng-switch="WidgetMedia.medium" class="media-center-banner clearfix">
4-
<div ng-switch-when="VIDEO" class="videogular-container" ng-style="{'min-height': (9 * deviceWidth / 16) + 'px' }">
4+
<div ng-switch-when="VIDEO" class="videogular-container"
5+
ng-style="{'min-height': (9 * deviceWidth / 16) + 'px' }">
56
<videogular ng-if="WidgetMedia.isVideoPlayerSupported" vg-player-ready="WidgetMedia.onPlayerReady($API)"
67
vg-change-source="WidgetMedia.sourceChanged($source)" vg-theme="WidgetMedia.videoPlayerConfig.theme.url"
78
vg-error="WidgetMedia.onVideoError($event)" vg-can-play="WidgetMedia.videoLoaded()">
@@ -29,8 +30,8 @@
2930
<div ng-switch-when="AUDIO">
3031
<div class="holder now-playing text-center back-color">
3132
<div class="audio-player-holder">
32-
<img ng-if="WidgetMedia.item.imageSrcUrl" class="border-radius-four" load-image="16x9" crop-width="deviceWidth"
33-
crop-height="193" crop-type="crop" ng-src="{{WidgetMedia.item.imageSrcUrl}}">
33+
<img ng-if="WidgetMedia.item.imageSrcUrl" class="border-radius-four" load-image="16x9"
34+
crop-width="deviceWidth" crop-height="193" crop-type="crop" ng-src="{{WidgetMedia.item.imageSrcUrl}}">
3435
</div>
3536
</div>
3637
</div>
@@ -42,29 +43,35 @@
4243
</div>
4344
</div>
4445
<div class="text-left padded padding-bottom-zero clearfix ">
45-
<h4 class="main-title margin-top-zero" style="font-size: 16px;" ng-bind-html="WidgetMedia.getTitle(WidgetMedia.item)"></h4>
46+
<h4 class="main-title margin-top-zero" style="font-size: 16px;"
47+
ng-bind-html="WidgetMedia.getTitle(WidgetMedia.item)"></h4>
4648

4749
<p class="item-author" ng-if="WidgetMedia.item.author">By : {{WidgetMedia.item.author}}</p>
48-
<p class="item-date" ng-if="WidgetMedia.getItemPublishDate(WidgetMedia.item)">{{WidgetMedia.getItemPublishDate(WidgetMedia.item)}}</p>
50+
<p class="item-date" ng-if="WidgetMedia.getItemPublishDate(WidgetMedia.item)">
51+
{{WidgetMedia.getItemPublishDate(WidgetMedia.item)}}</p>
4952
</div>
5053
<div class="item-actions">
54+
<div class="li-actions">
55+
<i ng-if="WidgetMedia.item.link" ng-click="WidgetMedia.openLink(WidgetMedia.item.link)" target="_blank" class="material-icons" aria-hidden="true" id="startIcon"
56+
style="font-size: 20px !important; letter-spacing: normal;">insert_link</i>
57+
<i class="share material-icons" ng-click="WidgetMedia.addNote()" ng-click=""
58+
role="button" style="font-size: 20px !important;">border_color</i>
59+
<i class="share glyphicon glyphicon-share-alt" ng-click="WidgetMedia.share()" role="button"></i>
60+
<i class="glyphicon icon bookmark" style="font-family: 'Glyphicons Halflings' !important;"
61+
ng-class="{ 'glyphicon-star-empty' : !WidgetMedia.item.bookmarked, 'glyphicon-star' : WidgetMedia.item.bookmarked }"
62+
ng-click="WidgetMedia.bookmark($event)" role="button"></i>
63+
</div>
5164
<div class="link-list">
5265
<a class="media-action" ng-click="WidgetMedia.playAudio()" ng-if="WidgetMedia.medium == 'AUDIO'">
53-
<i class="btn btn-success share glyphicon glyphicon-volume-up"></i>
54-
</a>
55-
<a class="media-action video" ng-click="WidgetMedia.API.play()" ng-if="WidgetMedia.isVideoPlayerSupported && WidgetMedia.medium == 'VIDEO'">
56-
<i class="btn btn-success share glyphicon glyphicon-play"></i>
66+
<i class="btn btn-success material-icons" aria-hidden="true" id="startIcon"
67+
style="font-size: 2em !important;">play_arrow</i>
5768
</a>
58-
<a ng-if="WidgetMedia.item.link" ng-click="WidgetMedia.openLink(WidgetMedia.item.link)" target="_blank">
59-
<i class="share glyphicon glyphicon-screenshot"></i>
69+
<a class="media-action video" ng-click="WidgetMedia.API.play()"
70+
ng-if="WidgetMedia.isVideoPlayerSupported && WidgetMedia.medium == 'VIDEO'">
71+
<i class="btn btn-success material-icons" aria-hidden="true" id="startIcon"
72+
style="font-size: 2em !important; letter-spacing: normal;">play_arrow</i>
6073
</a>
6174
</div>
62-
<div class="li-actions">
63-
<i class="share glyphicon glyphicon glyphicon-edit" ng-click="WidgetMedia.addNote()" ng-click="" role="button"></i>
64-
<i class="share glyphicon glyphicon-share-alt" ng-click="WidgetMedia.share()" role="button"></i>
65-
<i class="glyphicon icon bookmark" style="font-family: 'Glyphicons Halflings' !important;" ng-class="{ 'glyphicon-star-empty' : !WidgetMedia.item.bookmarked, 'glyphicon-star' : WidgetMedia.item.bookmarked }"
66-
ng-click="WidgetMedia.bookmark($event)" role="button"></i>
67-
</div>
6875
</div>
6976
<div class="padded padding-top-zero">
7077
<p id="description" ng-bind-html="WidgetMedia.item.description|removeHtmlStyle:WidgetMedia.imageUrl|safeHtml"></p>

‎widget/templates/Feed_Layout_2.html‎

Lines changed: 20 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -47,24 +47,28 @@ <h5 class="margin-bottom-zero whiteTheme" ng-if="WidgetMedia.getItemPublishDate(
4747
</div>
4848
</div>
4949
<div class="item-actions">
50-
<div class="link-list">
51-
<a class="media-action" ng-click="WidgetMedia.playAudio()" ng-if="WidgetMedia.medium == 'AUDIO'">
52-
<i class="btn btn-success share glyphicon glyphicon-volume-up"></i>
53-
</a>
54-
<a class="media-action video" ng-click="WidgetMedia.API.play()" ng-if="WidgetMedia.isVideoPlayerSupported && WidgetMedia.medium == 'VIDEO'">
55-
<i class="btn btn-success share glyphicon glyphicon-play"></i>
56-
</a>
57-
<a ng-if="WidgetMedia.item.link" ng-click="WidgetMedia.openLink(WidgetMedia.item.link)" target="_blank">
58-
<i class="share glyphicon glyphicon-screenshot"></i>
59-
</a>
60-
</div>
6150
<div class="li-actions">
62-
<i class="share glyphicon glyphicon-edit" ng-click="WidgetMedia.addNote()" role="button"></i>
63-
<i class="share glyphicon glyphicon-share-alt" ng-click="WidgetMedia.share()" role="button"></i>
64-
<i class="glyphicon icon bookmark" style="font-family: 'Glyphicons Halflings' !important;" ng-class="{ 'glyphicon-star-empty' : !WidgetMedia.item.bookmarked, 'glyphicon-star' : WidgetMedia.item.bookmarked }"
65-
ng-click="WidgetMedia.bookmark($event)" role="button"></i>
51+
<i ng-if="WidgetMedia.item.link" ng-click="WidgetMedia.openLink(WidgetMedia.item.link)" target="_blank" class="material-icons" aria-hidden="true" id="startIcon"
52+
style="font-size: 20px !important; letter-spacing: normal;">insert_link</i>
53+
<i class="share material-icons" ng-click="WidgetMedia.addNote()" ng-click=""
54+
role="button" style="font-size: 20px !important;">border_color</i>
55+
<i class="share glyphicon glyphicon-share-alt" ng-click="WidgetMedia.share()" role="button"></i>
56+
<i class="glyphicon icon bookmark" style="font-family: 'Glyphicons Halflings' !important;"
57+
ng-class="{ 'glyphicon-star-empty' : !WidgetMedia.item.bookmarked, 'glyphicon-star' : WidgetMedia.item.bookmarked }"
58+
ng-click="WidgetMedia.bookmark($event)" role="button"></i>
6659
</div>
67-
</div>
60+
<div class="link-list">
61+
<a class="media-action" ng-click="WidgetMedia.playAudio()" ng-if="WidgetMedia.medium == 'AUDIO'">
62+
<i class="btn btn-success material-icons" aria-hidden="true" id="startIcon"
63+
style="font-size: 2em !important;">play_arrow</i>
64+
</a>
65+
<a class="media-action video" ng-click="WidgetMedia.API.play()"
66+
ng-if="WidgetMedia.isVideoPlayerSupported && WidgetMedia.medium == 'VIDEO'">
67+
<i class="btn btn-success material-icons" aria-hidden="true" id="startIcon"
68+
style="font-size: 2em !important; letter-spacing: normal;">play_arrow</i>
69+
</a>
70+
</div>
71+
</div>
6872
<div class="padded">
6973
<p ng-bind-html="WidgetMedia.item.description|removeHtmlStyle:WidgetMedia.imageUrl|safeHtml"></p>
7074
</div>

‎widget/templates/Feed_Layout_3.html‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -57,23 +57,27 @@ <h4 ng-if="!WidgetMedia.item.imageSrcUrl" class="main-title margin-top-zero" sty
5757
<p class="item-date" ng-if="WidgetMedia.getItemPublishDate(WidgetMedia.item)">{{WidgetMedia.getItemPublishDate(WidgetMedia.item)}}</p>
5858
</div>
5959
<div class="item-actions">
60+
<div class="li-actions">
61+
<i ng-if="WidgetMedia.item.link" ng-click="WidgetMedia.openLink(WidgetMedia.item.link)" target="_blank" class="material-icons" aria-hidden="true" id="startIcon"
62+
style="font-size: 20px !important; letter-spacing: normal;">insert_link</i>
63+
<i class="share material-icons" ng-click="WidgetMedia.addNote()" ng-click=""
64+
role="button" style="font-size: 20px !important;">border_color</i>
65+
<i class="share glyphicon glyphicon-share-alt" ng-click="WidgetMedia.share()" role="button"></i>
66+
<i class="glyphicon icon bookmark" style="font-family: 'Glyphicons Halflings' !important;"
67+
ng-class="{ 'glyphicon-star-empty' : !WidgetMedia.item.bookmarked, 'glyphicon-star' : WidgetMedia.item.bookmarked }"
68+
ng-click="WidgetMedia.bookmark($event)" role="button"></i>
69+
</div>
6070
<div class="link-list">
6171
<a class="media-action" ng-click="WidgetMedia.playAudio()" ng-if="WidgetMedia.medium == 'AUDIO'">
62-
<i class="btn btn-success share glyphicon glyphicon-volume-up"></i>
63-
</a>
64-
<a class="media-action video" ng-click="WidgetMedia.API.play()" ng-if="WidgetMedia.isVideoPlayerSupported && WidgetMedia.medium == 'VIDEO'">
65-
<i class="btn btn-success share glyphicon glyphicon-play"></i>
72+
<i class="btn btn-success material-icons" aria-hidden="true" id="startIcon"
73+
style="font-size: 2em !important;">play_arrow</i>
6674
</a>
67-
<a ng-if="WidgetMedia.item.link" ng-click="WidgetMedia.openLink(WidgetMedia.item.link)" target="_blank">
68-
<i class="share glyphicon glyphicon-screenshot"></i>
75+
<a class="media-action video" ng-click="WidgetMedia.API.play()"
76+
ng-if="WidgetMedia.isVideoPlayerSupported && WidgetMedia.medium == 'VIDEO'">
77+
<i class="btn btn-success material-icons" aria-hidden="true" id="startIcon"
78+
style="font-size: 2em !important; letter-spacing: normal;">play_arrow</i>
6979
</a>
7080
</div>
71-
<div class="li-actions">
72-
<i class="share glyphicon glyphicon-edit" ng-click="WidgetMedia.addNote()" role="button"></i>
73-
<i class="share glyphicon glyphicon-share-alt" ng-click="WidgetMedia.share()" role="button"></i>
74-
<i class="glyphicon icon bookmark" style="font-family: 'Glyphicons Halflings' !important;" ng-class="{ 'glyphicon-star-empty' : !WidgetMedia.item.bookmarked, 'glyphicon-star' : WidgetMedia.item.bookmarked }"
75-
ng-click="WidgetMedia.bookmark($event)" role="button"></i>
76-
</div>
7781
</div>
7882
<div class="padded padding-top-zero">
7983
<p id="description" ng-bind-html="WidgetMedia.item.description|removeHtmlStyle:WidgetMedia.imageUrl|safeHtml"></p>

0 commit comments

Comments
 (0)