bryce/mediawiki-extensions-UniversalLanguageSelector
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use grid based css design (made css resets local)

Browse Source 
Introduced foundation based grid css
Related changes in example, template html

Change-Id: I8b1c1bae1c733ea0ed997d8317b9954592cf6eca
This commit is contained in:
Santhosh Thottingal
2012-07-18 10:24:34 +05:30
parent 27f9adcc15
commit b1b7c2feb3
14 changed files with 530 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

139
resources/css/ext.uls.css
View File

@@ -3,16 +3,13 @@
background: url('../images/icon-language.png') no-repeat scroll left center transparent;
padding-left: 36px;
}
.uls-menu {
position: fixed;
z-index: 1000;
display: none;
min-width: 600px;
min-height: 500px;
min-width: 715px;
margin-top: 1px;
width: 50%;
width:45%;
/* Styling */
background-color: #ffffff;
border: 1px solid #ccc;
@@ -29,90 +26,126 @@
-moz-background-clip: padding;
background-clip: padding-box;
}
.uls-menu a {
font-weight: normal;
color: #0088CC;
}
.uls-menu-header {
margin: 2%;
margin-top: 20px;
}
.uls-lang-selector {
margin: 2%;
}
.uls-menu-header-left {
float: left;
}
.uls-menu-header-left h1 {
.uls-menu h1 {
font-weight: normal;
padding-top: 12px;
border:none;
border: none;
padding-bottom: 3px;
font-size: 21pt;
padding-left: 15px;
color: #777;
}
.uls-menu-header-right {
float: right;
.uls-menu h3 {
padding-left: 0px;
margin-top: 0px;
margin-bottom: 15px;
}
.uls-worldmap {
/* @embed */
background: url('../images/world_map.png') no-repeat scroll left center transparent;
width: 400px;
height: 197px;
background: url('../images/world_map.png') no-repeat scroll right top transparent;
background-size: 100%;
}
.uls-region {
/* The map doesn't flip */
/* @noflip */
float: left;
cursor: pointer;
width: 133px;
padding: 0;
margin: 0;
height: 197px;
position: relative;
padding: 0px;
margin: 0px;
height: 125px;
border-bottom-color: #777;
border-bottom-style: solid;
border-bottom-width: 3px;
}
.uls-region a {
bottom: 2px;
position: absolute;
bottom: 0;
font-size: 13px;
}
.uls-region:hover {
outline: 1px solid #0E90D2;
/*Cross-browser background transparency*/
background: #3366bb;
background: rgba(51, 102, 187, 0.1);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb)";
border-bottom-color: #3366bb;
border-bottom-style: solid;
}
.regionselector.active {
background: black;
opacity: 0.4;
/*Cross-browser background transparency*/
background: #3366bb;
background: rgba(51, 102, 187, 0.2);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb)";
border-bottom-color: #3366bb;
border-bottom-style: solid;
}
#map-block {
top: 1px;
margin-right: 0;
padding-right: 0px;
float: right;
overflow: hidden;
}
#map-block a {
color: #444;
}
#map-block .active a {
font-weight: bold;
}
.icon-close {
/* @embed */
background: url('../images/close.png') no-repeat scroll left center transparent;
background: url('../images/close.png') no-repeat scroll center center transparent;
float: right;
padding: 10px;
padding: 15px;
cursor: pointer;
}
input#languagefilter {
height: 20px;
border: 1px solid #0E90D2;
width: 95%;
padding-right: 20px;
border: 1px solid #c9c9c9;
-moz-transition: all 0.15s linear 0s;
border-radius: 2px 2px 2px 2px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
color: #777;
display: block;
font-size: 14px;
height: 32px;
padding: 6px;
width: 100%;
text-align: left;
}
input:focus#languagefilter {
border: 1px solid #08C;
}
span.search-button {
#search {
background-color: #f8f8f8;
border-top-color: #777;
border-top-style: solid;
border-top-width: 1px;
padding: 0.8em 0;
}
.search-label {
/* @embed */
background: url('../images/search.png') no-repeat scroll left center transparent;
background: url('../images/search.png') no-repeat scroll right center transparent;
background-size: 30px;
height: 32px;
width: 32px;
display: inline-block;
float: right;
}
span.clear-button {
/* @embed */
background: url('../images/clear.png') no-repeat scroll left center transparent;
cursor: pointer;
height: 22px;
height: 32px;
position: absolute;
width: 20px;
margin-left: -20px;
}
width: 32px;
margin-left: -32px;
}