Ubuntu Software Center

Merge lp:~mpt/software-center/css into lp:software-center

  1. css
  2. Merge into trunk
Proposed by Matthew Paul Thomas
Status: Merged
Merged at revision: not available
Proposed branch: lp:~mpt/software-center/css
Merge into: lp:software-center
Diff against target: None lines
To merge this branch: bzr merge lp:~mpt/software-center/css
Reviewer Review Type Date Requested Status
software-store-developers Pending
Review via email: mp+11478@code.launchpad.net
To post a comment you must log in.
Revision history for this message
Matthew Paul Thomas (mpt) wrote :

Improves the appearance of the lobby screen, including larger icons laid out in a grid.

Improves the layout of the application screen, and makes it match the color scheme of the lobby when in the "Get Free Software" section.

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
=== modified file 'data/templates/AppDetailsView.html'
--- data/templates/AppDetailsView.html 2009-09-09 20:36:44 +0000
+++ data/templates/AppDetailsView.html 2009-09-09 21:11:23 +0000
@@ -35,13 +35,30 @@
35 }35 }
36 </script>36 </script>
3737
38 <style type="text/css">38 <style type="text/css">
39 #appname {font-size:120%;}39 body {margin: 0; padding: 1em 12px;}
40 #description {font-size:80%}40 body.section-get {background-color:#b6bdc4; color: #000;}
41 #icon {width:64px; height:64px; padding:10px; z-index:-1; background: url('file:$iconpath') no-repeat; position:absolute; -webkit-background-size: ${icon_width}px ${icon_height}px;}41 h1 {font-size:100%; font-weight: normal; margin: 0 0 1em;}
42 #screenshot_thumbnail_loading {float:right; padding:10px; width:160px; height:120px; background:#fff url('file:$iconpath_loading') 50% 50% no-repeat;}42 #description {font-size: 80%;}
43 #icon {
44 width:64px;
45 height:64px;
46 z-index:-1;
47 background: url('file:$iconpath') top center no-repeat;
48 position:absolute;
49 -webkit-background-clip: border-box;
50 -webkit-background-origin: border-box;
51 -webkit-background-size: ${icon_width}px ${icon_height}px;
52 }
53 #screenshot_thumbnail_loading {
54 background: url('file:$iconpath_loading') 50% 50% no-repeat;
55 float:right;
56 height:120px;
57 margin: 0 0 1em 1em;
58 width:160px;
59 }
43 #screenshot_thumbnail {visibility:hidden}60 #screenshot_thumbnail {visibility:hidden}
44 #text {float:left; padding-left:64px; width:90%; }61 #text {float:left; padding-left:86px;}
45 #installed_overlay { z-index:999; width:24px; height:24px; background: url('file:${software_installed_icon}'); position:absolute; left:40px; top:40px; visibility:${installed} }62 #installed_overlay { z-index:999; width:24px; height:24px; background: url('file:${software_installed_icon}'); position:absolute; left:40px; top:40px; visibility:${installed} }
46 #package_information { font-size:70%; }63 #package_information { font-size:70%; }
47 #maintainance_time { font-size:70%; }64 #maintainance_time { font-size:70%; }
@@ -54,10 +71,13 @@
54 </head>71 </head>
5572
56<body class="${body_class}">73<body class="${body_class}">
57 <div id="icon"></div>74
58 <div id="installed_overlay"></div>75 <div id="icon">
76 <div id="installed_overlay"></div>
77 </div>
78
59 <div id="text">79 <div id="text">
60 <p id="appname">$appname</p>80 <h1>$appname</h1>
61 <div id='screenshot_thumbnail_loading'>81 <div id='screenshot_thumbnail_loading'>
62 <img id="screenshot_thumbnail" src="http://screenshots.debian.net/thumbnail/$pkgname" alt="Application Screenshot"/>82 <img id="screenshot_thumbnail" src="http://screenshots.debian.net/thumbnail/$pkgname" alt="Application Screenshot"/>
63 </div>83 </div>
6484
=== modified file 'data/templates/CategoriesView.html'
--- data/templates/CategoriesView.html 2009-09-09 20:51:29 +0000
+++ data/templates/CategoriesView.html 2009-09-09 21:19:50 +0000
@@ -34,21 +34,41 @@
34 oT.appendChild(newTr);34 oT.appendChild(newTr);
35 }35 }
36 </script>36 </script>
37 <style type="text/css">37 <style type="text/css">
38 body { background-color:#b6bdc4; font-size:100%; padding:2px 10px; color:#000 }38 body {background-color:#b6bdc4; margin: 0; padding: 1em; color:#000;}
39 #header {font-size:100%; padding:10px; background-color:#7D91AA; border:2px solid #3F4B5A}39 h2 {
40 background-color: #7D91aa;
41 border-style: solid;
42 border-width: 0 0 1px 0;
43 border-color: #E2E7EC #404a57 #404a57 #E2E7EC;
44 color: #fff;
45 font-size: 100%;
46 font-weight: normal;
47 padding: 0.25em 0.5em;
48 margin: 0;
49 text-shadow: #404a57 0 -1px 1px;
50 }
40 /* debug border */51 /* debug border */
41 /* .category_td {border-width:1px;border-style:solid;} */52 /* .category_td {border-width:1px;border-style:solid;} */
42 /* fixed width does not work, it does not ellipsis but overflows the box */53 /* fixed width does not work, it does not ellipsis but overflows the box */
43 /* .category_td {padding:8px; margin:8px; width:6em; display:inline-block; text-overflow: ellipsis;} */54 /* .category_td {padding:8px; margin:8px; width:6em; display:inline-block; text-overflow: ellipsis;} */
44 .category_td {padding:8px; margin:8px; display:inline-block; text-overflow: ellipsis;} 55
45 .category_td:hover { cursor: pointer; opacity:0.65; }56 .category_td {
57 padding: 0 8px;
58 display:inline-block;
59 text-overflow: ellipsis;
60 vertical-align: top;
61 width: 8em !important;
62 }
63 .category_td:hover {cursor: pointer;}
64 .category_td:active {background-color: #7D91aa;}
65
46 .category_td p { font-size:90%; text-align:center; }66 .category_td p { font-size:90%; text-align:center; }
47 </style>67 </style>
48 </head>68 </head>
4969
50<body>70<body>
51 <p id="header">Departments</p>71 <h2>Departments</h2>
52 <table>72 <table>
53 <tr></tr>73 <tr></tr>
54 </table>74 </table>