Skip to content

Commit

Permalink
Updated spinner without using empty-state class
Browse files Browse the repository at this point in the history
  • Loading branch information
shanmukhdutt committed Jan 5, 2024
1 parent 30c1e71 commit 5a4161a
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 16 deletions.
11 changes: 0 additions & 11 deletions src/theme/variables.css
Original file line number Diff line number Diff line change
Expand Up @@ -265,14 +265,3 @@ http://ionicframework.com/docs/theming/ */
display: none;
}
}
.empty-state {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
}
.empty-state ion-spinner{
margin-right: 10px;
}
16 changes: 11 additions & 5 deletions src/views/TimezoneModal.vue
Original file line number Diff line number Diff line change
Expand Up @@ -13,12 +13,18 @@
</ion-toolbar>
</ion-header>

<ion-content class="ion-padding">
<!-- Empty state -->
<!-- Empty state -->
<ion-content class="ion-text-center">
<div class="empty-state" v-if="filteredTimeZones.length === 0">
<ion-spinner name="crescent" ></ion-spinner>
<p>{{ $t("Fetching time zones") }}</p>
</div>
<ion-row class="ion-align-items-center ion-justify-content-center" style="height: 50vh;">
<ion-col size="auto">
<ion-spinner name="crescent" ></ion-spinner>
</ion-col>
<ion-col size="auto">
<p>{{ $t("Fetching time zones")}}</p>
</ion-col>
</ion-row>
</div>

<!-- Timezones -->
<div v-else>
Expand Down

0 comments on commit 5a4161a

Please sign in to comment.