Rev 169 | Rev 179 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed
| Rev 169 | Rev 175 | ||
|---|---|---|---|
| Line 104... | Line 104... | ||
| 104 | <?php | 104 | <?php | 
| 105 | Mixins::animation('', 'analysis-offline 3s linear 2.0s infinite'); | 105 | Mixins::animation('', 'analysis-offline 3s linear 2.0s infinite'); | 
| 106 |   ?>
 | 106 |   ?>
 | 
| 107 | }
 | 107 | }
 | 
| 108 | 108 | ||
| 109 | /* FIXME: Does not work, appended at bottom instead  */
 | - | |
| 110 | /* @import url("/styles/lcars-responsive.css"); */
 | - | |
| 111 | - | ||
| 112 | body {
 | 109 | body {
 | 
| 113 | margin-top: 12em; | 110 | margin-top: 12em; | 
| 114 | margin-left: 16.8em; | 111 | margin-left: 16.8em; | 
| 115 | margin-right: 0.2em; | 112 | margin-right: 0.2em; | 
| 116 | margin-bottom: 0.2em; | 113 | margin-bottom: 0.2em; | 
| Line 314... | Line 311... | ||
| 314 | .menu ul { | 311 | .menu ul { | 
| 315 | margin: 0 0.2em 0 0; | 312 | margin: 0 0.2em 0 0; | 
| 316 | padding: 0; | 313 | padding: 0; | 
| 317 | }
 | 314 | }
 | 
| 318 | 315 | ||
| - | 316 | .menu ul:first-child { | |
| - | 317 | padding-top: 1em; | |
| - | 318 | }
 | |
| - | 319 | ||
| 319 | .menu li { | 320 | .menu li { | 
| 320 | margin: 0; | 321 | margin: 0; | 
| 321 | }
 | 322 | }
 | 
| 322 | 323 | ||
| 323 | #bow #bottom | 324 | #bow #bottom | 
| Line 428... | Line 429... | ||
| 428 | {
 | 429 | {
 | 
| 429 | background-color: #fff !important; | 430 | background-color: #fff !important; | 
| 430 | color: #000 !important; | 431 | color: #000 !important; | 
| 431 | }
 | 432 | }
 | 
| 432 | 433 | ||
| - | 434 | .menu bow { | |
| - | 435 | width: 8em; | |
| - | 436 | }
 | |
| - | 437 | ||
| 433 | .menu .button { | 438 | .menu .button { | 
| 434 | display: block; | 439 | display: block; | 
| 435 | width: 8em; | 440 | width: 8em; | 
| 436 | height: 1em; | 441 | height: 1em; | 
| 437 | line-height: 1; | 442 | line-height: 1; | 
| Line 913... | Line 918... | ||
| 913 | font-size: 2.4em; | 918 | font-size: 2.4em; | 
| 914 | text-transform: uppercase; | 919 | text-transform: uppercase; | 
| 915 | line-height: 0.9; | 920 | line-height: 0.9; | 
| 916 | }
 | 921 | }
 | 
| 917 | 922 | ||
| 918 | /* Responsive Web Design (TODO: Move to imported stylesheet; but see above) */
 | - | |
| 919 | - | ||
| 920 | body {
 | - | |
| 921 | <?php | - | |
| 922 | Mixins::transition('', 'margin-left 0.5s 0.5s ease'); | - | |
| 923 |   ?>
 | - | |
| 924 | }
 | - | |
| 925 | - | ||
| 926 | #bow #bottom | - | |
| 927 | {
 | - | |
| 928 | <?php | - | |
| 929 | Mixins::transition('', 'width 0.5s 0.5s ease'); | - | |
| 930 |   ?>
 | - | |
| 931 | }
 | - | |
| 932 | - | ||
| 933 | #bow-bottom { | - | |
| 934 | <?php | - | |
| 935 | Mixins::transition('-property', 'border-bottom-left-radius, border-bottom-right-radius, width'); | - | |
| 936 | Mixins::transition('-delay', '0.5s'); | - | |
| 937 | Mixins::transition('-duration', '0.5s'); | - | |
| 938 | Mixins::transition('-timing-function', 'ease'); | - | |
| 939 |   ?>
 | - | |
| 940 | }
 | - | |
| 941 | - | ||
| 942 | #bow-bottom .concave { | - | |
| 943 | <?php | - | |
| 944 | Mixins::transition('', 'width 0.5s 0.5s ease'); | - | |
| 945 |   ?>
 | - | |
| 946 | }
 | - | |
