From dev-return-3214-archive-asf-public=cust-asf.ponee.io@royale.apache.org Sat Mar 3 21:29:14 2018 Return-Path: X-Original-To: archive-asf-public@cust-asf.ponee.io Delivered-To: archive-asf-public@cust-asf.ponee.io Received: from mail.apache.org (hermes.apache.org [140.211.11.3]) by mx-eu-01.ponee.io (Postfix) with SMTP id 83AF8180654 for ; Sat, 3 Mar 2018 21:29:13 +0100 (CET) Received: (qmail 81362 invoked by uid 500); 3 Mar 2018 20:29:12 -0000 Mailing-List: contact dev-help@royale.apache.org; run by ezmlm Precedence: bulk List-Help: List-Unsubscribe: List-Post: List-Id: Reply-To: dev@royale.apache.org Delivered-To: mailing list dev@royale.apache.org Received: (qmail 81346 invoked by uid 99); 3 Mar 2018 20:29:11 -0000 Received: from pnap-us-west-generic-nat.apache.org (HELO spamd4-us-west.apache.org) (209.188.14.142) by apache.org (qpsmtpd/0.29) with ESMTP; Sat, 03 Mar 2018 20:29:11 +0000 Received: from localhost (localhost [127.0.0.1]) by spamd4-us-west.apache.org (ASF Mail Server at spamd4-us-west.apache.org) with ESMTP id 6E7F8C00D7 for ; Sat, 3 Mar 2018 20:29:11 +0000 (UTC) X-Virus-Scanned: Debian amavisd-new at spamd4-us-west.apache.org X-Spam-Flag: NO X-Spam-Score: 2.63 X-Spam-Level: ** X-Spam-Status: No, score=2.63 tagged_above=-999 required=6.31 tests=[DKIM_SIGNED=0.1, DKIM_VALID=-0.1, DKIM_VALID_AU=-0.1, HTML_EMBEDS=0.001, HTML_MESSAGE=2, KAM_INFOUSMEBIZ=0.75, RCVD_IN_DNSWL_NONE=-0.0001, RCVD_IN_MSPIKE_H3=-0.01, RCVD_IN_MSPIKE_WL=-0.01, SPF_PASS=-0.001] autolearn=disabled Authentication-Results: spamd4-us-west.apache.org (amavisd-new); dkim=pass (2048-bit key) header.d=gmail.com Received: from mx1-lw-eu.apache.org ([10.40.0.8]) by localhost (spamd4-us-west.apache.org [10.40.0.11]) (amavisd-new, port 10024) with ESMTP id B1ne3UmvoXo4 for ; Sat, 3 Mar 2018 20:29:09 +0000 (UTC) Received: from mail-wm0-f43.google.com (mail-wm0-f43.google.com [74.125.82.43]) by mx1-lw-eu.apache.org (ASF Mail Server at mx1-lw-eu.apache.org) with ESMTPS id DB0A45F1EE for ; Sat, 3 Mar 2018 20:29:08 +0000 (UTC) Received: by mail-wm0-f43.google.com with SMTP id q83so9060106wme.5 for ; Sat, 03 Mar 2018 12:29:08 -0800 (PST) DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=gmail.com; s=20161025; h=from:mime-version:subject:date:references:to:in-reply-to:message-id; bh=vdootkgZnOLHqtS/Kpez71hBH42AENvGgq5x9bEyqzQ=; b=YtsuDQU5AjcN3OnNaza4GnPA/OJSrKb3l5p2gyH5J6YhUm1yPwY1suKBL2kg4bQB4b Z/KAf0Ts6eBrGINAAmdtudWQIy1klh28QX6A2cO+oMmrvorRXDlia+tS3SxQtms/vIK4 N5dilqA0geac87qvIPKhu51p5qhY+Z3wAOLtHOrsE9BenBk9mlnW+WwtVIApyHgHXz+J nORf9SZnFLjziAwlZEiJAoVfV7JXeXocqIAUKELklDxy+PT371ichYm/OsovHAegN96G Vsai88+Li0JMWhUOP7m7iOf/iyhwjiDmNuLvmTVVJIQ+45GWnzJM+IHF52TJ84jv4piZ NccA== X-Google-DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=1e100.net; s=20161025; h=x-gm-message-state:from:mime-version:subject:date:references:to :in-reply-to:message-id; bh=vdootkgZnOLHqtS/Kpez71hBH42AENvGgq5x9bEyqzQ=; b=VlLIccRfosr3YVUzZx/l7+pdMKa5WKAg//JivzbnedldnksilocwKGMH/WoUpyk0II UxPsATBz8cg6FayHVvJuQ+dYH9oo28g1yTUvsADeR74RCul36ZUOwDFwkBDVeu/OSgSM C/hfNHAW2ut/cUiXWlp08YuFJFx5Gf7zcPbiH5NrGrwhNv034otw7On3l5UgJobyddlh OCLPJROGFjbCbxxhFer4IJbidb9bee8We11mLqlTTaW0HSbog23sxIv2ClJMZO5WrMlL V4aqugYTg5joQR2xyrwZHsjcwaudXAZYbu1L2f6yzA5gYFCBZrzGxW7L0ue7MKnhfR15 09+w== X-Gm-Message-State: AElRT7HXhSFJfCfComIjc9zqoaXKYSrEo2uI2FwQR0M+gCcO3tyOOw/s 6CmNZ0VqM4CCL5yWPAXIypjw2Vqu X-Google-Smtp-Source: AG47ELtAK97S/eXI5Yc1fIccjq2i3gDXAR41k9ePrcZa4tdbQQxTpgN/7iBHoEZpdWLalrM4OGGdRg== X-Received: by 10.28.17.77 with SMTP id 74mr4492398wmr.67.1520108948289; Sat, 03 Mar 2018 12:29:08 -0800 (PST) Received: from [10.0.0.4] ([195.192.229.46]) by smtp.gmail.com with ESMTPSA id x189sm3589234wmg.23.2018.03.03.12.29.06 for (version=TLS1_2 cipher=ECDHE-RSA-AES128-GCM-SHA256 bits=128/128); Sat, 03 Mar 2018 12:29:07 -0800 (PST) From: Harbs Content-Type: multipart/alternative; boundary="Apple-Mail=_DBC736EC-9D1C-4070-8F9D-D8272EA3048A" Mime-Version: 1.0 (Mac OS X Mail 10.3 \(3273\)) Subject: Re: My first experience with SVG Date: Sat, 3 Mar 2018 22:29:04 +0200 References: To: dev@royale.apache.org In-Reply-To: Message-Id: <0FEA9625-7E03-43B6-9C17-170DD069244F@gmail.com> X-Mailer: Apple Mail (2.3273) --Apple-Mail=_DBC736EC-9D1C-4070-8F9D-D8272EA3048A Content-Transfer-Encoding: quoted-printable Content-Type: text/plain; charset=utf-8 I=E2=80=99ve used 2 strategies so far in Royale: 1. Subclasses ImageButton and se the src property to an SVG image. This = in really only good for buttons which have an image *inside* the button. 2. Subclass Group and set :hover, :active, etc. using background-image = to set the background of the div to the image which could be SVG. Harbs > On Mar 3, 2018, at 8:47 PM, Carlos Rovira = wrote: >=20 >=20 > Hi, >=20 > I was this days playing with SVG to skin a button. My target was to = try to get a complete theme that could be skinned only with SVG. >=20 > After playing with Button, I don't see an easy way to make a button = works ok with SVG. I think the way to do this it with "border-image" = property in order to have some kind of 9-slice scaling, but this = property seems not to work ok in all browser (let me know if I'm wrong) = [1] >=20 > So for Button I ended using CSS3 properties. In the case of buttons, I = must to say that this seems to target almost 95% of what people expect. = And using software like Sketch I think that get to the final CSS 3 code = is in some way "quick". >=20 > For square graphics like radios or checkboxes maybe SVG will fit more = easily. I'll let you know as I get to that. >=20 > btw, although I'm uploading some styles, don't take the current work = as final. It should change a lot as I get more components and rework all = as I get more experience I the complete set. In the end, I have to make = a refactor to "Jewel", and the current theme is called blue but I = uploaded a orange button ;), I'm getting some experience on what can I = do and what not :) >=20 > For example this is a first render of the current button, just for fun = :) >=20 >=20 >=20 >=20 > [1] = https://www.w3schools.com/cssref/tryit.asp?filename=3Dtrycss3_border-image= = >=20 > --=20 > Carlos Rovira > http://about.me/carlosrovira >=20 --Apple-Mail=_DBC736EC-9D1C-4070-8F9D-D8272EA3048A--