PC版を作成

しばらく操作を離れると、億劫になってしまう。

しゃーなし。

 

ちょっと修正するだけで、OKな場所からどんどん終わらせていこう。

 

タイトル ------------------------

みたいなのをしたいので、探す。

timing-web.com

色々とあったけど、これがシンプルでわかりやすいな。

 

サイドメニュー固定で手こずる。

サイドメニュー固定したら、サイズが小さくなって違和感がある。

それをなくせるのを探してたらあった

fellowtuts.com

 

理想の動きができている。

だけど、下の方で固定されてしまう。

何度か実験してわかった。

 

スクロールがしたにくると、affixというクラスが付属されるので、affixにtop:●pxと書いたCSSを追加するとOKだった。

うん、これで希望するサイドメニューバーが出来たぞっと。

一回休憩。

 

ううぅーん、またページの読み込みによって固定されたりされなかったりするぞ。。

結局解決できず。がっくり。

 

 

ユーザーエージェント切り分け

blog.toshimaru.net

 

これを使って切り分けてみよう。

アプリケーションコントローラーを修正したら、すぐに出来た。

やったね。

 

SCSSの切り分けまでは、ちょっとよくわからなかった。うむ。

普通にPC用を作成して、PC用で読み込めばよいか。

流用できるところはして。

明日から、またポチポチ始めよー。

今日こそ終わらせる

もうあと少しだからね。

4時間で終わらせたもう。

主に微調整。

 

Jquery

$(function(){

を何回も読み出ししていたのは、回避して競合していたものがスッキリした。

だけど、Select formだけはうーん、修正できない。

 

ひとまず、アコーディオンメニューを追加しよう。

アコーディオンメニューは出来たけど、このままだとCSSもJSも増えてしまう。

これの対応策はちょっと現時点ではわからないな。。

 

これは相談項目の課題にする!

クリアした!GooJob俺。

 

jsfiddle.net

テーブルの折りたたみサンプルを探すのにどのぐらい時間をかけたのやら。

jsfiddle.net

 

なんというか、無理矢理な感じがするが、なんとか進めれた。

開閉できるようになったぞっと。

なかなか良い集中をした。

進んでいるのは少しだけれどもね。

一歩一歩着実に進んできたかな。

朝早くから作業

ここのところ毎朝走ったりしていたが、最近疲れがたまっているのか、すぐに眠くなってしまう。

というわけで、今日は朝から作業をしてみることにしてみよう。

 

あと少しが終わらない。

もうちょっとなんだけど、細かいところがうーむ。という感じ。

もう少しで納得できるものができそうなきもする。

 

ようやく一歩

あれ、こっちのほうが良さそうに見えてきた。

silviomoreto.github.io

 

うん。こっち側はやめよう。

 

文字が長すぎるのをどうにかしたい。

CSSだけで長い文字列を省略。末尾に「…」を付けて表示する方法 | developer's blog

 

これが良さそうなので、これを実装考えて見よう。

うん。これで表示されないものが、ちゃんと表示されるようになった。

ページ戻ると、項目数増えるよ・・・

 

原因がわからん。またはまった。。

色々と試したけど、よーわからん。

ひとまず、キャッシュをクリアしてみよう。

 

うん。キャッシュは関係なさそうだ。

最初から二回読み込みされるし。

これは課題としておこう。わからん。

なんか、うまいこと反映されていない気がする。

なんだこれ。

 

$(document).ready(function() {

が悪さしていることはわかったけど、回避の仕方はわからず。

うん。わからん。

今日はここまでにしておこう。

 

これを導入しよう。

monterail.github.io

 

うむ。うまくいかない。

毎度の事なりけり。

 

jsfiddle.net

これを見て導入したらうまくいった・・・

GitHub - monterail/vue-multiselect: Universal select/multiselect/tagging component for Vue.js

 

stackoverflow.com

do not follow the examples on the official documentation.

って・・・

 

そして、利用するのを辞めました。

さよなら俺の時間。

 

github.com


 

Bootsrap Multiselectを利用することにしてみる。

 

うぉおおおおおおおお!

これは素晴らしい。。。

なんてこった。早めにこれにしておけば・・・

 

ひとまず、オプション設定を色々とみて、実装対応を行おう。

これで、複数選択は大丈夫そうだな。

よしよし。

一度Git にPushしよう。

 

 

今日で終わらせよう・・・

このシリーズはいつまで続くのか。

だが、昨日とは違う俺がいる。昼飯を食べていない状態で作業を開始。

やはり朝作業するのはよいよね。うん。

というわけで、やっていく。もう殆ど終わっている。

と思いたい。

 

Jqueryで二つ使えない。それは諦めた。

プログラムで実装してもらう。

 

よし、1ページ進んだ。

ちょっと気が重たいページを対応しよう。

うーむ、やはりなかなか進まない。

考えながら動くため。

 

複数選択をどうしたらよいのかで、悩む。調べる。止まる。

うーむ。

jQuery Rain | Vue Select | VueJS Select2 Component

 

これが良さそうだけど、うーん。面倒くさいという気持ちが強くなってしまった。

今日は、複数選択のサンプルを見つけよう。

 

明日、Vueを使って複数選択できるようにチャレンジすることにしよう。

今日はここまで。おつかれ様でした。