github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

mvp for using sprites for flags, needs border removing

Browse source
This commit is contained in:
Henry Oswald 2016-07-01 15:04:39 +01:00
parent 7cb266d904
commit 6f4a7f4779
5 changed files with 119 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
services/web/Gruntfile.coffee
View file

@ -17,8 +17,9 @@ module.exports = (grunt) ->
grunt.loadNpmTasks 'grunt-contrib-watch'
grunt.loadNpmTasks 'grunt-parallel'
grunt.loadNpmTasks 'grunt-exec'
# grunt.loadNpmTasks 'grunt-contrib-imagemin'
grunt.loadNpmTasks 'grunt-contrib-cssmin'
# grunt.loadNpmTasks 'grunt-contrib-imagemin'
grunt.loadNpmTasks 'grunt-sprity'
config =
@ -59,6 +60,14 @@ module.exports = (grunt) ->
# interlaced:false
# optimizationLevel: 7
sprity:
sprite:
options:
cssPath:"/img/"
'style': '../../public/stylesheets/app/sprites.less'
src: ['./public/img/flags/24/*.png']
dest: './public/img/sprite',
coffee:

6
services/web/app/views/layout/footer.jade
View file

@ -15,7 +15,7 @@ footer.site-footer
aria-expanded="false",
tooltip="#{translate('language')}"
)
img(src="/img/flags/24/#{currentLngCode}.png")
img(class="icon icon-#{currentLngCode}")
ul.dropdown-menu(role="menu")
li.dropdown-header #{translate("language")}
@ -23,9 +23,9 @@ footer.site-footer
if !subdomainDetails.hide
li.lngOption
a.menu-indent(href=subdomainDetails.url+currentUrl)
img(src="/img/flags/24/#{subdomainDetails.lngCode}.png")
img(class="icon icon-#{subdomainDetails.lngCode}")
| #{translate(subdomainDetails.lngCode)}
//- img(src="/img/flags/24/.png")
each item in nav.left_footer
li
if item.url

BIN
services/web/public/img/sprite.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 KiB

105
services/web/public/stylesheets/app/sprites.less Normal file
View file

@ -0,0 +1,105 @@
.icon {
background-image: url('/img/sprite.png');
}
.icon-ko {
background-position: -0px -0px;
width: 34px;
height: 34px;
}
.icon-cn {
background-position: -0px -34px;
width: 34px;
height: 34px;
}
.icon-da {
background-position: -0px -68px;
width: 34px;
height: 34px;
}
.icon-de {
background-position: -0px -102px;
width: 34px;
height: 34px;
}
.icon-en {
background-position: -0px -136px;
width: 34px;
height: 34px;
}
.icon-es {
background-position: -0px -170px;
width: 34px;
height: 34px;
}
.icon-fi {
background-position: -0px -204px;
width: 34px;
height: 34px;
}
.icon-fr {
background-position: -0px -238px;
width: 34px;
height: 34px;
}
.icon-it {
background-position: -0px -272px;
width: 34px;
height: 34px;
}
.icon-ja {
background-position: -0px -306px;
width: 34px;
height: 34px;
}
.icon-cs {
background-position: -0px -340px;
width: 34px;
height: 34px;
}
.icon-nl {
background-position: -0px -374px;
width: 34px;
height: 34px;
}
.icon-no {
background-position: -0px -408px;
width: 34px;
height: 34px;
}
.icon-pl {
background-position: -0px -442px;
width: 34px;
height: 34px;
}
.icon-pt {
background-position: -0px -476px;
width: 34px;
height: 34px;
}
.icon-ru {
background-position: -0px -510px;
width: 34px;
height: 34px;
}
.icon-sv {
background-position: -0px -544px;
width: 34px;
height: 34px;
}
.icon-tr {
background-position: -0px -578px;
width: 34px;
height: 34px;
}
.icon-uk {
background-position: -0px -612px;
width: 34px;
height: 34px;
}
.icon-zh-CN {
background-position: -0px -646px;
width: 34px;
height: 34px;
}

1
services/web/public/stylesheets/style.less
View file

@ -73,3 +73,4 @@
@import "app/wiki.less";
@import "app/translations.less";
@import "app/contact-us.less";
@import "app/sprites.less";