diff --git a/src/app/app.ios.scss b/src/app/app.ios.scss index 9b7ffd32d..829e70af8 100644 --- a/src/app/app.ios.scss +++ b/src/app/app.ios.scss @@ -8,9 +8,25 @@ color: color($colors, primary, base); } +.col[align-self-stretch] .card-ios { + height: calc(100% - #{($card-ios-margin-end + $card-ios-margin-start)}); +} + +// Top tabs +// ------------------------- +.ios .core-top-tabbar { + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + > a { + font-size: 1.6rem; + } +} + // Highlights inside the input element. -@if ($mm-text-input-ios-show-highlight) { +@if ($core-text-input-ios-show-highlight) { .card-ios, .list-ios { // In order to get a 2px border we need to add an inset // box-shadow 1px (this is to avoid the div resizing) diff --git a/src/app/app.md.scss b/src/app/app.md.scss index 552f800a2..c62a2141f 100644 --- a/src/app/app.md.scss +++ b/src/app/app.md.scss @@ -8,8 +8,12 @@ color: color($colors, primary, base); } +.col[align-self-stretch] .card-md { + height: calc(100% - #{($card-md-margin-end + $card-md-margin-start)}); +} + // Highlights inside the input element. -@if ($mm-text-input-md-show-highlight) { +@if ($core-text-input-md-show-highlight) { .card-md, .list-md { // In order to get a 2px border we need to add an inset // box-shadow 1px (this is to avoid the div resizing) diff --git a/src/app/app.scss b/src/app/app.scss index ed0a5508b..3b5ab9aad 100644 --- a/src/app/app.scss +++ b/src/app/app.scss @@ -23,10 +23,16 @@ .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } - +.clearfix { + &:after { + content: ""; + display: table; + clear: both; + } +} @media only screen and (min-width: 430px) { - .mm-center-view .scroll-content { + .core-center-view .scroll-content { display: flex!important; align-content: center !important; align-items: center !important; @@ -37,6 +43,18 @@ } } +@media only screen and (max-width: 768px) { + .hidden-phone { + display: none !important; + } +} + +@media only screen and (min-width: 769px) { + .hidden-tablet { + display: none !important; + } +} + // Define an alternative way to set a heading in an item without using a heading tag. // This is done for accessibility reasons when a heading is semantically incorrect. @@ -45,7 +63,7 @@ margin: 0; } -.mm-oauth-icon, .item.mm-oauth-icon, .list .item.mm-oauth-icon { +.core-oauth-icon, .item.core-oauth-icon, .list .item.core-oauth-icon { min-height: 32px; img, .label { max-height: 32px; @@ -60,7 +78,7 @@ } } -.mm-bold, .mm-bold .label { +.core-bold, .core-bold .label { font-weight: bold; } @@ -128,23 +146,23 @@ core-format-text[maxHeight], *[core-format-text][maxHeight] { } // This is to allow clicks in radio/checkbox content. - &.mm-text-formatted { + &.core-text-formatted { cursor: pointer; - .mm-show-more { + .core-show-more { display: none; } - &:not(.mm-shortened) { + &:not(.core-shortened) { max-height: none !important; } - &.mm-shortened { + &.core-shortened { color: $gray-darker; overflow: hidden; min-height: 50px; - .mm-show-more { + .core-show-more { color: color($colors, dark); text-align: right; font-size: 14px; @@ -166,7 +184,7 @@ core-format-text[maxHeight], *[core-format-text][maxHeight] { */ } - &.mm-expand-in-fullview .mm-show-more:after { + &.core-expand-in-fullview .core-show-more:after { // content: $ionicon-var-chevron-right; @todo } @@ -225,3 +243,34 @@ core-format-text, *[core-format-text] { max-height: $item-media-height; } } + +// Ionic fix. Button can occupy all page if not. +ion-select { + position: relative +} + +// Top tabs +// ------------------------- + +.core-top-tabbar { + @include position(null, null, 0, 0); + + z-index: $z-index-toolbar; + display: flex; + width: 100%; + background: $core-top-tabs-background; + + > a { + @extend .tab-button; + + background: $core-top-tabs-background; + color: $core-top-tabs-color !important; + border-bottom: 1px solid $core-top-tabs-border; + font-size: 1.6rem; + + &[aria-selected=true] { + color: $core-top-tabs-color-active !important; + border-bottom: 2px solid $core-top-tabs-color-active; + } + } +} diff --git a/src/app/app.wp.scss b/src/app/app.wp.scss index 29afff5a3..c0544152c 100644 --- a/src/app/app.wp.scss +++ b/src/app/app.wp.scss @@ -7,3 +7,7 @@ .button-wp-light { color: color($colors, primary, base); } + +.col[align-self-stretch] .card-wp { + height: calc(100% - #{($card-wp-margin-end + $card-wp-margin-start)}); +} diff --git a/src/components/empty-box/empty-box.html b/src/components/empty-box/empty-box.html index 1c43cb9bf..13229943f 100644 --- a/src/components/empty-box/empty-box.html +++ b/src/components/empty-box/empty-box.html @@ -1,8 +1,8 @@ -
-
+
+
- -

{{ message }}

+ +

{{ message }}

\ No newline at end of file diff --git a/src/components/empty-box/empty-box.scss b/src/components/empty-box/empty-box.scss index ec407edf6..0b7562355 100644 --- a/src/components/empty-box/empty-box.scss +++ b/src/components/empty-box/empty-box.scss @@ -1,3 +1,57 @@ core-empty-box { + .core-empty-box { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + display: table; + height: 100%; + width: 100%; + z-index: -1; + margin: 0; + padding: 0; + clear: both; + .core-empty-box-content { + color: $black; + margin: 0; + display: table-cell; + text-align: center; + vertical-align: middle; + } + + &.core-empty-box-inline { + position: relative; + top: initial; + left: initial; + right: initial; + z-index: initial; + } + + .icon { + font-size: 120px; + } + img { + height: 125px; + width: 145px; + } + p { + font-size: 120%; + } + } + + @media only screen and (max-height: 420px) { + .core-empty-box { + position: relative; + + .icon { + font-size: 100px; + } + img { + height: 104px; + width: 121px; + } + } + } } diff --git a/src/components/file/file.scss b/src/components/file/file.scss index 6279a3b37..95127e438 100644 --- a/src/components/file/file.scss +++ b/src/components/file/file.scss @@ -1,28 +1,2 @@ -core-loading { - .mm-loading-container { - width: 100%; - text-align: center; - padding-top: 10px; - clear: both; - } - - .mm-loading-content { - padding-bottom: 1px; /* This makes height be real */ - } - - &.mm-loading-noheight .mm-loading-content { - height: auto; - } -} - -.scroll-content > .padding > core-loading > .mm-loading-container, -ion-content[padding] > .scroll-content > core-loading > .mm-loading-container, -.mm-loading-center .mm-loading-container { - display: table; - - .mm-loading-spinner { - display: table-cell; - text-align: center; - vertical-align: middle; - } -} +core-file { +} \ No newline at end of file diff --git a/src/components/iframe/iframe.html b/src/components/iframe/iframe.html index 75cea2664..69ace4cf8 100644 --- a/src/components/iframe/iframe.html +++ b/src/components/iframe/iframe.html @@ -1,4 +1,4 @@ -
- +
+
\ No newline at end of file diff --git a/src/components/loading/loading.html b/src/components/loading/loading.html index e79daa1ff..d6a224a91 100644 --- a/src/components/loading/loading.html +++ b/src/components/loading/loading.html @@ -1,8 +1,9 @@ -
-
- {{ 'core.percentagenumber' | translate: {$a: text} }} + {{ 'core.percentagenumber' | translate: {$a: text} }}
diff --git a/src/components/progress-bar/progress-bar.scss b/src/components/progress-bar/progress-bar.scss index a1d8ec63d..318a230bf 100644 --- a/src/components/progress-bar/progress-bar.scss +++ b/src/components/progress-bar/progress-bar.scss @@ -1,25 +1,25 @@ -$mm-progress-bar-height: 5px !default; +$core-progress-bar-height: 5px !default; core-progress-bar { padding-right: 55px; position: relative; display: block; - // @extend .clearfix; + @extend .clearfix; - .mm-progress-text { + .core-progress-text { margin-left: 10px; - line-height: 35px; + line-height: normal; + font-size: 1.4rem; color: $gray-darker; right: 0; - top: 0; - color: #626262; + top: -6px; position: absolute; } progress { -webkit-appearance: none; appearance: none; - height: $mm-progress-bar-height; + height: $core-progress-bar-height; margin: 15px 0; padding: 0; display: block; @@ -34,18 +34,18 @@ core-progress-bar { .progress-bar-fallback span, &[value]::-webkit-progress-value { - background-color: $mm-color-light; + background-color: $core-color-light; border-radius: 2px; } .progress-bar-fallback { width: 100%; - height: $mm-progress-bar-height; + height: $core-progress-bar-height; display: block; position: relative; span { - height: $mm-progress-bar-height; + height: $core-progress-bar-height; display: block; } } diff --git a/src/components/search-box/search-box.html b/src/components/search-box/search-box.html index bc0b8a5da..7772b67e8 100644 --- a/src/components/search-box/search-box.html +++ b/src/components/search-box/search-box.html @@ -2,7 +2,7 @@
- diff --git a/src/components/search-box/search-box.scss b/src/components/search-box/search-box.scss index d451c7559..c2f5de7b5 100644 --- a/src/components/search-box/search-box.scss +++ b/src/components/search-box/search-box.scss @@ -3,4 +3,7 @@ core-search-box { margin: 0; padding: ($content-padding / 2) $content-padding; } + .item.item-input.item-block .item-inner ion-input { + border-bottom: 0; + } } diff --git a/src/components/show-password/show-password.scss b/src/components/show-password/show-password.scss index 5e5621493..919b6dce4 100644 --- a/src/components/show-password/show-password.scss +++ b/src/components/show-password/show-password.scss @@ -16,6 +16,11 @@ core-show-password { margin-top: 0; margin-bottom: 0; } + + .core-ioninput-password { + padding-top: 0; + padding-bottom: 0; + } } .md { diff --git a/src/core/courses/components/course-list-item/course-list-item.html b/src/core/courses/components/course-list-item/course-list-item.html index 1c105977b..26bd82906 100644 --- a/src/core/courses/components/course-list-item/course-list-item.html +++ b/src/core/courses/components/course-list-item/course-list-item.html @@ -1,15 +1,12 @@ - +

- - - + + + - - -
diff --git a/src/core/courses/components/course-list-item/course-list-item.scss b/src/core/courses/components/course-list-item/course-list-item.scss index 2487cb6e9..d5fe709e3 100644 --- a/src/core/courses/components/course-list-item/course-list-item.scss +++ b/src/core/courses/components/course-list-item/course-list-item.scss @@ -1,5 +1,5 @@ core-courses-course-list-item { - .mm-course-enrollment-img { + .core-course-enrollment-img { max-width: 16px; max-height: 16px; } diff --git a/src/core/courses/components/course-progress/course-progress.html b/src/core/courses/components/course-progress/course-progress.html index e66ef5389..08b954147 100644 --- a/src/core/courses/components/course-progress/course-progress.html +++ b/src/core/courses/components/course-progress/course-progress.html @@ -1,19 +1,22 @@ - -

- - - + +

+ + - + - +

- +

+ + + diff --git a/src/core/courses/components/course-progress/course-progress.scss b/src/core/courses/components/course-progress/course-progress.scss index e24e0ae82..4587fe8ca 100644 --- a/src/core/courses/components/course-progress/course-progress.scss +++ b/src/core/courses/components/course-progress/course-progress.scss @@ -1,2 +1,12 @@ -core-courses-course-progress { +core-courses-course-progress.core-courseoverview { + @media (max-width: 576px) { + ion-card.card { + margin: 0; + border-radius: 0; + box-shadow: none; + border-bottom: 1px solid $list-border-color; + width: 100%; + height: 100% !important; + } + } } diff --git a/src/core/courses/components/course-progress/course-progress.ts b/src/core/courses/components/course-progress/course-progress.ts index a3dd08c3c..e7a2fb49c 100644 --- a/src/core/courses/components/course-progress/course-progress.ts +++ b/src/core/courses/components/course-progress/course-progress.ts @@ -15,14 +15,13 @@ import { Component, Input, OnInit } from '@angular/core'; import { NavController } from 'ionic-angular'; import { TranslateService } from '@ngx-translate/core'; -import { CoreUtilsProvider } from '../../../../providers/utils/utils'; /** * This component is meant to display a course for a list of courses with progress. * * Example usage: * - * + * * */ @Component({ @@ -31,22 +30,20 @@ import { CoreUtilsProvider } from '../../../../providers/utils/utils'; }) export class CoreCoursesCourseProgressComponent implements OnInit { @Input() course: any; // The course to render. - @Input() showSummary?: boolean|string; // Whether to show the summary. - actionsLoaded = true; - prefetchCourseIcon: string; + isDownloading: boolean; protected obsStatus; protected downloadText; protected downloadingText; protected downloadButton = { isDownload: true, - className: 'mm-download-course', + className: 'core-download-course', priority: 1000 }; protected buttons; - constructor(private navCtrl: NavController, private translate: TranslateService, private utils: CoreUtilsProvider) { + constructor(private navCtrl: NavController, private translate: TranslateService) { this.downloadText = this.translate.instant('core.course.downloadcourse'); this.downloadingText = this.translate.instant('core.downloading'); } @@ -56,7 +53,6 @@ export class CoreCoursesCourseProgressComponent implements OnInit { */ ngOnInit() { // @todo: Handle course prefetch. - this.showSummary = this.utils.isTrueOrOne(this.showSummary); } /** diff --git a/src/core/courses/components/overview-events/overview-events.html b/src/core/courses/components/overview-events/overview-events.html index b7240d0f8..e39c479b2 100644 --- a/src/core/courses/components/overview-events/overview-events.html +++ b/src/core/courses/components/overview-events/overview-events.html @@ -1,62 +1,45 @@ - + - - {{event.action.itemcount}}

{{event.timesort * 1000 | coreFormatDate:"dfmediumdate" }}

+ + {{event.action.itemcount}} - -
{{ 'core.courses.recentlyoverdue' | translate }}
-
    -
  • - -
    • -
- + + {{ 'core.courses.recentlyoverdue' | translate }} + + + + - -
{{ 'core.today' | translate }}
-
    -
  • - -
    • -
- + + {{ 'core.courses.next7days' | translate }} + + + + - -
{{ 'core.courses.next7days' | translate }}
-
    -
  • - -
    • -
- + + {{ 'core.courses.next30days' | translate }} + + + + - -
{{ 'core.courses.next30days' | translate }}
-
    -
  • - -
    • -
- + + {{ 'core.courses.future' | translate }} + + + + - -
{{ 'core.courses.future' | translate }}
-
    -
  • - -
    • -
- - -
+
diff --git a/src/core/courses/components/overview-events/overview-events.scss b/src/core/courses/components/overview-events/overview-events.scss index e24e0ae82..4adcffdff 100644 --- a/src/core/courses/components/overview-events/overview-events.scss +++ b/src/core/courses/components/overview-events/overview-events.scss @@ -1,2 +1,24 @@ core-courses-course-progress { + + .core-course-module-handler.item-md.item-block .item-inner { + border-bottom: 1px solid $list-md-border-color; + } + + .core-course-module-handler.item-ios.item-block .item-inner { + border-bottom: $hairlines-width solid $list-ios-border-color; + } + + .core-course-module-handler.item-wp.item-block .item-inner { + border-bottom: 1px solid $list-wp-border-color; + } + + .core-course-module-handler.item:last-child .item-inner { + border-bottom: 0; + } + + .core-course-module-handler.item .item-heading:first-child { + margin-top: 0; + } } + + diff --git a/src/core/courses/pages/course-preview/course-preview.html b/src/core/courses/pages/course-preview/course-preview.html index 9bda961bf..58db99af7 100644 --- a/src/core/courses/pages/course-preview/course-preview.html +++ b/src/core/courses/pages/course-preview/course-preview.html @@ -10,7 +10,7 @@ - +

{{course.categoryname}}

@@ -29,13 +29,13 @@

{{ instance.name }}

- +

{{ 'core.courses.paypalaccepted' | translate }}

{{ 'core.paymentinstant' | translate }}

- +

{{ 'core.courses.notenrollable' | translate }}

@@ -49,16 +49,14 @@

{{ 'core.course.contents' | translate }}

- -
- +
+

-
- + diff --git a/src/core/courses/pages/my-overview/my-overview.html b/src/core/courses/pages/my-overview/my-overview.html index d7be21e0e..84f43acd7 100644 --- a/src/core/courses/pages/my-overview/my-overview.html +++ b/src/core/courses/pages/my-overview/my-overview.html @@ -3,12 +3,12 @@ {{ 'core.courses.courseoverview' | translate }} + - @@ -18,61 +18,63 @@ -
- {{ 'core.courses.timeline' | translate }} - {{ 'core.courses.courses' | translate }} +
+ {{ 'core.courses.timeline' | translate }} + {{ 'core.courses.courses' | translate }}
-
- +
+
{{ 'core.courses.sortbydates' | translate }} {{ 'core.courses.sortbycourses' | translate }} - - +
+ - -
- - - -
+ + + + + + + + + + - - - - - - {{ 'core.courses.inprogress' | translate }} - {{ 'core.courses.future' | translate }} - {{ 'core.courses.past' | translate }} - - - - - - - -
- - - - - -
- -
- -
+
+ +
+ + {{ 'core.courses.inprogress' | translate }} + {{ 'core.courses.future' | translate }} + {{ 'core.courses.past' | translate }} + + +
+
+ + + + +
+
+ + + + + + + - -
+
+ diff --git a/src/core/courses/pages/my-overview/my-overview.ts b/src/core/courses/pages/my-overview/my-overview.ts index f3643851c..77981683c 100644 --- a/src/core/courses/pages/my-overview/my-overview.ts +++ b/src/core/courses/pages/my-overview/my-overview.ts @@ -48,7 +48,6 @@ export class CoreCoursesMyOverviewPage { inprogress: [], future: [] }; - showGrid = true; showFilter = false; searchEnabled: boolean; filteredCourses: any[]; @@ -204,13 +203,6 @@ export class CoreCoursesMyOverviewPage { } } - /** - * Switch grid/list view. - */ - switchGrid() { - this.showGrid = !this.showGrid; - } - /** * Refresh the data. * diff --git a/src/core/courses/pages/self-enrol-password/self-enrol-password.html b/src/core/courses/pages/self-enrol-password/self-enrol-password.html index b9161587b..3294d64bc 100644 --- a/src/core/courses/pages/self-enrol-password/self-enrol-password.html +++ b/src/core/courses/pages/self-enrol-password/self-enrol-password.html @@ -9,11 +9,11 @@ - + - + diff --git a/src/core/courses/providers/handlers.ts b/src/core/courses/providers/handlers.ts index c003917b3..dd3338802 100644 --- a/src/core/courses/providers/handlers.ts +++ b/src/core/courses/providers/handlers.ts @@ -57,14 +57,14 @@ export class CoreCoursesMainMenuHandler implements CoreMainMenuHandler { icon: 'ionic', title: 'core.courses.courseoverview', page: 'CoreCoursesMyOverviewPage', - class: 'mm-courseoverview-handler' + class: 'core-courseoverview-handler' }; } else { return { icon: 'ionic', title: 'core.courses.mycourses', page: 'CoreCoursesMyCoursesPage', - class: 'mm-mycourses-handler' + class: 'core-mycourses-handler' }; } } diff --git a/src/core/emulator/providers/clipboard.ts b/src/core/emulator/providers/clipboard.ts index 89a427f8e..2cdd7435e 100644 --- a/src/core/emulator/providers/clipboard.ts +++ b/src/core/emulator/providers/clipboard.ts @@ -34,7 +34,7 @@ export class ClipboardMock extends Clipboard { } else { // In browser the text must be selected in order to copy it. Create a hidden textarea to put the text in it. this.copyTextarea = document.createElement('textarea'); - this.copyTextarea.className = 'mm-browser-copy-area'; + this.copyTextarea.className = 'core-browser-copy-area'; this.copyTextarea.setAttribute('aria-hidden', 'true'); document.body.appendChild(this.copyTextarea); } diff --git a/src/core/login/pages/credentials/credentials.html b/src/core/login/pages/credentials/credentials.html index b58d711b8..6aee0c300 100644 --- a/src/core/login/pages/credentials/credentials.html +++ b/src/core/login/pages/credentials/credentials.html @@ -3,7 +3,7 @@ {{ 'core.login.login' | translate }} - +
@@ -12,10 +12,10 @@ -

{{siteUrl}}

+

{{siteUrl}}

-

{{siteName}}

-

{{siteUrl}}

+

{{siteName}}

+

{{siteUrl}}

@@ -23,7 +23,7 @@ - + @@ -36,7 +36,7 @@ {{ 'core.login.potentialidps' | translate }} - diff --git a/src/core/login/pages/credentials/credentials.scss b/src/core/login/pages/credentials/credentials.scss index b940b3116..030525baf 100644 --- a/src/core/login/pages/credentials/credentials.scss +++ b/src/core/login/pages/credentials/credentials.scss @@ -4,11 +4,6 @@ page-core-login-credentials { background: radial-gradient(white, $gray-light); } - .mm-ioninput-password { - padding-top: 0; - padding-bottom: 0; - } - img { max-width: 100%; } @@ -25,8 +20,8 @@ page-core-login-credentials { border: 1px solid $gray; } - .mm-sitename, .mm-siteurl { - @if $mm-fixed-url { display: none; } + .core-sitename, .core-siteurl { + @if $core-fixed-url { display: none; } } .item-input { diff --git a/src/core/login/pages/email-signup/email-signup.html b/src/core/login/pages/email-signup/email-signup.html index 2a737e086..e284fd771 100644 --- a/src/core/login/pages/email-signup/email-signup.html +++ b/src/core/login/pages/email-signup/email-signup.html @@ -78,7 +78,7 @@ diff --git a/src/core/login/pages/init/init.html b/src/core/login/pages/init/init.html index d0ef72e4a..53461969c 100644 --- a/src/core/login/pages/init/init.html +++ b/src/core/login/pages/init/init.html @@ -1,6 +1,6 @@ -