deefaze / startless
Startless - Less starting bloc for any projects
Installs: 16
Dependents: 0
Suggesters: 0
Security: 0
Stars: 1
Watchers: 2
Forks: 0
Open Issues: 0
Language:Shell
This package is not auto-updated.
Last update: 2024-09-29 23:24:52 UTC
README
Table of content
2.1 Locate main Less file
2.2 Configuration
2.3 Compress CSS / Sourcemap
2.4 LESS Mixins
2.5 CSS Rules
What is StartLess ?
Startless is a Less/Css starting bloc for any Html/CSS web application. Startless include base of css reset, normalization, fonts and colors theme.
What StartLess use ?
Startless use LESS/CSS type files.
Fonts theme base on some of Google Fonts like Roboto, Lato, Ubuntu, Oswald...
1. Installation
1.1 Composer
Run this composer command in your terminal :
composer require deefaze/startless dev-master
1.2 or Download
Go to Deefaze/starless repo, select master branch and click Clone or download > Download ZIP or just Click here.
1.3 View reference page
The test/index.html cannot be called directly from file:/// protocol, launch from your own server.
Starless provide a script for create a PHP Server on 127.0.0.254:80.
Go to Startless root path, open a terminal (CMD on Windows) and run win-php-server.cmd (NB: require a valid PHP > v5.3 installation), this launch automaticaly the index in your browser.
If not, go to http://127.0.0.254:80/test/index.html
Other terminal in your editor ? You can launch CMD into your current terminal (terminalception), run like this :
dev@dev-PC MINGW64 /s/www/startless/ (master) $ cmd /k
next, run win-php-server.cmd from CMD :
Microsoft Windows [version 10] (c) 2017 Microsoft Corporation. All rights reserved. S:\www\startless\win-php-server.cmd
Return to your terminal ? run exit from CMD.
2. Usage @ Dev
2.1 Locate main LESS file
The main file is src/scss/main.less. But this, contain only @import directives. src/scss/Public/ folder is more interesting.
2.2 Configuration
config\ contain Startless config.less, you need to edit this :
// Theme [default, belle, onedark] @theme-selector : 'onedark'; // Font [default, raleway, ubuntu, roboto, laosov (lato, oswald, overpass), ibm] @font-selector : 'ibm';
2.3 Compress CSS / Sourcemap
This is localized into scss/main.less file.
If you use a less compiler who support first line parameter like :
// out: ../css/styles.css, compress: false, sourcemap: false
You just need to set compress or sourcemap to true/false.
2.4 LESS Mixins
components/ contain Less mixins, themes, fonts, no CSS rules here ...
components/themes/ contain all colors themes, you can add yours here.
components/themes.less Startless themes core file.
components/fonts/ contain all fonts configurations, you can add yours here.
components/fonts.less Startless fonts core file.
2.5 CSS Rules
public\ contain all CSS rules. Put yours here. This already contain a
basic reset and normalizer, root (:root{}) variables, document parameters ...
3. Usage @ Production
Compile scss/main.less and use css/styles.css in your project, like :
<head> { ... } <link type="text/css" rel="stylesheet" href="vendor/deefaze/startless/src/css/styles.css"> { ... } </head>
NB : On standard production, startless is not needed, you can deploy CSS in any ways :