0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-23 23:18:48 -05:00

add text options styles

This commit is contained in:
elhombretecla 2016-02-28 10:41:55 +01:00
parent f00c322689
commit 590b3b3b5c
3 changed files with 45 additions and 14 deletions

View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<title>uxbox.io - ???</title>
<link href="/css/main.css?v=1456649213513" rel="stylesheet" type="text/css" />
<link rel="icon" href="/images/favicon.png" />
</head>
<body>
<section id="app" tabindex="1"></section>
<section id="lightbox" tabindex="2"></section>
<script src="/js/main.js?v=1456649213513"></script>
</body>
</html>

View file

@ -1,12 +1,17 @@
.element-options {
display: flex;
width: 100%;
> div {
width: 100%;
}
.element-icons {
background-color: $primary-ui-bg;
border: 1px solid $soft-ui-border;
border-radius: $br-small;
display: flex;
margin: $x-small 0 $x-small $x-small;
margin: $x-small;
li {
align-items: center;
@ -51,7 +56,7 @@
.element-set {
color: $medium-ui-text;
margin-left: $x-small;
margin: 0 $x-small;
.element-set-title {
border-bottom: 1px dashed $soft-ui-border;
@ -68,7 +73,7 @@
.element-set-content {
display: flex;
flex-direction: column;
padding: $small;
padding: $small $x-small;
.input-text {
background-color: transparent;
@ -163,18 +168,22 @@
.align-icons {
cursor: pointer;
svg {
fill: $medium-ui-icons;
height: 20px;
margin: 5px 7px 0 7px;
width: 20px;
}
&:hover,
&.current {
span {
svg {
fill: $main-ui-color;
fill: $medium-ui-icons;
height: 20px;
margin: $x-small $small;
width: 20px;
}
&:hover,
&.current {
svg {
fill: $main-ui-color;
}
}
}

View file

@ -528,7 +528,14 @@
[:select.input-select {:value (:font-weight shape ":normal")
:on-change on-font-weight-change}
[:option {:value ":normal"} "Normal"]
[:option {:value ":bold"} "Solid"]]]]])))
[:option {:value ":bold"} "Solid"]]]
[:span "Text align"]
[:div.row-flex.align-icons
[:span.current i/align-left]
[:span i/align-right]
[:span i/align-center]
[:span i/align-justify]
]]])))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Components