diff --git a/app/partials/bills.jade b/app/partials/bills.jade index 9face9c..5fe9a2d 100644 --- a/app/partials/bills.jade +++ b/app/partials/bills.jade @@ -4,71 +4,22 @@ .bill-progress(ng-if="bill_ref") .common.ui.seven.steps span.stage(ng-repeat="step in steps") - a.ui.step(ng-click="showSub($index)",ng-class="step.status.step") {{step.description}} - .ui.pointing.below.label(ng-class="step.status.step") {{step.date}} + a.ui.step(ng-click="showSub($index)",ng-class="step.status.step") + .step-description {{step.description}} + .date {{step.date}} + //-.ui.pointing.below.label(ng-class="step.status.step") {{step.date}} .ui.state(ng-class="step.status.state"): i.icon(ng-class="step.status.icon") .ui.small.steps(ng-repeat="step in steps") span.stage(ng-show="step.sub",ng-repeat="substep in step.detail") - .ui.step(ng-class="substep.status.step") {{substep.description}} - .ui.pointing.below.label(ng-class="'{{substep.status.step}}'") {{substep.date}} + .ui.step(ng-class="substep.status.step") + .substep-description {{substep.description}} + .date {{substep.date}} + //-.ui.pointing.below.label(ng-class="'{{substep.status.step}}'") {{substep.date}} .ui.state(ng-class="substep.status.state"): i.icon(ng-class="substep.status.icon") - //-.ui.seven.steps - a.ui.step.white(ng-click="mode='proposal'") 一讀 - .ui.pointing.below.label.green ..... - .ui.state.white: i.icon.check - a.ui.step.green(ng-click="mode='first-reading'",ng-class="green") 一讀 - .ui.state.white: i.icon.check - a.ui.step.white(ng-click="mode='step-3'") 委員會 - .ui.state.white: i.icon.check - a.ui.step.white(ng-click="mode='step-4'") 二讀 - .ui.state.white: i.icon.check - a.ui.step.white(ng-click="mode='step-5'") 三讀 - .ui.state.white: i.icon.check - a.ui.step.white(ng-click="mode='step-6'") 頒佈 - .ui.state.white: i.icon.check - a.ui.step.white(ng-click="mode='step-7'") 生效 - //-.ui.small.steps(ng-show="mode=='proposal'") - .ui.step.green.no-hover - .ui.pointing.below.label date - | 經OO立委送至OO單位 - .ui.state.green: i.icon.check - .ui.step.white.no-hover - .ui.pointing.below.label date - | 經程序委員會排入全院院會一讀議程 - .ui.state.white: i.icon.check - //-.ui.small.steps(ng-show="mode=='first-reading'") - .ui.step.white.no-hover - .ui.pointing.below.label date - | 於院會一讀通過 - .ui.state.white: i.icon.check - .ui.step.white.no-hover - .ui.pointing.below.label date - | 經程序委員會排入委員會議程 - .ui.state.white: i.icon.check - //-.ui.small.steps(ng-show="mode=='step-3'") - .ui.step.white.no-hover - .ui.pointing.below.label date - | 於委員會審查通過 - .ui.state.white: i.icon.check - .ui.step.white.no-hover - .ui.pointing.below.label date - | 經程序委員會排入全院院會二讀議程 - .ui.state.white: i.icon.check - //-.ui.small.steps(ng-show="mode=='step-4'") - .ui.step.white.no-hover - .ui.pointing.below.label date - | 於院會二讀通過 - .ui.state.white: i.icon.check - .ui.step.white.no-hover - .ui.pointing.below.label date - | 經程序委員會排入全院院會三讀議程 - .ui.state.white: i.icon.check - - .summary - .ui.vertical.menu.right.floated + .links.ui.vertical.menu.right.floated .item(ng-show="bill_ref") h4 提案編號 {{ bill_ref }} .item.center.right#qrlink @@ -93,7 +44,7 @@ .item a(ng-href="",target="_blank") | 民法親屬編、繼承編部分條文修正草案 - p {{abstract}} + p.description {{abstract}} .role .committee(ng-show="committee") diff --git a/app/styles/10_bill.sass b/app/styles/10_bill.sass index d3b2322..7dab0f0 100644 --- a/app/styles/10_bill.sass +++ b/app/styles/10_bill.sass @@ -4,6 +4,7 @@ @import "compass/css3/transform" @import "compass/css3/transition" @import "compass/css3/border-radius" +@import "compass/css3/box-sizing" @media print .hide-print @@ -19,7 +20,7 @@ .bill width: 100% - font-family: "Songti TC", "Biaodian Sans", "Helvetica Neue", Helvetica, Arial, "Han Heiti", sans-serif + #qrlink display: none @@ -27,18 +28,16 @@ text-decoration: none display: inline-block - h1.bill,h2 - padding: 0 - margin: 1em 0 - height: auto - width: 100% + h1, h2 + padding: 1rem 0 + margin: 1em 0 0 0 + font-size: 1.7rem .ui.label.light.gray background-color: #eee color: #666 .bill-progress - padding: 1rem 0 0 0 .ui.label.light.gray background-color: #eee @@ -53,14 +52,38 @@ cursor: auto .ui.steps - margin: 1rem 0 .ui.step .ui.pointing.below.label top: -2rem .step - padding-left: 3em + display: inline-block + position: relative + min-height: 3rem + text-align: center + vertical-align: middle + padding: 0.3rem 0 0 1rem +border-radius(0) + line-height: 1.2em + +box-sizing(border-box) + + .step-description, + .substep-description, + .date + margin: 0 + padding: 0 + position: relative + z-index: 10 + .step-description + font-size: large + font-weight: bold + .substep-description + font-weight: bold + + &.small + margin: 1rem 0 + .step + min-height: 2.5rem &.common @@ -90,16 +113,8 @@ @mixin ui-step-color($n, $b, $c, $s, $h) .ui.step.#{$n}, .ui.steps .step.#{$n} - display: inline-block - position: relative - padding: 1em 2em 1em 3em - vertical-align: top background-color: $b color: $c - -webkit-box-sizing: border-box - -moz-box-sizing: border-box - -ms-box-sizing: border-box - box-sizing: border-box .ui.step.#{$n}:hover, .ui.step.#{$n}.hover @@ -153,6 +168,7 @@ .ui.step.not-implemented opacity: 0.5 + .ui.state i margin: 0 @@ -204,6 +220,14 @@ border-color: #5c6166 color: #fff + .summary + .links.ui.right.floated.menu + margin-left: 2rem + margin-bottom: 1rem + .description + font-size: larger + line-height: 1.5em + .role .item float: left @@ -320,12 +344,11 @@ div.item white-space: normal -@media (max-width: 1024px) - .bill .bill-progress .common.ui.seven.steps - width: 800px - display: block +@media (max-width: 640px) + .bill .bill-progress .common.ui.seven.steps, + .bill .bill-progress .ui.small.steps width: 100% - text-align: center + display: block .stage:first-child .step:first-child border-radius: 0 .ui.step @@ -344,4 +367,7 @@ div.item left: 50% box-shadow: 1px -1px 0px 0px white inset .ui.state - margin-left: -50px + margin-left: -2.5rem + .bill .bill-progress .ui.small.steps + .ui.step:after + top: 2rem diff --git a/app/styles/10_lawdiff.sass b/app/styles/10_lawdiff.sass index 67c3401..6bcc891 100644 --- a/app/styles/10_lawdiff.sass +++ b/app/styles/10_lawdiff.sass @@ -1,50 +1,5 @@ @import "app/styles/mixins" -.bill - margin-left: 10% - h1 - margin: 1em - text-overflow: ellipsis - +word-break-sane - overflow: hidden - height: 3.1em - width: 80% - .role - float: left - clear: left - span.name - padding-left: 12px - ul - list-style: none - &.sponsors, &.committee - margin-left: 3em - width: 25% - li - width: 60px - float: left - &:first-child - width: 180px - clear: both - .avatar - width: 100px - height: 100px - &.committee - .avatar - margin: 8px - span.name - padding-left: 4px - &.cosponsors - li - width: 60px - float: left - .description - font-size: larger - margin: 1em - margin-right: 2em - width: 60% - float: right - position: relative - .related margin: 2em margin-left: 3em