Browse the code

 

Differences between 600 and 601 on /.
Number of edited files: 5 (0 added, 0 deleted and 5 modified)
Revision 601

About 3 months and 29 days ago.

* Started to develop the smartphone/screen-less-than-800px-wide CSS
Added file(s) Deleted file(s) Modified file(s)

 

Old New Code
51
51

                                        
52
52
<p class="spacer">&nbsp;</p>
53
53

                                        
54
 
<div class="content_left">
55
 
  <h2><?=i18n('Projects news');?></h2>
56
 

                                    
57
 
  <div class="table_view">
58
 
    <?php foreach($news as $new): ?>
59
 
      <div class="table_line">
60
 
        <a href="<?=$new['project'];?>" title="<?=$new['title'];?>"><img src="<?=$new['logourl'];?>" alt="<?=$new['title'];?>" /></a>
61
 
        <h3><a href="<?=$new['link'];?>"><?=$new['news'];?></a></h3>
62
 
        <span class="text_minus"><?=$new['infos_a'];?> - <span title="<?=$new['infos_date'];?>"><?=$new['infos_b'];?></span></span>
63
 
      </div>
64
 
    <?php endforeach; ?>
 
54
<h2><?=i18n('A few statistics');?></h2>
 
55
<div class="grid">
 
56
  <div class="left_column">
 
57
    <div class="cell cell1" style="background-image: url('public/images/icons/homepage_grid_projects.png');"><?=i18n('%(val)s registered projects', array('val' => '<strong>'.$stats_projects.'</strong>'));?></div>
 
58
    <div class="cell cell3" style="background-image: url('public/images/icons/homepage_grid_bugs.png');"><?=i18n('%(val)s tasks reported', array('val' => '<strong>'.$stats_bugs.'</strong>'));?></div>
 
59
    <div class="cell cell5" style="background-image: url('public/images/icons/homepage_grid_forumtopics.png');"><?=i18n('%(val)s forum topics', array('val' => '<strong>'.$stats_forum.'</strong>'));?></div>
65
60
  </div>
66
 

                                    
 
61
  <div class="right_column">
 
62
    <div class="cell cell2" style="background-image: url('public/images/icons/homepage_grid_users.png');"><?=i18n('%(val)s registered users', array('val' => '<strong>'.$stats_users.'</strong>'));?></div>
 
63
    <div class="cell cell4" style="background-image: url('public/images/icons/homepage_grid_commits.png');"><?=i18n('%(val)s commits stored', array('val' => '<strong>'.$stats_ci.'</strong>'));?></div>
 
64
    <div class="cell cell6" style="background-image: url('public/images/icons/homepage_grid_doc.png');"><?=i18n('%(val)s documentation pages', array('val' => '<strong>'.$stats_doc.'</strong>'));?></div>
67
65
  </div>
68
 
  <div class="content_right">
69
 

                                    
70
 
  <h2><?=i18n('A few statistics');?></h2>
71
 
  <div class="grid">
72
 
    <div class="left_column">
73
 
      <div class="cell cell1" style="background-image: url('public/images/icons/homepage_grid_projects.png');"><?=i18n('%(val)s registered projects', array('val' => '<strong>'.$stats_projects.'</strong>'));?></div>
74
 
      <div class="cell cell3" style="background-image: url('public/images/icons/homepage_grid_bugs.png');"><?=i18n('%(val)s tasks reported', array('val' => '<strong>'.$stats_bugs.'</strong>'));?></div>
75
 
      <div class="cell cell5" style="background-image: url('public/images/icons/homepage_grid_forumtopics.png');"><?=i18n('%(val)s forum topics', array('val' => '<strong>'.$stats_forum.'</strong>'));?></div>
76
 
          </div>
77
 
    <div class="right_column">
78
 
      <div class="cell cell2" style="background-image: url('public/images/icons/homepage_grid_users.png');"><?=i18n('%(val)s registered users', array('val' => '<strong>'.$stats_users.'</strong>'));?></div>
79
 
      <div class="cell cell4" style="background-image: url('public/images/icons/homepage_grid_commits.png');"><?=i18n('%(val)s commits stored', array('val' => '<strong>'.$stats_ci.'</strong>'));?></div>
