-
-
-
-
+
+
+
+
About
- The Ionic Conference is a one-day conference on - {{ dateFormat(conferenceDate, "MMM dd, yyyy") }} - featuring talks from the Ionic team. It is focused on Ionic applications being built with Ionic Framework. This includes migrating apps to the latest version of the framework, Angular concepts, Webpack, Sass, and many other technologies used in Ionic 7. Tickets are completely sold out, and we’re expecting more than 1000 developers – making this the largest Ionic conference ever! + The Ionic Conference is a one-day event happening on + {{ dateFormat(conferenceDate, "MMM dd, yyyy") }}, + featuring talks from the Ionic team. The conference focuses on + building applications with Ionic Framework, including topics such + as app migration to the latest version, Vue best practices, Webpack, + Sass, and other technologies commonly used in the Ionic ecosystem. Tickets + are completely sold out, and we're expecting over 1,000 developers — + making this the largest Ionic conference to date!
Details
- 
+ 
-
-
+
+
+
+
+
-
-
- {{ track }}
-
-
-
-
-
+ {{ track }}
- {{ dateFormat(session.dateTimeStart, "h:mm a") }} — {{ dateFormat(session.dateTimeEnd, "h:mm a") }}
-
+ {{ session.timeStart }} – {{ session.timeEnd }} +
{{ session.location }}
-
+
Watch
-
+
Add to Calendar
-
+
Mark as Unwatched
-
+
Download Video
-
-
+
Leave Feedback
@@ -64,28 +65,75 @@
color: var(--ion-color-primary);
}
-.session-track-angular {
- color: var(--ion-color-angular);
+.session-track-vue {
+ color: var(--ion-color-vue);
+}
+
+.session-track-communication {
+ color: var(--ion-color-communication);
+}
+
+.session-track-tooling {
+ color: var(--ion-color-tooling);
}
+.session-track-services {
+ color: var(--ion-color-services);
+}
+
+.session-track-design {
+ color: var(--ion-color-design);
+}
+
+.session-track-workshop {
+ color: var(--ion-color-workshop);
+}
+
+.session-track-food {
+ color: var(--ion-color-food);
+}
+
+.session-track-documentation {
+ color: var(--ion-color-documentation);
+}
+
+.session-track-navigation {
+ color: var(--ion-color-navigation);
+}
+
+/* Favorite Icon
+ * --------------------------------------------------------
+ */
+
.show-favorite {
position: relative;
}
-.icon-heart-empty {
+.icon-heart-empty,
+.icon-heart {
+ --border-radius: 50%;
+ --padding-start: 0;
+ --padding-end: 0;
+
position: absolute;
+
top: 5px;
right: 5px;
+
+ width: 48px;
+ height: 48px;
+
+ transition: transform 300ms ease;
+
+ font-size: 16px;
+}
+
+.icon-heart-empty {
transform: scale(1);
- transition: transform 0.3s ease;
}
.icon-heart {
- position: absolute;
- top: 5px;
- right: 5px;
transform: scale(0);
- transition: transform 0.3s ease;
}
.show-favorite .icon-heart {
@@ -95,18 +143,22 @@
.show-favorite .icon-heart-empty {
transform: scale(0);
}
+
+h1 {
+ margin: 0;
+}
-
\ No newline at end of file
+
+onMounted(async () => {
+ // Check if sessions are loaded, if not load them
+ if (store.state.sessions.sessions.length === 0) {
+ await store.dispatch("loadSessionData");
+ }
+
+ session.value = store.state.sessions.sessions.find(
+ (s) => s.id === parseInt(route.params.sessionId.toString())
+ );
+});
+
diff --git a/src/views/SessionList.vue b/src/views/SessionList.vue
index 865c1b2..f73df26 100644
--- a/src/views/SessionList.vue
+++ b/src/views/SessionList.vue
@@ -1,23 +1,48 @@
-
+
-
+
-
+
All
Favorites
+ Schedule
+
+
-
-
+
+
+ Filter
+
+
+
+
+
+ All
+ Favorites
+
+
+
@@ -26,64 +51,68 @@
+
-
+
- {{ dateFormat(group.startTime, "h:mm a") }}
+ {{ group.startTime }}
-
-
-
+
+
Favorite
+ Favorite
+
Remove
+ Remove
+
- No Sessions Found
+
+ No Sessions Found
+
+
-
+
-
+
-
-
-
+
-
+
-
-
diff --git a/src/views/SessionListFilter.vue b/src/views/SessionListFilter.vue
index 242113e..c908cf7 100644
--- a/src/views/SessionListFilter.vue
+++ b/src/views/SessionListFilter.vue
@@ -1,30 +1,36 @@
-
+
- Cancel
+ Cancel
+ Reset
-
- Filter Sessions
-
+
+ Filter Sessions
+
Done
-
-
+
+
Tracks
-
-
+
+
+
{{ track.name }}
-
+
+
@@ -39,6 +45,35 @@
diff --git a/src/views/Signup.vue b/src/views/Signup.vue
index 4e496aa..b9cb55d 100644
--- a/src/views/Signup.vue
+++ b/src/views/Signup.vue
@@ -1,17 +1,3 @@
-
-
@@ -23,48 +9,49 @@
-
+
-
+
+
diff --git a/src/views/SpeakerDetail.vue b/src/views/SpeakerDetail.vue
index 171279d..502c033 100644
--- a/src/views/SpeakerDetail.vue
+++ b/src/views/SpeakerDetail.vue
@@ -1,47 +1,162 @@
-
-
-
-
- {{ speaker ? speaker.name : '' }}
-
-
-
-
-
{{ session.name }}
-{{ session.description }}
+ {{ session.timeStart }} – {{ session.timeEnd }} +
{{ session.location }}
{{ session.tracks[0] }} - {{ session.name }}
+{{ session.name }}
- {{ dateFormat(session.dateTimeStart, "h:mm a") }} — - {{ dateFormat(session.dateTimeEnd, "h:mm a") }}: + {{ session.timeStart }} — {{ session.timeEnd }}: {{ session.location }}
-
+
+
+
+
+
+
+
-
-
- ![]()
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/SpeakerList.vue b/src/views/SpeakerList.vue
index c2238ea..83b8434 100644
--- a/src/views/SpeakerList.vue
+++ b/src/views/SpeakerList.vue
@@ -1,11 +1,11 @@
-
+
- Speakers
+ Speakers
@@ -15,110 +15,82 @@
Speakers
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
-
- ![Speaker profile pic]()
-
-
-
-
-
-
-
-
-
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/Support.vue b/src/views/Support.vue
index bdfefab..8296194 100644
--- a/src/views/Support.vue
+++ b/src/views/Support.vue
@@ -10,6 +10,14 @@
.support-logo img {
max-width: 150px;
}
+
+.list {
+ margin-bottom: 0;
+}
+
+.support-form {
+ padding: 16px;
+}
@@ -23,36 +31,37 @@
-
+
-
diff --git a/src/views/Tutorial.vue b/src/views/Tutorial.vue
index bdbb588..70367b2 100644
--- a/src/views/Tutorial.vue
+++ b/src/views/Tutorial.vue
@@ -1,111 +1,139 @@
-
-
-
+
+
+
- Skip
+ Skip
-
-
-
- 
+
+
\ No newline at end of file
+onActivated(() => {
+ resetScroll();
+});
+
diff --git a/vite.config.ts b/vite.config.ts
index 5f24224..634fd5c 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -17,5 +17,8 @@ export default defineConfig({
test: {
globals: true,
environment: 'jsdom'
+ },
+ define: {
+ __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: 'false'
}
})
-
+ ![]()
+
- {{ speaker?.name || 'Loading...' }}
{{ speaker ? speaker.about : '' }}
+
+
+ +
+ Twitter
+
+
+
+ GitHub
+
+
+
+ Instagram
+
+
{{ speaker?.about || 'Loading biography...' }} Say hello on social media!
+ ++ +
{{ speaker.name }}
+{{ speaker.title }}
+{{ speaker.name }}
-{{ speaker.title }}
+{{ session.name }}
{{ session.name }}
-About {{ speaker.name }}
-
- 
+
+
+
+
+
+
+
-
-
+
+
+ 
-
+
+
+
+ 
- 
-
+
+
+ 
+
- 
+
+
+
+ 
Continue
-
-
+
+
- Welcome to - ICA + Welcome to ICA
- The - ionic conference app is a practical preview of the ionic framework in action, and a demonstration of proper code use. + The ionic conference app is a practical preview of the ionic + framework in action, and a demonstration of proper code use.
- - -
+
What is Ionic?
- Ionic Framework is an open source SDK that enables developers to build high-quality mobile apps with web technologies - like HTML, CSS, and JavaScript. + Ionic Framework is an open source SDK that enables developers + to build high quality mobile apps with web technologies like HTML, + CSS, and JavaScript.
- - -
- What is Ionic Pro?
+
+ What is Ionic Appflow?
- Ionic Pro is a powerful set of services and features built on top of Ionic Framework that brings a totally new - level of app development agility to mobile dev teams. + Ionic Appflow is a powerful set of services and features built + on top of Ionic Framework that brings a totally new level of app + development agility to mobile dev teams.
- - -
+