Fossil SCM
In the default skin, adjust the labels in the menu bar depending on screen width.
Commit
306f8ffdef2e6063200d12ae62a4137c683606edcf254a6158e6ff876525e839
Parent
c565732f78b0340…
2 files changed
+10
-1
+17
-13
+10
-1
| --- skins/default/css.txt | ||
| +++ skins/default/css.txt | ||
| @@ -206,11 +206,11 @@ | ||
| 206 | 206 | div.submenu label { |
| 207 | 207 | white-space: nowrap; |
| 208 | 208 | } |
| 209 | 209 | |
| 210 | 210 | @media screen and (max-width: 600px) { |
| 211 | - /* Adjustments for mobile */ | |
| 211 | + /* Spacing for mobile */ | |
| 212 | 212 | body { |
| 213 | 213 | padding-left: 4px; |
| 214 | 214 | padding-right: 4px; |
| 215 | 215 | } |
| 216 | 216 | .title { |
| @@ -222,10 +222,13 @@ | ||
| 222 | 222 | padding: 10px 10px; |
| 223 | 223 | } |
| 224 | 224 | .mainmenu { |
| 225 | 225 | padding: 10px; |
| 226 | 226 | } |
| 227 | + .desktoponly { | |
| 228 | + display: none; | |
| 229 | + } | |
| 227 | 230 | } |
| 228 | 231 | @media screen and (min-width: 600px) { |
| 229 | 232 | /* Spacing for desktop */ |
| 230 | 233 | body { |
| 231 | 234 | padding-left: 20px; |
| @@ -240,6 +243,12 @@ | ||
| 240 | 243 | padding: 10px 20px; |
| 241 | 244 | } |
| 242 | 245 | .mainmenu { |
| 243 | 246 | padding: 10px; |
| 244 | 247 | } |
| 248 | +} | |
| 249 | +@media screen and (max-width: 950px) { | |
| 250 | + /* Special declarations for narrow desktop or wide mobile */ | |
| 251 | + .wideonly { | |
| 252 | + display: none; | |
| 253 | + } | |
| 245 | 254 | } |
| 246 | 255 |
| --- skins/default/css.txt | |
| +++ skins/default/css.txt | |
| @@ -206,11 +206,11 @@ | |
| 206 | div.submenu label { |
| 207 | white-space: nowrap; |
| 208 | } |
| 209 | |
| 210 | @media screen and (max-width: 600px) { |
| 211 | /* Adjustments for mobile */ |
| 212 | body { |
| 213 | padding-left: 4px; |
| 214 | padding-right: 4px; |
| 215 | } |
| 216 | .title { |
| @@ -222,10 +222,13 @@ | |
| 222 | padding: 10px 10px; |
| 223 | } |
| 224 | .mainmenu { |
| 225 | padding: 10px; |
| 226 | } |
| 227 | } |
| 228 | @media screen and (min-width: 600px) { |
| 229 | /* Spacing for desktop */ |
| 230 | body { |
| 231 | padding-left: 20px; |
| @@ -240,6 +243,12 @@ | |
| 240 | padding: 10px 20px; |
| 241 | } |
| 242 | .mainmenu { |
| 243 | padding: 10px; |
| 244 | } |
| 245 | } |
| 246 |
| --- skins/default/css.txt | |
| +++ skins/default/css.txt | |
| @@ -206,11 +206,11 @@ | |
| 206 | div.submenu label { |
| 207 | white-space: nowrap; |
| 208 | } |
| 209 | |
| 210 | @media screen and (max-width: 600px) { |
| 211 | /* Spacing for mobile */ |
| 212 | body { |
| 213 | padding-left: 4px; |
| 214 | padding-right: 4px; |
| 215 | } |
| 216 | .title { |
| @@ -222,10 +222,13 @@ | |
| 222 | padding: 10px 10px; |
| 223 | } |
| 224 | .mainmenu { |
| 225 | padding: 10px; |
| 226 | } |
| 227 | .desktoponly { |
| 228 | display: none; |
| 229 | } |
| 230 | } |
| 231 | @media screen and (min-width: 600px) { |
| 232 | /* Spacing for desktop */ |
| 233 | body { |
| 234 | padding-left: 20px; |
| @@ -240,6 +243,12 @@ | |
| 243 | padding: 10px 20px; |
| 244 | } |
| 245 | .mainmenu { |
| 246 | padding: 10px; |
| 247 | } |
| 248 | } |
| 249 | @media screen and (max-width: 950px) { |
| 250 | /* Special declarations for narrow desktop or wide mobile */ |
| 251 | .wideonly { |
| 252 | display: none; |
| 253 | } |
| 254 | } |
| 255 |
+17
-13
| --- skins/default/header.txt | ||
| +++ skins/default/header.txt | ||
| @@ -8,40 +8,44 @@ | ||
| 8 | 8 | } |
| 9 | 9 | </th1></div> |
| 10 | 10 | </div> |
| 11 | 11 | <div class="mainmenu"> |
| 12 | 12 | <th1> |
| 13 | -proc menulink {url name} { | |
| 13 | +proc menulink {url name cls} { | |
| 14 | 14 | upvar current_page current |
| 15 | 15 | upvar home home |
| 16 | 16 | if {[string range $url 0 [string length $current]] eq "/$current"} { |
| 17 | - html "<a href='$home$url' class='active'>$name</a>\n" | |
| 17 | + html "<a href='$home$url' class='active $cls'>$name</a>\n" | |
| 18 | 18 | } else { |
| 19 | - html "<a href='$home$url'>$name</a>\n" | |
| 19 | + html "<a href='$home$url' class='$cls'>$name</a>\n" | |
| 20 | 20 | } |
| 21 | 21 | } |
| 22 | -menulink $index_page Home | |
| 22 | +menulink $index_page Home {} | |
| 23 | 23 | if {[anycap jor]} { |
| 24 | - menulink /timeline Timeline | |
| 24 | + menulink /timeline Timeline {} | |
| 25 | 25 | } |
| 26 | 26 | if {[hascap oh]} { |
| 27 | - menulink /dir?ci=tip Files | |
| 27 | + menulink /dir?ci=tip Files desktoponly | |
| 28 | 28 | } |
| 29 | 29 | if {[hascap o]} { |
| 30 | - menulink /brlist Branches | |
| 31 | - menulink /taglist Tags | |
| 30 | + menulink /brlist Branches desktoponly | |
| 31 | + menulink /taglist Tags wideonly | |
| 32 | 32 | } |
| 33 | 33 | if {[anycap 23456] || [anoncap 2] || [anoncap 3]} { |
| 34 | - menulink /forum Forum | |
| 34 | + menulink /forum Forum wideonly | |
| 35 | 35 | } |
| 36 | 36 | if {[hascap r]} { |
| 37 | - menulink /ticket Tickets | |
| 37 | + menulink /ticket Tickets wideonly | |
| 38 | 38 | } |
| 39 | 39 | if {[hascap j]} { |
| 40 | - menulink /wiki Wiki | |
| 40 | + menulink /wiki Wiki wideonly | |
| 41 | 41 | } |
| 42 | 42 | if {[hascap s]} { |
| 43 | - menulink /setup Admin | |
| 43 | + menulink /setup Admin {} | |
| 44 | + menulink /sitemap More... wideonly | |
| 44 | 45 | } elseif {[hascap a]} { |
| 45 | - menulink /setup_ulist Users | |
| 46 | + menulink /setup_ulist Users {} | |
| 47 | + menulink /sitemap More... {} | |
| 48 | +} else { | |
| 49 | + menulink /sitemap More... {} | |
| 46 | 50 | } |
| 47 | 51 | </th1></div> |
| 48 | 52 |
| --- skins/default/header.txt | |
| +++ skins/default/header.txt | |
| @@ -8,40 +8,44 @@ | |
| 8 | } |
| 9 | </th1></div> |
| 10 | </div> |
| 11 | <div class="mainmenu"> |
| 12 | <th1> |
| 13 | proc menulink {url name} { |
| 14 | upvar current_page current |
| 15 | upvar home home |
| 16 | if {[string range $url 0 [string length $current]] eq "/$current"} { |
| 17 | html "<a href='$home$url' class='active'>$name</a>\n" |
| 18 | } else { |
| 19 | html "<a href='$home$url'>$name</a>\n" |
| 20 | } |
| 21 | } |
| 22 | menulink $index_page Home |
| 23 | if {[anycap jor]} { |
| 24 | menulink /timeline Timeline |
| 25 | } |
| 26 | if {[hascap oh]} { |
| 27 | menulink /dir?ci=tip Files |
| 28 | } |
| 29 | if {[hascap o]} { |
| 30 | menulink /brlist Branches |
| 31 | menulink /taglist Tags |
| 32 | } |
| 33 | if {[anycap 23456] || [anoncap 2] || [anoncap 3]} { |
| 34 | menulink /forum Forum |
| 35 | } |
| 36 | if {[hascap r]} { |
| 37 | menulink /ticket Tickets |
| 38 | } |
| 39 | if {[hascap j]} { |
| 40 | menulink /wiki Wiki |
| 41 | } |
| 42 | if {[hascap s]} { |
| 43 | menulink /setup Admin |
| 44 | } elseif {[hascap a]} { |
| 45 | menulink /setup_ulist Users |
| 46 | } |
| 47 | </th1></div> |
| 48 |
| --- skins/default/header.txt | |
| +++ skins/default/header.txt | |
| @@ -8,40 +8,44 @@ | |
| 8 | } |
| 9 | </th1></div> |
| 10 | </div> |
| 11 | <div class="mainmenu"> |
| 12 | <th1> |
| 13 | proc menulink {url name cls} { |
| 14 | upvar current_page current |
| 15 | upvar home home |
| 16 | if {[string range $url 0 [string length $current]] eq "/$current"} { |
| 17 | html "<a href='$home$url' class='active $cls'>$name</a>\n" |
| 18 | } else { |
| 19 | html "<a href='$home$url' class='$cls'>$name</a>\n" |
| 20 | } |
| 21 | } |
| 22 | menulink $index_page Home {} |
| 23 | if {[anycap jor]} { |
| 24 | menulink /timeline Timeline {} |
| 25 | } |
| 26 | if {[hascap oh]} { |
| 27 | menulink /dir?ci=tip Files desktoponly |
| 28 | } |
| 29 | if {[hascap o]} { |
| 30 | menulink /brlist Branches desktoponly |
| 31 | menulink /taglist Tags wideonly |
| 32 | } |
| 33 | if {[anycap 23456] || [anoncap 2] || [anoncap 3]} { |
| 34 | menulink /forum Forum wideonly |
| 35 | } |
| 36 | if {[hascap r]} { |
| 37 | menulink /ticket Tickets wideonly |
| 38 | } |
| 39 | if {[hascap j]} { |
| 40 | menulink /wiki Wiki wideonly |
| 41 | } |
| 42 | if {[hascap s]} { |
| 43 | menulink /setup Admin {} |
| 44 | menulink /sitemap More... wideonly |
| 45 | } elseif {[hascap a]} { |
| 46 | menulink /setup_ulist Users {} |
| 47 | menulink /sitemap More... {} |
| 48 | } else { |
| 49 | menulink /sitemap More... {} |
| 50 | } |
| 51 | </th1></div> |
| 52 |