This is the official Unibo Application Theme based on Foundation for Sites. Unibo Application Theme is suited for the creation and development of application website in University of Bologna network.
Unibo Application Theme inherits all the features, components, mixins, grid systems, and more already present in Foundation 6. It has a Gulp-powered build system with these features:
- Handlebars HTML templates with Panini
- Sass compilation and prefixing
- JavaScript module bundling with webpack
- Built-in BrowserSync server
- For production builds:
- CSS compression
- JavaScript module bundling with webpack
- Image compression
To use this template, your computer needs:
- NodeJS (Version 10 or greater recommended, tested with 10)
- SASS node-sass, © Andrew Nesbitt, license MIT
- Git
To manually set up the template, first download it with Git:
git clone https://github.com/unibo/application_theme.git projectnameThen open the folder in your command line, and install the needed dependencies:
cd projectname
yarnFinally, run yarn start to run Gulp.
Your finished site will be created in a folder called dist, viewable at this URL:
http://localhost:8000/
If you need to create compressed, production-ready assets, run.
yarn run build
Here a brief description for repository structure.
src
├─ assets All static files, scss and javascript files.
├─ img * Images used in Application Unibo Theme.
├─ js * All javascript that are not incorporated via webpack and app.js for configuration.
├─ scss * All scss divided into folders by functionality
└─ webfonts * Used Fonts in Application Unibo Theme.
├─ data
└─ layout List of used template in theme.
├─ default * Default Template for pages created in folder "pages".
├─ styleguide * Template used for styleguide pages.
└─ pages List of all pages.
├─ index * Main page of the theme, to be updated manually, to view the content list.
├─ styleguide * All styleguide pages.
├─ layout * All example pages.
└─ partials All html snippets used in pages.
Is something get wrong or it's not what you expected? Please open an issue in this repository on github. Thank you for contributing!
The components distributed with Unibo Applicatione Theme that have their own license other than CC0 are listed below.
- Foundation 6.6.3 © Zurb Foundation, MIT license.
- Cinzel Google Font © Google, MIT license.
- Font Awesome Free 5.15.3 © License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
- Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/
- What Input is freely available under the MIT License.
- Highlight.js is released under the BSD License
- jQuery © jQuery Foundation, MIT license.
- placeimg.com sample photos from 500px and Flickr, Creative Commons Attribution.
- placeholder.com/ Free Image Placeholder Service C/O https://placeholder.com/ with dimension informations.
- Background photo by artsandcrafts, CC0 License.
- NodeJS (Version 10 or greater recommended, tested with 10)
- SASS node-sass, © Andrew Nesbitt, license MIT
Using this styleguide is very simple and immediate.
Download the starter kit, add <link rel="stylesheet" href="css/app.css"> inside tag <head> and <script src="js/app.js"> at the bottom of page (before end of tag <body>).
Choose a template from our styleguide and start code!
Example can be found in our demo site (italian language).
The license of Unibo Applicatione Theme is BSD 3-Clause and is visible in LICENSE file.
If you use Unibo Applicatione Theme for your projects, the link to this repository must be reported in the software interface exposed to the public.
- Institutional Brand is owned by the University of Bologna and its legal use is permitted under the conditions described at this page Legal Use of the Institutional Brand by third parties
- The DSA Logo (
ssologo36x36.png) is is owned by the University of Bologna - CeSIA - Settore Sistemi e middleware - Ufficio Unità specialistica Identità digitale and its use is permitted only for internal university applications that use DSA directory system.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent