Subversion Repositories LCARS

Rev

Rev 179 | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
177 PointedEar 1
<?php
2
  /* Responsive Web Design for small viewports; see lcars-responsive.css */
3
  use de\pointedears\css\least\Mixins;
4
?>/* 0.5 to 0.5225s */
5
  #connectors {
6
    opacity: 0;
7
    <?php
8
      Mixins::transition('', 'opacity 0s 0.5s linear');
9
    ?>
10
  }
11
 
12
  #bow-bottom {
13
    bottom: 2.6em;
14
    height: 0em;
15
    opacity: 0;
16
    <?php
17
      Mixins::transition('',
18
          'bottom   0.0225s 0.5s    linear,'
19
        . ' height  0.0225s 0.5s    linear,'
20
        . ' opacity 0s      0.5225s linear');
21
    ?>
22
  }
23
 
24
  #bow #bottom {
25
    visibility: hidden;
26
    <?php
27
      Mixins::transition('',
28
          'visibility 0s      0.5225s linear');
29
    ?>
30
  }
31
 
32
  .menu-container
33
  {
34
    top: 11em;
35
    width: 5em;
36
    bottom: 0;
37
    z-index: 1;
38
    background-color: #fc6;
39
    <?php
40
      Mixins::transition('',
41
          'top               0.5s 0.5s linear,'
42
        . ' width            0.5s 0.5s linear,'
43
        . ' bottom           0.5s 0.5s linear,'
44
        . ' background-color 0s   1s   linear'
45
      );
46
    ?>
47
  }
48
 
49
  .menu {
231 PointedEar 50
    height: 19.6em;
177 PointedEar 51
    <?php
52
      Mixins::transition('', 'height 0.5s 0.5s linear');
53
    ?>
54
  }
55
 
56
  .menu ul:first-child {
57
    padding-top: 0;
58
    <?php
59
      Mixins::transition('', 'padding-top 0.5s 0.5s linear');
60
    ?>
61
  }
62
 
63
  .menu .button
64
  {
65
    width: 5em;
66
    <?php
67
      Mixins::transition('', 'width 0.5s 0.5s linear');
68
    ?>
69
  }
70
 
71
  /* 0.5225s to 0.6475s */
72
  #bow-top-left {
73
    height: 0;
74
    <?php
75
      Mixins::transition('', 'height 0.125s 0.5225s linear');
76
    ?>  
77
  }
78
 
79
  /* at 0.6475s */
80
  #bow-top .text {
81
    opacity: 0;
82
    <?php
83
      Mixins::transition('-property', 'opacity');
84
      Mixins::transition('-delay', '0.6475s');
85
      Mixins::transition('-timing-function', 'linear');
86
    ?>
87
  }
88
 
89
  .empty #bow-top .text {
90
    opacity: 1;
91
  }
92
 
93
  /* 0.6475s to 1.1475s */
94
  #bow-top {
95
    left: 100%;
96
    min-width: auto;
97
    border-top-left-radius: 0;    
98
    border-bottom-left-radius: 0;
99
    border-top-right-radius: 1.2em;
100
    border-bottom-right-radius: 1.2em;
101
    opacity: 0;
102
    <?php
103
      Mixins::transition('',
104
          'left                        0.5s 0.6475s linear,'
105
        . ' min-width                  0s   0.6475s linear,'
106
        . ' border-top-left-radius     0.5s 0.6475s linear,'
107
        . ' border-top-right-radius    0.5s 0.6475s linear,'
108
        . ' border-bottom-right-radius 0.5s 0.6475s linear,'
109
        . ' opacity                    0s   1.1475s linear');
110
    ?>
111
  }
112
 
113
  .empty #bow-top {
114
    left: 0%;
115
    min-width: 10em;
116
    border-top-left-radius: 1.2em;
117
    border-bottom-left-radius: 1.2em;
118
    border-top-right-radius: 1.2em;
119
    border-bottom-right-radius: 1.2em;
120
    opacity: 1;
121
  }
122
 
179 PointedEar 123
  .multi-display,
124
  #content.fixed
177 PointedEar 125
  {
126
    <?php
127
      Mixins::transition('',
128
          'top    0.25s 1.1475s linear,'
129
        . ' left  0.25s 1.3975s linear');      
130
    ?>
131
  }
179 PointedEar 132
 
133
  .multi-display
134
  {
135
    top: 0.2em;
136
    left: 0.2em;
137
  }
138
 
139
  #content.fixed {
140
    left: 6.4em;
141
    top:  9.6em;
142
  }  
177 PointedEar 143
 
144
  .menu .bow
145
  {
146
    background-color: #fc6;
147
    <?php
148
      Mixins::transition('',
149
        'width 0.5s 0.5s linear,'
150
        . 'background-color 0s 1.6475s linear'
151
      );
152
    ?>
153
  }
154
 
155
  .multi-display .lower .bg
156
  {
157
    top: 11em;
158
    <?php
159
      Mixins::transition('', 'top 0.25s 1.1475s linear');
160
    ?>
161
  }
162
 
163
  body {
164
    margin-top: 9.6em;
165
    margin-left: 6.4em;
166
    <?php
167
      Mixins::transition('',
168
          'margin-top   0.25s 1.1475s linear,'
169
        . ' margin-left 0.25s 1.3975s linear');
170
    ?>
171
  }
172
 
173
  .multi-display .upper .content #cmd2,
174
  .multi-display .upper .content #cmd3
175
  {
176
    display: none;
177
  }
178
 
179
  .multi-display .upper .content #cmd1,
180
  .multi-display .upper .content #cmd4
181
  {
182
    right: 0;
183
  }  
184
 
185
  .multi-display .upper .content .analysis
186
  {
187
    right: 5.2em;
188
  }
189
 
190
  .multi-display .upper .content .commands
191
  {
192
    width: 5.2em;
179 PointedEar 193
  }