Browse Source

Updates popup title style, card

pull/13/head
Jack Lukic 11 years ago
parent
commit
1569b27212
2 changed files with 36 additions and 68 deletions
  1. 17
      node/src/files/overrides/views/card.css
  2. 87
      src/modules/popup.less

17
node/src/files/overrides/views/card.css

@ -47,6 +47,7 @@
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
z-index: 100;
}
.ui.cards .card .dimmer .close,
.ui.card .dimmer .close {
@ -69,14 +70,14 @@
padding: 0.6em;
border-radius: 4px;
}
.ui.cards .card .dimmer .buttons .button,
.ui.card .dimmer .buttons .button {
.ui.cards .card .dimmer .buttons > *,
.ui.card .dimmer .buttons > * {
display: inline-block;
margin-left: 2%;
width: 48%;
}
.ui.cards .card .dimmer .buttons .button:first-child,
.ui.card .dimmer .buttons .button:first-child {
.ui.cards .card .dimmer .buttons > :first-child,
.ui.card .dimmer .buttons > :first-child {
margin-left: 0em;
}
@ -135,6 +136,14 @@
display: block;
margin: 0em -0.5em -1em;
}
.ui.cards:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.ui.cards .card {
display: inline-block;
margin: 0em 0.5em 1em;

87
src/modules/popup.less

@ -9,12 +9,9 @@
*
* Released: April 17 2013
*/
/*******************************
Popup
*******************************/
.ui.popup {
display: none;
position: absolute;
@ -25,53 +22,44 @@
border: 1px solid #DCDDDE;
max-width: 250px;
background-color: #FFFFFF;
padding: 0.8em 1.2em;
font-size: 0.875rem;
font-weight: normal;
font-style: normal;
color: rgba(0, 0, 0, 0.7);
-webkit-border-radius: 0.2em;
-moz-border-radius: 0.2em;
border-radius: 0.2em;
color: rgba(0, 0, 0, 0.7);
-webkit-box-shadow: 0px 1px 1px #DCDDDE;
-moz-box-shadow: 0px 1px 1px #DCDDDE;
box-shadow: 0px 1px 1px #DCDDDE;
}
.ui.popup .header {
margin: -0.8em -1.2em 0.8em;
background-color: rgba(0, 0, 0, 0.05);
padding: 0.8em 1.2em;
line-height: 1;
font-weight: bold;
color: rgba(0, 0, 0, 0.8);
-webkit-border-radius: 0.2em 0.2em 0em 0em;
-moz-border-radius: 0.2em 0.2em 0em 0em;
border-radius: 0.2em 0.2em 0em 0em;
}
.ui.popup .content {
}
/* Default Interactions */
.ui.popup .ui.button,
.ui.popup form.ui input
.ui.popup form.ui textarea {
.ui.popup form.ui input .ui.popup form.ui textarea {
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
/*--------------
Spacing
---------------*/
.ui.popup {
margin: 0em;
}
@ -87,35 +75,27 @@
.ui.popup.right.center {
margin: 0em 0em 0em 0.75em;
}
.ui.popup.center {
margin-left: -1.25em;
}
/*--------------
Pointer
---------------*/
.ui.popup:before {
position: absolute;
content: "";
width: 0.75em;
height: 0.75rem;
background-image: none;
background-color: #FFFFFF;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
z-index: 2;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
-webkit-box-shadow: 1px 1px 1px #DCDDDE;
-moz-box-shadow: 1px 1px 1px #DCDDDE;
box-shadow: 1px 1px 1px #DCDDDE;
@ -127,9 +107,9 @@
left: 50%;
right: auto;
bottom: auto;
-webkit-box-shadow: -1px -1px 1px #DCDDDE;
-moz-box-shadow: -1px -1px 1px #DCDDDE;
box-shadow: -1px -1px 1px #DCDDDE;
-webkit-box-shadow: -1px -1px 1px #dcddde;
-moz-box-shadow: -1px -1px 1px #dcddde;
box-shadow: -1px -1px 1px #dcddde;
}
.ui.bottom.left.popup:before {
top: -0.4em;
@ -137,29 +117,26 @@
right: auto;
bottom: auto;
margin-left: 0em;
-webkit-box-shadow: -1px -1px 1px #DCDDDE;
-moz-box-shadow: -1px -1px 1px #DCDDDE;
box-shadow: -1px -1px 1px #DCDDDE;
-webkit-box-shadow: -1px -1px 1px #dcddde;
-moz-box-shadow: -1px -1px 1px #dcddde;
box-shadow: -1px -1px 1px #dcddde;
}
.ui.bottom.right.popup:before {
top: -0.4em;
right: 1em;
bottom: auto;
left: auto;
margin-left: 0em;
-webkit-box-shadow: -1px -1px 1px #DCDDDE;
-moz-box-shadow: -1px -1px 1px #DCDDDE;
box-shadow: -1px -1px 1px #DCDDDE;
-webkit-box-shadow: -1px -1px 1px #dcddde;
-moz-box-shadow: -1px -1px 1px #dcddde;
box-shadow: -1px -1px 1px #dcddde;
}
/*--- Above ---*/
.ui.top.center.popup:before {
top: auto;
right: auto;
bottom: -0.4em;
left: 50%;
margin-left: -0.4em;
}
.ui.top.left.popup:before {
@ -167,7 +144,6 @@
left: 1em;
top: auto;
right: auto;
margin-left: 0em;
}
.ui.top.right.popup:before {
@ -175,43 +151,33 @@
right: 1em;
top: auto;
left: auto;
margin-left: 0em;
}
/*--- Left ---*/
.ui.left.center.popup:before {
.ui.left.center.popup:before {
top: 50%;
right: -0.35em;
bottom: auto;
left: auto;
margin-top: -0.4em;
-moz-box-shadow: 1px -1px 1px #DCDDDE;
-webkit-box-shadow: 1px -1px 1px #DCDDDE;
box-shadow: 1px -1px 1px #DCDDDE;
-moz-box-shadow: 1px -1px 1px #dcddde;
-webkit-box-shadow: 1px -1px 1px #dcddde;
box-shadow: 1px -1px 1px #dcddde;
}
/*--- Right ---*/
.ui.right.center.popup:before {
top: 50%;
left: -0.35em;
bottom: auto;
right: auto;
margin-top: -0.4em;
-moz-box-shadow: -1px 1px 1px #DCDDDE;
-webkit-box-shadow: -1px 1px 1px #DCDDDE;
box-shadow: -1px 1px 1px #DCDDDE;
-moz-box-shadow: -1px 1px 1px #dcddde;
-webkit-box-shadow: -1px 1px 1px #dcddde;
box-shadow: -1px 1px 1px #dcddde;
}
/*******************************
States
*******************************/
.ui.popup.loading {
display: block;
visibility: hidden;
@ -219,28 +185,21 @@
.ui.popup.active {
display: block;
}
/*******************************
Variations
*******************************/
/*--------------
Size
---------------*/
.ui.small.popup {
font-size: 0.75rem;
}
.ui.large.popup {
font-size: 1rem;
}
/*--------------
Colors
---------------*/
/* Black */
.ui.inverted.popup {
background-color: #333333;
@ -253,4 +212,4 @@
}
.ui.inverted.popup:before {
background-color: #333333;
}
}
Loading…
Cancel
Save