We use cookies to ensure you get the best experience on our website
Home Explore Help
Sign In
mirror
/
assets
mirror of https://github.com/vladimirok5959/assets.git
2
0
Fork 0
Files Wiki
Browse Source

CP

Volodymyr Tkach 2 years ago
parent
a8a98d0cef
commit
d15d2338c5
2 changed files with 131 additions and 0 deletions
Unified View Show Diff Stats
  1. 65 0
      css/layouts/cp/base.css
  2. 66 0
      css/layouts/cp/example.html

+ 65 - 0
css/layouts/cp/base.css
View File 

@@ -0,0 +1,65 @@
 
+body.cp {
 
+	color: #1e375a;
 
+	height: 100%;
 
+	overflow: hidden;
 
+	position: relative;
 
+	width: 100%;
 
+}
 
+
 
+body.cp header {
 
+	background-color: #1e375a;
 
+	color: #fff;
 
+	height: 56px;
 
+	left: 0;
 
+	position: fixed;
 
+	right: 0;
 
+	top: 0;
 
+	z-index: 3;
 
+}
 
+
 
+body.cp .wrap {
 
+	align-items: stretch;
 
+	display: block;
 
+	height: 100%;
 
+	width: 100%;
 
+}
 
+
 
+body.cp .wrap .sidebar,
 
+body.cp .wrap .content {
 
+	box-shadow: 0 0px 5px rgb(0 0 0 / 30%);
 
+	height: 100%;
 
+	padding-top: 56px;
 
+	position: relative;
 
+	vertical-align: top;
 
+	z-index: 2;
 
+}
 
+
 
+body.cp .wrap .content {
 
+	z-index: 1;
 
+}
 
+
 
+body.cp .wrap .sidebar {
 
+	background: #eee;
 
+	float: left;
 
+	width: 250px;
 
+}
 
+
 
+body.cp .wrap .sidebar.left {
 
+	float: left;
 
+}
 
+
 
+body.cp .wrap .sidebar.right {
 
+	float: right;
 
+}
 
+
 
+body.cp .wrap .sidebar .scroll,
 
+body.cp .wrap .content .scroll {
 
+	height: 100%;
 
+	overflow: hidden;
 
+	overflow-y: auto;
 
+}
 
+
 
+body.cp .wrap .sidebar .scroll .padding,
 
+body.cp .wrap .content .scroll .padding {
 
+	padding: 16px;
 
+}

+ 66 - 0
css/layouts/cp/example.html
View File 

@@ -0,0 +1,66 @@
 
+<!doctype html>
 
+<html lang="uk">
 
+	<head>
 
+		<meta charset="utf-8" />
 
+		<meta name="theme-color" content="#1e375a" />
 
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+		<title>Index</title>
 
+		<link rel="stylesheet" href="./../../reset.css">
 
+		<link rel="stylesheet" href="./base.css">
 
+	</head>
 
+	<body class="cp">
 
+		<header>
 
+			Text
 
+		</header>
 
+		<div class="wrap">
 
+			<div class="sidebar left">
 
+				<div class="scroll">
 
+					<div class="padding">
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+						Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>Sidebar 1<br>
 
+					</div>
 
+				</div>
 
+			</div>
 
+			<div class="sidebar right">
 
+				<div class="scroll">
 
+					<div class="padding">
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+						Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>Sidebar 2<br>
 
+					</div>
 
+				</div>
 
+			</div>
 
+			<div class="content">
 
+				<div class="scroll">
 
+					<div class="padding">
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+						Content<br>Content<br>Content<br>Content<br>Content<br>
 
+					</div>
 
+				</div>
 
+			</div>
 
+		</div>
 
+	</body>
 
+</html>