buildmydist-2/style/common.css

   1 /* === ここからメニューバー === */
   2 header{
   3     /* 横幅を画面いっぱいにする */
   4     width: 100%;
   5
   6     /* 上下の空白 */
   7     padding-top: 0.5%;
   8     padding-bottom: 0.5%;
   9
  10     /* 背景色 */
  11     background-color: var(--black-1);
  12
  13     /* 文字色 */
  14     color: var(--white-1);
  15 }
  16
  17 .bar-item-left, .bar-logo{
  18     text-align: center;
  19     list-style: none;
  20
  21     /* マウスの形状を変える*/
  22     cursor: pointer;
  23
  24     /* 左右に空白を作る */
  25     padding-left: 0.1%;
  26     padding-right: 0.1%;
  27
  28
  29     /* 選択を無効化 */
  30     user-select: none;
  31 }
  32
  33 .bar-item-left > a, .bar-logo > a{
  34     color: var(--main-white);
  35     text-decoration: none;
  36 }
  37
  38 /* クリックされたときの色 */
  39 .bar-item-left:active, .bar-logo:active{
  40     /* 文字色を設定 */
  41     color: var(--red-1);
  42
  43     /* 選択を無効化 */
  44     user-select: none;
  45 }
  46
  47
  48 /* 現在選択されているディストロ */
  49 .currentdistro{
  50     background-color: var(--black-2);
  51 }
  52 /* === ここまでメニューバー === */
  53
  54
  55
  56 /* === ここから本文 === */
  57 main a{
  58     text-decoration: none;
  59     color: blue;
  60 }
  61 /* === ここまで本文 === */
  62
  63
  64
  65 /* === ここから全体 === */
  66 body{
  67     min-height: 100vh;
  68 }
  69 /* === ここまで全体 === */
  70
  71
  72
  73 /* === ここからフッター === */
  74 footer{
  75     color: var(--white-1);
  76     background-color: var(--black-1);
  77     width: 100%;
  78     padding-top: 0.3%;
  79     padding-bottom: 0.3%;
  80
  81     position: fixed;
  82     bottom: 0;
  83 }
  84 #counter > img{
  85     margin-left: auto;
  86 }
  87 /* === ここまでフッター === */
  88
  89
  90 /* === ここから目次 === */
  91 #index li{
  92     list-style: none;
  93
  94 }
  95
  96 #index ul{
  97     padding-left: 10px;
  98 }
  99 #index  a{
 100     text-decoration: none;
 101 }
 102 #index  a:visited{
 103     color: blue;
 104 }
 105 /* === ここまで目次 === */
 106
 107 /* === ここから関連ページ === */
 108 #relation_page a{
 109     text-decoration: none;
 110     color: blue;
 111 }
 112 /* === ここまで関連ページ === */
 113
 114 /* ここから画像 */
 115 main img{
 116     width: 50%;
 117     display: inline-block;
 118     margin-right: auto;
 119 }
 120 /* ここまで画像 */
 121
 122 /* ここから警告 */
 123 .box-warning {
 124     position: relative;
 125     border: 3px double #da4033;
 126     border-radius: 5px;
 127     margin: 20px 0;
 128     padding: 20px 20px 5px 20px;
 129 }
 130 .box-warning::before {
 131     content: "警告";
 132     position: absolute;
 133     background-color: #f4f4f4;
 134     color: #da4033;
 135     font-weight: bold;
 136     left: 20px;
 137     top: -23px;
 138     padding: 10px;
 139 }
 140 /* ここまで警告 */
 141
 142 /* === ここからサイドメニュー === */
 143 #sidemenu-right{
 144     /* 線を描写 */
 145     /* border: solid 1px black; */
 146     box-sizing: border-box;
 147
 148     /* 余白設定 */
 149     padding-left: 1%;
 150     padding-right: 1%;
 151     margin-top: 1%;
 152     /* margin-right: 4%; */
 153     margin-bottom: 1%;
 154
 155 }
 156
 157 /* サイドメニューのスクロールバーを隠す */
 158 #sidemenu-right{
 159     /* IE, Edge 対応 */
 160     -ms-overflow-style: none;
 161     /* Firefox 対応 */
 162     scrollbar-width: none;
 163 }
 164
 165 #sidemenu-right::-webkit-scrollbar {
 166     display:none;
 167 }
 168
 169 #sidemenu-right h2{
 170     text-align: center;
 171 }
 172
 173
 174 #link-collection ul, #relation_page ul{
 175     list-style:none;
 176     padding-left: 10px;
 177 }
 178
 179 #link-collection a{
 180     color: blue;
 181     text-decoration: none;
 182 }
 183
 184
 185 /* === ここまでサイドメニュー === */