diff --git a/app/lib/models/content_layout.dart b/app/lib/models/content_layout.dart
new file mode 100644
index 0000000..4e11242
--- /dev/null
+++ b/app/lib/models/content_layout.dart
@@ -0,0 +1,10 @@
+import 'package:dde_gesture_manager/builder/provider_annotation.dart';
+
+@ProviderModel()
+class ContentLayout {
+  @ProviderModelProp()
+  bool? localManagerOpened;
+
+  @ProviderModelProp()
+  bool? marketOpened;
+}
diff --git a/app/lib/pages/content.dart b/app/lib/pages/content.dart
new file mode 100644
index 0000000..6eb14ac
--- /dev/null
+++ b/app/lib/pages/content.dart
@@ -0,0 +1,33 @@
+import 'package:dde_gesture_manager/extensions.dart';
+import 'package:dde_gesture_manager/pages/gesture_editor.dart';
+import 'package:dde_gesture_manager/pages/local_manager.dart';
+import 'package:dde_gesture_manager/pages/market.dart';
+import 'package:flutter/material.dart';
+import 'package:dde_gesture_manager/models/content_layout.provider.dart';
+
+class Content extends StatefulWidget {
+  const Content({Key? key}) : super(key: key);
+
+  @override
+  _ContentState createState() => _ContentState();
+}
+
+class _ContentState extends State<Content> {
+  @override
+  Widget build(BuildContext context) {
+    return ChangeNotifierProvider(
+      create: (context) => ContentLayoutProvider()
+        ..localManagerOpened = true
+        ..marketOpened = true,
+      builder: (context, child) => Row(
+        mainAxisSize: MainAxisSize.max,
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          LocalManager(),
+          GestureEditor(),
+          Market(),
+        ],
+      ),
+    );
+  }
+}
diff --git a/app/lib/widgets/footer.dart b/app/lib/pages/footer.dart
similarity index 100%
rename from app/lib/widgets/footer.dart
rename to app/lib/pages/footer.dart
diff --git a/app/lib/pages/gesture_editor.dart b/app/lib/pages/gesture_editor.dart
new file mode 100644
index 0000000..ac8691c
--- /dev/null
+++ b/app/lib/pages/gesture_editor.dart
@@ -0,0 +1,15 @@
+import 'package:flutter/material.dart';
+
+class GestureEditor extends StatelessWidget {
+  const GestureEditor({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      color: Colors.black45,
+      child: Column(
+        children: [],
+      ),
+    );
+  }
+}
diff --git a/app/lib/pages/home.dart b/app/lib/pages/home.dart
index d24aa85..f1c3a4a 100644
--- a/app/lib/pages/home.dart
+++ b/app/lib/pages/home.dart
@@ -1,4 +1,5 @@
-import 'package:dde_gesture_manager/widgets/footer.dart';
+import 'package:dde_gesture_manager/pages/content.dart';
+import 'package:dde_gesture_manager/pages/footer.dart';
 import 'package:flutter/material.dart';
 
 class HomePage extends StatefulWidget {
@@ -16,11 +17,8 @@ class _HomePageState extends State<HomePage> {
         mainAxisSize: MainAxisSize.max,
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
         children: [
-          Row(
-            mainAxisSize: MainAxisSize.max,
-            children: [
-              Text('WIP'),
-            ],
+          Flexible(
+            child: Content(),
           ),
           SizedBox(
             height: 36,
diff --git a/app/lib/pages/local_manager.dart b/app/lib/pages/local_manager.dart
new file mode 100644
index 0000000..824162b
--- /dev/null
+++ b/app/lib/pages/local_manager.dart
@@ -0,0 +1,46 @@
+import 'package:dde_gesture_manager/models/content_layout.provider.dart';
+import 'package:flutter/animation.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:dde_gesture_manager/extensions.dart';
+
+class LocalManager extends StatelessWidget {
+  const LocalManager({
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    var isOpen = context.watch<ContentLayoutProvider>().localManagerOpened == true;
+    isOpen.sout();
+    return AnimatedContainer(
+      duration: Duration(milliseconds: 300),
+      curve: Curves.easeInOut,
+      color: context.t.backgroundColor,
+      width: isOpen ? 200 : 36,
+      child: Column(
+        children: [
+          OverflowBox(
+            child: SizedBox(
+              width: 200,
+              child: Row(
+                mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                children: [
+                  Flexible(
+                    child: Text("本地配置"),
+                  ),
+                  IconButton(
+                    onPressed: () => context.read<ContentLayoutProvider>().setProps(localManagerOpened: !isOpen),
+                    icon: Icon(
+                      isOpen ? CupertinoIcons.chevron_left_2 : CupertinoIcons.chevron_right_2,
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/app/lib/pages/market.dart b/app/lib/pages/market.dart
new file mode 100644
index 0000000..11ad12e
--- /dev/null
+++ b/app/lib/pages/market.dart
@@ -0,0 +1,12 @@
+import 'package:flutter/material.dart';
+
+class Market extends StatelessWidget {
+  const Market({
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container();
+  }
+}