Last active
December 20, 2015 16:49
-
-
Save kenjikaneko/6164306 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <head> | |
| <meta charset="utf-8"> | |
| <title>Twitter</title> | |
| <link rel="stylesheet" href="./twitter.scss" type="text/css"> | |
| </head> | |
| <body> | |
| <div class="doc"> | |
| <div class="global-nav-inner"> | |
| <h1 class="twitter-icon"> | |
| <img id="twitter-icon" class="icon" src="http://norwinband.net/wordpress/wp-content/uploads/2013/06/twitter-icon-1024x1024.png"> | |
| <span class="visuallyhidden"> | |
| </span> | |
| </h1> | |
| <ul class="global-actions-left"> | |
| <li id="global-nav-home"> | |
| <a href="/" class="js-nav" title="ホーム"><img id="home-icon" class="icon" src="http://iconhoihoi.oops.jp/sozai/icon/01-house/icon_6m_64.png">ホーム</a> | |
| </li> | |
| <li id="connections"> | |
| <a href="/" class="js-nav" title="つながり"><img id="connection-icon" class="icon" src="http://iconhoihoi.oops.jp/sozai/icon/128-notepc/icon_2y_64.png">つながり</a> | |
| </li> | |
| <li class="topics"> | |
| <a href="/" class="js-nav" title="見つける"><img id="topic-icon" class="icon" src="http://iconhoihoi.oops.jp/sozai/icon/97-businessgoods/icon_6m_64.png">見つける</a> | |
| </li> | |
| <li class="account"> | |
| <a href="/" class="js-nav" title="アカウント"><img id="account-icon" class="icon" src="http://iconhoihoi.oops.jp/sozai/icon/97-businessgoods/icon_3g_64.png">アカウント</a> | |
| </li> | |
| </ul> | |
| <ul class="global-actions-right"> | |
| <li id="search"> | |
| <form id="global-nav-search"> | |
| <input class="search-input" type="text" id="search-query"> | |
| </form> | |
| </li> | |
| <li id="edit-profile"> | |
| <img class="icon" src="http://iconhoihoi.oops.jp/sozai/icon/71-tool/icon_4b_64.png"> | |
| </li> | |
| <li id="topbar-tweet-btn"> | |
| <button id="nav-tweet-btn" type="button" title="ツイートする"><img class="icon" src="http://iconhoihoi.oops.jp/sozai/icon/97-businessgoods/icon_5p_64.png"></button> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="page-outer"> | |
| <div class="dashboard"> | |
| <div class="contents-separator"> | |
| <img class="icon" src="https://si0.twimg.com/profile_images/378800000239659691/7a07f318b13da6dbaf20561c361e427c_normal.jpeg"> | |
| <b class="nickname">Kenjieen</b> | |
| </div> | |
| <div class="contents-separator"> | |
| <h3>おすすめユーザー</h3> | |
| <img class="icon" src="https://si0.twimg.com/profile_images/378800000116588091/4617a4f8d6cf5170834c1c9c41251c91_normal.png"> | |
| <b class="nickname">Tatsuo Ikura</b> | |
| </div> | |
| <div class="contents-separator"> | |
| <h3>トレンド</h3> | |
| <a href="./">#京都駅</a> | |
| <a href="./">#バルス</a> | |
| </div> | |
| </div> | |
| <div class="contents-separator timeline"> | |
| <h2 id="content-main-heading" class="timeline-title">ツイート</h2> | |
| <div class="stream home-stream"> | |
| <ol class="stream-items" id="stream-items-id"> | |
| <li class="stream-item"> | |
| <div class="tweet original-tweet"> | |
| <div class="stream-item-header"> | |
| <a class="account-group" href="./"> | |
| <img class="contributer-icon" src="https://si0.twimg.com/profile_images/3634499923/9a19cf31c5ce2e542a16d41c503b7a75_normal.jpeg"> | |
| <strong class="nickname">大石哲之（おおいしてつゆき）</strong> | |
| </a> | |
| </div> | |
| <p class="tweet-body">バルス!!バルス!!バルス!! | |
| <a href="http://gigazine.net/news/20130802-laputa-twitter/" rel="nofollow"> | |
| http://gigazine.net/news/20130802-laputa-twitter/ | |
| </a> | |
| </p> | |
| </div> | |
| </li> | |
| <li class="stream-item"> | |
| <div class="tweet original-tweet"> | |
| <div class="stream-item-header"> | |
| <a class="account-group" href="./"> | |
| <img class="contributer-icon" src="https://si0.twimg.com/profile_images/3440260453/902666189d5b00c9371dd9e03f718e9c_normal.jpeg"> | |
| <strong class="nickname">堀江貴文(Takafumi Horie)</strong> | |
| </a> | |
| </div> | |
| <p class="tweet-body">バルス!!バルス!!バルス!! | |
| <a href="http://gigazine.net/news/20130802-laputa-twitter/" rel="nofollow"> | |
| http://gigazine.net/news/20130802-laputa-twitter/ | |
| </a> | |
| </p> | |
| </div> | |
| </li> | |
| <li class="stream-item"> | |
| <div class="tweet original-tweet"> | |
| <div class="stream-item-header"> | |
| <a class="account-group" href="./"> | |
| <img class="contributer-icon" src="https://si0.twimg.com/profile_images/1088643548/jsdoit01_normal.png"> | |
| <strong class="nickname">jsdo.it</strong> | |
| </a> | |
| </div> | |
| <p class="tweet-body">バルス!!バルス!!バルス!! | |
| <a href="http://gigazine.net/news/20130802-laputa-twitter/" rel="nofollow"> | |
| http://gigazine.net/news/20130802-laputa-twitter/ | |
| </a> | |
| </p> | |
| </div> | |
| </li> | |
| </ol> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </body> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| // --- base.css --- | |
| */ | |
| html, body { | |
| font-family: "Helvetica Neue",Arial,sans-serif; | |
| line-height: 1.4; | |
| } | |
| a { | |
| color: #0066cc; | |
| text-decoration: none; | |
| } | |
| a:hover { | |
| color: #00cccc; | |
| } | |
| a:visited { | |
| color: #ff0000; | |
| } | |
| /* | |
| // --- layout.css --- | |
| */ | |
| .doc { | |
| width: 960px; | |
| } | |
| .global-nav-inner { | |
| width: 960px; | |
| height: 60px; | |
| padding: 1px 0px 2px 30px; | |
| background-color: black; | |
| } | |
| .global-actions-left > * { | |
| display: inline; | |
| float: left; | |
| padding: 1px 3px 2px 3px; | |
| } | |
| .global-actions-right > * { | |
| display: inline; | |
| float: right; | |
| padding: 1px 3px 2px 3px; | |
| } | |
| .page-outer { | |
| width: 960px; | |
| margin: 30px auto; | |
| } | |
| /* | |
| // --- module.css --- | |
| */ | |
| .dashboard { | |
| float: left; | |
| width: 240px; | |
| } | |
| .timeline-title { | |
| padding: 0px 0px 0px 40px; | |
| } | |
| .twitter-icon { | |
| float: left; | |
| padding: 1px 3px 2px 10px; | |
| } | |
| .contents-separator { | |
| border: 1px #BBBBBB solid; | |
| margin: 0px 0px 10px 0px; | |
| padding: 6px 0px 4px 6px; | |
| -webkit-border-radius: 10px; | |
| } | |
| .timeline { | |
| margin-left: 285px; | |
| width: 720px; | |
| /* | |
| border: 1px #BBBBBB solid; | |
| -webkit-border-radius: 10px; | |
| */ | |
| } | |
| .stream.home-stream { | |
| padding: 1px 40px 2px 0px; | |
| } | |
| .stream-items > li { | |
| display: inline; | |
| } | |
| .tweet.original-tweet { | |
| border: 1px #BBBBBB solid; | |
| padding: 4px 0px 4px 4px; | |
| } | |
| /* | |
| .stream-item-header { | |
| padding: 4px 0px 4px 4px; | |
| } | |
| */ | |
| .nickname { | |
| padding: 0px 0px 0px 4px; | |
| } | |
| .visuallyhidden { | |
| display: none; | |
| } | |
| img.icon { | |
| width: 40px; | |
| height: 40px; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment