mirror of
https://github.com/documize/community.git
synced 2025-08-02 20:15:26 +02:00
Per space label, icon, description
Labels introduce visual grouping and filtering of spaces.
This commit is contained in:
McMatts
parent
fe8068965c
commit
a211ba051a
106 changed files with 3280 additions and 1008 deletions
|
|
@ -30,7 +30,8 @@
|
|||
.background-color-theme-100 { background-color: $theme-100; }
|
||||
|
||||
@import "reset.scss";
|
||||
@import "icon.scss";
|
||||
@import "icon-ui.scss";
|
||||
@import "icon-meta.scss";
|
||||
@import "mixins.scss";
|
||||
@import "layout/all.scss";
|
||||
@import "util.scss";
|
||||
|
|
|
|||
334
gui/app/styles/core/icon-meta.scss
Normal file
334
gui/app/styles/core/icon-meta.scss
Normal file
|
|
@ -0,0 +1,334 @@
|
|||
@font-face {
|
||||
font-family: 'dmzmeta';
|
||||
src: url('font/dmzmeta.eot');
|
||||
src: url('font/dmzmeta.eot') format('embedded-opentype'), url('font/dmzmeta.woff2') format('woff2'), url('font/dmzmeta.woff') format('woff'), url('font/dmzmeta.ttf') format('truetype'), url('font/dmzmeta.svg') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
/*------------------------
|
||||
base class definition
|
||||
-------------------------*/
|
||||
.dmeta {
|
||||
display: inline-block;
|
||||
font: normal normal normal 1em/1 'dmzmeta';
|
||||
/* speak: none; */
|
||||
text-transform: none;
|
||||
/* Better Font Rendering */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
/*------------------------
|
||||
change icon size
|
||||
-------------------------*/
|
||||
/* relative units */
|
||||
.dmeta-sm {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
.dmeta-lg {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
/* absolute units */
|
||||
.dmeta-16 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.dmeta-32 {
|
||||
font-size: 32px;
|
||||
}
|
||||
/*----------------------------------
|
||||
add a square/circle background
|
||||
-----------------------------------*/
|
||||
.dmeta-bg-square,
|
||||
.dmeta-bg-circle {
|
||||
padding: 0.35em;
|
||||
background-color: #eee;
|
||||
}
|
||||
.dmeta-bg-circle {
|
||||
border-radius: 50%;
|
||||
}
|
||||
/*------------------------------------
|
||||
use icons as list item markers
|
||||
-------------------------------------*/
|
||||
.dmeta-ul {
|
||||
padding-left: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
.dmeta-ul > li {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.dmeta-ul > li > .dmeta {
|
||||
margin-right: 0.4em;
|
||||
line-height: inherit;
|
||||
}
|
||||
/*------------------------
|
||||
spinning icons
|
||||
-------------------------*/
|
||||
.dmeta-is-spinning {
|
||||
-webkit-animation: dmeta-spin 2s infinite linear;
|
||||
-moz-animation: dmeta-spin 2s infinite linear;
|
||||
animation: dmeta-spin 2s infinite linear;
|
||||
}
|
||||
@-webkit-keyframes dmeta-spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes dmeta-spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-moz-transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes dmeta-spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
-moz-transform: rotate(0deg);
|
||||
-ms-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
-o-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
/*------------------------
|
||||
rotated/flipped icons
|
||||
-------------------------*/
|
||||
.dmeta-rotate-90 {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
|
||||
-webkit-transform: rotate(90deg);
|
||||
-moz-transform: rotate(90deg);
|
||||
-ms-transform: rotate(90deg);
|
||||
-o-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
.dmeta-rotate-180 {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
|
||||
-webkit-transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
-ms-transform: rotate(180deg);
|
||||
-o-transform: rotate(180deg);
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.dmeta-rotate-270 {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
|
||||
-webkit-transform: rotate(270deg);
|
||||
-moz-transform: rotate(270deg);
|
||||
-ms-transform: rotate(270deg);
|
||||
-o-transform: rotate(270deg);
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
.dmeta-flip-y {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
|
||||
-webkit-transform: scale(-1, 1);
|
||||
-moz-transform: scale(-1, 1);
|
||||
-ms-transform: scale(-1, 1);
|
||||
-o-transform: scale(-1, 1);
|
||||
transform: scale(-1, 1);
|
||||
}
|
||||
.dmeta-flip-x {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
|
||||
-webkit-transform: scale(1, -1);
|
||||
-moz-transform: scale(1, -1);
|
||||
-ms-transform: scale(1, -1);
|
||||
-o-transform: scale(1, -1);
|
||||
transform: scale(1, -1);
|
||||
}
|
||||
/*------------------------
|
||||
icons
|
||||
-------------------------*/
|
||||
|
||||
.dmeta-meta-checklist::before {
|
||||
content: "\ea02";
|
||||
}
|
||||
|
||||
.dmeta-meta-people::before {
|
||||
content: "\ea03";
|
||||
}
|
||||
|
||||
.dmeta-meta-components::before {
|
||||
content: "\ea06";
|
||||
}
|
||||
|
||||
.dmeta-meta-plan::before {
|
||||
content: "\ea07";
|
||||
}
|
||||
|
||||
.dmeta-meta-world::before {
|
||||
content: "\ea09";
|
||||
}
|
||||
|
||||
.dmeta-meta-devops::before {
|
||||
content: "\ea0a";
|
||||
}
|
||||
|
||||
.dmeta-meta-announce::before {
|
||||
content: "\ea0c";
|
||||
}
|
||||
|
||||
.dmeta-meta-marketing::before {
|
||||
content: "\ea0d";
|
||||
}
|
||||
|
||||
.dmeta-meta-sales::before {
|
||||
content: "\ea0e";
|
||||
}
|
||||
|
||||
.dmeta-meta-time::before {
|
||||
content: "\ea0f";
|
||||
}
|
||||
|
||||
.dmeta-meta-rocket::before {
|
||||
content: "\ea10";
|
||||
}
|
||||
|
||||
.dmeta-meta-smile::before {
|
||||
content: "\ea11";
|
||||
}
|
||||
|
||||
.dmeta-meta-guide::before {
|
||||
content: "\ea12";
|
||||
}
|
||||
|
||||
.dmeta-meta-tune::before {
|
||||
content: "\ea13";
|
||||
}
|
||||
|
||||
.dmeta-meta-security::before {
|
||||
content: "\ea15";
|
||||
}
|
||||
|
||||
.dmeta-meta-money::before {
|
||||
content: "\ea16";
|
||||
}
|
||||
|
||||
.dmeta-meta-roadmap::before {
|
||||
content: "\ea17";
|
||||
}
|
||||
|
||||
.dmeta-meta-winner::before {
|
||||
content: "\ea19";
|
||||
}
|
||||
|
||||
.dmeta-meta-travel::before {
|
||||
content: "\ea1a";
|
||||
}
|
||||
|
||||
.dmeta-meta-incoming::before {
|
||||
content: "\ea1e";
|
||||
}
|
||||
|
||||
.dmeta-meta-outgoing::before {
|
||||
content: "\ea1f";
|
||||
}
|
||||
|
||||
.dmeta-meta-procedure::before {
|
||||
content: "\ea20";
|
||||
}
|
||||
|
||||
.dmeta-meta-todo::before {
|
||||
content: "\ea21";
|
||||
}
|
||||
|
||||
.dmeta-meta-infinite::before {
|
||||
content: "\ea22";
|
||||
}
|
||||
|
||||
.dmeta-meta-home::before {
|
||||
content: "\ea23";
|
||||
}
|
||||
|
||||
.dmeta-meta-org::before {
|
||||
content: "\ea24";
|
||||
}
|
||||
|
||||
.dmeta-meta-partner::before {
|
||||
content: "\ea25";
|
||||
}
|
||||
|
||||
.dmeta-meta-in::before {
|
||||
content: "\ea28";
|
||||
}
|
||||
|
||||
.dmeta-meta-out::before {
|
||||
content: "\ea29";
|
||||
}
|
||||
|
||||
.dmeta-meta-flow::before {
|
||||
content: "\ea2b";
|
||||
}
|
||||
|
||||
.dmeta-meta-manuals::before {
|
||||
content: "\ea32";
|
||||
}
|
||||
|
||||
.dmeta-meta-help::before {
|
||||
content: "\ea35";
|
||||
}
|
||||
|
||||
.dmeta-meta-code::before {
|
||||
content: "\ea36";
|
||||
}
|
||||
|
||||
.dmeta-meta-lab::before {
|
||||
content: "\ea37";
|
||||
}
|
||||
|
||||
.dmeta-meta-finance::before {
|
||||
content: "\ea38";
|
||||
}
|
||||
|
||||
.dmeta-meta-barchart::before {
|
||||
content: "\ea39";
|
||||
}
|
||||
|
||||
.dmeta-meta-piechart::before {
|
||||
content: "\ea3a";
|
||||
}
|
||||
|
||||
.dmeta-meta-metrics::before {
|
||||
content: "\ea3b";
|
||||
}
|
||||
|
||||
.dmeta-meta-bulb::before {
|
||||
content: "\ea3c";
|
||||
}
|
||||
|
||||
.dmeta-meta-design::before {
|
||||
content: "\ea3d";
|
||||
}
|
||||
|
||||
.dmeta-meta-gift::before {
|
||||
content: "\ea3e";
|
||||
}
|
||||
|
||||
.dmeta-meta-box::before {
|
||||
content: "\ea3f";
|
||||
}
|
||||
|
||||
.dmeta-meta-apps::before {
|
||||
content: "\ea40";
|
||||
}
|
||||
|
||||
.dmeta-meta-message::before {
|
||||
content: "\ea41";
|
||||
}
|
||||
|
||||
.dmeta-meta-support::before {
|
||||
content: "\ea42";
|
||||
}
|
||||
|
||||
.dmeta-meta-star::before {
|
||||
content: "\ea43";
|
||||
}
|
||||
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
.dicon {
|
||||
display: inline-block;
|
||||
font: normal normal normal 1em/1 'dmzui';
|
||||
speak: none;
|
||||
// speak: none;
|
||||
text-transform: none;
|
||||
/* Better Font Rendering */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
|
@ -171,18 +171,10 @@ icons
|
|||
content: "\ea04";
|
||||
}
|
||||
|
||||
.dicon-code::before {
|
||||
content: "\ea05";
|
||||
}
|
||||
|
||||
.dicon-attachment::before {
|
||||
content: "\ea06";
|
||||
}
|
||||
|
||||
.dicon-align-justify::before {
|
||||
content: "\ea07";
|
||||
}
|
||||
|
||||
.dicon-pen-2::before {
|
||||
content: "\ea08";
|
||||
}
|
||||
|
|
@ -335,10 +327,6 @@ icons
|
|||
content: "\ea35";
|
||||
}
|
||||
|
||||
.dicon-gallery-view::before {
|
||||
content: "\ea36";
|
||||
}
|
||||
|
||||
.dicon-time::before {
|
||||
content: "\ea37";
|
||||
}
|
||||
|
|
@ -355,18 +343,6 @@ icons
|
|||
content: "\ea3a";
|
||||
}
|
||||
|
||||
.dicon-ctrl-down::before {
|
||||
content: "\ea3d";
|
||||
}
|
||||
|
||||
.dicon-ctrl-left::before {
|
||||
content: "\ea3e";
|
||||
}
|
||||
|
||||
.dicon-ctrl-up::before {
|
||||
content: "\ea3f";
|
||||
}
|
||||
|
||||
.dicon-menu-6::before {
|
||||
content: "\ea40";
|
||||
}
|
||||
|
|
@ -375,22 +351,10 @@ icons
|
|||
content: "\ea41";
|
||||
}
|
||||
|
||||
.dicon-reload::before {
|
||||
content: "\ea42";
|
||||
}
|
||||
|
||||
.dicon-copy::before {
|
||||
content: "\ea43";
|
||||
}
|
||||
|
||||
.dicon-list-numbers::before {
|
||||
content: "\ea45";
|
||||
}
|
||||
|
||||
.dicon-bookmark-2::before {
|
||||
content: "\ea46";
|
||||
}
|
||||
|
||||
.dicon-menu-8::before {
|
||||
content: "\ea48";
|
||||
}
|
||||
|
|
@ -451,10 +415,6 @@ icons
|
|||
content: "\ea56";
|
||||
}
|
||||
|
||||
.dicon-d-check::before {
|
||||
content: "\ea57";
|
||||
}
|
||||
|
||||
.dicon-preview::before {
|
||||
content: "\ea58";
|
||||
}
|
||||
|
|
@ -462,3 +422,7 @@ icons
|
|||
.dicon-link::before {
|
||||
content: "\ea59";
|
||||
}
|
||||
|
||||
.dicon-b-check::before {
|
||||
content: "\ea5a";
|
||||
}
|
||||
|
|
@ -31,24 +31,24 @@ $display-break-5: 1800px;
|
|||
|
||||
// X-axis alignment
|
||||
.grid-cell-left {
|
||||
justify-self: self-end;
|
||||
justify-self: self-start !important;
|
||||
}
|
||||
.grid-cell-right {
|
||||
justify-self: self-end;
|
||||
justify-self: self-end !important;
|
||||
}
|
||||
.grid-cell-center {
|
||||
justify-self: center;
|
||||
justify-self: center !important;
|
||||
}
|
||||
|
||||
// Y-axis alignment
|
||||
.grid-cell-top {
|
||||
align-self: self-start;
|
||||
align-self: self-start !important;
|
||||
}
|
||||
.grid-cell-middle {
|
||||
align-self: center;
|
||||
align-self: center !important;
|
||||
}
|
||||
.grid-cell-bottom {
|
||||
align-self: self-end;
|
||||
align-self: self-end !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
.master-page-heading {
|
||||
font-size: 2rem;
|
||||
font-weight: 700;
|
||||
color: map-get($gray-shades, 900);
|
||||
color: map-get($gray-shades, 800);
|
||||
}
|
||||
|
||||
.master-page-desc {
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
> .image {
|
||||
> .icon, > .meta-icon {
|
||||
align-self: center;
|
||||
margin-right: 25px;
|
||||
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
z-index: 1041; // reequired if we want to show modals from inside sidebar
|
||||
z-index: 1041; // required if we want to show modals from inside sidebar
|
||||
|
||||
.master-navbar {
|
||||
display: block;
|
||||
|
|
@ -40,7 +40,7 @@
|
|||
> .nav-options {
|
||||
> .selected {
|
||||
> .dicon, > .name {
|
||||
color: $theme-400 !important;
|
||||
color: $color-white !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -50,13 +50,20 @@
|
|||
|
||||
> .dicon {
|
||||
display: inline-block;
|
||||
color: $color-white;
|
||||
color: $theme-300;
|
||||
font-size: 20px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
> .name {
|
||||
display: none;
|
||||
color: $theme-300;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
> .dicon, > .name {
|
||||
color: $theme-400 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -159,7 +166,6 @@
|
|||
> .option {
|
||||
>.dicon {
|
||||
display: block;
|
||||
color: $color-white;
|
||||
font-size: 20px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
|
@ -248,7 +254,6 @@
|
|||
> .option {
|
||||
> .dicon {
|
||||
display: block;
|
||||
color: $color-white;
|
||||
font-size: 24px;
|
||||
padding: 15px 0 10px 0;
|
||||
}
|
||||
|
|
@ -258,7 +263,6 @@
|
|||
padding: 0 0 15px 0;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
color: $color-white;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,6 +31,10 @@
|
|||
color: $color-black-light-3;
|
||||
}
|
||||
|
||||
> .form-field {
|
||||
margin: 10px 0 5px 0;
|
||||
}
|
||||
|
||||
> .label {
|
||||
@include border-radius(3px);
|
||||
@extend .no-select;
|
||||
|
|
@ -90,6 +94,82 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .tabs {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
> .tab {
|
||||
margin: 20px 0;
|
||||
padding: 10px 10px;
|
||||
@include border-radius(3px);
|
||||
background-color: $color-white;
|
||||
border: 1px solid map-get($gray-shades, 200);
|
||||
cursor: pointer;
|
||||
|
||||
> .icon {
|
||||
display: inline-block;
|
||||
font-size: 24px;
|
||||
color: map-get($gray-shades, 700);
|
||||
margin: 0 10px 0 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
> .text {
|
||||
display: inline-block;
|
||||
|
||||
> .title {
|
||||
display: block;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 500;
|
||||
color: map-get($gray-shades, 800);
|
||||
}
|
||||
|
||||
> .desc {
|
||||
display: block;
|
||||
margin: 5px 0 5px 0;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
color: map-get($gray-shades, 700);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
> .icon {
|
||||
color: map-get($gray-shades, 800);
|
||||
}
|
||||
|
||||
> .text {
|
||||
> .title {
|
||||
color: map-get($gray-shades, 900);
|
||||
}
|
||||
|
||||
> .desc {
|
||||
color: map-get($gray-shades, 800);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .selected, > .selected:hover {
|
||||
background-color: map-get($yellow-shades, 200);
|
||||
border: 1px solid map-get($yellow-shades, 300);
|
||||
|
||||
> .icon {
|
||||
color: map-get($yellow-shades, 700);
|
||||
}
|
||||
|
||||
> .text {
|
||||
> .title {
|
||||
color: map-get($yellow-shades, 800);
|
||||
}
|
||||
|
||||
> .desc {
|
||||
color: map-get($yellow-shades, 700);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.empty-label {
|
||||
|
|
|
|||
|
|
@ -2,3 +2,4 @@
|
|||
@import "ui-popup";
|
||||
@import "ui-button";
|
||||
@import "ui-toolbar";
|
||||
@import "ui-icon-picker";
|
||||
|
|
|
|||
28
gui/app/styles/core/ui/ui-icon-picker.scss
Normal file
28
gui/app/styles/core/ui/ui-icon-picker.scss
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
.ui-icon-picker {
|
||||
> .list {
|
||||
> .item {
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
|
||||
> i {
|
||||
font-size: 2.5rem;
|
||||
color: map-get($gray-shades, 500);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: map-get($gray-shades, 600);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .selected {
|
||||
> i {
|
||||
color: map-get($yellow-shades, 600);
|
||||
|
||||
&:hover {
|
||||
color: map-get($yellow-shades, 600);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -27,6 +27,7 @@
|
|||
text-align: left;
|
||||
padding: 0.5rem 1.5rem;
|
||||
font-size: 1rem;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: $color-black;
|
||||
|
|
@ -81,4 +82,15 @@
|
|||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
> .form {
|
||||
padding: 20px;
|
||||
width: 300px;
|
||||
|
||||
> .caption {
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: map-get($gray-shades, 800);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,29 +38,58 @@
|
|||
margin-bottom: 10px;
|
||||
|
||||
> .theme {
|
||||
height: 100px;
|
||||
width: 250px;
|
||||
height: 60px;
|
||||
width: 200px;
|
||||
text-align: center;
|
||||
color: $color-white;
|
||||
font-weight: 600;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
margin: 0 20px 20px 0;
|
||||
padding: 10px 0 0 0;
|
||||
padding: 5px;
|
||||
cursor: default;
|
||||
border: 7px solid map-get($gray-shades, 300);
|
||||
border: 3px solid map-get($gray-shades, 300);
|
||||
@include border-radius(3px);
|
||||
|
||||
&:hover {
|
||||
border: 7px solid map-get($gray-shades, 600);
|
||||
border: 3px solid map-get($gray-shades, 600);
|
||||
}
|
||||
}
|
||||
|
||||
.tick {
|
||||
text-align: center;
|
||||
color: $color-white;
|
||||
font-weight: 400;
|
||||
font-size: 2rem;
|
||||
> .selected {
|
||||
border: 3px solid map-get($yellow-shades, 600);
|
||||
|
||||
&:hover {
|
||||
border: 3px solid map-get($yellow-shades, 600);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.label-color-picker {
|
||||
display : block;
|
||||
|
||||
> .color {
|
||||
height: 60px;
|
||||
width: 60px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
margin: 0 20px 20px 0;
|
||||
cursor: default;
|
||||
border: 3px solid map-get($gray-shades, 300);
|
||||
@include border-radius(3px);
|
||||
|
||||
&:hover {
|
||||
border: 3px solid map-get($gray-shades, 600);
|
||||
}
|
||||
}
|
||||
|
||||
> .selected {
|
||||
border: 3px solid map-get($yellow-shades, 600);
|
||||
|
||||
&:hover {
|
||||
border: 3px solid map-get($yellow-shades, 600);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -324,4 +324,19 @@
|
|||
color: map-get($yellow-shades, 800);
|
||||
}
|
||||
}
|
||||
|
||||
> .space-labels {
|
||||
display : block;
|
||||
|
||||
> .label {
|
||||
@include border-radius(3px);
|
||||
@extend .no-select;
|
||||
display: block;
|
||||
margin: 20px 0;
|
||||
padding: 1rem 1rem;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
color: $color-white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -140,7 +140,7 @@
|
|||
margin: 0;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 400;
|
||||
color: map-get($gray-shades, 700);
|
||||
color: map-get($yellow-shades, 700);
|
||||
}
|
||||
|
||||
> .document-heading {
|
||||
|
|
|
|||
|
|
@ -1,15 +1,6 @@
|
|||
.view-activity {
|
||||
margin: 50px;
|
||||
|
||||
.title {
|
||||
font-size: 1.8rem;
|
||||
font-weight: bold;
|
||||
margin: 0 0 30px 0;
|
||||
color: map-get($gray-shades, 600);
|
||||
}
|
||||
|
||||
> .list {
|
||||
margin: 0 0 50px 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
|
||||
|
|
@ -24,7 +15,7 @@
|
|||
position: absolute;
|
||||
top: 19px;
|
||||
left: -20px;
|
||||
background-color: map-get($gray-shades, 300);
|
||||
background-color: map-get($gray-shades, 200);
|
||||
height: 3px;
|
||||
width: 10px;
|
||||
}
|
||||
|
|
@ -39,24 +30,24 @@
|
|||
display: inline-block;
|
||||
|
||||
> .doc {
|
||||
font-size: 1.2rem;
|
||||
font-weight: normal;
|
||||
color: $color-black-light-1;
|
||||
color: map-get($gray-shades, 700);
|
||||
font-size: 1.4rem;
|
||||
font-weight: 300;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
> .note {
|
||||
color: map-get($gray-shades, 600);
|
||||
font-size: 1rem;
|
||||
margin-top: 2px;
|
||||
color: map-get($yellow-shades, 800);
|
||||
font-size: 1.2rem;
|
||||
font-weight: 400;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .list-timeline {
|
||||
border-left: 5px solid map-get($gray-shades, 300);
|
||||
border-left: 5px solid map-get($gray-shades, 200);
|
||||
padding-left: 20px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
.wysiwyg {
|
||||
font-size: 17px;
|
||||
line-height: 25px;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
color: $color-black-light-1;
|
||||
|
||||
table {
|
||||
|
|
|
|||
|
|
@ -245,3 +245,39 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.space-label-picker {
|
||||
display : block;
|
||||
|
||||
> .label {
|
||||
@extend .no-select;
|
||||
@extend .text-truncate;
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
margin: 0 20px 20px 0;
|
||||
padding: 0.5rem 0.75rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
color: $color-white;
|
||||
border: 3px solid map-get($gray-shades, 300);
|
||||
@include border-radius(3px);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
border: 3px solid map-get($gray-shades, 600);
|
||||
}
|
||||
}
|
||||
|
||||
.none {
|
||||
background-color: $color-white;
|
||||
color: map-get($gray-shades, 500);
|
||||
}
|
||||
|
||||
> .selected {
|
||||
border: 3px solid map-get($yellow-shades, 800);
|
||||
|
||||
&:hover {
|
||||
border: 3px solid map-get($yellow-shades, 800);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,6 +25,14 @@
|
|||
font-size: 1.3rem;
|
||||
font-weight: 700;
|
||||
color: map-get($gray-shades, 800);
|
||||
|
||||
> .icon {
|
||||
color: map-get($gray-shades, 700);
|
||||
font-size: 20px;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
> .desc {
|
||||
|
|
@ -35,11 +43,24 @@
|
|||
}
|
||||
|
||||
> .meta {
|
||||
padding: 25px 0 0 0;
|
||||
padding: 15px 0 0 0;
|
||||
|
||||
> .dicon {
|
||||
color: map-get($gray-shades, 600);
|
||||
font-size: 20px;
|
||||
margin-right: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
> .space-label {
|
||||
@include border-radius(3px);
|
||||
@extend .no-select;
|
||||
display: inline-block;
|
||||
margin: 10px 0 13px 0;
|
||||
padding: 0.3rem 0.7rem;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 400;
|
||||
color: map-get($gray-shades, 100);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,12 +6,15 @@
|
|||
padding: 0;
|
||||
line-height: 0;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
background-color: map-get($gray-shades, 300);
|
||||
text-align: center;
|
||||
vertical-align: center;
|
||||
background-color: map-get($gray-shades, 200);
|
||||
|
||||
> .dicons {
|
||||
font-size: 22px;
|
||||
margin-top: 20px;
|
||||
color: map-get($gray-shades, 600);
|
||||
> .dicon {
|
||||
font-size: 18px;
|
||||
line-height: 27px;
|
||||
margin: 7px 0 0 0;
|
||||
color: map-get($gray-shades, 700);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue