{{"profile.basic_info" | translate}}
++ {{"profile.type" | translate}} + | ++ {{ctrl.profile | translateProfile}} + | +
diff --git a/src/app/index.scss b/src/app/index.scss index af07f5c..685f48e 100644 --- a/src/app/index.scss +++ b/src/app/index.scss @@ -24,12 +24,19 @@ $main-bg-color: #e7ebee; $primary-color: #03a9f4; $primary-color-dark: #0288d1; +//OTHER COLORS +$default-bg-hover-color: #f8f8f8; +$red-color: #e84e40; +$red-color-dark: #dd191d; + //GRID - media queries breakpoints $break-xxs-min: 420px; $break-xs-min: 768px; $break-xxs-max: ($break-xxs-min - 1); $break-xs-max: ($break-xs-min - 1); + + @import "../../bower_components/bootswatch/flatly/_variables.scss"; /** @@ -68,4 +75,5 @@ h1, h2, h3, h4, h5 { @import "../../bower_components/bootswatch/flatly/_bootswatch.scss"; @import "layout/scss/mixins"; @import "layout/scss/bootstrap-overrides"; -@import "layout/scss/layout" +@import "layout/scss/layout"; +@import "layout/scss/tables"; diff --git a/src/app/layout/scss/_bootstrap-overrides.scss b/src/app/layout/scss/_bootstrap-overrides.scss index a522883..07881b1 100644 --- a/src/app/layout/scss/_bootstrap-overrides.scss +++ b/src/app/layout/scss/_bootstrap-overrides.scss @@ -1,41 +1,3 @@ -/* MAINBOX */ -.main-box { - border: 1px solid #e7ebee; - box-shadow: 0px 1px 1px rgba(0,0,0,0.1); - margin-bottom: 16px; - /* overflow: hidden; */ - @include border-radius($border-radius-base); - - @media (max-width: $break-xs-max) { - margin-bottom: 10px; - } - - h2 { - font-size: 1.3em; - line-height: 29px; - margin: 0; - padding: 0; - - @media (max-width: $break-xxs-max) { - margin-bottom: 5px; - } - } - &.no-header { - padding-top: 20px; - } - .main-box-header { - min-height: 50px; - padding: 10px 20px; - - &.with-border { - border-bottom: 1px solid #ecf0f1; - } - } - .main-box-body { - padding: 0 20px 20px 20px; - } -} - /* TABS */ .nav-tabs { background: #f9f9f9; diff --git a/src/app/layout/scss/_layout.scss b/src/app/layout/scss/_layout.scss index ed1684d..f8abff4 100644 --- a/src/app/layout/scss/_layout.scss +++ b/src/app/layout/scss/_layout.scss @@ -33,6 +33,5 @@ } .main-box-body { padding: 0 20px 20px 20px; - text-align: center; } } diff --git a/src/app/layout/scss/_tables.scss b/src/app/layout/scss/_tables.scss new file mode 100644 index 0000000..196caaa --- /dev/null +++ b/src/app/layout/scss/_tables.scss @@ -0,0 +1,103 @@ +/* TABLES */ +.table-hover > tbody > tr:hover > td, +.table-hover > tbody > tr:hover > th { + background-color: $default-bg-hover-color; +} +.table { + thead > tr { + > th { + border-bottom: 2px solid $main-bg-color; + text-transform: uppercase; + font-size: 0.875em; + + > a span { + color: $text-color; + } + } + } + tbody > tr { + > td { + font-size: 0.875em; + vertical-align: middle; + border-top: 1px solid $main-bg-color; + padding: 12px 8px; + + &:first-child { + font-size: 1.125em; + font-weight: bold; + } + } + td { + .call-type { + display: block; + font-size: 0.75em; + text-align: center; + } + .first-line { + line-height: 1.5; + font-weight: 400; + font-size: 1.125em; + + span { + font-size: 0.875em; + color: #969696; + font-weight: 300; + } + } + .second-line { + font-size: 0.875em; + line-height: 1.2; + } + } + &.table-line-fb > td { + background-color: #9daccb; + color: #262525; + } + &.table-line-twitter > td { + background-color: #9fccff; + color: #262525; + } + &.table-line-plus > td { + background-color: #eea59c; + color: #262525; + } + } + + a { + &.table-link { + margin: 0 5px; + font-size: 1.125em; + + &:hover { + text-decoration: none; + color: #2980b9; + } + &.danger { + color: $red-color; + + &:hover { + color: $red-color-dark; + } + } + } + } + + &.table-condensed { + tbody > tr { + > td { + padding: 8px 5px; + } + } + } +} + +.table-striped { + tbody > tr { + > td { + width: 50%; + background: none; + border: none; + border-bottom: 1px solid #ebebeb; + } + } +} diff --git a/src/app/profile/data/profile-data.component.ts b/src/app/profile/data/profile-data.component.ts new file mode 100644 index 0000000..031f816 --- /dev/null +++ b/src/app/profile/data/profile-data.component.ts @@ -0,0 +1,15 @@ +import {StateConfig, Component, Inject, Input, provide} from 'ng-forward'; +import {ProfileService} from "../../../lib/ng-noosfero-api/http/profile.service"; +import {TranslateProfile} from "../../shared/pipes/translate-profile.filter"; + +@Component({ + selector: 'profile-data', + templateUrl: "app/profile/data/profile-data.html", + pipes: [TranslateProfile] +}) +export class ProfileDataComponent { + + @Input() + profile: noosfero.Profile; + +} diff --git a/src/app/profile/data/profile-data.html b/src/app/profile/data/profile-data.html new file mode 100644 index 0000000..70f8e4c --- /dev/null +++ b/src/app/profile/data/profile-data.html @@ -0,0 +1,45 @@ + +
+ {{"profile.type" | translate}} + | ++ {{ctrl.profile | translateProfile}} + | +
+ {{ field }} + | ++ {{ value }} + | +