1
0
mirror of https://github.com/flarum/core.git synced 2025-08-06 16:36:47 +02:00

Major CSS revamp

- Get rid of Bootstrap (except we still rely on some JS)
- Use BEM class names
- Rework variables/theme config
- Fix various bugs, including some on mobile

The CSS is still not ideal – it needs to be cleaned up some more. But
that can be a focus for after beta.
This commit is contained in:
Toby Zerner
2015-07-17 14:47:49 +09:30
parent 0b685b1036
commit 2aa9c2e746
206 changed files with 4337 additions and 8830 deletions

View File

@@ -28,14 +28,18 @@
<script>
var app;
System.import('flarum/app').then(function(module) {
app = module.default;
app.preload = {
data: {!! json_encode($data) !!},
document: {!! json_encode($document) !!},
session: {!! json_encode($session) !!}
};
initLocale(app);
app.boot();
try {
app = module.default;
app.preload = {
data: {!! json_encode($data) !!},
document: {!! json_encode($document) !!},
session: {!! json_encode($session) !!}
};
initLocale(app);
app.boot();
} catch (e) {
document.write('<div class="container">Something went wrong.</div>');
}
});
</script>

View File

@@ -9,8 +9,9 @@
* Flarum's JavaScript client mounts various components into key elements in
* this template. They are distinguished by their ID attributes:
*
* - #page
* - #page-navigation
* - #app
* - #app-navigation
* - #drawer
* - #header
* - #header-navigation
* - #home-link
@@ -23,38 +24,38 @@
* - #composer
*/
?>
<div id="page" class="global-page">
<div id="app" class="App">
<div id="page-navigation"></div>
<div id="app-navigation" class="App-navigation"></div>
<div class="global-drawer">
<div id="drawer" class="App-drawer">
<header id="header" class="global-header">
<div id="header-navigation"></div>
<header id="header" class="App-header">
<div id="header-navigation" class="Header-navigation"></div>
<div class="container">
<h1 class="header-title">
<h1 class="Header-title">
<a href="{{ $forum->attributes->baseUrl }}" id="home-link">
{{ $forum->attributes->title }}
</a>
</h1>
<div id="header-primary" class="header-primary"></div>
<div id="header-secondary" class="header-secondary"></div>
<div id="header-primary" class="Header-primary"></div>
<div id="header-secondary" class="Header-secondary"></div>
</div>
</header>
<footer id="footer" class="global-footer">
<footer id="footer" class="App-footer">
<div class="container">
<div id="footer-primary" class="footer-primary"></div>
<div id="footer-secondary" class="footer-secondary"></div>
<div id="footer-primary" class="Footer-primary"></div>
<div id="footer-secondary" class="Footer-secondary"></div>
</div>
</footer>
</div>
<main class="global-content">
<main class="App-content">
<div id="content"></div>
<div class="composer-container">
<div class="App-composer">
<div class="container">
<div id="composer"></div>
</div>