mirror of
https://github.com/flarum/framework.git
synced 2025-02-10 11:07:47 +08:00
1d6616a419
Mobile responsive design with a very native feel, all in pure CSS (no templating differences between versions — even though some things are in very different positions.) I’ve been working on this whole thing in my head for a while now, planning out how certain components will be laid out on the mobile version, and how to reason about them in the templates so that a substantially different layout can still be achieved by only using CSS. Today I finally wrote the CSS and it’s come together pretty damn perfectly. Still to come: - Swiping left or right on discussions to reveal controls - Tablet version
35 lines
1.2 KiB
Plaintext
35 lines
1.2 KiB
Plaintext
// This files is where our LESS journey begins.
|
|
|
|
// We begin by importing our own configuration variables, which are used all
|
|
// throughout the stylesheets. These pertain to
|
|
// @import "config-default.less";
|
|
@import "config.less";
|
|
|
|
@flarum-base: "flarum/";
|
|
@bootstrap-base: "../../bower_components/bootstrap/less/";
|
|
@font-awesome-base: "../../bower_components/font-awesome/less/";
|
|
|
|
@import "bootstrap/bootstrap.less";
|
|
|
|
// We want to specify the @fa-font-path variable AFTER we import font awesome
|
|
// so that it overrides the default definition.
|
|
@import "@{font-awesome-base}font-awesome.less";
|
|
@fa-font-path: "../font-awesome/fonts";
|
|
|
|
// Finally, with our vendor CSS loaded, we can import Flarum-specific stuff.
|
|
@import "@{flarum-base}components.less";
|
|
@import "@{flarum-base}buttons.less";
|
|
@import "@{flarum-base}dropdowns.less";
|
|
@import "@{flarum-base}avatars.less";
|
|
@import "@{flarum-base}forms.less";
|
|
@import "@{flarum-base}hero.less";
|
|
@import "@{flarum-base}alerts.less";
|
|
@import "@{flarum-base}modals.less";
|
|
@import "@{flarum-base}layout.less";
|
|
@import "@{flarum-base}composer.less";
|
|
|
|
@import "@{flarum-base}index.less";
|
|
@import "@{flarum-base}discussion.less";
|
|
@import "@{flarum-base}login.less";
|
|
@import "@{flarum-base}signup.less";
|