Hi,
You can clone OOB my request widget and try below HTML code
<div class="panel panel-default b" ng-init="c.trackPage()">
<div class="panel-heading" ng-show="::!data.is_associated_ticket_tab">
<h2 class="panel-title">{{::data.messages.myRequestsTitle}}</h2>
</div>
<div class="panels-container list-group">
<div ng-show="::!data.is_associated_ticket_tab" class="list-group-item row requests-header-container">
<div class="col-md-3 col-xs-12 m-b-sm fit-content">
<div class="form-inline control-view" ng-if="c.options.show_view == 'true'">
<label class="control-label hidden-xs wrapper-xs " id="label_view" for="view">${View}</label>
<select ng-model="c.viewFilter" id="view" class="sc-basic-select adjust-width" ng-change="c.changeView()" style="width:80%">
<option value="open" selected="true">{{::data.messages.openRequests}}</option>
<option value="close">{{::data.messages.closedRequests}}</option>
</select>
</div>
</div>
<div class="col-md-6 col-xs-12 padding-left-large fit-content">
<div class="input-group" style="width:100%">
<input ng-model="c.filterText" ng-keypress="c.checkEnter($event)"class="form-control" style="width:100%" placeholder="{{data.filterMsg}}" aria-label="{{data.filterMsg}}">
<span class="input-group-btn">
<button class="btn btn-default align-icon" type="button" ng-click="c.search()" title="{{data.filterMsg}}" aria-label="{{data.filterMsg}}">
<i class="fa fa-search"></i>
</button>
</span>
</div><!-- /input-group -->
</div>
</div>
<div ng-if="c.data.request.req_list.length == 0 && !c.filterText" class="panel-body panels-container">
${You do not have any requests}
</div>
<div ng-if="c.data.request.req_list.length == 0 && c.filterText" class="panel-body panels-container">
${Search didn't match any requests}
</div>
<div role="table" ng-if="c.data.request.req_list.length > 0" class="table" aria-label="{{::data.messages.myRequestsTitle}}">
<div ng-show="::!data.is_associated_ticket_tab" role="rowgroup" class="column-headers">
<div role="row" class="list-group-item table-responsive">
<span role="columnheader" class="col-xs-6 padder-r-none padder-l-none">${Request}</span>
<span role="columnheader" class="col-xs-6 padder-r-none padder-l-none">${State}</span>
</div>
</div>
<ul role="rowgroup" class="padder-l-none padder-r-none">
<li role="row" class="list-group-item table-responsive" ng-repeat="item in c.data.request.req_list | limitTo: c.data.lastLimit track by item.sys_id" style="margin:0px" >
<div role="cell" class="col-xs-6 padder-l-none padder-r-none main-column">
<div class="primary-display">
<a href="?id={{::item.url.id}}&table={{::item.url.table}}&sys_id={{::item.url.sys_id}}" sn-focus="{{::item.highlight}}" aria-label="{{::item.display_field}} , {{::item.display_number}}"> {{::item.display_field}} </a>
</div>
<small class="text-muted">
<div ng-repeat="f in item.secondary_displays" class="secondary-display">
<span >{{::f.display_value}}</span>
</div>
</small>
</div>
<div role="cell" class="col-xs-6 padder-l-none padder-r-none state-column">
<div class="state">
<span> {{::item.state}}</span>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="col-sm-12 pull-none" ng-if="c.data.hasMore" style="padding-bottom:15px">
<div class="text-a-c" ng-if="c.fetching">
<i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i>
<span class="sr-only">${Loading more requests}</span>
</div>
<button class="btn btn-default btn-show-more" ng-click="c.loadMore()"> {{::data.messages.showMoreRequests}} </button>
</div>
