説明

優先度

期限

担当者

サムネイル

サブアイテム

親アイテム

作成日時

名前

<script>
/* 常時レイアウト固定フラグ（後勝ち対策の保険） */
(function(){
  function lock(){ document.documentElement.classList.add('layout-locked'); }
  ['load','pageshow','hashchange','popstate'].forEach(evt=>{
    window.addEventListener(evt,()=>{
      lock();
      setTimeout(lock,0);
      setTimeout(lock,200);
    });
  });
  document.addEventListener('click',(e)=>{
    const a=e.target.closest('a[href^="/"], a[href^="#"]');
    if(a){
      setTimeout(lock,50);
      setTimeout(lock,300);
    }
  });
})();
</script>

<script>
/* ヘッダー要素の固定座標適用（Wraptas/Notion差分に追従） */
(()=>{
  const BRAND_SEL=[
    '.header__logoArea','.header__brand','.siteTitle',
    'header .brand','header .site-name'
  ];
  const NAV_SEL=[
    '.header__btns','header nav','.header nav',
    'header .globalNav','header [role="navigation"]'
  ];
  const SEARCH_SEL=[
    '.header [aria-label*="Search" i]',
    '.header [aria-label*="検索"]',
    '.wraptas-search-btn','.notion-search-button','.notion-search'
  ];
  const HAMBURGER_SEL='.header__menuOpenBtn';

  const cssVar=(name,fb)=>getComputedStyle(document.documentElement)
    .getPropertyValue(name).trim()||fb;

  function applyFixed(){
    const railLeft=cssVar('--rail-left','24px');
    const railTop=cssVar('--rail-top','85px');
    const railWidth=cssVar('--rail-width','240px');
    const gapBrand=cssVar('--brand-gap','36px'); // 参照のみ

    // Brand: fixed (PC / Mobile)
    for(const sel of BRAND_SEL){
      const el=document.querySelector(sel);
      if(!el) continue;
      const isMobile=window.matchMedia('(max-width:1023.98px)').matches;
      if(isMobile){
        el.style.setProperty('position','fixed','important');
        el.style.setProperty('left','16px','important');
        el.style.setProperty('top','12px','important');
        el.style.setProperty('width','auto','important');
        el.style.setProperty('z-index','1000','important');
        el.style.setProperty('margin','0','important');
        el.style.setProperty('padding','0','important');
      }else{
        el.style.setProperty('position','fixed','important');
        el.style.setProperty('left',railLeft,'important');
        el.style.setProperty('top','calc('+railTop+' + 40px)','important');
        el.style.setProperty('width',railWidth,'important');
        el.style.setProperty('z-index','60','important');
        el.style.setProperty('margin','0','important');
        el.style.setProperty('padding','0','important');
      }
      break; // 最初に見つかったブランドを採用
    }

    // Search & Hamburger
    const search=document.querySelector(SEARCH_SEL.join(','));
    const burger=document.querySelector(HAMBURGER_SEL);
    if(search){
      if(window.matchMedia('(max-width:1023.98px)').matches){
        search.style.setProperty('position','fixed','important');
        search.style.setProperty('top','12px','important');
        search.style.setProperty('right','16px','important');
        search.style.setProperty('left','auto','important');
        search.style.setProperty('bottom','auto','important');
        search.style.setProperty('z-index','1001','important');
        search.style.setProperty('display','inline-flex','important');
        search.style.setProperty('visibility','visible','important');
        search.style.setProperty('transform','none','important');

        if(burger){
          burger.style.setProperty('position','fixed','important');
          burger.style.setProperty('top','12px','important');
          burger.style.setProperty('right','56px','important'); // 検索の左
          burger.style.setProperty('left','auto','important');
          burger.style.setProperty('z-index','1000','important');
          burger.style.setProperty('display','inline-flex','important');
        }
      }else{
        search.style.setProperty('position','fixed','important');
        search.style.setProperty('left',railLeft,'important');
        search.style.setProperty('bottom','32px','important');
        search.style.setProperty('top','auto','important');
        search.style.setProperty('right','auto','important');
        search.style.setProperty('z-index','70','important');
        search.style.setProperty('margin','0','important');
      }
    }
  }

  const reapply=()=>{
    applyFixed();
    setTimeout(applyFixed,0);
    setTimeout(applyFixed,120);
    setTimeout(applyFixed,300);
  };

  window.addEventListener('load',reapply);
  window.addEventListener('pageshow',reapply);
  window.addEventListener('hashchange',reapply);
  window.addEventListener('popstate',reapply);

  document.addEventListener('click',(e)=>{
    const a=e.target.closest('a');
    if(!a) return;
    const href=a.getAttribute('href')||'';
    if(href.startsWith('/')||href.startsWith('#')||href.startsWith(location.origin)){
      setTimeout(reapply,50);
      setTimeout(reapply,250);
    }
  });

  new MutationObserver(()=>applyFixed())
    .observe(document.documentElement,{childList:true,subtree:true,attributes:true});

  reapply();
})();
</script>

<script>
/* 画面の空白クリックでハンバーガーメニューを閉じる */
document.addEventListener('click',e=>{
  const menu=document.querySelector('.header__menu');
  const btn=document.querySelector('.header__menuOpenBtn');
  if(!menu||!btn) return;
  if(menu.contains(e.target)||btn.contains(e.target)) return;
  const closeBtn=menu.querySelector('button, .close, .closeBtn');
  if(closeBtn) closeBtn.click();
});
</script>

<script>
(function(){
  if (document.querySelector('.notion-collection')) {
    document.documentElement.classList.add('has-collection');
  }
})();
</script>

<script>
(function(){
  // コレクション系の幅広ページを確実に検出（linked view も拾う）
  var sel = '.notion-collection, .notion-collection_view, .notion-gallery,' +
            ' [class*="linked-collection"], [class*="collection-view"], [data-collection-id]';
  if (document.querySelector(sel)) {
    document.documentElement.classList.add('has-collection');
  }
})();
</script>

<script>
(function(){
  var sel = '.notion-collection, .notion-collection_view, .notion-gallery,' +
            ' [class*="linked-collection"], [class*="collection-view"], [data-collection-id]';
  if (document.querySelector(sel)) {
    document.documentElement.classList.add('has-collection');
  }
})();
</script>

<script>
  (function(){
    var sel = '.notion-collection, .notion-collection_view, .notion-gallery,' +
              ' [class*="linked-collection"], [class*="collection-view"], [data-collection-id]';
    if (document.querySelector(sel)) {
      document.documentElement.classList.add('has-collection');
    }
  })();
</script>


<p style="text-align:center;font-size:8px;">Copyright © Shota Seshimo</p>

1991年、埼玉県生まれ。編集者、ディレクター。NPO法人bootopia代表理事。大正大学非常勤講師。慶應義塾大学環境情報学部卒業。

瀬下翔太

仕事にかんする考え方や方向性など、一緒に仕事をするうえで参考になりそうな情報を掲載しています。


Column

過去の印象的な仕事を掲載しています。更新頻度は控えめ気味。

Works