btn colorless for colorful background

[leo424y]

207

在彩色背景使用灰色按鈕或許更好？試用gray，灰色。此修改調整：了解更多、政治履歷等按鍵成灰色

[thewayiam]

嗨可以直接截個圖丟上來嗎？謝啦

[leo424y]

抱歉我不會run server起來，原色看起來的衝突感如上 改圖成gray如下

可免除色相衝突問題

[ttcat]

我是建議不要改灰色誒，因為這是 call action 的部分，建議改 #f4f4f4

[ttcat]

然後按鈕改白底灰黑字這樣

[leo424y]

同意 @ttcat 新修正如圖

[ttcat]

感謝啦！(那我是不是可以多丟一些視覺的 issues 上來 XD)

[leo424y]

@ttcat 請快發！鄉民的美感教育靠你惹 XDD

[thewayiam]

需要 build dist 裡的 css 哦，.less 是開發用，建置方法請見 https://github.com/g0v/councilor-voter-guide/tree/master/2018_frontend

[leo424y]

@thewayiam 已 npm i 但請問我如何把less build 成 css 呢？感謝幫忙

[s890081tonyhsu]

@leo424y 剛剛看了一下裡面的readme.md(原來readme.md的排版變形了，可能會造成閱讀困難)

應該是以下這兩者的其中之一，看這邊的用途應該是production

編譯

執行npm run dev

編譯 for production

執行npm run bu

[leo424y]

感謝 @s890081tonyhsu 說明，但 npm run dev / npm run bu 皆能執行server 但不見css變化，有勞協助

[thewayiam]

npm run bu 後應該能在 console 看到以下資訊：

[Browsersync] 27 files changed (about.min.css, all.min.css, ballot.min.css, bill.min.css, bootstrap-theme.min.css, bootstrap.min.css, common.min.css, config.min.css, councilmen.min.css, county-mayer.min.css, county-mayor.min.css, fonts.min.css, func.min.css, gallery.min.css, idnex.min.css, index.min.css, mixin.min.css, pagemanager.min.css, product.min.css, resume-bills.min.css, resume-header.min.css, resume.min.css, rule.min.css, scrollbar.min.css, seemore.min.css, upload.min.css, wish.min.css)
[15:53:16] Finished 'minify-css' after 4.8 s
[15:53:16] Starting 'build'...
[15:53:16] Finished 'build' after 2.97 μs
[15:53:21] Starting 'minify-js'...
[15:53:26] Finished 'minify-js' after 5.08 s

有看到這幾行資訊後，dist/ 裡相關的 css 應該就會看到變更

[leo424y]

以修改less過後之repo npm run bu 有看到 [Browsersync] 27 files changed (about.min.css, all.min.css, ballot.min.css, bill.min.css, bootstrap-theme.min.css, bootstrap.min.css, common.min.css, config.min.css, councilmen.min.css, county-mayer.min.css, county-mayor.min.css, fonts.min.css, func.min.css, gallery.min.css, idnex.min.css, index.min.css, mixin.min.css, pagemanager.min.css, product.min.css, resume-bills.min.css, resume-header.min.css, resume.min.css, rule.min.css, scrollbar.min.css, seemore.min.css, upload.min.css, wish.min.css) 但不見css變更結果如下，請求協助

➜  councilor-voter-guide git:(btn-colorless) ✗ git status
On branch btn-colorless
Your branch is up to date with 'origin/btn-colorless'.

Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)

    modified:   2018_frontend/dist/img/dest/Capture001.png.png
    modified:   2018_frontend/dist/img/dest/arrow.png
    modified:   2018_frontend/dist/img/dest/close.jpg
    modified:   2018_frontend/dist/img/dest/currency.png
    modified:   2018_frontend/dist/img/dest/dollar.png
    modified:   2018_frontend/dist/img/dest/fb.jpg
    modified:   2018_frontend/dist/img/dest/ico.png
    modified:   2018_frontend/dist/img/dest/index-ico1.png
    modified:   2018_frontend/dist/img/dest/index-ico2.png
    modified:   2018_frontend/dist/img/dest/index-logo.png
    modified:   2018_frontend/dist/img/dest/location-ico.png
    modified:   2018_frontend/dist/img/dest/logo-b.png
    modified:   2018_frontend/dist/img/dest/logo.png
    modified:   2018_frontend/dist/img/dest/map.png
    modified:   2018_frontend/dist/img/dest/party.png
    modified:   2018_frontend/dist/img/dest/photo.jpg
    modified:   2018_frontend/dist/img/dest/search.jpg
    modified:   2018_frontend/dist/img/dest/sec2_ico1.png
    modified:   2018_frontend/dist/img/dest/sec2_ico2.png
    modified:   2018_frontend/dist/img/dest/sec3_ico.png
    modified:   2018_frontend/dist/img/dest/sec3_icoa.png
    modified:   2018_frontend/dist/img/dest/sec6_ico.png
    modified:   2018_frontend/dist/img/dest/sec7_ico.png
    modified:   2018_frontend/dist/img/dest/sec7_icoa.png
    modified:   2018_frontend/dist/img/dest/sec7_icob.png
    modified:   2018_frontend/dist/img/dest/sec8_ico.png
    modified:   2018_frontend/dist/img/dest/site-logo.jpg
    modified:   2018_frontend/dist/img/dest/to-ico.jpg
    modified:   2018_frontend/dist/img/dest/tri.png
    modified:   2018_frontend/dist/img/dest/wish-box-bg.png
    modified:   data/avatar/councilors/2018/中國國民黨/臺北市_4_葉林傳.jpg
    modified:   data/avatar/councilors/2018/中國國民黨/雲林縣_4_廖偉晴.jpg

Untracked files:
  (use "git add <file>..." to include in what will be committed)

    2018_frontend/package-lock.json

no changes added to commit (use "git add" and/or "git commit -a")

[leo424y]

更正，上面圖檔變更之來源指令為： npm run dev

與npm run bu 無關

[leo424y]

發現問題了，沒有.gary的class，改用.darkGray 請見 #209