80
 
      <div class="cell cell6" style="background-image: url('public/images/icons/homepage_grid_doc.png');"><?=i18n('%(val)s documentation pages', array('val' => '<strong>'.$stats_doc.'</strong>'));?></div>
81
 
    </div>
82
 
  </div>
83
 

                                    
84
66
</div>
85
 

                                    
86
 
<p class="spacer">&nbsp;</p>
87
67

                                        

 

Old New Code
7
7
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
8
8
    <link href="{tpl:cssdir}screen.css" rel="stylesheet" type="text/css" media="all" />
9
9
    <link href="{tpl:cssdir}print.css" rel="stylesheet" type="text/css" media="print" />
10
 
    <meta name="viewport" content="width=1200px; initial-scale=0.30;" />
11
 
    <link href="{tpl:cssdir}mobile.css" rel="stylesheet" type="text/css" media="(max-width: 640px)" />
 
10
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
 
11
    <link href="{tpl:cssdir}mobile.css" rel="stylesheet" type="text/css" media="(max-width: 800px)" />
12
12
    <link href="{tpl:logosimages}ct_cube.ico" rel="shortcut icon" />
13
13
  </head>
14
14
  <body>
15
15

                                        

 

Old New Code
 
1
div#globalmenu {
 
2
  display: none;
 
3
}
 
4

                                    
 
5
#header_page form, #header_page ul#buttons {
 
6
  display: none;
 
7
}
 
8

                                    
 
9
#content {
 
10
  margin-left: 0%;
 
11
}
0
12

                                        

 

Old New Code
193
193
  padding-top: 7px;
194
194
}
195
195

                                        
196
 
@media (max-width: 640px) {
197
 
  #header_page form, #header_page ul#buttons {
198
 
    display: none;
199
 
  }
200
 
}
201
196

                                        
202
 

                                    
203
197
/* HEADER SEARCH BAR */
204
198
#header_page form {
205
199
  float: right;
206
200

                                        

 

Old New Code
1
 
/* CONTENT ORGANIZATION */
 
1
/* CONTENT ORGANIZATION
2
2
div.content_left {
3
3
  width: 49%;
4
4
  float: left;
18
18
div.content_right {
19
19
  width: 49%;
20
20
  margin-left: 51%;
21
 
}
 
21
}*/
22
22

                                        
23
23

                                        
24
24
/* MULTICOLORED GRIDS */
25
25
div.grid {
26
 
  margin: 10px;
 
26
  margin: 10px 0px 10px 0px;
27
27
  position: relative;
28
28
}
29
29

                                        
50
50
}
51
51

                                        
52
52
div.cell1 {
53
 
  background-color: {color_700};
 
53
  background-color: {color_800};
54
54
}
55
55

                                        
56
56
div.cell2 {
57
 
  background-color: {color_800};
 
57
  background-color: {color_600};
58
58
}
59
59

                                        
60
60
div.cell3 {
61
 
  background-color: {color_600};
 
61
  background-color: {color_700};
62
62
}
63
63

                                        
64
64
div.cell4 {
65
 
  background-color: {color_700};
 
65
  background-color: {color_800};
66
66
}
67
67

                                        
68
68
div.cell5 {
69
 
  background-color: {color_800};
 
69
  background-color: {color_600};
70
70
}
71
71

                                        
72
72
div.cell6 {
73
 
  background-color: {color_600};
 
73
  background-color: {color_700};
74
74
}
75
75

                                        
 
76
@media (max-width: 800px) {
 
77
  div.grid div.left_column {
 
78
    position: inherit;
 
79
    width: 100%;
 
80
  }
76
81

                                        
 
82
  div.grid div.right_column {
 
83
    margin-left: 0;
 
84
    width: 100%;
 
85
  }
 
86

                                    
 
87
  div.cell1 {
 
88
    background-color: {color_800};
 
89
  }
 
90

                                    
 
91
  div.cell2 {
 
92
    background-color: {color_800};
 
93
  }
 
94

                                    
 
95
  div.cell3 {
 
96
    background-color: {color_700};
 
97
  }
 
98

                                    
 
99
  div.cell4 {
 
100
    background-color: {color_700};
 
101
  }
 
102

                                    
 
103
  div.cell5 {
 
104
    background-color: {color_600};
 
105
  }
 
106

                                    
 
107
  div.cell6 {
 
108
    background-color: {color_600};
 
109
  }
 
110
}
 
