Implement masonry

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

4 files changed, 0 insertions, 200 deletions

diff --git a/css/ContactDetails.scss b/css/ContactDetails.scss
deleted file mode 100644
index 6cf09749..00000000
--- a/css/ContactDetails.scss
+++ /dev/null
@@ -1,151 +0,0 @@
-/**
- * @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>
- *
- * @author John Molakvoæ <skjnldsv@protonmail.com>
- *
- * @license GNU AGPL version 3 or any later version
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- *
- */
-
-#contact-details {
-	$grid-column-gap: 20px;
-	$grid-column-width: 350px;
-	flex: 1 1 524px;
-	// header
-	header {
-		display: flex;
-		align-items: center;
-		padding: 50px 0 20px;
-		font-weight: bold;
-
-		// ORG-TITLE-NAME
-		#contact-header-infos {
-			display: flex;
-			flex: 1 1 auto; // shrink avatar before this one
-			flex-direction: column;
-			h2,
-			#details-org-container {
-				display: flex;
-				flex-wrap: wrap;
-				margin: 0;
-			}
-			input {
-				overflow: hidden;
-				flex: 1 1;
-				min-width: 100px;
-				max-width: 100%;
-				margin: 0;
-				padding: 4px 5px;
-				white-space: nowrap;
-				text-overflow: ellipsis;
-				border: none;
-				background: transparent;
-				font-size: inherit;
-				&#contact-fullname {
-					font-weight: bold;
-				}
-			}
-			#contact-org:placeholder-shown {
-				max-width: 20%;
-			}
-		}
-
-		// ACTIONS
-		#contact-header-actions {
-			position: relative;
-			display: flex;
-			.header-menu {
-				margin-right: 10px;
-			}
-			.header-icon {
-				width: 44px;
-				height: 44px;
-				padding: 14px;
-				cursor: pointer;
-				opacity: .7;
-				border-radius: 22px;
-				background-size: 16px;
-				&:hover,
-				&:focus {
-					opacity: 1;
-				}
-				&.header-icon--pulse {
-					width: 16px;
-					height: 16px;
-					margin: 8px;
-				}
-			}
-		}
-	}
-
-	// contact details
-	section.contact-details {
-		display: grid;
-		min-height: 200px;
-		padding: 20px $grid-column-gap;
-		/* unquote is a strange hack to avoid removal of the comma by the scss compiler */
-		grid-template-columns: repeat(auto-fit, minmax(unquote('#{$grid-column-width}'), 1fr));
-		grid-column-gap: $grid-column-gap;
-	}
-
-	// single column fix, better visual
-	@media only screen and (max-width: $navigation-width + $list-min-width + 2 * $grid-column-gap +$grid-column-width) {
-		section.contact-details {
-			padding: 10px;
-
-			grid-template-columns: 1fr;
-			grid-column-gap: 10px;
-		}
-	}
-}
-
-.property--rev {
-	position: absolute;
-	right: 22px;
-	bottom: 0;
-	height: 44px;
-	opacity: .5;
-	color: var(--color-text-lighter);
-	line-height: 44px;
-}
-
-#qrcode-modal {
-	.modal-container {
-		display: flex;
-		padding: 10px;
-		background-color: #fff;
-		.qrcode {
-			max-width: 100%;
-		}
-	}
-}
-
-#pick-addressbook-modal {
-	.modal-container {
-		display: flex;
-		overflow: visible;
-		flex-wrap: wrap;
-		justify-content: space-evenly;
-		margin-bottom: 20px;
-		padding: 10px;
-		background-color: #fff;
-		.multiselect {
-			flex: 1 1 100%;
-			width: 100%;
-			margin-bottom: 20px;
-		}
-	}
-}
diff --git a/css/ContactsList.scss b/css/ContactsList.scss
deleted file mode 100644
index 43e8f17c..00000000
--- a/css/ContactsList.scss
+++ /dev/null
@@ -1,35 +0,0 @@
-/**
- * @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>
- *
- * @author John Molakvoæ <skjnldsv@protonmail.com>
- *
- * @license GNU AGPL version 3 or any later version
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- *
- */
-
-#app-details-toggle {
-	position: fixed;
-	z-index: 1500;
-	left: 0;
-	display: inline-block;
-	width: 44px;
-	height: 44px;
-	cursor: pointer;
-	transform: rotate(180deg);
-	background-color: var(--color-main-background);
-	border-radius: 50%;
-	opacity: 1;
-}
diff --git a/css/Properties/Properties.scss b/css/Properties/Properties.scss
index 5a9aca79..788a3c81 100644
--- a/css/Properties/Properties.scss
+++ b/css/Properties/Properties.scss
@@ -32,7 +32,6 @@ $property-ext-padding-right: 8px;
 	// the max width and keep the right alignment
 	max-width: $property-label-max-width + $property-value-max-width + 44px;
 
-	@include generate-grid-span(1);
 	justify-self: center;
 
 	&--last {
diff --git a/css/contacts.scss b/css/contacts.scss
index 82c96a89..78288b20 100644
--- a/css/contacts.scss
+++ b/css/contacts.scss
@@ -24,19 +24,8 @@
 $grid-height-unit: 40px;
 $grid-input-padding: 7px;
 $grid-input-margin: 3px;
-$grid-column-width: 380px;
 $grid-input-height-with-margin: $grid-height-unit - $grid-input-margin * 2;
 
-@mixin generate-grid-span($default-unit) {
-	// we only supports 10 props of the same type
-	@for $i from 1 through 10 {
-		&.grid-span-#{$i} {
-			// default unit + title + bottom padding
-			grid-row-start: span #{$i * $default-unit};
-		}
-	}
-}
-
 #app-content-wrapper {
 	display: flex;
 }
@@ -46,9 +35,7 @@ $grid-input-height-with-margin: $grid-height-unit - $grid-input-margin * 2;
 @import 'Settings/SettingsAddressbook';
 @import 'Settings/SettingsAddressbookShares';
 @import 'Settings/SettingsAddressbookSharee';
-@import 'ContactDetails';
 @import 'ContactDetailsAvatar';
-@import 'ContactsList';
 @import 'ContactsListItem';
 @import 'Properties/Properties';
 @import 'Properties/PropertyTitle';