Browse Source

Use flewbox for content

Tobias Reich 9 years ago
parent
commit
06fba792b2
6 changed files with 6 additions and 6 deletions
  1. 0 0
      dist/main.css
  2. 0 0
      dist/main.js
  3. 0 0
      dist/view.js
  4. 1 1
      src/scripts/build.js
  5. 3 5
      src/styles/_content.scss
  6. 2 0
      src/styles/_imageview.scss

File diff suppressed because it is too large
+ 0 - 0
dist/main.css


File diff suppressed because it is too large
+ 0 - 0
dist/main.js


File diff suppressed because it is too large
+ 0 - 0
dist/view.js


+ 1 - 1
src/scripts/build.js

@@ -26,7 +26,7 @@ build.divider = function(title) {
 	var html = '';
 
 	html =	`
-			<div class='divider fadeIn'>
+			<div class='divider'>
 				<h1>${ title }</h1>
 			</div>
 			`

+ 3 - 5
src/styles/_content.scss

@@ -4,7 +4,8 @@
 
 #content {
 
-	position: absolute;
+	display: flex;
+	flex-wrap: wrap;
 	padding: 50px 0 33px;
 	width: 100%;
 	min-height: calc(100% - 83px);
@@ -47,7 +48,7 @@
 
 	&.contentZoomOut .divider {
 		animation-name: fadeOut;
-		animation-duration: .3s;
+		animation-duration: .2s;
 		animation-fill-mode: forwards;
 		animation-timing-function: $timing;
 	}
@@ -55,7 +56,6 @@
 	/* Albums and Photos ------------------------------------------------*/
 	.album,
 	.photo {
-		float: left;
 		position: relative;
 		width: 202px;
 		height: 202px;
@@ -181,7 +181,6 @@
 
 	/* Divider ------------------------------------------------*/
 	.divider {
-		float: left;
 		margin: 50px 0 0;
 		padding: 10px 0 0;
 		width: 100%;
@@ -196,7 +195,6 @@
 		}
 
 		h1 {
-			float: left;
 			margin: 0 0 0 30px;
 			color: white(.6);
 			font-size: 14px;

+ 2 - 0
src/styles/_imageview.scss

@@ -6,6 +6,8 @@
 
 	position: fixed;
 	display: none;
+	top: 0;
+	left: 0;
 	width: 100%;
 	height: 100%;
 	background-color: rgba(10, 10, 10, .98);

Some files were not shown because too many files changed in this diff