111

                                    
 
112

                                    
77
113
/* TABLE LIKE VIEWS */
78
114
div.table_view {
79
115
  margin-top: 10px;
463
499
  margin-right: auto;
464
500
}
465
501

                                        
466
 
@media (max-width: 640px) {
467
 
  div.prettylist_box {
468
 
    width: 100%;
469
 
  }
470
 
}
471
 

                                    
472
502
div.prettylist_box h2 {
473
503
  overflow: hidden;
474
504
  white-space: nowrap;
478
508
ul.prettylist_order {
479
509
  list-style-type: none;
480
510
  list-style-image: none;
481
 
  margin-top: -30px;/*-2.50em*/
 
511
  margin-top: -30px;
482
512
  float: right;
483
513
}
484
514

                                        
526
556
  margin-right: 10px;
527
557
}
528
558

                                        
529
 
@media (max-width: 640px) {
530
 
  li.prettylist_browsing img {
531
 
    /*margin-top: 5px;*/
532
 
  }
533
 
}
534
 

                                    
535
559
div.prettylist_browsing h3 a {
536
560
  font-size: 0.90em;
537
561
  color: {color_800};
541
565
  color: {color_900};
542
566
}
543
567

                                        
544
 
@media (max-width: 640px) {
545
 
  li.prettylist_browsing span.desc {
546
 
    display: none;
547
 
  }
548
 
}
549
 

                                    
550
568
li.prettylist_browsing span.category {
551
569
  float: right;
552
570
  padding-right: 2px;
553
571
  line-height: 14.5px;
554
572
}
555
573

                                        
556
 
@media (max-width: 640px) {
557
 
  li.prettylist_browsing span.category {
558
 
    float: none;
559
 
    display: block;
560
 
  }
561
 
}
562
 

                                    
563
574
li.prettylist_browsing span.date, li.prettylist_browsing span.download {
564
575
  background-repeat: no-repeat;
565
576
  background-position: left center;
568
579
  float: right;
569
580
}
570
581

                                        
571
 
@media (max-width: 640px) {
572
 
  li.prettylist_browsing span.date, li.prettylist_browsing span.download {
573
 
    margin-top: 0;
574
 
  }
575
 
}
576
 

                                    
577
582
li.prettylist_browsing span.download {
578
583
  font-weight: bold;
579
584
  background-image: url('../../../public/images/icons/project-download.png');
583
588
  background-image: url('../../../public/images/icons/project-timeline.png');
584
589
}
585
590

                                        
 
591
@media (max-width: 800px) {
 
592
  ul.prettylist_order {
 
593
    display: none;
 
594
  }
586
595

                                        
 
596
  div.prettylist_box h2 {
 
597
    width: 100%;
 
598
  }
 
599

                                    
 
600
  li.prettylist_browsing span.desc {
 
601
    display: block;
 
602
    margin-top: 20px;
 
603
  }
 
604

                                    
 
605
  li.prettylist_browsing span.category, li.prettylist_browsing span.date, li.prettylist_browsing span.download {
 
606
    display: none;
 
607
  }
 
608

                                    
 
609
}
 
610

                                    
 
611

                                    
587
612
/* PAGINATION STYLING */
588
613
div.pagination_box {
589
614
  width: 80%;
635
660
  display: none;
636
661
}
637
662

                                        
 
663
@media (max-width: 800px) {
 
664
  div.pagination_box {
 
665
    max-width: 300px;
 
666
    overflow: scroll;
 
667
    white-space: nowrap;
 
668
    min-height: 50px;
 
669
    padding-top: 20px;
 
670
  }
 
671
}
638
672

                                        
 
673

                                    
639
674
/* PRIVATE MESSAGES */
640
675
#messages_list {
641
676
  height: 80%;
642
677