| 947 | - | ||
| 948 | #connectors .right { | - | |
| 949 | <?php | - | |
| 950 | Mixins::transition('', 'width 0.5s 0.5s ease'); | - | |
| 951 |   ?>
 | - | |
| 952 | }
 | - | |
| 953 | - | ||
| 954 | .multi-display
 | - | |
| 955 | {
 | - | |
| 956 | <?php | - | |
| 957 | Mixins::transition('', 'left 0.5s 0.5s ease'); | - | |
| 958 |   ?>
 | - | |
| 959 | }
 | - | |
| 960 | - | ||
| 961 | .multi-display .lower .bg | - | |
| 962 | {
 | - | |
| 963 | <?php | - | |
| 964 |     /* Wait 1s for bow to become shallower */
 | - | |
| 965 | Mixins::transition('', 'bottom 2.5s 0.5s ease'); | - | |
| 966 |   ?>
 | - | |
| 967 | }
 | - | |
| 968 | - | ||
| 969 | @media all and (min-width: 1024px) and (min-height: 364px) {
 | - | |
| 970 |   body {
 | - | |
| 971 | margin-left: 22em; | - | |
| 972 | <?php | - | |
| 973 | Mixins::transition('', 'margin-left 0.5s 0.5s ease'); | - | |
| 974 |   ?>
 | - | |
| 975 |   }
 | - | |
| 976 | - | ||
| 977 | #bow #bottom | - | |
| 978 |   {
 | - | |
| 979 | width: 20.8em; | - | |
| 980 | <?php | - | |
| 981 |     /* Wait 0.5s for multi-display to be reduced in height */
 | - | |
| 982 | Mixins::transition('', 'width 1.0s 0.5s ease'); | - | |
| 983 |   ?>
 | - | |
| 984 |   }
 | - | |
| 985 | - | ||
| 986 | #bow-bottom { | - | |
| 987 | border-bottom-left-radius: 2.4em; | 923 | <?php require_once 'lcars-responsive.css'; ?> | 
| 988 | border-bottom-right-radius: 2em; | - | |
| 989 | width: 20.6em; | - | |
| 990 | <?php | - | |
| 991 | Mixins::transition('-property', 'border-bottom-left-radius, border-bottom-right-radius, height, width'); | - | |
| 992 | Mixins::transition('-delay', '1.0s'); | - | |
| 993 | Mixins::transition('-duration', '0.5s'); | - | |
| 994 | Mixins::transition('-timing-function', 'ease'); | - | |
| 995 |   ?>
 | - | |
| 996 |   }
 | - | |
| 997 | - | ||
| 998 | #bow-bottom .concave { | - | |
| 999 | width: 7.6em; | - | |
| 1000 | <?php | - | |
| 1001 | Mixins::transition('', 'width 1.0s 0.5s ease'); | - | |
| 1002 |   ?>
 | - | |
| 1003 |   }
 | - | |
| 1004 | - | ||
| 1005 | #connectors .right { | - | |
| 1006 | width: 5em; | - | |
| 1007 | <?php | - | |
| 1008 |       /* Wait 1.0s for multi-display to be moved to right */
 | - | |
| 1009 | Mixins::transition('', 'width 1.0s 0.5s ease'); | - | |
| 1010 |     ?>
 | - | |
| 1011 |   }
 | - | |
| 1012 | - | ||
| 1013 |   .multi-display
 | - | |
| 1014 |   {
 | - | |
| 1015 | left: 15.8em; | - | |
| 1016 | <?php | - | |
| 1017 | Mixins::transition('', 'left 0.5s 0.5s ease'); | - | |
| 1018 |   ?>
 | - | |
| 1019 |   }
 | - | |
| 1020 | - | ||
| 1021 | .multi-display .lower .bg | - | |
| 1022 |   {
 | - | |
| 1023 | bottom: 2.8em; | - | |
| 1024 | <?php | - | |
| 1025 | Mixins::transition('', 'bottom 0.5s 0.5s ease'); | - | |
| 1026 |     ?>
 | - | |
| 1027 |   }  
 | - | |
| 1028 | }
 | - | |
| 1029 | 924 | ||