From c76a9f859a9dac130604ef707908cce683f973ea Mon Sep 17 00:00:00 2001
From: luigser <luigser@gmail.com>
Date: Thu, 5 Nov 2015 12:12:46 +0100
Subject: [PATCH] card and controllet updates
---
controllets/create-card-controllet/create-card-controllet.html | 4 ++++
controllets/data-sevc-controllet/data-sevc-controllet.html | 45 ++++++++++++++++++++++-----------------------
controllets/generic-cards-container-controllet/generic-cards-container-controllet.html | 8 ++++++++
controllets/paper-card-controllet/paper-card-controllet.html | 80 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----
4 files changed, 109 insertions(+), 28 deletions(-)
diff --git a/controllets/create-card-controllet/create-card-controllet.html b/controllets/create-card-controllet/create-card-controllet.html
index 853a10e..c2666d5 100755
--- a/controllets/create-card-controllet/create-card-controllet.html
+++ b/controllets/create-card-controllet/create-card-controllet.html
@@ -115,6 +115,10 @@
display: none;
}
+ ::content #card_preview .fullscreen{
+ display: none;
+ }
+
</style>
diff --git a/controllets/data-sevc-controllet/data-sevc-controllet.html b/controllets/data-sevc-controllet/data-sevc-controllet.html
index 2cd90d1..172be38 100755
--- a/controllets/data-sevc-controllet/data-sevc-controllet.html
+++ b/controllets/data-sevc-controllet/data-sevc-controllet.html
@@ -226,29 +226,6 @@ Example:
overflow: auto;
}
- paper-tabs, paper-toolbar
- {
- background-color: var(--paper-blue-500);
- color: #ffffff;
- box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
- }
-
- paper-toolbar paper-tabs
- {
- box-shadow: none;
- --paper-tabs-selection-bar-color : var(--google-gray-500);
- }
-
- paper-tabs[noink][no-bar] paper-tab.iron-selected
- {
- background-color: var(--google-gray-500);
- }
-
- paper-tabs[align-bottom]
- {
- box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.15);
- }
-
#idm_fields_main_container{
position: relative;
height: 60vh;
@@ -282,6 +259,28 @@ Example:
padding : 30px;
}
+ paper-tabs, paper-toolbar
+ {
+ background-color: var(--paper-blue-500);
+ color: #ffffff;
+ box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
+ --paper-tabs-selection-bar-color: var(--google-gray-500);
+ }
+
+ paper-toolbar paper-tabs
+ {
+ box-shadow: none;
+ }
+
+ paper-tabs[noink][no-bar] paper-tab.iron-selected
+ {
+ background-color: var(--google-gray-500);
+ }
+
+ paper-tabs[align-bottom]
+ {
+ box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.15);
+ }
</style>
<iron-ajax
diff --git a/controllets/generic-cards-container-controllet/generic-cards-container-controllet.html b/controllets/generic-cards-container-controllet/generic-cards-container-controllet.html
index 0ecc77e..737eb25 100755
--- a/controllets/generic-cards-container-controllet/generic-cards-container-controllet.html
+++ b/controllets/generic-cards-container-controllet/generic-cards-container-controllet.html
@@ -93,6 +93,14 @@ Example:
float: left;
}
+ ::content .card-grid .fullscreen{
+ display: none;
+ }
+
+ ::content .card-grid .delete{
+ display: none;
+ }
+
</style>
<div id="container" class="layout vertical">
diff --git a/controllets/paper-card-controllet/paper-card-controllet.html b/controllets/paper-card-controllet/paper-card-controllet.html
index fc2f6cb..604d68a 100755
--- a/controllets/paper-card-controllet/paper-card-controllet.html
+++ b/controllets/paper-card-controllet/paper-card-controllet.html
@@ -18,9 +18,6 @@
--paper-fab-background: var(--accent-color);
font-family: 'Roboto', sans-serif;
padding-bottom: 30px;
-
- /*Test*/
-
}
paper-material {
@@ -62,9 +59,11 @@
position:relative;
overflow: auto;
}
+
::content.buttons {
margin-top: 8px;
}
+
::content paper-button, ::content paper-icon-button {
font-weight: 500;
color: var(--accent-color);
@@ -91,6 +90,49 @@
height: 24px;
--paper-fab-background:#cccccc;
}
+
+ .fullscreen{
+ position: absolute;
+ top: 36px;
+ right: 54px;
+ --iron-icon-height: 18px;
+ --iron-icon-width: 18px;
+ width: 24px;
+ height: 24px;
+ --paper-fab-background:#cccccc;
+ }
+
+ #fullscreen_container{
+ position: fixed;
+ width: 80%;
+ height: 75%;
+ right: 0;
+ left: 0;
+ top: 5%;
+ margin-right: auto;
+ margin-left: auto;
+ z-index: 1000;
+ display: none;
+ padding: 20px;
+ }
+
+ .close_fullscreen{
+ position: absolute;
+ top: 5px;
+ right: 1vw;
+ --iron-icon-height: 18px;
+ --iron-icon-width: 18px;
+ width: 24px;
+ height: 24px;
+ --paper-fab-background:#cccccc;
+ }
+
+ #fullscreen_content{
+ position: relative;
+ height: 100%;
+ width: 100%;
+ }
+
</style>
@@ -107,6 +149,9 @@
<div class="legend horizontal layout center">
<span>{{cardTitle}}</span>
+
+ <paper-fab class="fullscreen" mini icon="fullscreen" on-click="_handleFullscreenClick"></paper-fab>
+
<!-- Adding icon based on card type -->
<template is="dom-if" if="{{checkType(cardType, 'text')}}">
@@ -143,6 +188,11 @@
</template>
</div>
+ <paper-material elevation="4" id="fullscreen_container">
+ <paper-fab class="close_fullscreen" mini icon="close" on-click="_handleCloseFullscreenClick"></paper-fab>
+ <div id="fullscreen_content"></div>
+ </paper-material>
+
</div>
</paper-material>
@@ -209,8 +259,28 @@
},
_handleDeleteClick: function(e){
- this.fire('paper-card-controllet_delete-clicked', {data : this});
- }
+ this.fire('paper-card-controllet_delete-clicked', {data : this});
+ },
+
+ _handleFullscreenClick: function(e){
+
+ switch(this.cardType){
+ case 'text':
+ this.$.fullscreen_content.style.backgroundColor = "#ffc";
+ break;
+ case 'link':
+ window.open(this.getAttribute('card-link'),'_blank');
+ return;
+ }
+
+ this.$.fullscreen_container.style.display = "inline-block";
+ this.$.fullscreen_content.innerHTML = this.$.content.innerHTML;
+ },
+
+ _handleCloseFullscreenClick: function(e){
+
+ this.$.fullscreen_container.style.display = "none";
+ }
})
</script>
--
libgit2 0.21.4